/* هدر همیشه بالای صفحه باقی بماند */
.site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    width: 100%;
}

/* پیام خوشامدگویی در حالت روشن و تاریک */
.welcome-message {
    position: fixed !important;
    left: 20px !important;
    right: auto !important;
    bottom: 20px !important;
    top: auto !important;
    width: fit-content !important;
    max-width: min(340px, calc(100vw - 40px)) !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    z-index: 1100 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

/* دکمه جزئیات محصول */
.product-details-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 42px;
    margin-top: 10px;
    padding: 9px 14px;
    border: 0;
    border-radius: 10px;
    background: #f0a52b;
    color: #222;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.product-details-button:hover {
    opacity: 0.9;
    transform: translateY(-2px);
}

/* پس‌زمینه پنجره جزئیات */
.product-details-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    justify-content: center;
    align-items: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.72);
}

.product-details-overlay.active {
    display: flex;
}

/* پنجره جزئیات */
.product-details-modal {
    position: relative;
    width: min(520px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    padding: 22px;
    border-radius: 18px;
    background: #fff;
    color: #222;
    text-align: right;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.25);
}

.dark-mode .product-details-modal {
    background: #242424;
    color: #f5f5f5;
}

.product-details-close {
    position: absolute;
    top: 10px;
    left: 12px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #eee;
    color: #222;
    font-size: 24px;
    cursor: pointer;
}

.product-details-image {
    display: block;
    width: 100%;
    max-height: 320px;
    object-fit: contain;
    border-radius: 12px;
    margin-bottom: 18px;
}

.product-details-title {
    margin: 0 0 14px;
    font-size: 21px;
    font-weight: 800;
}

.product-details-ingredients-title {
    margin: 15px 0 8px;
    font-weight: 700;
}

.product-details-ingredients {
    line-height: 2;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

body.details-modal-open {
    overflow: hidden;
}

@media (max-width: 600px) {
    .welcome-message {
        left: 12px !important;
        bottom: 12px !important;
        max-width: calc(100vw - 24px) !important;
    }

    .product-details-modal {
        padding: 16px;
    }

    .product-details-image {
        max-height: 240px;
    }
}
/* ==========================================
   پشتیبانی حرفه‌ای بستنی چتر
========================================== */

/* دکمه شناور پشتیبانی */

.support-button {
    position: fixed !important;
    right: 25px;
    bottom: 25px;
    z-index: 3000;

    width: 64px;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 3px solid rgba(255,255,255,.9);
    border-radius: 22px;

    background: linear-gradient(135deg, #ec6596, #8e6bc5);
    color: #fff;

    font-size: 27px;
    box-shadow: 0 8px 30px rgba(190, 70, 130, .35);

    cursor: pointer;
    transition: .35s ease;

    animation: supportPulse 3s infinite;
}

.support-button:hover {
    transform: translateY(-5px) rotate(-5deg) scale(1.06);
    box-shadow: 0 13px 35px rgba(190, 70, 130, .45);
}

.support-button::after {
    content: "پشتیبانی چتر";

    position: absolute;
    right: 75px;

    white-space: nowrap;

    background: #35283a;
    color: #fff;

    padding: 7px 14px;
    border-radius: 10px;

    font-size: 12px;
    font-weight: 700;

    opacity: 0;
    transform: translateX(8px);

    pointer-events: none;
    transition: .3s ease;
}

.support-button:hover::after {
    opacity: 1;
    transform: translateX(0);
}

@keyframes supportPulse {
    0%, 100% {
        box-shadow: 0 8px 30px rgba(190, 70, 130, .30);
    }

    50% {
        box-shadow: 0 8px 35px rgba(190, 70, 130, .55);
    }
}


/* پنل اصلی */

.support-panel {
    position: fixed !important;

    right: 25px !important;
    bottom: 105px !important;

    width: 365px;
    max-width: calc(100vw - 30px);

    max-height: calc(100dvh - 130px);

    overflow-x: hidden;
    overflow-y: auto;

    z-index: 2999;

    padding: 0 17px 18px;

    background: #fff;

    border: 1px solid rgba(236,101,150,.18);
    border-radius: 23px;

    box-shadow: 0 18px 65px rgba(45, 20, 45, .22);

    direction: rtl;
    text-align: right;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateY(18px) scale(.96);
    transform-origin: bottom right;

    transition:
        opacity .3s ease,
        transform .3s ease,
        visibility .3s ease;
}

.support-panel.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transform: translateY(0) scale(1);
}

.support-panel::-webkit-scrollbar {
    width: 6px;
}

.support-panel::-webkit-scrollbar-thumb {
    background: #e6a0bb;
    border-radius: 10px;
}

.support-panel::-webkit-scrollbar-track {
    background: transparent;
}


/* سربرگ پنل */

.support-panel-header {
    position: sticky;
    top: 0;
    z-index: 5;

    margin-inline: -17px;
    padding: 19px 18px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    background: linear-gradient(120deg, #ec6596, #936ac8);
    color: white;

    border-radius: 22px 22px 0 0;
}

.support-panel-header strong {
    font-size: 16px;
    font-weight: 900;
}

.support-panel-header strong::before {
    content: "🎧";
    margin-left: 9px;
    font-size: 21px;
}

.support-panel-header button {
    width: 34px;
    height: 34px;

    border: 1px solid rgba(255,255,255,.45);
    border-radius: 50%;

    background: rgba(255,255,255,.18);
    color: #fff;

    font-size: 24px;
    line-height: 1;

    cursor: pointer;
    transition: .25s ease;
}

.support-panel-header button:hover {
    background: white;
    color: #d84b80;
    transform: rotate(90deg);
}


/* پیام خوشامدگویی */

.support-intro {
    margin: 16px 0 12px;
    padding: 15px;

    border-radius: 15px;

    background: linear-gradient(135deg, #fff1f6, #f5efff);

    border: 1px solid #f5dce8;
}

.support-intro strong {
    display: block;
    margin-bottom: 5px;

    color: #a83d70;
    font-size: 14px;
}

.support-intro p {
    margin: 0;
    color: #716273;
    font-size: 12px;
    line-height: 1.9;
}

.support-hours {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 12px;
    padding: 10px;

    background: #f0fbf4;
    border-radius: 11px;

    color: #267b4c;
    font-size: 12px;
    font-weight: 800;
}

.support-hours span:first-child {
    font-size: 18px;
}


/* لینک‌های ارتباطی */

.support-panel > a {
    position: relative;

    display: flex;
    align-items: center;
    gap: 12px;

    margin: 9px 0;
    padding: 12px;

    border: 1px solid #f0e7ed;
    border-radius: 13px;

    background: #fff;

    color: #473747;
    font-size: 13px;
    font-weight: 700;

    transition: .25s ease;
}

.support-panel > a:hover {
    transform: translateX(-4px);

    border-color: #e8a0bc;
    background: #fff5f9;

    box-shadow: 0 5px 16px rgba(190, 70, 130, .09);
}

/* آیکون اختصاصی لینک‌ها */

.support-link-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: #f8eaf1;
    font-size: 19px;
}

.support-panel > a.support-instagram .support-link-icon {
    background: #fce8f0;
}

.support-panel > a.support-telegram .support-link-icon {
    background: #e5f4ff;
}

.support-panel > a.support-whatsapp .support-link-icon {
    background: #e7f9ec;
}

.support-panel > a.support-phone .support-link-icon {
    background: #fff3dc;
}

.support-panel > a.support-map .support-link-icon {
    background: #e9efff;
}


/* جداکننده‌ها */

.support-panel hr {
    border: 0;
    height: 1px;

    background: linear-gradient(
        to left,
        transparent,
        #ead5e0,
        transparent
    );

    margin: 18px 0;
}


/* عنوان شعب */

.support-panel > strong {
    display: block;

    margin: 14px 0 7px;

    color: #9a4775;
    font-size: 14px;
    font-weight: 900;
}

.support-panel > p {
    margin: 7px 0;

    padding: 10px 12px;

    border-radius: 11px;
    background: #faf6f9;

    color: #655668;

    font-size: 12px;
    line-height: 2;
}


/* حالت شب */

.dark-mode .support-panel {
    background: #28222e;
    border-color: rgba(255,255,255,.08);
    color: #f5edf5;
}

.dark-mode .support-panel > a {
    background: #352c3c;
    color: #f5edf5;
    border-color: #493c50;
}

.dark-mode .support-panel > a:hover {
    background: #443348;
    border-color: #a96b91;
}

.dark-mode .support-panel > p {
    background: #352c3c;
    color: #e5d9e8;
}

.dark-mode .support-panel > strong {
    color: #f29ac0;
}

.dark-mode .support-intro {
    background: linear-gradient(135deg, #49303f, #39304c);
    border-color: #594259;
}

.dark-mode .support-intro strong {
    color: #ffb5d0;
}

.dark-mode .support-intro p {
    color: #e2d4e4;
}

.dark-mode .support-hours {
    background: #243c32;
    color: #a8e9bf;
}

.dark-mode .support-link-icon {
    background: #493b4d;
}


/* موبایل */

@media (max-width: 600px) {

    .support-button {
        right: 15px;
        bottom: 15px;

        width: 56px;
        height: 56px;

        border-radius: 19px;
    }

    .support-button::after {
        display: none;
    }

    .support-panel {
        right: 12px !important;
        bottom: 82px !important;

        width: calc(100vw - 24px);
        max-width: none;

        max-height: calc(100dvh - 100px);

        padding-inline: 13px;
        border-radius: 19px;
    }

    .support-panel-header {
        margin-inline: -13px;
        border-radius: 18px 18px 0 0;
    }

}