/* /Components/Layout/AdminLayout.razor.rz.scp.css */
.page[b-8wt4b9btvy] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    /* پس‌زمینه تصویری، فقط مخصوص پنل ادمین */
    background-image: url(/ShahrzadLashAcademy/Images/background.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

main[b-8wt4b9btvy] {
    flex: 1;
    min-width: 0;   /* بدون این، جدول/محتوای عریض کل صفحه را از عرض موبایل بیرون می‌برد */
}

.content[b-8wt4b9btvy] {
    border-radius: 20px;
    margin: 1rem 1.5rem;
    padding: 1.5rem !important;
    box-shadow: 0 14px 40px rgba(0, 10, 30, .30), inset 0 1px 0 rgba(255, 255, 255, .8);
}

/* سایدبار شیشه‌ای؛ رنگ‌ها از تصویر پس‌زمینه برداشته شده‌اند */
.sidebar[b-8wt4b9btvy] {
    background:
        radial-gradient(120% 35% at 50% 0%, rgba(255, 255, 255, .16), transparent 65%),
        linear-gradient(180deg, rgba(2, 26, 64, .72) 0%, rgba(5, 61, 103, .55) 55%, rgba(14, 116, 144, .50) 100%);
    border-inline-end: 1px solid rgba(255, 255, 255, .16);
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, .08), 0 10px 40px rgba(0, 10, 30, .45);
}
/* نوار بالا: شیشه‌ی روشن */
.top-row[b-8wt4b9btvy] {
    background-color: rgba(255, 255, 255, .78);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 18px;
    margin: .75rem 1.5rem 0;
    box-shadow: 0 8px 26px rgba(0, 10, 30, .26), inset 0 1px 0 rgba(255, 255, 255, .8);
    justify-content: space-between;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-8wt4b9btvy]  a, .top-row[b-8wt4b9btvy]  .btn-link {
        white-space: nowrap;
        text-decoration: none;
    }

        .top-row[b-8wt4b9btvy]  a:hover, .top-row[b-8wt4b9btvy]  .btn-link:hover {
            text-decoration: underline;
        }

.admin-panel-title[b-8wt4b9btvy] {
    font-weight: 700;
    color: #053d67;
}

/* ===== جدید: عکس گرد + پیام خوش‌آمد ===== */
.admin-welcome[b-8wt4b9btvy] {
    display: flex;
    align-items: center;
    gap: .6rem;
}

/* عکس گرد؛ اگر عکس لود نشود حرف اول نام دیده می‌شود */
.admin-avatar[b-8wt4b9btvy] {
    position: relative;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #cffafe;
    border: 2px solid #0e7490;
    box-shadow: 0 0 0 3px rgba(34, 211, 238, .28), 0 4px 12px rgba(14, 116, 144, .35);
}

    .admin-avatar img[b-8wt4b9btvy] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 50%;
    }

.admin-avatar-initial[b-8wt4b9btvy] {
    font-weight: 700;
    color: #0e7490;
}
/* ===== پایان بخش جدید ===== */

/* دکمه‌ی خروج کنار پیام خوش‌آمد */
.admin-logout-form[b-8wt4b9btvy] {
    margin: 0;
    margin-inline-start: .5rem;
}

.admin-logout-btn[b-8wt4b9btvy] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .85rem;
    font: inherit;
    font-size: .88rem;
    font-weight: 600;
    color: #b91c1c;
    background: rgba(255, 255, 255, .7);
    border: 1.5px solid rgba(254, 202, 202, .95);
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

    .admin-logout-btn svg[b-8wt4b9btvy] {
        width: 1rem;
        height: 1rem;
        flex-shrink: 0;
    }

    .admin-logout-btn:hover[b-8wt4b9btvy] {
        color: #fff;
        background: #dc2626;
        border-color: #dc2626;
        box-shadow: 0 4px 12px rgba(220, 38, 38, .3);
    }

    .admin-logout-btn:focus-visible[b-8wt4b9btvy] {
        outline: 2px solid #dc2626;
        outline-offset: 2px;
    }

.admin-back-link[b-8wt4b9btvy] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    flex: 0 0 auto;
    white-space: nowrap;
    color: #0e7490;
    font-weight: 600;
    padding: .38rem .95rem;
    border-radius: 999px;
    background: rgba(14, 116, 144, .10);
    border: 1px solid rgba(14, 116, 144, .22);
    transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}

    .admin-back-link:hover[b-8wt4b9btvy] {
        background: rgba(14, 116, 144, .18);
        box-shadow: 0 4px 14px rgba(14, 116, 144, .25);
        transform: translateY(-1px);
    }

.admin-back-ico[b-8wt4b9btvy] {
    display: none;            /* فقط در موبایل */
    width: 1.15rem;
    height: 1.15rem;
}

/* اگر مرورگر backdrop-filter را پشتیبانی نکند، پس‌زمینه‌ها مات‌تر می‌شوند */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .top-row[b-8wt4b9btvy] {
        background-color: rgba(255, 255, 255, .95);
    }

    .sidebar[b-8wt4b9btvy] {
        background: linear-gradient(180deg, #021a40 0%, #053d67 55%, #07577b 100%);
    }
}

/* =====================================================================
   موبایل (مثلاً Galaxy S22 با عرض CSS = 360 پیکسل)
   ===================================================================== */
@media (max-width: 640.98px) {
    .page[b-8wt4b9btvy] {
        min-height: 100vh;
        min-height: 100dvh;          /* ارتفاع واقعیِ دیده‌شده (با نوار آدرس مرورگر موبایل) */
        width: 100%;
        max-width: 100%;
        overflow-x: clip;             /* هیچ چیز نباید صفحه را افقی بزرگ‌تر کند؛ clip برخلاف hidden جلوی sticky را نمی‌گیرد */
        isolation: isolate;
        /* background-attachment: fixed در مرورگرهای موبایل کند و پرش‌دار است ← تصویر در یک لایه‌ی fixed جدا می‌آید */
        background-image: none;
    }

    .page[b-8wt4b9btvy]::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background: #04204a url(/ShahrzadLashAcademy/Images/background.webp) center / cover no-repeat;
    }

    /* نوار برگر همیشه بالای صفحه می‌ماند تا منو در هر جای صفحه در دسترس باشد
       (z-index کمتر از مودال‌ها که 1050 است) */
    .sidebar[b-8wt4b9btvy] {
        position: sticky;
        top: 0;
        z-index: 1040;
        /* هنگام اسکرول، محتوای صفحه نباید از زیر نوار برگر دیده شود ← زمینه‌ی مات */
        background: linear-gradient(135deg, #021a40 0%, #053d67 60%, #07577b 100%);
        border-inline-end: 0;
        box-shadow: 0 4px 18px rgba(0, 10, 30, .45);
    }

    .top-row[b-8wt4b9btvy] {
        height: auto;
        min-height: 3.1rem;
        margin: .5rem .5rem 0;
        padding: .35rem .6rem;
        gap: .5rem;
        border-radius: 16px;
        justify-content: space-between;
        flex-wrap: nowrap;
    }

    .admin-welcome[b-8wt4b9btvy] {
        flex: 1 1 auto;
        min-width: 0;                 /* تا نام بلند با «…» کوتاه شود و عرض را نترکاند */
        gap: .5rem;
    }

    .admin-avatar[b-8wt4b9btvy] {
        width: 2.25rem;
        height: 2.25rem;
    }

    .admin-panel-title[b-8wt4b9btvy] {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
        font-size: .9rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .admin-logout-form[b-8wt4b9btvy] {
        flex: 0 0 auto;
        margin-inline-start: 0;
    }

    /* در موبایل فقط آیکون خروج و آیکون بازگشت به سایت (اهداف لمسی حداقل 40 پیکسل) */
    .admin-logout-btn span[b-8wt4b9btvy],
    .admin-back-text[b-8wt4b9btvy] {
        display: none;
    }

    .admin-logout-btn[b-8wt4b9btvy],
    .admin-back-link[b-8wt4b9btvy] {
        justify-content: center;
        min-width: 2.5rem;
        min-height: 2.5rem;
        padding: .4rem;
    }

    .admin-back-ico[b-8wt4b9btvy] {
        display: block;
    }

    .content[b-8wt4b9btvy] {
        margin: .5rem;
        padding: .75rem !important;
        border-radius: 16px;
        min-width: 0;
        max-width: 100%;
    }
}

@media (min-width: 641px) {
    .page[b-8wt4b9btvy] {
        flex-direction: row;
    }

    /* سایدبار شناور و شیشه‌ای */
    .sidebar[b-8wt4b9btvy] {
        width: 250px;
        height: calc(100vh - 1.5rem);
        margin: .75rem;
        border: 1px solid rgba(255, 255, 255, .18);
        border-radius: 22px;
        overflow: hidden;
        position: sticky;
        top: .75rem;
        /* بلور فقط در دسکتاپ؛ در موبایل منوی fixed را خراب می‌کند */
        -webkit-backdrop-filter: blur(18px) saturate(140%);
        backdrop-filter: blur(18px) saturate(140%);
    }

    .top-row[b-8wt4b9btvy] {
        position: sticky;
        top: .75rem;
        z-index: 5;
    }

    .top-row[b-8wt4b9btvy], article[b-8wt4b9btvy] {
        padding-inline-end: 2rem !important;
        padding-inline-start: 1.5rem !important;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ===== Layout Shell ===== */
.app-shell[b-v7psooy5si] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.app-main[b-v7psooy5si] {
    flex: 1;
    margin-top: 70px;
}

/* ===== Top Navbar ===== */
.top-navbar[b-v7psooy5si] {
    background: transparent;
    color: var(--nav-text, #000);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 900;
    box-shadow: none;
    transition: background 0.35s ease, box-shadow 0.35s ease, backdrop-filter 0.35s ease;
    width: 100%;
}

    .top-navbar.scrolled[b-v7psooy5si] {
        background: var(--nav-bg, rgba(255, 255, 255, 0.65));
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    }

    .top-navbar.pinned[b-v7psooy5si] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        background: var(--nav-bg, rgba(255, 255, 255, 0.65));
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    }

.navbar-container[b-v7psooy5si] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.25rem;
}

/* ===== Brand Logo ===== */
.navbar-brand[b-v7psooy5si] {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.brand-logo[b-v7psooy5si] {
    height: 75px; /* ارتفاع لوگو را تنظیم کنید */
    width: auto; /* عرض به صورت خودکار تنظیم می‌شود */
    display: block;
    object-fit: contain;
}

/* ===== Navbar Menu ===== */
.navbar-menu[b-v7psooy5si] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    flex: 1;
}

/* ===== Nav Items ===== */
.nav-item[b-v7psooy5si] {
    color: var(--nav-text, #000) !important;
    text-decoration: none !important;
    padding: 0.5rem 0.9rem;
    border-radius: 6px;
    font-weight: 500;
    background: none;
    border: none;
    cursor: default;
    transition: background 0.2s, color 0.2s;
    display: inline-block;
    text-align: center;
}

    .nav-item:hover[b-v7psooy5si],
    .nav-item.active[b-v7psooy5si] {
        background: color-mix(in srgb, var(--nav-text, #000) 8%, transparent);
        color: var(--nav-text, #000) !important;
        text-decoration: none !important;
    }

    .nav-item:any-link[b-v7psooy5si],
    .nav-item:-webkit-any-link[b-v7psooy5si] {
        color: var(--nav-text, #000) !important;
        text-decoration: none !important;
    }

a.nav-item[b-v7psooy5si] {
    cursor: pointer;
}

/* ===== دکمه ورود / ثبت‌نام کنار منوهای بالا ===== */
.navbar-auth-button[b-v7psooy5si] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: var(--gradient-button, linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%));
    color: #fff !important;
    font-weight: 600;
    padding: .5rem 1.2rem;
    border-radius: 999px;
    box-shadow: 0 4px 14px rgba(99, 102, 241, .35);
    transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
}

    .navbar-auth-button:hover[b-v7psooy5si] {
        color: #fff !important;
        background: var(--gradient-button-hover, linear-gradient(135deg, #4338ca 0%, #7c3aed 100%));
        box-shadow: 0 6px 18px rgba(99, 102, 241, .45);
        transform: translateY(-1px);
    }

/* ===== Language Dropdown ===== */
.language-dropdown[b-v7psooy5si] {
    position: relative;
    padding: 0;
    z-index: 960;
}

.language-trigger[b-v7psooy5si] {
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--nav-text, #000);
    background: none;
    border: none;
    padding: 0.5rem 0.9rem;
    border-radius: 6px;
    font-size: 0.95rem;
    cursor: pointer;
}

    .language-trigger:hover[b-v7psooy5si] {
        background: rgba(0, 0, 0, 0.08);
        color: #000;
    }

.dropdown-arrow[b-v7psooy5si] {
    font-size: 0.7rem;
    transition: transform 0.2s;
}

    .dropdown-arrow.open[b-v7psooy5si] {
        transform: rotate(180deg);
    }

.dropdown-menu[b-v7psooy5si] {
    /*
     * فایل bootstrap.min.css به‌صورت سراسری روی این کلاس
     * "display: none" اعمال می‌کند (چون برای دراپ‌داون‌های خودش استفاده
     * می‌شود). این خط صراحتاً آن را بازنویسی می‌کند تا منو واقعاً نمایش
     * داده شود؛ همین نبودِ این خط باعث می‌شد با کلیک روی «انتخاب زبان»
     * چیزی نمایش داده نشود.
     */
    display: block;
    position: absolute;
    top: calc(100% + 6px);
    inset-inline-start: 0;
    background: #fff;
    color: #000;
    list-style: none;
    margin: 0;
    padding: 0.4rem;
    min-width: 150px;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    z-index: 960;
}

.dropdown-item[b-v7psooy5si] {
    display: block;
    width: 100%;
    text-align: start;
    background: none;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.9rem;
    color: #000;
    cursor: pointer;
}

    .dropdown-item:hover[b-v7psooy5si] {
        background: #f2f3f5;
    }

    .dropdown-item.active[b-v7psooy5si] {
        font-weight: 700;
        background: #eef0ff;
    }

/* ===== دکمه‌های سمت دیگر هدر: جستجوی موبایل + منوی همبرگری ===== */
.navbar-actions[b-v7psooy5si] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

/* ===== Mobile Toggle Button ===== */
.navbar-toggle[b-v7psooy5si] {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
    height: 18px;
    background: none;
    border: none;
    cursor: pointer;
}

    .navbar-toggle span[b-v7psooy5si] {
        display: block;
        height: 2px;
        background: var(--nav-text, #000);
        border-radius: 2px;
    }

/* ===== Overlay ===== */
.menu-overlay[b-v7psooy5si] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 800;
}

/* ===== Responsive (Mobile) ===== */
/*
 * نکته‌ی مهم: هدر backdrop-filter دارد و در نتیجه «position: fixed» فرزندانش نسبت به خودِ هدر محاسبه می‌شود
 * (نه صفحه). برای همین منوی موبایل «absolute» و زیر لبه‌ی پایین هدر (top: 100%) قرار می‌گیرد تا بین هدر و
 * منو هیچ شکافی نماند، حتی اگر ارتفاع هدر عوض شود (مثلاً با آیکن سبد خرید).
 */
@media (max-width: 1200px) {
    .app-shell[b-v7psooy5si] {
        --navbar-h: 64px;
    }

    .app-main[b-v7psooy5si] {
        margin-top: var(--navbar-h);
    }

    .navbar-container[b-v7psooy5si] {
        min-height: var(--navbar-h);
        box-sizing: border-box;
        padding: 0.5rem 0.9rem;
        gap: 0.5rem;
    }

    /* لوگو */
    .navbar-brand[b-v7psooy5si] {
        min-width: 0;
        flex: 0 1 auto;
    }

    .brand-logo[b-v7psooy5si] {
        height: 36px;
        max-width: 150px;
    }

    .navbar-actions[b-v7psooy5si] {
        flex: 0 0 auto;
        gap: 0.5rem;
    }

    /* دکمه‌ی همبرگری: هدف لمسی ۴۲×۴۲ و تبدیل به × هنگام باز بودن منو */
    .navbar-toggle[b-v7psooy5si] {
        display: flex;
        flex: 0 0 auto;
        width: 42px;
        height: 42px;
        padding: 13px 10px;
        box-sizing: border-box;
        border-radius: 12px;
        background: rgba(0, 0, 0, 0.05);
        -webkit-tap-highlight-color: transparent;
        transition: background 0.2s ease;
    }

        .navbar-toggle:active[b-v7psooy5si] {
            background: rgba(0, 0, 0, 0.12);
        }

        .navbar-toggle span[b-v7psooy5si] {
            transition: transform 0.25s ease, opacity 0.2s ease;
        }

        .navbar-toggle.is-open span:nth-child(1)[b-v7psooy5si] {
            transform: translateY(7px) rotate(45deg);
        }

        .navbar-toggle.is-open span:nth-child(2)[b-v7psooy5si] {
            opacity: 0;
        }

        .navbar-toggle.is-open span:nth-child(3)[b-v7psooy5si] {
            transform: translateY(-7px) rotate(-45deg);
        }

    /* پنل منو: زمینه‌ی سفید کامل (نه نیمه‌شفاف)، قابل اسکرول، هرگز بزرگ‌تر از صفحه نمی‌شود */
    .navbar-menu[b-v7psooy5si] {
        /* پنل منوی موبایل همیشه زمینه‌ی سفید دارد؛ رنگ نوشته‌ی منوی بالا (تنظیمات) فقط روی دسکتاپ اعمال می‌شود */
        --nav-text: #000;
        position: absolute;
        top: 100%;
        inset-inline: 0;
        flex: none;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 4px;
        background: #fff;
        border-radius: 0 0 20px 20px;
        box-shadow: 0 18px 36px rgba(30, 27, 75, 0.18);
        max-height: 0;
        overflow: hidden;
        visibility: hidden;
        opacity: 0;
        padding: 0 14px;
        transition: max-height 0.28s ease, opacity 0.2s ease, padding 0.2s ease, visibility 0s linear 0.28s;
    }

        .navbar-menu.open[b-v7psooy5si] {
            max-height: calc(100vh - var(--navbar-h) - 8px);
            max-height: calc(100dvh - var(--navbar-h) - 8px);
            overflow-x: hidden;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            visibility: visible;
            opacity: 1;
            padding: 10px 14px 16px;
            transition-delay: 0s;
        }

    /* آیتم‌های منو: ردیف‌های هم‌اندازه، هم‌تراز، با هدف لمسی حداقل ۴۸ پیکسل */
    .nav-item[b-v7psooy5si] {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0.5rem;
        width: 100%;
        box-sizing: border-box;
        min-height: 48px;
        padding: 0.7rem 1rem;
        border-radius: 12px;
        font-size: 1rem !important;
        font-weight: 600;
        text-align: start !important;
        color: #1e1b4b !important;
        -webkit-tap-highlight-color: transparent;
    }

        .nav-item:hover[b-v7psooy5si] {
            background: rgba(99, 102, 241, 0.08);
            color: #1e1b4b !important;
        }

        .nav-item:active[b-v7psooy5si] {
            background: rgba(99, 102, 241, 0.14);
        }

        .nav-item.active[b-v7psooy5si] {
            background: rgba(99, 102, 241, 0.12);
            color: var(--color-primary-dark, #4338ca) !important;
        }

    /* دکمه‌های ورود / خروج: تمام‌عرض و وسط‌چین */
    .nav-item.navbar-auth-button[b-v7psooy5si] {
        justify-content: center;
        margin-top: 0.5rem;
        color: #fff !important;
        border-radius: 14px;
    }

        .nav-item.navbar-auth-button:hover[b-v7psooy5si],
        .nav-item.navbar-auth-button:active[b-v7psooy5si] {
            color: #fff !important;
        }

    /* انتخاب زبان */
    .nav-item.language-dropdown[b-v7psooy5si] {
        display: block;
        padding: 0;
        min-height: 0;
        background: none;
    }

    .language-trigger[b-v7psooy5si] {
        width: 100%;
        min-height: 48px;
        justify-content: space-between;
        padding: 0.7rem 1rem;
        font-size: 1rem;
        font-weight: 600;
        color: #1e1b4b;
        border-radius: 12px;
    }

    .dropdown-menu[b-v7psooy5si] {
        position: static;
        width: 100%;
        box-sizing: border-box;
        box-shadow: none;
        background: rgba(99, 102, 241, 0.06);
        margin: 4px 0 0;
        padding: 6px;
        border-radius: 12px;
    }

    .dropdown-item[b-v7psooy5si] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 44px;
        color: #1e1b4b;
    }

        .dropdown-item:hover[b-v7psooy5si] {
            background: rgba(99, 102, 241, 0.1);
        }
}

/* پس‌زمینه‌ی تیره‌ی ملایم پشت منوی موبایل؛ لمس آن منو را می‌بندد */
.menu-overlay.is-dim[b-v7psooy5si] {
    background: rgba(15, 23, 42, 0.35);
    animation: menu-overlay-in-b-v7psooy5si 0.2s ease;
}

@media (min-width: 1201px) {
    .menu-overlay.is-dim[b-v7psooy5si] {
        background: transparent;
        animation: none;
    }
}

@keyframes menu-overlay-in-b-v7psooy5si {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* ===== دکمه خروج (فرم POST) — همان ظاهر دکمه ورود/ثبت‌نام ===== */
.navbar-logout-form[b-v7psooy5si] {
    margin: 0;
    padding: 0;
}

    .navbar-logout-form .navbar-auth-button[b-v7psooy5si] {
        border: none;
        font-family: inherit;
        font-size: 1rem;
    }

@media (max-width: 1200px) {
    .navbar-logout-form .navbar-auth-button[b-v7psooy5si] {
        width: 100%;
        min-height: 48px;
        justify-content: center;
        border-radius: 14px;
    }
}

/* ===== دسکتاپ: آیتم‌ها تک‌خطی بمانند و در عرض‌های متوسط (۱۱۰۱ تا ۱۴۰۰) فشرده‌تر شوند تا منو بریده نشود ===== */
@media (min-width: 1201px) {
    .nav-item[b-v7psooy5si] {
        white-space: nowrap;
    }
}

@media (min-width: 1201px) and (max-width: 1400px) {
    .navbar-container[b-v7psooy5si] {
        padding-inline: 0.9rem;
    }

    .navbar-menu[b-v7psooy5si] {
        gap: 0.35rem;
    }

    .nav-item:not(.language-dropdown)[b-v7psooy5si] {
        padding: 0.45rem 0.6rem;
        font-size: 0.92rem;
    }

    .language-trigger[b-v7psooy5si] {
        padding: 0.45rem 0.6rem;
        font-size: 0.9rem;
    }

    .navbar-auth-button[b-v7psooy5si] {
        padding: 0.45rem 0.95rem;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* ============================================
   هدر منو (نام برنامه + دکمه برگر)
   ============================================ */
.nav-header[b-pamlowdiu8] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.5rem;
    padding: 0 1rem;
    /* هدر شیشه‌ای هماهنگ با سایدبار و تصویر پس‌زمینه */
    background: linear-gradient(135deg, rgba(255, 255, 255, .20) 0%, rgba(34, 211, 238, .10) 55%, rgba(255, 255, 255, .04) 100%);
    box-shadow: 0 2px 12px rgba(0, 10, 30, .28), inset 0 1px 0 rgba(255, 255, 255, .22);
    border-bottom: 1px solid rgba(255, 255, 255, .18);
    z-index: 1050;
}

/* نام برنامه - دقیقاً وسط کادر */
.nav-brand[b-pamlowdiu8] {
    color: #fff;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-decoration: none;
    text-align: center;
    transition: text-shadow .2s, opacity .2s;
}

    .nav-brand:hover[b-pamlowdiu8] {
        color: #fff;
        text-shadow: 0 0 12px rgba(103, 232, 249, .85);
    }

/* ============================================
   دکمه برگر - ابتدای خط
   ============================================ */
.nav-toggler[b-pamlowdiu8] {
    position: absolute;
    inset-inline-start: 1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 42px;
    height: 42px;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 12px;
    background: rgba(255, 255, 255, .12);
    cursor: pointer;
    transition: background .25s, border-color .25s, transform .2s;
}

    .nav-toggler:hover[b-pamlowdiu8] {
        background: rgba(255, 255, 255, .22);
        border-color: rgba(255, 255, 255, .45);
    }

    .nav-toggler:active[b-pamlowdiu8] {
        transform: translateY(-50%) scale(.93);
    }

.nav-toggler-bar[b-pamlowdiu8] {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: #fff;
    transition: transform .3s ease, opacity .2s ease;
}

/* تبدیل برگر به ضربدر در حالت باز */
.nav-toggler.is-open .nav-toggler-bar:nth-child(1)[b-pamlowdiu8] {
    transform: translateY(7px) rotate(45deg);
}

.nav-toggler.is-open .nav-toggler-bar:nth-child(2)[b-pamlowdiu8] {
    opacity: 0;
}

.nav-toggler.is-open .nav-toggler-bar:nth-child(3)[b-pamlowdiu8] {
    transform: translateY(-7px) rotate(-45deg);
}

/* ============================================
   پس‌زمینه تیره (فقط موبایل)
   ============================================ */
.nav-backdrop[b-pamlowdiu8] {
    position: fixed;
    inset: 3.5rem 0 0 0;
    background: rgba(15, 23, 42, .5);
    backdrop-filter: blur(3px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .28s ease, visibility .28s;
    z-index: 1035;
}

    .nav-backdrop.is-open[b-pamlowdiu8] {
        opacity: 1;
        visibility: visible;
    }

/* ============================================
   کشوی منو (موبایل)
   ============================================ */
.nav-scrollable[b-pamlowdiu8] {
    position: fixed;
    top: 3.5rem;
    inset-inline-start: 0;
    bottom: 0;
    width: 84%;
    width: min(84vw, 320px);
    max-width: 320px;
    padding-top: .5rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(180deg, rgba(2, 26, 64, .96) 0%, rgba(7, 87, 123, .94) 100%);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    box-shadow: calc(-8px * var(--dir-sign, 1)) 0 28px rgba(15, 23, 42, .35);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    /* در ابتدای کار بسته است: بیرون از صفحه + مخفی (تا با کیبورد/ابزار دسترسی‌پذیری هم قابل انتخاب نباشد) */
    transform: translateX(calc(100% * var(--dir-sign, 1)));
    visibility: hidden;
    pointer-events: none;
    transition: transform .3s cubic-bezier(.4, 0, .2, 1), visibility 0s linear .3s;
    z-index: 1045;
}

    .nav-scrollable.is-open[b-pamlowdiu8] {
        transform: translateX(0);
        visibility: visible;
        pointer-events: auto;
        transition: transform .3s cubic-bezier(.4, 0, .2, 1), visibility 0s;
    }

/* ============================================
   آیتم‌های منو
   ============================================ */
.nav-item[b-pamlowdiu8] {
    font-size: .9rem;
    padding-bottom: .4rem;
}

    .nav-item:first-of-type[b-pamlowdiu8] {
        padding-top: .75rem;
    }

    .nav-item:last-of-type[b-pamlowdiu8] {
        padding-bottom: 1rem;
    }

    .nav-item[b-pamlowdiu8]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: 1px solid transparent;
        border-radius: 14px;
        min-height: 3rem;
        display: flex;
        align-items: center;
        width: 100%;
        padding: .4rem .75rem;
        transition: background .2s, color .2s, transform .2s;
    }

    .nav-item[b-pamlowdiu8]  a.active {
        background: linear-gradient(135deg, rgba(255, 255, 255, .28) 0%, rgba(34, 211, 238, .16) 100%);
        border-color: rgba(255, 255, 255, .30);
        color: #fff;
        box-shadow: inset 3px 0 0 #22d3ee, 0 6px 16px rgba(0, 10, 30, .30);
    }

    .nav-item[b-pamlowdiu8]  .nav-link:hover {
        background-color: rgba(255, 255, 255, .14);
        border-color: rgba(255, 255, 255, .22);
        color: #fff;
        transform: translateX(-3px);
    }

/* ============================================
   آیکون‌ها
   ============================================ */
.bi[b-pamlowdiu8] {
    display: inline-block;
    position: relative;
    flex: 0 0 auto;
    width: 1.25rem;
    height: 1.25rem;
    /* منطقی (logical) تا در RTL هم فاصله درست باشد */
    margin-inline-end: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-pamlowdiu8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-pamlowdiu8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-pamlowdiu8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-product-icon[b-pamlowdiu8] {
    flex: 0 0 auto;
    width: 1.25rem;
    height: 1.25rem;
    margin-inline-end: 0.75rem;
    object-fit: contain;
    vertical-align: middle;
}

/* آیکون محصولات در موبایل کوچک‌تر و مرتب‌تر شود */
@media (max-width: 640.98px) {
    .nav-item[b-pamlowdiu8]  .nav-product-icon {
        width: 34px !important;
        height: 34px !important;
        margin-inline-start: 0 !important;
        margin-inline-end: .7rem !important;
    }
}

/* ============================================
   دسکتاپ - منو همیشه باز و ثابت
   ============================================ */
@media (min-width: 641px) {

    .nav-toggler[b-pamlowdiu8] {
        display: none;
    }

    .nav-backdrop[b-pamlowdiu8] {
        display: none;
    }

    .nav-scrollable[b-pamlowdiu8] {
        position: static;
        width: auto;
        max-width: none;
        transform: none;
        visibility: visible;
        pointer-events: auto;
        padding-bottom: 0;
        box-shadow: none;
        background: transparent;
        /* 3.5rem هدر + 1.5rem فاصله‌ی شناور بودن سایدبار */
        height: calc(100vh - 5rem);
        height: calc(100dvh - 5rem);
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, .35) transparent;
    }
}

/* ============================================
   آیکون‌های منوی ادمین (SVG با ماسک؛ هر آیکون گرادیان رنگی خودش را دارد)
   ============================================ */
.nav-ico[b-pamlowdiu8] {
    display: inline-block;
    flex: 0 0 auto;
    width: 1.4rem;
    height: 1.4rem;
    margin-inline-end: 0.75rem;
    background: linear-gradient(135deg, var(--ico-a, #fff), var(--ico-b, #fff));
    -webkit-mask: var(--ico) center / contain no-repeat;
    mask: var(--ico) center / contain no-repeat;
    filter: drop-shadow(0 1px 2px rgba(0, 10, 30, .35));
    transition: transform .2s;
}

.nav-item[b-pamlowdiu8]  .nav-link:hover .nav-ico {
    transform: scale(1.12);
}
.nav-ico-home[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M3%2010.5%2012%203l9%207.5%22/%3E%3Cpath%20d=%22M5%209v12h14V9%22/%3E%3Cpath%20d=%22M10%2021v-6h4v6%22/%3E%3C/svg%3E");
    --ico-a: #fde68a;
    --ico-b: #fbbf24;
}

.nav-ico-users[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M16%2021v-2a4%204%200%200%200-4-4H6a4%204%200%200%200-4%204v2%22/%3E%3Ccircle%20cx=%229%22%20cy=%227%22%20r=%224%22/%3E%3Cpath%20d=%22M22%2021v-2a4%204%200%200%200-3-3.87%22/%3E%3Cpath%20d=%22M16%203.13a4%204%200%200%201%200%207.75%22/%3E%3C/svg%3E");
    --ico-a: #a5f3fc;
    --ico-b: #22d3ee;
}

.nav-ico-sliders[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M2%204v16%22/%3E%3Crect%20x=%226%22%20y=%224%22%20width=%2212%22%20height=%2216%22%20rx=%222%22/%3E%3Cpath%20d=%22M22%204v16%22/%3E%3C/svg%3E");
    --ico-a: #f5d0fe;
    --ico-b: #e879f9;
}

.nav-ico-languages[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22m5%208%206%206%22/%3E%3Cpath%20d=%22m4%2014%206-6%202-3%22/%3E%3Cpath%20d=%22M2%205h12%22/%3E%3Cpath%20d=%22M7%202h1%22/%3E%3Cpath%20d=%22m22%2022-5-10-5%2010%22/%3E%3Cpath%20d=%22M14%2018h6%22/%3E%3C/svg%3E");
    --ico-a: #bbf7d0;
    --ico-b: #4ade80;
}

.nav-ico-compare[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x=%223%22%20y=%223%22%20width=%2218%22%20height=%2218%22%20rx=%222%22/%3E%3Cpath%20d=%22M12%203v18%22/%3E%3Cpath%20d=%22m8%209-3%203%203%203%22/%3E%3Cpath%20d=%22m16%209%203%203-3%203%22/%3E%3C/svg%3E");
    --ico-a: #fecdd3;
    --ico-b: #fb7185;
}

.nav-ico-about[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx=%2212%22%20cy=%2212%22%20r=%2210%22/%3E%3Cpath%20d=%22M12%2016v-4%22/%3E%3Cpath%20d=%22M12%208h.01%22/%3E%3C/svg%3E");
    --ico-a: #fde68a;
    --ico-b: #f59e0b;
}

.nav-ico-ticket[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M2%209a3%203%200%200%201%200%206v2a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-2a3%203%200%200%201%200-6V7a2%202%200%200%200-2-2H4a2%202%200%200%200-2%202Z%22/%3E%3Cpath%20d=%22M13%205v2%22/%3E%3Cpath%20d=%22M13%2011v2%22/%3E%3Cpath%20d=%22M13%2017v2%22/%3E%3C/svg%3E");
    --ico-a: #fed7aa;
    --ico-b: #fb923c;
}

.nav-ico-ticket-catalog[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M20.59%2013.41l-7.17%207.17a2%202%200%200%201-2.83%200L2%2012V2h10l8.59%208.59a2%202%200%200%201%200%202.82z%22/%3E%3Cpath%20d=%22M7%207h.01%22/%3E%3C/svg%3E");
    --ico-a: #ddd6fe;
    --ico-b: #8b5cf6;
}

.nav-ico-chat[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M7.9%2020A9%209%200%201%200%204%2016.1L2%2022Z%22/%3E%3Cpath%20d=%22M8%2012h.01%22/%3E%3Cpath%20d=%22M12%2012h.01%22/%3E%3Cpath%20d=%22M16%2012h.01%22/%3E%3C/svg%3E");
    --ico-a: #bfdbfe;
    --ico-b: #60a5fa;
}

.nav-ico-reviews[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M12%202.5l2.94%205.96%206.58.96-4.76%204.64%201.12%206.55L12%2017.52l-5.88%203.09%201.12-6.55L2.48%209.42l6.58-.96L12%202.5z%22/%3E%3C/svg%3E");
    --ico-a: #fde68a;
    --ico-b: #f59e0b;
}

.nav-ico-products[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22m7.5%204.27%209%205.15%22/%3E%3Cpath%20d=%22M21%208a2%202%200%200%200-1-1.73l-7-4a2%202%200%200%200-2%200l-7%204A2%202%200%200%200%203%208v8a2%202%200%200%200%201%201.73l7%204a2%202%200%200%200%202%200l7-4A2%202%200%200%200%2021%2016Z%22/%3E%3Cpath%20d=%22m3.3%207%208.7%205%208.7-5%22/%3E%3Cpath%20d=%22M12%2022V12%22/%3E%3C/svg%3E");
    --ico-a: #ddd6fe;
    --ico-b: #a78bfa;
}


.nav-ico-categories[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x=%223%22%20y=%223%22%20width=%227%22%20height=%227%22%20rx=%221.5%22/%3E%3Crect%20x=%2214%22%20y=%223%22%20width=%227%22%20height=%227%22%20rx=%221.5%22/%3E%3Crect%20x=%223%22%20y=%2214%22%20width=%227%22%20height=%227%22%20rx=%221.5%22/%3E%3Crect%20x=%2214%22%20y=%2214%22%20width=%227%22%20height=%227%22%20rx=%221.5%22/%3E%3C/svg%3E");
    --ico-a: #a7f3d0;
    --ico-b: #34d399;
}

.nav-ico-articles[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M14%203H7a2%202%200%200%200-2%202v14a2%202%200%200%200%202%202h10a2%202%200%200%200%202-2V8z%22/%3E%3Cpath%20d=%22M14%203v5h5%22/%3E%3Cpath%20d=%22M9%2013h6%22/%3E%3Cpath%20d=%22M9%2017h6%22/%3E%3C/svg%3E");
    --ico-a: #fef08a;
    --ico-b: #facc15;
}

.nav-ico-discounts[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cline%20x1=%2219%22%20y1=%225%22%20x2=%225%22%20y2=%2219%22/%3E%3Ccircle%20cx=%226.5%22%20cy=%226.5%22%20r=%222.5%22/%3E%3Ccircle%20cx=%2217.5%22%20cy=%2217.5%22%20r=%222.5%22/%3E%3C/svg%3E");
    --ico-a: #fecaca;
    --ico-b: #f87171;
}

.nav-ico-import[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z'/%3E%3Cpath%20d='M14%202v6h6'/%3E%3Cpath%20d='M12%2018v-6'/%3E%3Cpath%20d='m9%2015%203-3%203%203'/%3E%3C/svg%3E");
    --ico-a: #a7f3d0;
    --ico-b: #10b981;
}

.nav-ico-price[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20.6%2013.4l-7.2%207.2a2%202%200%200%201-2.8%200L3%2013V3h10l7.6%207.6a2%202%200%200%201%200%202.8z'/%3E%3Ccircle%20cx='7.5'%20cy='7.5'%20r='1.2'/%3E%3C/svg%3E");
    --ico-a: #fecdd3;
    --ico-b: #f43f5e;
}

.nav-ico-inventory[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21%208l-9-5-9%205v8l9%205%209-5V8z'/%3E%3Cpath%20d='M3.3%207.7L12%2012.5l8.7-4.8M12%2022V12.5'/%3E%3C/svg%3E");
    --ico-a: #fde68a;
    --ico-b: #f59e0b;
}

.nav-ico-purchases[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%202h12a1%201%200%200%201%201%201v18l-3-2-3%202-3-2-3%202V3a1%201%200%200%201%201-1z'/%3E%3Cpath%20d='M9%208h6M9%2012h6'/%3E%3C/svg%3E");
    --ico-a: #a7f3d0;
    --ico-b: #10b981;
}

.nav-ico-visitors[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M3%203v18h18%22/%3E%3Crect%20x=%227%22%20y=%2213%22%20width=%223%22%20height=%225%22%20rx=%220.5%22/%3E%3Crect%20x=%2212%22%20y=%229%22%20width=%223%22%20height=%229%22%20rx=%220.5%22/%3E%3Crect%20x=%2217%22%20y=%225%22%20width=%223%22%20height=%2213%22%20rx=%220.5%22/%3E%3C/svg%3E");
    --ico-a: #99f6e4;
    --ico-b: #2dd4bf;
}

.nav-ico-backup[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cellipse%20cx='12'%20cy='5'%20rx='9'%20ry='3'/%3E%3Cpath%20d='M3%205v14c0%201.7%204%203%209%203s9-1.3%209-3V5'/%3E%3Cpath%20d='M3%2012c0%201.7%204%203%209%203s9-1.3%209-3'/%3E%3C/svg%3E");
    --ico-a: #bae6fd;
    --ico-b: #38bdf8;
}

.nav-ico-triple[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x=%223%22%20y=%223%22%20width=%2218%22%20height=%2218%22%20rx=%222%22/%3E%3Cpath%20d=%22M3%209h18%22/%3E%3Cpath%20d=%22M9%209v12%22/%3E%3Cpath%20d=%22M15%209v12%22/%3E%3C/svg%3E");
    --ico-a: #c7d2fe;
    --ico-b: #818cf8;
}

.nav-ico-triple-items[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x=%223%22%20y=%223%22%20width=%2218%22%20height=%2218%22%20rx=%222%22/%3E%3Ccircle%20cx=%228.5%22%20cy=%228.5%22%20r=%221.5%22/%3E%3Cpath%20d=%22m21%2015-5-5L5%2021%22/%3E%3C/svg%3E");
    --ico-a: #fbcfe8;
    --ico-b: #f472b6;
}

.nav-ico-contact[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x=%222%22%20y=%225%22%20width=%2220%22%20height=%2214%22%20rx=%222%22/%3E%3Cpath%20d=%22m3%207%209%206%209-6%22/%3E%3C/svg%3E");
    --ico-a: #bfdbfe;
    --ico-b: #60a5fa;
}

.nav-ico-gallery[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d=%22M18%2022H4a2%202%200%200%201-2-2V6%22/%3E%3Cpath%20d=%22m22%2013-1.296-1.296a2.41%202.41%200%200%200-3.408%200L11%2018%22/%3E%3Ccircle%20cx=%2212%22%20cy=%228%22%20r=%222%22/%3E%3Crect%20x=%226%22%20y=%222%22%20width=%2216%22%20height=%2216%22%20rx=%222%22/%3E%3C/svg%3E");
    --ico-a: #bae6fd;
    --ico-b: #38bdf8;
}


/* ============================================
   آیکون‌های تازه‌ی منوهای زیرمجموعه‌دار
   ============================================ */
.nav-ico-sales[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%202%203%206v14a2%202%200%200%200%202%202h14a2%202%200%200%200%202-2V6l-3-4z'/%3E%3Cpath%20d='M3%206h18'/%3E%3Cpath%20d='M16%2010a4%204%200%200%201-8%200'/%3E%3C/svg%3E");
    --ico-a: #a7f3d0;
    --ico-b: #2dd4bf;
}

.nav-ico-tickets-group[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M2%209a3%203%200%200%201%200%206v2a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-2a3%203%200%200%201%200-6V7a2%202%200%200%200-2-2H4a2%202%200%200%200-2%202Z'/%3E%3Cpath%20d='M13%205v2'/%3E%3Cpath%20d='M13%2011v2'/%3E%3Cpath%20d='M13%2017v2'/%3E%3C/svg%3E");
    --ico-a: #fed7aa;
    --ico-b: #fb923c;
}

.nav-ico-unit[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m12%202%2010%205-10%205L2%207z'/%3E%3Cpath%20d='m2%2012%2010%205%2010-5'/%3E%3Cpath%20d='m2%2017%2010%205%2010-5'/%3E%3C/svg%3E");
    --ico-a: #fbcfe8;
    --ico-b: #f472b6;
}

/* ============================================
   منوی زیرمجموعه‌دار (سرگروه + زیرمنو)
   ============================================ */

/* سرگروه یک دکمه است؛ ظاهرش مثل بقیه‌ی آیتم‌ها */
.nav-item[b-pamlowdiu8]  .nav-group-toggle {
    font: inherit;
    text-align: start;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    gap: 0;
}

.nav-group-label[b-pamlowdiu8] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* فلش: باز = رو به بالا، بسته = رو به پایین (با چرخش) */
.nav-chevron[b-pamlowdiu8] {
    flex: 0 0 auto;
    width: .55rem;
    height: .55rem;
    margin-inline-start: .5rem;
    border-inline-end: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .28s ease;
    opacity: .85;
}

.nav-group.is-open .nav-chevron[b-pamlowdiu8] {
    transform: translateY(2px) rotate(-135deg);
}

/* سرگروهِ بازی که صفحه‌ی فعلی داخل آن است: روشن‌تر از بقیه */
.nav-group.is-open.has-active[b-pamlowdiu8]  .nav-group-toggle {
    color: #fff;
    font-weight: 700;
    background-color: rgba(255, 255, 255, .10);
    border-color: rgba(255, 255, 255, .20);
}

/* سرگروهِ بسته‌ای که صفحه‌ی فعلی داخل آن است: مثل یک آیتم انتخاب‌شده هایلایت می‌شود */
.nav-group:not(.is-open).has-active[b-pamlowdiu8]  .nav-group-toggle {
    background: linear-gradient(135deg, rgba(255, 255, 255, .28) 0%, rgba(34, 211, 238, .16) 100%);
    border-color: rgba(255, 255, 255, .30);
    color: #fff;
    font-weight: 700;
    box-shadow: inset 3px 0 0 #22d3ee, 0 6px 16px rgba(0, 10, 30, .30);
}

.nav-group.has-active[b-pamlowdiu8]  .nav-group-toggle:focus-visible,
.nav-item[b-pamlowdiu8]  .nav-group-toggle:focus-visible,
.nav-item[b-pamlowdiu8]  .nav-sublink:focus-visible {
    outline: 2px solid #67e8f9;
    outline-offset: 2px;
}

/* بدنه‌ی زیرمنو؛ باز و بسته‌شدن نرم با تغییر ارتفاع از 0 تا اندازه‌ی واقعی */
.nav-sub[b-pamlowdiu8] {
    display: grid;
    grid-template-rows: 0fr;
    visibility: hidden;
    transition: grid-template-rows .28s ease, visibility 0s linear .28s;
}

.nav-group.is-open > .nav-sub[b-pamlowdiu8] {
    grid-template-rows: 1fr;
    visibility: visible;
    transition: grid-template-rows .28s ease, visibility 0s;
}

.nav-sub-inner[b-pamlowdiu8] {
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: .25rem;
    /* خط راهنمای سمت آیکون‌ها نشان می‌دهد این آیتم‌ها زیرمجموعه‌ی سرگروه‌اند */
    margin-inline-start: 1.15rem;
    padding-inline-start: .6rem;
    border-inline-start: 1px solid rgba(255, 255, 255, .22);
}

.nav-group.is-open .nav-sub-inner[b-pamlowdiu8] {
    padding-top: .35rem;
}

/* آیتم‌های زیرمنو */
.nav-item[b-pamlowdiu8]  .nav-sublink {
    position: relative;
    min-height: 2.6rem;
    padding: .3rem .65rem;
    font-size: .86rem;
    border-radius: 12px;
    color: #cfd8e3;
}

.nav-item[b-pamlowdiu8]  .nav-sublink::after {
    display: none;
}

.nav-item[b-pamlowdiu8]  .nav-sublink:hover {
    transform: translateX(-2px);
}

.nav-ico-sub[b-pamlowdiu8] {
    width: 1.15rem;
    height: 1.15rem;
    margin-inline-end: .6rem;
}

.nav-sub-text[b-pamlowdiu8] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* آیتم انتخاب‌شده‌ی زیرمنو: پس‌زمینه‌ی روشن + نوار رنگی + نقطه‌ی درخشان تا کاملاً مشخص باشد */
.nav-item[b-pamlowdiu8]  .nav-sublink.active {
    background: linear-gradient(135deg, rgba(34, 211, 238, .34) 0%, rgba(255, 255, 255, .20) 100%);
    border-color: rgba(103, 232, 249, .55);
    color: #fff;
    font-weight: 700;
    box-shadow: inset 3px 0 0 #22d3ee, 0 6px 16px rgba(0, 10, 30, .32);
}

.nav-item[b-pamlowdiu8]  .nav-sublink.active::before {
    content: "";
    position: absolute;
    inset-inline-start: -.95rem;
    top: 50%;
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    transform: translateY(-50%);
    background: #22d3ee;
    box-shadow: 0 0 0 3px rgba(34, 211, 238, .30), 0 0 10px rgba(34, 211, 238, .9);
}

/* نشان‌ها (تعداد نظرهای در انتظار) در سرگروه و زیرمنو کنار متن بنشینند */
.nav-group[b-pamlowdiu8]  .cb-nav-badge {
    margin-inline-start: .4rem;
    flex: 0 0 auto;
}

/* موبایل: اهداف لمسی بزرگ‌تر و فاصله‌ی کمتر از لبه */
@media (max-width: 640.98px) {
    .nav-item[b-pamlowdiu8]  .nav-sublink {
        min-height: 2.85rem;
        font-size: .9rem;
    }

    .nav-sub-inner[b-pamlowdiu8] {
        margin-inline-start: 1rem;
    }
}

/* صفحه‌ی لمسی: hover وجود ندارد؛ بدون این، آخرین آیتمِ لمس‌شده کج می‌ماند */
@media (hover: none) {
    .nav-item[b-pamlowdiu8]  .nav-link:hover,
    .nav-item[b-pamlowdiu8]  .nav-sublink:hover {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-scrollable[b-pamlowdiu8],
    .nav-sub[b-pamlowdiu8],
    .nav-group.is-open > .nav-sub[b-pamlowdiu8],
    .nav-chevron[b-pamlowdiu8] {
        transition: none;
    }
}

/* نوبت‌دهی */
.nav-ico-appointments-group[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3'%20y='4'%20width='18'%20height='17'%20rx='3'/%3E%3Cpath%20d='M8%202v4M16%202v4M3%2010h18'/%3E%3C/svg%3E");
    --ico-a: #fbcfe8;
    --ico-b: #ec4899;
}

.nav-ico-appointment[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3'%20y='4'%20width='18'%20height='17'%20rx='3'/%3E%3Cpath%20d='M8%202v4M16%202v4M3%2010h18'/%3E%3Cpath%20d='m9%2015%202%202%204-4'/%3E%3C/svg%3E");
    --ico-a: #bbf7d0;
    --ico-b: #22c55e;
}

.nav-ico-appointment-agenda[b-pamlowdiu8] {
    --ico: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.9'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='12'%20r='9'/%3E%3Cpath%20d='M12%207v5l3%202'/%3E%3C/svg%3E");
    --ico-a: #bfdbfe;
    --ico-b: #3b82f6;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-7fmqalw20i],
.components-reconnect-repeated-attempt-visible[b-7fmqalw20i],
.components-reconnect-failed-visible[b-7fmqalw20i],
.components-pause-visible[b-7fmqalw20i],
.components-resume-failed-visible[b-7fmqalw20i],
.components-rejoining-animation[b-7fmqalw20i] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-retrying[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-failed[b-7fmqalw20i],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-7fmqalw20i] {
    display: block;
}


#components-reconnect-modal[b-7fmqalw20i] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-7fmqalw20i 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-7fmqalw20i 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-7fmqalw20i 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-7fmqalw20i]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-7fmqalw20i 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-7fmqalw20i {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-7fmqalw20i {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-7fmqalw20i {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-7fmqalw20i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-7fmqalw20i] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-7fmqalw20i] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-7fmqalw20i] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-7fmqalw20i] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-7fmqalw20i] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-7fmqalw20i] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-7fmqalw20i 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-7fmqalw20i] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-7fmqalw20i {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Layout/SiteFooter.razor.rz.scp.css */
/* ============================================================
   فوتر سایت — زمینه‌ی تیره‌ی گرادیانی + ناحیه‌ی آبیِ موج‌دار (الگوبرداری از طرح مرجع)
   همه‌ی رنگ‌ها از متغیرهای --ft-* می‌آیند که در «تنظیمات سایت ← ظاهر سایت» ویرایش می‌شوند.
   فقط ویژگی‌های منطقی (inline/start/end) تا در RTL و LTR درست دیده شود.
   ============================================================ */

.site-footer[b-cxw87ae5bz] {
    position: relative;
    margin-top: 3rem;
    color: var(--ft-text, #d1d5db);
    overflow: hidden;
}

/* ---------- بخش تیره ---------- */
.sf-main[b-cxw87ae5bz] {
    background: linear-gradient(180deg, var(--ft-top, #0d0d0d) 0%, var(--ft-bottom, #222222) 100%);
    padding: 3.2rem 1.25rem 1.4rem;
}

.sf-inner[b-cxw87ae5bz] {
    max-width: 1200px;
    margin-inline: auto;
}

.sf-grid[b-cxw87ae5bz] {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1.3fr;
    gap: 2.2rem 3rem;
}

.sf-col[b-cxw87ae5bz] {
    min-width: 0;
}

.sf-brand[b-cxw87ae5bz] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .55rem;
}

.sf-logo img[b-cxw87ae5bz] {
    height: 64px;
    width: auto;
    display: block;
    object-fit: contain;
    padding: .35rem .7rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, .92);
}

.sf-title[b-cxw87ae5bz] {
    margin: .4rem 0 0;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--ft-heading, #fff);
}

.sf-about[b-cxw87ae5bz] {
    margin: 0;
    max-width: 38ch;
    font-size: .92rem;
    line-height: 2;
    color: var(--ft-text, #d1d5db);
}

.sf-heading[b-cxw87ae5bz] {
    position: relative;
    margin: 0 0 1rem;
    padding-bottom: .6rem;
    font-size: 1rem;
    font-weight: 800;
    color: var(--ft-heading, #fff);
}

    .sf-heading[b-cxw87ae5bz]::after {
        content: "";
        position: absolute;
        inset-inline-start: 0;
        bottom: 0;
        width: 38px;
        height: 3px;
        border-radius: 3px;
        background: linear-gradient(90deg, var(--ft-wave-top, #2561bb), var(--ft-wave-bottom, #317ff6));
    }

.sf-links[b-cxw87ae5bz],
.sf-contact[b-cxw87ae5bz] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .65rem;
}

.site-footer a[b-cxw87ae5bz] {
    color: var(--ft-text, #d1d5db);
    text-decoration: none;
    transition: color .2s ease, transform .2s ease;
}

.sf-links a:hover[b-cxw87ae5bz],
.sf-links a:focus-visible[b-cxw87ae5bz],
.sf-contact a:hover[b-cxw87ae5bz],
.sf-contact a:focus-visible[b-cxw87ae5bz] {
    color: var(--ft-hover, #60a5fa);
}

.sf-links a[b-cxw87ae5bz] {
    display: inline-block;
    font-size: .93rem;
}

    .sf-links a:hover[b-cxw87ae5bz] {
        transform: translateX(-3px);
    }

[dir="ltr"] .sf-links a:hover[b-cxw87ae5bz] {
    transform: translateX(3px);
}

.sf-contact li[b-cxw87ae5bz] {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    font-size: .92rem;
    line-height: 1.9;
}

    .sf-contact li svg[b-cxw87ae5bz] {
        flex: none;
        width: 18px;
        height: 18px;
        margin-top: .35rem;
        color: var(--ft-hover, #60a5fa);
    }

    .sf-contact li span[b-cxw87ae5bz],
    .sf-contact li a[b-cxw87ae5bz] {
        min-width: 0;
        overflow-wrap: anywhere;
    }

/* ---------- ناحیه‌ی آبی موج‌دار ---------- */
.sf-zone[b-cxw87ae5bz] {
    position: relative;
    background: linear-gradient(180deg, var(--ft-wave-top, #2561bb) 0%, var(--ft-wave-bottom, #317ff6) 100%);
    padding-top: clamp(70px, 9vw, 130px);
}

.sf-waves[b-cxw87ae5bz] {
    position: absolute;
    inset-inline: 0;
    top: -1px;
    width: 100%;
    height: clamp(70px, 9vw, 130px);
    display: block;
}

/* لایه‌های نیمه‌شفاف روی آبی؛ بعد از آن، زمینه‌ی تیره با منحنی جلویی بریده می‌شود */
.sf-wave-2[b-cxw87ae5bz] {
    fill: rgba(8, 20, 60, .22);
}

.sf-wave-3[b-cxw87ae5bz] {
    fill: rgba(10, 14, 38, .38);
}

.sf-wave-cut[b-cxw87ae5bz] {
    fill: var(--ft-bottom, #222222);
}

.sf-base[b-cxw87ae5bz] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.1rem;
    padding: .6rem 1.25rem 1.6rem;
    text-align: center;
}

/* ---------- آیکن‌ها (واتس‌اپ / ایمیل / اینستاگرام) ---------- */
.sf-social[b-cxw87ae5bz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .9rem;
}

.site-footer a.sf-icon[b-cxw87ae5bz] {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    color: var(--ft-icon, #fff);
    background: color-mix(in srgb, var(--ft-icon, #fff) 14%, transparent);
    border: 1.5px solid color-mix(in srgb, var(--ft-icon, #fff) 38%, transparent);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
    transition: transform .2s ease, background .2s ease, color .2s ease, box-shadow .2s ease;
}

    .site-footer a.sf-icon svg[b-cxw87ae5bz] {
        width: 22px;
        height: 22px;
    }

    .site-footer a.sf-icon:hover[b-cxw87ae5bz],
    .site-footer a.sf-icon:focus-visible[b-cxw87ae5bz] {
        transform: translateY(-4px);
        color: var(--ft-icon, #fff);
        background: var(--ft-hover, #60a5fa);
        box-shadow: 0 12px 26px rgba(0, 0, 0, .32);
        outline: none;
    }

.sf-copy[b-cxw87ae5bz] {
    margin: 0;
    font-size: .85rem;
    line-height: 1.9;
    color: var(--ft-heading, #fff);
    opacity: .92;
}

/* ---------- تبلت و موبایل ---------- */
@media (max-width: 900px) {
    .sf-grid[b-cxw87ae5bz] {
        grid-template-columns: 1fr 1fr;
    }

    .sf-brand[b-cxw87ae5bz] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .site-footer[b-cxw87ae5bz] {
        margin-top: 2rem;
    }

    .sf-main[b-cxw87ae5bz] {
        padding: 2.2rem 1rem 1rem;
    }

    .sf-grid[b-cxw87ae5bz] {
        grid-template-columns: 1fr;
        gap: 1.6rem;
    }

    .sf-brand[b-cxw87ae5bz] {
        align-items: center;
        text-align: center;
    }

    .sf-about[b-cxw87ae5bz] {
        max-width: none;
    }

    .sf-logo img[b-cxw87ae5bz] {
        height: 56px;
    }

    .sf-base[b-cxw87ae5bz] {
        padding-inline: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-footer a[b-cxw87ae5bz],
    .site-footer a.sf-icon[b-cxw87ae5bz] {
        transition: none;
    }

        .site-footer a.sf-icon:hover[b-cxw87ae5bz] {
            transform: none;
        }
}
/* /Components/Pages/AboutUsPage.razor.rz.scp.css */
/* ===== صفحه‌ی عمومی «درباره ما» ===== */
.aboutpage[b-8lu2g3dv0j] {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 24px 3% 48px;
    box-sizing: border-box;
}

.aboutpage-breadcrumb[b-8lu2g3dv0j] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    font-size: 13.5px;
    color: #6b7280;
}

    .aboutpage-breadcrumb a[b-8lu2g3dv0j] {
        color: #4f46e5;
        text-decoration: none;
    }

        .aboutpage-breadcrumb a:hover[b-8lu2g3dv0j] {
            text-decoration: underline;
        }

.aboutpage-card[b-8lu2g3dv0j] {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    align-items: start;
    gap: 36px;
    padding: 28px;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid var(--color-border-light, #ddd6fe);
    border-radius: 24px;
    box-shadow: 0 10px 30px rgba(99, 102, 241, .12);
}

.aboutpage-media[b-8lu2g3dv0j] {
    margin: 0;
    overflow: hidden;
    border-radius: 18px;
    aspect-ratio: 4 / 3;
    background: #f1f5f9;
}

    .aboutpage-media img[b-8lu2g3dv0j] {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.aboutpage-body[b-8lu2g3dv0j] {
    min-width: 0;
    text-align: start;
}

.aboutpage-eyebrow[b-8lu2g3dv0j] {
    display: inline-block;
    margin-bottom: 12px;
    padding: 4px 14px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: #4f46e5;
    background: rgba(99, 102, 241, .10);
}

.aboutpage-title[b-8lu2g3dv0j] {
    margin: 0 0 16px;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.6;
    color: #164a8a;
}

.aboutpage-text[b-8lu2g3dv0j] {
    margin: 0 0 20px;
    font-size: 16px;
    line-height: 2.2;
    color: #374151;
    white-space: normal;
    overflow-wrap: anywhere;
}

.aboutpage-keywords[b-8lu2g3dv0j] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
}

.aboutpage-chip[b-8lu2g3dv0j] {
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    color: #4338ca;
    background: #eef2ff;
    border: 1px solid #e0e7ff;
}

.aboutpage-btn[b-8lu2g3dv0j] {
    display: inline-block;
    padding: 10px 24px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    text-decoration: none;
    background: var(--gradient-button, linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%));
    transition: transform .2s, box-shadow .2s;
}

    .aboutpage-btn:hover[b-8lu2g3dv0j] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(99, 102, 241, .35);
        color: #fff;
    }

.aboutpage-state[b-8lu2g3dv0j] {
    padding: 56px 20px;
    text-align: center;
    color: #6b7280;
    background: #fff;
    border: 1px dashed var(--color-border-light, #ddd6fe);
    border-radius: 20px;
}

.aboutpage-state-icon[b-8lu2g3dv0j] {
    font-size: 40px;
    margin-bottom: 8px;
}

.aboutpage-state p[b-8lu2g3dv0j] {
    margin: 0 0 18px;
    font-size: 15px;
}

@media (max-width: 768px) {
    .aboutpage[b-8lu2g3dv0j] {
        padding: 14px 12px 32px;
    }

    .aboutpage-card[b-8lu2g3dv0j] {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
        padding: 14px;
        border-radius: 18px;
    }

    .aboutpage-title[b-8lu2g3dv0j] {
        font-size: 21px;
    }

    .aboutpage-text[b-8lu2g3dv0j] {
        font-size: 14.5px;
    }
}
/* /Components/Pages/Admin/AdminHome.razor.rz.scp.css */
.admin-home-empty[b-zd0185rok2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 50vh;
    color: #f1f9ff;
}

    .admin-home-empty h3[b-zd0185rok2] {
        margin-bottom: .5rem;
    }

    .admin-home-empty p[b-zd0185rok2] {
        color: #c3dcea;
    }
/* /Components/Pages/Admin/Backup/BackupAdmin.razor.rz.scp.css */
.bk-page[b-um1sultzvs] {
    max-width: 880px;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.bk-note[b-um1sultzvs] {
    padding: 12px 16px;
    border-radius: var(--radius, 12px);
    background: rgba(99, 102, 241, .08);
    border: 1px solid var(--border, rgba(0, 0, 0, .1));
    font-size: .92rem;
    line-height: 1.8;
    color: white;
}

.bk-card[b-um1sultzvs],
.bk-card:hover[b-um1sultzvs] {
    transform: none;
    overflow: visible;
    padding: 18px 20px;
}

.bk-title[b-um1sultzvs] {
    margin: 0 0 14px;
    font-size: 1.05rem;
    font-weight: 700;
}

.bk-sub[b-um1sultzvs] {
    margin: 18px 0 8px;
    font-size: .95rem;
}

.bk-grid[b-um1sultzvs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px 16px;
}

.bk-field[b-um1sultzvs] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: .9rem;
}

    .bk-field > small[b-um1sultzvs] {
        opacity: .7;
        line-height: 1.7;
    }

.bk-wide[b-um1sultzvs] {
    grid-column: 1 / -1;
}

.bk-badge[b-um1sultzvs] {
    font-style: normal;
    font-size: .75rem;
    padding: 2px 8px;
    border-radius: 999px;
    margin-inline-start: 6px;
}

    .bk-badge.ok[b-um1sultzvs] {
        background: rgba(16, 185, 129, .15);
        color: #047857;
    }

.bk-hint[b-um1sultzvs] {
    margin: 12px 0;
    font-size: .88rem;
    line-height: 1.9;
    opacity: .85;
}

.bk-check[b-um1sultzvs] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 8px 0 12px;
    font-size: .92rem;
    line-height: 1.8;
    cursor: pointer;
}

    .bk-check input[b-um1sultzvs] {
        margin-top: 6px;
    }

.bk-actions[b-um1sultzvs] {
    margin-top: 14px;
    display: flex;
    gap: 10px;
}

.bk-savebar[b-um1sultzvs] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.bk-result[b-um1sultzvs] {
    margin-top: 12px;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: .9rem;
    line-height: 1.8;
    word-break: break-word;
}

    .bk-result.ok[b-um1sultzvs] {
        background: rgba(16, 185, 129, .12);
        color: #065f46;
    }

    .bk-result.bad[b-um1sultzvs] {
        background: rgba(239, 68, 68, .1);
        color: #991b1b;
    }

.bk-status[b-um1sultzvs] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 8px 16px;
    margin: 0;
    font-size: .92rem;
}

    .bk-status dt[b-um1sultzvs] {
        opacity: .7;
    }

    .bk-status dd[b-um1sultzvs] {
        margin: 0;
    }

.bk-file[b-um1sultzvs] {
    word-break: break-all;
}

.bk-table-wrap[b-um1sultzvs] {
    overflow-x: auto;
}

.bk-table[b-um1sultzvs] {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
}

    .bk-table th[b-um1sultzvs],
    .bk-table td[b-um1sultzvs] {
        padding: 8px 10px;
        border-bottom: 1px solid var(--border, rgba(0, 0, 0, .08));
        text-align: start;
        white-space: nowrap;
    }
/* /Components/Pages/Admin/PriceImport/PriceImportAdmin.razor.rz.scp.css */
.import-page[b-d1wmx1gfxr] { display: flex; flex-direction: column; gap: 18px; }

.import-card[b-d1wmx1gfxr] { padding: 20px 22px; }
.import-card:hover[b-d1wmx1gfxr] { transform: none; }

.import-step[b-d1wmx1gfxr] { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.import-step-no[b-d1wmx1gfxr] {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
}

.import-step-text[b-d1wmx1gfxr] { flex: 1 1 260px; min-width: 0; }
.import-step-text h4[b-d1wmx1gfxr] { margin: 0 0 4px; font-size: 16px; }
.import-step-text p[b-d1wmx1gfxr] { margin: 0; font-size: 13px; color: var(--text-muted); line-height: 1.8; }

.import-download[b-d1wmx1gfxr] { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.import-download svg[b-d1wmx1gfxr] { width: 18px; height: 18px; }

.import-columns[b-d1wmx1gfxr] { margin-top: 16px; }
.import-columns summary[b-d1wmx1gfxr] { cursor: pointer; font-weight: 700; font-size: 14px; padding: 6px 0; }
.import-db-field[b-d1wmx1gfxr] { font-size: 12px; white-space: nowrap; }

.import-form[b-d1wmx1gfxr] { margin-top: 16px; max-width: 640px; }
.import-file[b-d1wmx1gfxr] { padding: 8px 10px; }
.import-file-name[b-d1wmx1gfxr] { margin-top: 6px; font-size: 12px; color: var(--text-muted); }

.import-check[b-d1wmx1gfxr] { display: flex; align-items: center; gap: 8px; font-size: 13px; margin: 6px 0 16px; cursor: pointer; }

.import-actions[b-d1wmx1gfxr] { display: flex; }

.import-summary[b-d1wmx1gfxr] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.import-chip[b-d1wmx1gfxr] {
    border-radius: 14px;
    padding: 14px 10px;
    text-align: center;
    font-size: 13px;
    background: rgba(238, 242, 255, .75);
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.import-chip-num[b-d1wmx1gfxr] { font-size: 24px; font-weight: 800; }
.import-chip-ok[b-d1wmx1gfxr] { background: rgba(209, 250, 229, .9); color: #047857; }
.import-chip-bad[b-d1wmx1gfxr] { background: var(--danger-light); color: var(--danger); }

.import-success[b-d1wmx1gfxr] { margin-top: 14px; padding: 10px 14px; border-radius: 10px; background: rgba(209, 250, 229, .9); color: #047857; font-weight: 600; font-size: 13px; }

.import-errors-title[b-d1wmx1gfxr] { margin: 18px 0 4px; font-size: 15px; }
.import-errors-hint[b-d1wmx1gfxr] { margin: 0 0 10px; font-size: 12px; color: var(--text-muted); line-height: 1.8; }
.import-errors[b-d1wmx1gfxr] { max-height: 360px; overflow: auto; }

@media (max-width: 600px) {
    .import-card[b-d1wmx1gfxr] { padding: 16px 14px; }
    .import-summary[b-d1wmx1gfxr] { grid-template-columns: 1fr; }
    .import-download[b-d1wmx1gfxr] { width: 100%; justify-content: center; }
}

.import-summary-4[b-d1wmx1gfxr] { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 760px) {
    .import-summary-4[b-d1wmx1gfxr] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* /Components/Pages/Admin/ProductImport/ProductImportAdmin.razor.rz.scp.css */
.import-page[b-qb4r38g02e] { display: flex; flex-direction: column; gap: 18px; }

.import-card[b-qb4r38g02e] { padding: 20px 22px; }
.import-card:hover[b-qb4r38g02e] { transform: none; }

.import-step[b-qb4r38g02e] { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.import-step-no[b-qb4r38g02e] {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
}

.import-step-text[b-qb4r38g02e] { flex: 1 1 260px; min-width: 0; }
.import-step-text h4[b-qb4r38g02e] { margin: 0 0 4px; font-size: 16px; }
.import-step-text p[b-qb4r38g02e] { margin: 0; font-size: 13px; color: var(--text-muted); line-height: 1.8; }

.import-download[b-qb4r38g02e] { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.import-download svg[b-qb4r38g02e] { width: 18px; height: 18px; }

.import-columns[b-qb4r38g02e] { margin-top: 16px; }
.import-columns summary[b-qb4r38g02e] { cursor: pointer; font-weight: 700; font-size: 14px; padding: 6px 0; }
.import-db-field[b-qb4r38g02e] { font-size: 12px; white-space: nowrap; }

.import-form[b-qb4r38g02e] { margin-top: 16px; max-width: 640px; }
.import-file[b-qb4r38g02e] { padding: 8px 10px; }
.import-file-name[b-qb4r38g02e] { margin-top: 6px; font-size: 12px; color: var(--text-muted); }

.import-check[b-qb4r38g02e] { display: flex; align-items: center; gap: 8px; font-size: 13px; margin: 6px 0 16px; cursor: pointer; }

.import-actions[b-qb4r38g02e] { display: flex; }

.import-summary[b-qb4r38g02e] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.import-chip[b-qb4r38g02e] {
    border-radius: 14px;
    padding: 14px 10px;
    text-align: center;
    font-size: 13px;
    background: rgba(238, 242, 255, .75);
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.import-chip-num[b-qb4r38g02e] { font-size: 24px; font-weight: 800; }
.import-chip-ok[b-qb4r38g02e] { background: rgba(209, 250, 229, .9); color: #047857; }
.import-chip-bad[b-qb4r38g02e] { background: var(--danger-light); color: var(--danger); }

.import-success[b-qb4r38g02e] { margin-top: 14px; padding: 10px 14px; border-radius: 10px; background: rgba(209, 250, 229, .9); color: #047857; font-weight: 600; font-size: 13px; }

.import-errors-title[b-qb4r38g02e] { margin: 18px 0 4px; font-size: 15px; }
.import-errors-hint[b-qb4r38g02e] { margin: 0 0 10px; font-size: 12px; color: var(--text-muted); line-height: 1.8; }
.import-errors[b-qb4r38g02e] { max-height: 360px; overflow: auto; }

@media (max-width: 600px) {
    .import-card[b-qb4r38g02e] { padding: 16px 14px; }
    .import-summary[b-qb4r38g02e] { grid-template-columns: 1fr; }
    .import-download[b-qb4r38g02e] { width: 100%; justify-content: center; }
}
/* /Components/Pages/Admin/SiteSettings/SiteSettingsAdmin.razor.rz.scp.css */
/* ============================================================
   تنظیمات سایت — هماهنگ با بقیه‌ی صفحات پنل (کارت شیشه‌ای، رنگ‌های --primary / --accent، دکمه‌ها و فیلدهای مشترک)
   همه‌ی جهت‌ها منطقی (inline) هستند تا در حالت RTL و LTR درست دیده شوند.
   ============================================================ */

.settings-page[b-n1ejup97y0] {
    max-width: 880px;
    margin-inline: auto;
}

/* کارت اصلی: همان ظاهر crud-card، بدون بالا پریدنِ hover (فرم است نه جدول) */
.settings-shell.crud-card[b-n1ejup97y0],
.settings-shell.crud-card:hover[b-n1ejup97y0] {
    transform: none;
    overflow: visible;
}

/* ---------- تب‌ها ---------- */
.settings-tabs[b-n1ejup97y0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
    background: rgba(245, 243, 255, .55);
    border-start-start-radius: var(--radius);
    border-start-end-radius: var(--radius);
}

.settings-tab[b-n1ejup97y0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1.5px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--text-muted);
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background var(--transition-base), color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-fast);
}

    .settings-tab svg[b-n1ejup97y0] {
        width: 18px;
        height: 18px;
        flex: none;
    }

    .settings-tab:hover[b-n1ejup97y0] {
        background: var(--primary-light);
        color: var(--primary-dark);
    }

    .settings-tab:focus-visible[b-n1ejup97y0] {
        outline: 2px solid var(--primary);
        outline-offset: 2px;
    }

    .settings-tab.is-active[b-n1ejup97y0] {
        background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
        color: #fff;
        box-shadow: 0 4px 14px rgba(99, 102, 241, .35);
    }

.settings-tab-dot[b-n1ejup97y0] {
    min-width: 20px;
    height: 20px;
    padding-inline: 6px;
    border-radius: 999px;
    background: var(--warning);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 20px;
    text-align: center;
}

/* ---------- پنل ---------- */
.settings-panel[b-n1ejup97y0] {
    padding: 22px 26px 8px;
    animation: settingsFade-b-n1ejup97y0 .25s ease;
}

@keyframes settingsFade-b-n1ejup97y0 {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.settings-desc[b-n1ejup97y0] {
    margin: 0 0 14px;
    color: var(--text-muted);
    font-size: 13px;
    line-height: 2;
}

.settings-row[b-n1ejup97y0] {
    display: grid;
    grid-template-columns: minmax(180px, 250px) 1fr;
    gap: 8px 22px;
    align-items: start;
    padding: 14px 12px;
    margin-inline: -12px;
    border-radius: 12px;
    border-bottom: 1px dashed var(--border);
    transition: background var(--transition-base);
}

    .settings-row:last-of-type[b-n1ejup97y0] {
        border-bottom: none;
    }

    .settings-row.is-dirty[b-n1ejup97y0] {
        background: rgba(245, 158, 11, .08);
    }

.settings-label[b-n1ejup97y0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-top: 9px;
}

    .settings-label label[b-n1ejup97y0] {
        font-size: 14px;
        font-weight: 700;
        color: var(--text);
    }

    .settings-label small[b-n1ejup97y0] {
        font-size: 12px;
        line-height: 1.8;
        color: var(--text-muted);
    }

.settings-control[b-n1ejup97y0] {
    min-width: 0;
}

.settings-error[b-n1ejup97y0] {
    margin-top: 6px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--danger);
}

.settings-control .form-control.invalid[b-n1ejup97y0],
.settings-control .form-control.invalid:focus[b-n1ejup97y0] {
    border-color: var(--danger);
    box-shadow: 0 0 0 4px var(--danger-light);
}

/* ---------- رنگ ---------- */
.color-field[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.color-picker[b-n1ejup97y0] {
    flex: none;
    width: 52px;
    height: 42px;
    padding: 3px;
    border: 1.5px solid var(--border);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
}

    .color-picker:hover[b-n1ejup97y0] {
        border-color: var(--accent-light);
    }

.color-hex[b-n1ejup97y0] {
    max-width: 150px;
    font-family: var(--font-main);
    text-transform: lowercase;
}

.btn-reset[b-n1ejup97y0] {
    flex: none;
    padding: 10px 12px;
}

    .btn-reset svg[b-n1ejup97y0] {
        width: 16px;
        height: 16px;
    }

    .btn-reset:disabled[b-n1ejup97y0] {
        opacity: .45;
        cursor: default;
        transform: none;
    }

/* ---------- کلید روشن/خاموش ---------- */
.switch[b-n1ejup97y0] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-top: 8px;
    cursor: pointer;
    user-select: none;
}

    .switch input[b-n1ejup97y0] {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
    }

.switch-track[b-n1ejup97y0] {
    position: relative;
    width: 48px;
    height: 26px;
    border-radius: 999px;
    background: #d1d5db;
    transition: background var(--transition-base);
}

.switch-thumb[b-n1ejup97y0] {
    position: absolute;
    top: 3px;
    inset-inline-start: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
    transition: inset-inline-start var(--transition-base);
}

.switch input:checked + .switch-track[b-n1ejup97y0] {
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
}

    .switch input:checked + .switch-track .switch-thumb[b-n1ejup97y0] {
        inset-inline-start: 25px;
    }

.switch input:focus-visible + .switch-track[b-n1ejup97y0] {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}

.switch-text[b-n1ejup97y0] {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-muted);
}

/* ---------- رمز / مقدار محرمانه ---------- */
.secret-state[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
}

.link-btn[b-n1ejup97y0] {
    padding: 0;
    border: none;
    background: none;
    color: var(--primary-dark);
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

    .link-btn.danger[b-n1ejup97y0] {
        color: var(--danger);
    }

/* ---------- پیش‌نمایش تم ---------- */
.theme-preview[b-n1ejup97y0] {
    margin: 18px 0 14px;
    border: 1.5px dashed var(--accent-light);
    border-radius: 14px;
    overflow: hidden;
}

.theme-preview-caption[b-n1ejup97y0] {
    display: block;
    padding: 8px 14px;
    font-size: 12px;
    font-weight: 700;
    color: var(--primary-dark);
    background: var(--bg-soft);
}

.theme-preview-surface[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 16px;
    background-color: var(--pv-bg, #f8f7fc);
    transition: background-color var(--transition-base);
}

.theme-preview-btn[b-n1ejup97y0] {
    pointer-events: none;
}

/* ---------- ایمیل آزمایشی ---------- */
.smtp-test[b-n1ejup97y0] {
    margin: 18px 0 14px;
    padding: 16px 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--bg-soft);
}

    .smtp-test h5[b-n1ejup97y0] {
        margin: 0 0 4px;
        font-size: 15px;
        color: var(--primary-dark);
    }

    .smtp-test p[b-n1ejup97y0] {
        margin: 0 0 12px;
        font-size: 12.5px;
        line-height: 1.9;
        color: var(--text-muted);
    }

.smtp-test-row[b-n1ejup97y0] {
    display: flex;
    gap: 10px;
}

    .smtp-test-row .form-control[b-n1ejup97y0] {
        flex: 1;
        min-width: 0;
        background: #fff;
    }

.smtp-test-hint[b-n1ejup97y0] {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    color: #92400e;
}

.smtp-test-result[b-n1ejup97y0] {
    margin-top: 10px;
    padding: 9px 14px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.8;
    overflow-wrap: anywhere;
}

    .smtp-test-result.is-ok[b-n1ejup97y0] {
        background: #dcfce7;
        color: #166534;
    }

    .smtp-test-result.is-error[b-n1ejup97y0] {
        background: var(--danger-light);
        color: #b91c1c;
    }

/* ---------- نوار ذخیره ---------- */
.settings-savebar[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 10px;
    padding: 16px 26px;
    border-top: 1px solid var(--border);
    background: rgba(245, 243, 255, .55);
    border-end-start-radius: var(--radius);
    border-end-end-radius: var(--radius);
}

.savebar-state[b-n1ejup97y0] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-muted);
}

    .savebar-state.has-changes[b-n1ejup97y0] {
        color: #b45309;
    }

.savebar-actions[b-n1ejup97y0] {
    display: flex;
    gap: 10px;
}

    .savebar-actions .btn:disabled[b-n1ejup97y0] {
        opacity: .5;
        cursor: default;
        transform: none;
        box-shadow: none;
    }

/* ---------- موبایل ---------- */
@media (max-width: 680px) {
    .settings-panel[b-n1ejup97y0] {
        padding-inline: 16px;
    }

    .settings-row[b-n1ejup97y0] {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .settings-label[b-n1ejup97y0] {
        padding-top: 0;
    }

    .settings-tabs[b-n1ejup97y0] {
        padding: 10px 12px;
    }

    .settings-tab[b-n1ejup97y0] {
        flex: 1 1 auto;
        justify-content: center;
        padding: 9px 12px;
    }

    .smtp-test-row[b-n1ejup97y0] {
        flex-direction: column;
    }

    .settings-savebar[b-n1ejup97y0] {
        padding-inline: 16px;
    }

    .savebar-actions[b-n1ejup97y0] {
        width: 100%;
    }

        .savebar-actions .btn[b-n1ejup97y0] {
            flex: 1;
        }
}

@media (prefers-reduced-motion: reduce) {
    .settings-panel[b-n1ejup97y0] {
        animation: none;
    }
}

/* ---------- سرتیتر بخش‌ها (رنگ‌ها / فوتر) ---------- */
.settings-section[b-n1ejup97y0] {
    margin: 22px 0 4px;
    padding: 8px 14px;
    border-inline-start: 4px solid var(--accent);
    border-radius: 8px;
    background: var(--bg-soft);
    font-size: 14px;
    font-weight: 800;
    color: var(--primary-dark);
}

    .settings-section:first-of-type[b-n1ejup97y0] {
        margin-top: 4px;
    }

.settings-control textarea.form-control[b-n1ejup97y0] {
    min-height: 84px;
    resize: vertical;
    line-height: 1.9;
}

/* ---------- پیش‌نمایش منو و فوتر ---------- */
.theme-preview-surface[b-n1ejup97y0] {
    flex-direction: column;
    gap: 18px;
}

.pv-nav[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 14px;
    width: 100%;
    padding: 8px 14px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--pv-nav-bg, #fff) 65%, transparent);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
}

.pv-nav-item[b-n1ejup97y0] {
    font-size: 13px;
    font-weight: 600;
    color: var(--pv-nav-text, #000);
}

.pv-site-btn[b-n1ejup97y0] {
    margin-inline-start: auto;
    padding: 5px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--pv-p, #6366f1), var(--pv-a, #8b5cf6));
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.pv-footer[b-n1ejup97y0] {
    overflow: hidden;
    border-radius: 0 0 12px 12px;
}

.pv-footer-dark[b-n1ejup97y0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 14px 18px 22px;
    background: linear-gradient(180deg, var(--ft-top, #0d0d0d), var(--ft-bottom, #222));
    color: var(--ft-text, #d1d5db);
    font-size: 12px;
}

    .pv-footer-dark b[b-n1ejup97y0] {
        color: var(--ft-heading, #fff);
        font-size: 13px;
    }

.pv-footer-blue[b-n1ejup97y0] {
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 18px 0 14px;
    background: linear-gradient(180deg, var(--ft-wave-top, #2561bb), var(--ft-wave-bottom, #317ff6));
    border-top-left-radius: 50% 14px;
    border-top-right-radius: 50% 14px;
    margin-top: -12px;
}

.pv-dot[b-n1ejup97y0] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--ft-icon, #fff) 18%, transparent);
    border: 1.5px solid color-mix(in srgb, var(--ft-icon, #fff) 45%, transparent);
}

/* ---------- لوگوی گزارش ---------- */
.logo-field[b-n1ejup97y0] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 14px;
}

.logo-field-preview[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 150px;
    height: 100px;
    padding: 8px;
    border: 1.5px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    /* شطرنجی ملایم تا شفافیت لوگو دیده شود */
    background:
        conic-gradient(#f3f4f6 25%, #fff 0 50%, #f3f4f6 0 75%, #fff 0) 0 0 / 16px 16px;
}

    .logo-field-preview.is-empty[b-n1ejup97y0] {
        border-style: dashed;
        color: var(--text-muted);
        font-size: 12px;
        text-align: center;
    }

    .logo-field-preview img[b-n1ejup97y0] {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

.logo-field-actions[b-n1ejup97y0] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    flex: 1 1 220px;
    min-width: 0;
}

    .logo-field-actions .form-control[b-n1ejup97y0] {
        width: 100%;
    }

.logo-field-meta[b-n1ejup97y0] {
    color: var(--text-muted);
    word-break: break-all;
}

    .logo-field-meta.too-large[b-n1ejup97y0] {
        color: var(--danger);
        font-weight: 700;
    }

/* ---------- پیش‌نمایش سربرگ گزارش ---------- */
.report-preview[b-n1ejup97y0] {
    margin: 18px 0 14px;
    border: 1.5px dashed var(--accent-light);
    border-radius: 14px;
    overflow: hidden;
}

.report-preview-sheet[b-n1ejup97y0] {
    margin: 14px;
    padding: 14px 16px 16px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
}

.rp-head[b-n1ejup97y0] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.rp-logo[b-n1ejup97y0] {
    flex: 0 0 auto;
    width: 56px;
    height: 48px;
    object-fit: contain;
}

.rp-name[b-n1ejup97y0] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    gap: 2px;
}

    .rp-name b[b-n1ejup97y0] {
        font-size: 15px;
        color: var(--rp-brand, #154c79);
    }

    .rp-name span[b-n1ejup97y0] {
        font-size: 12px;
        color: var(--text-muted);
    }

.rp-meta[b-n1ejup97y0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 6px 10px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--rp-brand, #154c79) 10%, #fff);
    font-size: 11px;
}

    .rp-meta small[b-n1ejup97y0] {
        color: var(--text-muted);
    }

    .rp-meta b[b-n1ejup97y0] {
        color: var(--rp-brand, #154c79);
        white-space: nowrap;
    }

.rp-bar[b-n1ejup97y0] {
    height: 2px;
    margin: 12px 0 10px;
    background: var(--rp-brand, #154c79);
}

.rp-table[b-n1ejup97y0] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px;
}

    .rp-table span[b-n1ejup97y0] {
        height: 14px;
        border-radius: 3px;
        background: var(--rp-brand, #154c79);
        opacity: .85;
    }

.rp-note[b-n1ejup97y0] {
    display: block;
    padding: 0 14px 12px;
    color: var(--text-muted);
}
/* /Components/Pages/Admin/TicketCatalog/TicketCatalogAdmin.razor.rz.scp.css */
/* تب‌های «موضوع‌ها / بخش‌ها»؛ رنگ‌ها از متغیرهای خود .crud-container گرفته می‌شوند تا با بقیه‌ی صفحات مدیریت هماهنگ بماند */
.tc-tabs[b-qrpy5dpfms] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    width: fit-content;
    max-width: 100%;
    margin-bottom: 1rem;
    padding: .35rem;
    background: var(--bg-soft);
    border: 1px solid var(--border);
    border-radius: 999px;
}

.tc-tab[b-qrpy5dpfms] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .55rem 1.2rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--text-muted);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

    .tc-tab:hover[b-qrpy5dpfms] {
        color: var(--primary-dark);
        background: rgba(99, 102, 241, .08);
    }

    .tc-tab:focus-visible[b-qrpy5dpfms] {
        outline: 3px solid rgba(99, 102, 241, .35);
        outline-offset: 2px;
    }

    .tc-tab.active[b-qrpy5dpfms] {
        background: linear-gradient(135deg, var(--primary), var(--accent));
        color: #fff;
        box-shadow: var(--shadow-md);
    }

.tc-tab-count[b-qrpy5dpfms] {
    min-width: 1.6rem;
    padding: .05rem .5rem;
    border-radius: 999px;
    background: rgba(99, 102, 241, .14);
    color: var(--primary-dark);
    font-size: .78rem;
    line-height: 1.5;
    text-align: center;
}

.tc-tab.active .tc-tab-count[b-qrpy5dpfms] {
    background: rgba(255, 255, 255, .25);
    color: #fff;
}

/* توضیح کوتاهِ زیر تب‌ها: ادمین بداند این فهرست دقیقاً کجا به کاربر نشان داده می‌شود */
.tc-hint[b-qrpy5dpfms] {
    margin: 0 0 1rem;
    padding: .75rem 1rem;
    border: 1px dashed var(--border);
    border-radius: 12px;
    background: var(--primary-light);
    color: var(--text);
    font-size: .9rem;
    line-height: 1.9;
}

@media (max-width: 560px) {
    .tc-tabs[b-qrpy5dpfms] {
        width: 100%;
        border-radius: 16px;
    }

    .tc-tab[b-qrpy5dpfms] {
        flex: 1 1 0;
        padding: .55rem .6rem;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
.carousel-viewport[b-q57x4xb349], .main-slider[b-q57x4xb349] {
    overflow: hidden;
    position: relative;
    width: 100%
}

.main-slider[b-q57x4xb349] {
    margin-top: 25px
}

.carousel-viewport[b-q57x4xb349] {
    margin-top: 0
}

.slider-wrapper[b-q57x4xb349] {
    width: 100%;
    padding: 25px 3%;
    box-sizing: border-box
}

.custom-control[b-q57x4xb349], .dot[b-q57x4xb349] {
    padding: 0;
    cursor: pointer
}

.main-slider[b-q57x4xb349] {
    border-radius: 22px;
    background: #e9ecef;
    box-shadow: 0 15px 40px rgba(0,0,0,.15),0 5px 15px rgba(0,0,0,.08)
}

.carousel-viewport[b-q57x4xb349] {
    /* مهم: صفحه RTL است و در RTL محور flex معکوس می‌شود؛ ترک اسلایدر با translateX
       (که منفی می‌شود) به‌جای اسلاید، فضای خالی نشان می‌داد. مکانیزم اسلایدر باید LTR باشد. */
    direction: ltr;
    touch-action: pan-y;
    cursor: grab;
    -webkit-user-select: none;
    user-select: none
}

    .carousel-viewport.dragging[b-q57x4xb349] {
        cursor: grabbing
    }

.carousel-track[b-q57x4xb349] {
    display: flex;
    height: clamp(240px, 42vw, 540px);
    will-change: transform
}

.carousel-item[b-q57x4xb349] {
    position: relative;
    flex: 0 0 100%;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    background: #e9ecef;
    margin: 0; /* ریست مارجین پیش‌فرض تگ figure */
}

.slider-caption[b-q57x4xb349] {
    direction: rtl;
    text-align: right;
    position: absolute;
    right: 24px;
    bottom: 44px;
    max-width: min(70%, 520px);
    padding: 12px 18px;
    border-radius: 12px;
    background: rgba(0, 0, 0, .45);
    backdrop-filter: blur(4px);
    color: #fff;
    line-height: 1.7;
    z-index: 4;
    pointer-events: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.slider-caption-header[b-q57x4xb349] {
    font-size: 12px;
    font-weight: 600;
    opacity: .85;
    letter-spacing: .2px;
}

.slider-caption-title[b-q57x4xb349] {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
}

.slider-caption-text[b-q57x4xb349] {
    font-size: 14px;
    opacity: .95;
}

@media (max-width: 768px) {
    /* زیرنویس بین دو فلش (هر کدام ۵۰ تا ۵۶ پیکسل) می‌ماند تا نوشته زیر فلش‌ها نرود */
    .slider-caption[b-q57x4xb349] {
        right: 56px;
        bottom: 38px;
        max-width: calc(100% - 112px);
        padding: 8px 12px;
    }

    .slider-caption-header[b-q57x4xb349] {
        font-size: 10.5px;
    }

    .slider-caption-title[b-q57x4xb349] {
        font-size: 14px;
    }

    .slider-caption-text[b-q57x4xb349] {
        font-size: 12px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

.slider-image[b-q57x4xb349] {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center;
    max-width: none;
    pointer-events: none;
    -webkit-user-drag: none
}

.slider-overlay[b-q57x4xb349] {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,rgba(0,0,0,.05),rgba(0,0,0,.2));
    pointer-events: none
}

.carousel-dots[b-q57x4xb349] {
    position: absolute;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 7px;
    z-index: 5
}

.custom-arrow[b-q57x4xb349], .custom-control[b-q57x4xb349] {
    align-items: center;
    display: flex
}

.dot[b-q57x4xb349] {
    width: 9px;
    height: 9px;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background-color: rgba(255,255,255,.65);
    transition: width .3s,border-radius .3s,background-color .3s,transform .3s
}

    .dot.active[b-q57x4xb349] {
        width: 30px;
        border-radius: 20px;
        background-color: #fff;
        transform: scale(1.05)
    }

.custom-control[b-q57x4xb349] {
    position: absolute;
    top: 0;
    height: 100%;
    width: 70px;
    justify-content: center;
    background: transparent;
    border: none;
    z-index: 6;
    opacity: 0;
    transition: opacity 0.4s ease, transform 0.3s ease;
}

.custom-control-prev[b-q57x4xb349] {
    left: 0;
    background: linear-gradient(to right, rgba(0,0,0,0.1), transparent);
}

.custom-control-next[b-q57x4xb349] {
    right: 0;
    background: linear-gradient(to left, rgba(0,0,0,0.1), transparent);
}

.main-slider:hover .custom-control[b-q57x4xb349] {
    opacity: 1
}

.custom-arrow[b-q57x4xb349] {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: #1a1a2e;
    font-size: 22px;
    font-weight: 300;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(10px);
    transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.custom-control:hover .custom-arrow[b-q57x4xb349] {
    transform: scale(1.12) translateY(-2px);
    background: #ffffff;
    color: #164a8a;
    box-shadow: 0 8px 30px rgba(22, 74, 138, 0.25);
    border-color: rgba(22, 74, 138, 0.2);
}

.slider-navigation[b-q57x4xb349] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 18px
}

.slider-nav-button[b-q57x4xb349] {
    font-family: var(--font-main);
    min-width: 120px;
    height: 48px;
    border: none;
    border-radius: 14px;
    background: #fff;
    color: #164a8a;
    font-size: 15px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    box-shadow: 0 5px 20px rgba(0,0,0,.1);
    transition: .25s
}

    .slider-nav-button:hover[b-q57x4xb349] {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(0,0,0,.15);
        background: #164a8a;
        color: #fff
    }

    .slider-nav-button:active[b-q57x4xb349] {
        transform: translateY(0)
    }

.nav-icon[b-q57x4xb349] {
    font-size: 27px;
    line-height: 1;
    font-weight: 300
}

.slider-counter[b-q57x4xb349] {
    min-width: 70px;
    height: 42px;
    padding: 0 15px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: #f5f7fa;
    color: #333;
    font-size: 14px;
    font-weight: 600
}

.counter-separator[b-q57x4xb349] {
    color: #999;
    font-weight: 400
}

@media (max-width:992px) {
    .slider-wrapper[b-q57x4xb349] {
        padding: 20px 2.5%
    }

    .main-slider[b-q57x4xb349] {
        border-radius: 18px
    }

    .carousel-track[b-q57x4xb349] {
        height: clamp(260px, 46vw, 420px)
    }
}

@media (max-width:768px) {
    .slider-wrapper[b-q57x4xb349] {
        padding: 15px 12px
    }

    .main-slider[b-q57x4xb349] {
        border-radius: 15px
    }

    .carousel-track[b-q57x4xb349] {
        height: clamp(200px, 56vw, 320px)
    }

    .custom-control[b-q57x4xb349] {
        width: 50px;
        opacity: 1;
        background: transparent !important;
    }

    .custom-arrow[b-q57x4xb349] {
        width: 40px;
        height: 40px;
        font-size: 18px;
        background: rgba(255, 255, 255, 0.95);
        box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
    }

    .custom-control:hover .custom-arrow[b-q57x4xb349] {
        transform: scale(1.05);
    }

    .main-slider .custom-control[b-q57x4xb349] {
        opacity: 1
    }

    .carousel-dots[b-q57x4xb349] {
        bottom: 12px
    }

    .dot[b-q57x4xb349] {
        width: 7px;
        height: 7px
    }

        .dot.active[b-q57x4xb349] {
            width: 22px
        }

    .slider-navigation[b-q57x4xb349] {
        gap: 10px;
        margin-top: 14px
    }

    .slider-nav-button[b-q57x4xb349] {
        min-width: 100px;
        height: 44px;
        border-radius: 12px;
        font-size: 14px;
        gap: 6px
    }

    .nav-icon[b-q57x4xb349] {
        font-size: 23px
    }

    .slider-counter[b-q57x4xb349] {
        min-width: 55px;
        height: 40px;
        font-size: 13px;
        padding: 0 10px
    }
}

@media (max-width:480px) {
    .slider-wrapper[b-q57x4xb349] {
        padding: 10px
    }

    .main-slider[b-q57x4xb349] {
        border-radius: 12px
    }

    .carousel-track[b-q57x4xb349] {
        height: clamp(170px, 58vw, 240px)
    }

    .custom-control[b-q57x4xb349] {
        width: 56px
    }

    .custom-arrow[b-q57x4xb349] {
        width: 32px;
        height: 32px;
        font-size: 12px
    }

    .carousel-dots[b-q57x4xb349] {
        bottom: 8px
    }
}

@media (max-width:400px) {
    .slider-navigation[b-q57x4xb349] {
        gap: 7px
    }

    .slider-nav-button[b-q57x4xb349] {
        min-width: 85px;
        height: 42px;
        font-size: 13px
    }
}

@media (prefers-reduced-motion:reduce) {
    .carousel-track[b-q57x4xb349] {
        transition: none !important
    }
}





.online-card[b-q57x4xb349] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    margin: 10px auto;
    width: 100%;
}

.online-card-content[b-q57x4xb349] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 18px 32px;
    background: linear-gradient(135deg, #ffffff 0%, #f8faff 100%);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(22, 74, 138, 0.10), 0 2px 8px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(22, 74, 138, 0.06);
    position: relative;
    overflow: hidden;
}

    .online-card-content[b-q57x4xb349]::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: radial-gradient(circle at 30% 50%, rgba(22, 74, 138, 0.03), transparent 60%);
        pointer-events: none;
    }

.online-card-icon[b-q57x4xb349] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #164a8a;
    background: rgba(22, 74, 138, 0.08);
    padding: 10px;
    border-radius: 14px;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.online-card-info[b-q57x4xb349] {
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

.online-card-number[b-q57x4xb349] {
    font-size: 32px;
    font-weight: 800;
    color: #164a8a;
    line-height: 1.1;
    letter-spacing: -1px;
    font-variant-numeric: tabular-nums;
}

.online-card-label[b-q57x4xb349] {
    font-size: 13px;
    color: #888;
    font-weight: 500;
    letter-spacing: 0.3px;
}

.online-card-pulse[b-q57x4xb349] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    z-index: 1;
}

.pulse-ring[b-q57x4xb349] {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid rgba(34, 197, 94, 0.3);
    animation: pulse-ring-b-q57x4xb349 2s ease-out infinite;
}

.pulse-dot[b-q57x4xb349] {
    width: 12px;
    height: 12px;
    background: #22c55e;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.2);
}

@keyframes pulse-ring-b-q57x4xb349 {
    0% {
        transform: scale(0.8);
        opacity: 1;
    }

    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .online-card-content[b-q57x4xb349] {
        padding: 14px 24px;
        gap: 14px;
        border-radius: 16px;
    }

    .online-card-number[b-q57x4xb349] {
        font-size: 26px;
    }

    .online-card-icon svg[b-q57x4xb349] {
        width: 22px;
        height: 22px;
    }

    .online-card-icon[b-q57x4xb349] {
        padding: 8px;
        border-radius: 12px;
    }

    .online-card-pulse[b-q57x4xb349] {
        width: 32px;
        height: 32px;
    }

    .pulse-ring[b-q57x4xb349] {
        width: 32px;
        height: 32px;
    }

    .pulse-dot[b-q57x4xb349] {
        width: 10px;
        height: 10px;
    }
}

@media (max-width: 480px) {
    .online-card[b-q57x4xb349] {
        padding: 12px 0;
        margin: 4px auto;
    }

    .online-card-content[b-q57x4xb349] {
        padding: 10px 16px;
        gap: 10px;
        border-radius: 14px;
    }

    .online-card-number[b-q57x4xb349] {
        font-size: 20px;
    }

    .online-card-label[b-q57x4xb349] {
        font-size: 11px;
    }

    .online-card-icon svg[b-q57x4xb349] {
        width: 18px;
        height: 18px;
    }

    .online-card-icon[b-q57x4xb349] {
        padding: 6px;
        border-radius: 10px;
    }

    .online-card-pulse[b-q57x4xb349] {
        width: 26px;
        height: 26px;
    }

    .pulse-ring[b-q57x4xb349] {
        width: 26px;
        height: 26px;
        border-width: 1.5px;
    }

    .pulse-dot[b-q57x4xb349] {
        width: 8px;
        height: 8px;
    }
}

/* ============================================================
   بخش «مقایسه تصاویر» (تصاویر مقایسه‌ای فعال از بک‌اند)
   ============================================================ */
.compare-section[b-q57x4xb349] {
    width: 100%;
    padding: 25px 3%;
    box-sizing: border-box;
}

.compare-block[b-q57x4xb349] {
    max-width: 980px;
    margin: 0 auto 36px;
    padding: 0 6px;
}

.compare-title[b-q57x4xb349] {
    margin: 0 0 8px;
    text-align: center;
    font-size: 22px;
    font-weight: 800;
    color: #164a8a;
}

.compare-desc[b-q57x4xb349] {
    max-width: 720px;
    margin: 0 auto 22px;
    text-align: center;
    font-size: 14.5px;
    line-height: 2;
    color: #555;
}

@media (max-width: 768px) {
    .compare-section[b-q57x4xb349] {
        padding: 15px 12px;
    }

    .compare-title[b-q57x4xb349] {
        font-size: 18px;
    }

    .compare-desc[b-q57x4xb349] {
        font-size: 13px;
        margin-bottom: 16px;
    }

    .compare-block[b-q57x4xb349] {
        margin-bottom: 26px;
    }
}

/* زیرنویس اسلاید در زبان‌های چپ‌به‌راست */
:root[dir="ltr"] .slider-caption[b-q57x4xb349] {
    direction: ltr;
    text-align: left;
    right: auto;
    left: 24px;
}

@media (max-width: 768px) {
    :root[dir="ltr"] .slider-caption[b-q57x4xb349] {
        right: auto;
        left: 56px;
    }
}

/* ============================================================
   بخش «دسته‌بندی محصولات» (زیر اسلایدر و بالای تصاویر مقایسه‌ای)
   ============================================================ */
.category-section[b-q57x4xb349] {
    width: 100%;
    padding: 25px 3% 10px;
    box-sizing: border-box;
}

.category-section-head[b-q57x4xb349] {
    max-width: 980px;
    margin: 0 auto 22px;
    text-align: center;
}

.category-section-title[b-q57x4xb349] {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 800;
    color: #164a8a;
}

.category-section-sub[b-q57x4xb349] {
    margin: 0;
    font-size: 14px;
    color: #6b7280;
}

.category-grid[b-q57x4xb349] {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 20px;
}

.category-card[b-q57x4xb349] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--color-border-light, #ddd6fe);
    box-shadow: 0 4px 14px rgba(99, 102, 241, .10);
    text-decoration: none;
    transition: transform .25s cubic-bezier(.4, 0, .2, 1), box-shadow .25s cubic-bezier(.4, 0, .2, 1), border-color .25s;
    -webkit-tap-highlight-color: transparent;
}

    /* خط زیرینِ سراسریِ لینک‌ها برای کارت لازم نیست */
    .category-card[b-q57x4xb349]::after {
        content: none;
    }

    .category-card:hover[b-q57x4xb349] {
        transform: translateY(-5px);
        text-shadow: none;
        border-color: var(--color-primary-light, #a5b4fc);
        box-shadow: 0 14px 30px rgba(99, 102, 241, .22);
    }

    .category-card:focus-visible[b-q57x4xb349] {
        outline: 3px solid var(--color-focus-ring, #a5b4fc);
        outline-offset: 3px;
    }

.category-card-media[b-q57x4xb349] {
    display: block;
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #eef0f6;
}

    .category-card-media img[b-q57x4xb349] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform .5s cubic-bezier(.22, 1, .36, 1);
    }

    .category-card-media[b-q57x4xb349]::after {
        content: "";
        position: absolute;
        inset: auto 0 0 0;
        height: 45%;
        background: linear-gradient(to top, rgba(30, 27, 75, .28), transparent);
        pointer-events: none;
    }

.category-card:hover .category-card-media img[b-q57x4xb349] {
    transform: scale(1.07);
}

.category-card-desc[b-q57x4xb349] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    padding: 0 12px 14px;
    text-align: center;
    font-size: 12.5px;
    line-height: 1.8;
    color: #6b7280;
}

.category-card-name[b-q57x4xb349] {
    padding: 14px 12px 6px;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.7;
    color: #1e1b4b;
}

@media (max-width: 768px) {
    .category-section[b-q57x4xb349] {
        padding: 15px 12px 6px;
    }

    .category-section-head[b-q57x4xb349] {
        margin-bottom: 16px;
    }

    .category-section-title[b-q57x4xb349] {
        font-size: 18px;
    }

    .category-section-sub[b-q57x4xb349] {
        font-size: 12.5px;
    }

    .category-grid[b-q57x4xb349] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .category-card[b-q57x4xb349] {
        border-radius: 14px;
    }

    .category-card-name[b-q57x4xb349] {
        padding: 10px 8px 12px;
        font-size: 13.5px;
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .category-grid[b-q57x4xb349] {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .category-card[b-q57x4xb349],
    .category-card-media img[b-q57x4xb349] {
        transition: none;
    }

        .category-card:hover[b-q57x4xb349],
        .category-card:hover .category-card-media img[b-q57x4xb349] {
            transform: none;
        }
}

/* ===== بخش «درباره ما» ===== */
.about-section[b-q57x4xb349] {
    width: 100%;
    padding: 25px 3% 10px;
    box-sizing: border-box;
}

.about-card[b-q57x4xb349] {
    max-width: 1080px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    align-items: center;
    gap: 32px;
    padding: 22px;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid var(--color-border-light, #ddd6fe);
    border-radius: 22px;
    box-shadow: 0 8px 24px rgba(99, 102, 241, .12);
}

.about-media[b-q57x4xb349] {
    margin: 0;
    overflow: hidden;
    border-radius: 16px;
    aspect-ratio: 4 / 3;
    background: #f1f5f9;
}

    .about-media img[b-q57x4xb349] {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .5s cubic-bezier(.4, 0, .2, 1);
    }

.about-card:hover .about-media img[b-q57x4xb349] {
    transform: scale(1.04);
}

.about-body[b-q57x4xb349] {
    min-width: 0;
    text-align: start;
}

.about-eyebrow[b-q57x4xb349] {
    display: inline-block;
    margin-bottom: 10px;
    padding: 4px 14px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: #4f46e5;
    background: rgba(99, 102, 241, .10);
}

.about-title[b-q57x4xb349] {
    margin: 0 0 12px;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.6;
    color: #164a8a;
}

.about-text[b-q57x4xb349] {
    margin: 0;
    font-size: 15px;
    line-height: 2.1;
    color: #4b5563;
    white-space: normal;
    overflow-wrap: anywhere;
}

.about-more[b-q57x4xb349] {
    display: inline-block;
    margin-top: 14px;
    font-size: 14px;
    font-weight: 700;
    color: #4f46e5;
    text-decoration: none;
}

    .about-more:hover[b-q57x4xb349] {
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .about-section[b-q57x4xb349] {
        padding: 15px 12px 6px;
    }

    .about-card[b-q57x4xb349] {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        padding: 14px;
        border-radius: 16px;
    }

    .about-title[b-q57x4xb349] {
        font-size: 19px;
    }

    .about-text[b-q57x4xb349] {
        font-size: 13.5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-media img[b-q57x4xb349] {
        transition: none;
    }

    .about-card:hover .about-media img[b-q57x4xb349] {
        transform: none;
    }
}
/* /Components/Shared/HomeWidgets/ImageCompare.razor.rz.scp.css */
/* ============================================================
   قاب اصلی: حاشیه‌ی رنگیِ در حال چرخش + درخشش نرم + ورود آرام
   ============================================================ */
.icv[b-84vutxmv6g] {
    font-family: var(--font-main);
    --thumb: 48px;
    position: relative;
    max-width: 1800px; /* جلوگیری از خیلی پهن شدن */
    margin: 15px auto; /* فاصله از بالا/پایین + وسط‌چین افقی */
    padding: 3px;
    border-radius: 20px;
    background: conic-gradient(from var(--ang), #7c5cff, #22d3ee, #34d399, #fbbf24, #f472b6, #7c5cff);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
    animation: icv-spin-b-84vutxmv6g 16s linear infinite, icv-enter-b-84vutxmv6g 1.6s cubic-bezier(.16, .84, .3, 1) backwards;
    transition: transform 1.2s cubic-bezier(.2, .8, .2, 1), box-shadow 1.2s ease;
}

.icv:hover[b-84vutxmv6g] {
    transform: translateY(-6px);
    box-shadow: 0 30px 70px rgba(0, 0, 0, .55);
}

/* هاله‌ی رنگی پشت قاب */
.icv[b-84vutxmv6g]::after {
    content: "";
    position: absolute;
    inset: -16px;
    z-index: -1;
    border-radius: 34px;
    background: inherit;
    filter: blur(34px);
    opacity: .4;
    animation: icv-halo-b-84vutxmv6g 8s ease-in-out infinite alternate;
}

@keyframes icv-spin-b-84vutxmv6g  { to { --ang: 360deg; } }
@keyframes icv-halo-b-84vutxmv6g  { from { opacity: .25; } to { opacity: .55; } }
@keyframes icv-enter-b-84vutxmv6g {
    from { opacity: 0; transform: translateY(40px) scale(.96); filter: blur(10px); }
    to   { opacity: 1; transform: none; filter: none; }
}

.icv-inner[b-84vutxmv6g] {
    --p: var(--pos);
    position: relative;
    width: 100%;
    aspect-ratio: var(--ratio, 16 / 9);
    overflow: hidden;
    border-radius: 17px;
    background: #0b1020;
    user-select: none;
    -webkit-user-select: none;
    touch-action: pan-y;
    /* وقتی کاربر می‌کشد، خط با کمی تأخیرِ نرم دنبال می‌شود */
    transition: --p .45s cubic-bezier(.22, .8, .3, 1);
}

/* ============================================================
   پخش خودکار: رفت‌وبرگشتِ بسیار آهسته با مکث در دو انتها
   ============================================================ */
.icv-auto .icv-inner[b-84vutxmv6g] {
    animation: icv-sweep-b-84vutxmv6g 30s ease-in-out infinite;
}

.icv-paused .icv-inner[b-84vutxmv6g] {
    animation-play-state: paused;
}

/* لغزش نرم به نقطه‌ی شروع هنگام «پخش خودکار» */
.icv-glide .icv-inner[b-84vutxmv6g] {
    transition-duration: 1.25s;
}

@keyframes icv-sweep-b-84vutxmv6g {
    0%, 6%   { --p: var(--pos); }
    50%, 56% { --p: 900; }
    100%     { --p: var(--pos); }
}

/* ============================================================
   دو تصویر (هر کدام داخل لایه‌ی خودش تا برش دقیق بماند)
   ============================================================ */
.icv-layer[b-84vutxmv6g] {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

/* تصویر «قبل» فقط تا محل خط دیده می‌شود */
.icv-before[b-84vutxmv6g] {
    clip-path: inset(0 calc(100% - var(--p) * 0.1%) 0 0);
}

.icv-img[b-84vutxmv6g] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    transform-origin: 62% 55%;
    /* زوم بسیار آهسته‌ی سینمایی؛ هر دو تصویر هم‌زمان و یکسان */
    animation: icv-kenburns-b-84vutxmv6g 45s ease-in-out infinite alternate;
}

@keyframes icv-kenburns-b-84vutxmv6g {
    from { transform: scale(1) translate(0, 0); }
    to   { transform: scale(1.07) translate(-1.2%, .8%); }
}

/* سایه‌ی گوشه‌ها برای عمق */
.icv-shade[b-84vutxmv6g] {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: radial-gradient(120% 90% at 50% 45%, transparent 55%, rgba(0, 0, 0, .38) 100%);
}

/* رگه‌ی نوری که آرام روی تصویر می‌گذرد */
.icv-sheen[b-84vutxmv6g] {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    mix-blend-mode: screen;
    background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .13) 50%, transparent 58%);
    background-size: 260% 100%;
    animation: icv-sheen-b-84vutxmv6g 14s ease-in-out infinite;
}

@keyframes icv-sheen-b-84vutxmv6g {
    0%   { background-position: 160% 0; }
    60%, 100% { background-position: -60% 0; }
}

/* ============================================================
   برچسب‌ها: شیشه‌ای، شناور، و محو شدن هنگام رسیدن خط
   ============================================================ */
.icv-label[b-84vutxmv6g] {
    --fade: 1;
    position: absolute;
    top: 14px;
    z-index: 2;
    padding: 5px 14px;
    font-size: .88rem;
    letter-spacing: .02em;
    color: #fff;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .35);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border-radius: 999px;
    pointer-events: none;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
    animation: icv-float-b-84vutxmv6g 7s ease-in-out infinite alternate;
}

.icv-label-before[b-84vutxmv6g] {
    left: 14px;
    opacity: clamp(0, calc((var(--p) - 90) / 90), 1);
}

.icv-label-after[b-84vutxmv6g] {
    right: 14px;
    opacity: clamp(0, calc((910 - var(--p)) / 90), 1);
    animation-delay: -3.5s;
}

@keyframes icv-float-b-84vutxmv6g {
    from { translate: 0 -3px; }
    to   { translate: 0 4px; }
}

/* ============================================================
   خط جداکننده: درخشان، با نورِ روان و جرقه‌های شناور
   ============================================================ */
.icv-line[b-84vutxmv6g] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(var(--p) * 0.1%);
    width: 3px;
    margin-left: -1.5px;
    z-index: 2;
    background: linear-gradient(180deg, rgba(255, 255, 255, .55), #fff 25%, #fff 75%, rgba(255, 255, 255, .55));
    box-shadow: 0 0 10px rgba(255, 255, 255, .9), 0 0 28px rgba(120, 200, 255, .75);
    pointer-events: none;
}

/* نوری که مدام روی خط بالا و پایین می‌رود */
.icv-bead[b-84vutxmv6g] {
    position: absolute;
    left: -2px;
    width: 7px;
    height: 110px;
    border-radius: 6px;
    background: linear-gradient(180deg, transparent, #bfe9ff, transparent);
    filter: blur(1.5px);
    animation: icv-bead-b-84vutxmv6g 6s ease-in-out infinite;
}

@keyframes icv-bead-b-84vutxmv6g {
    from { top: -20%; }
    to   { top: 100%; }
}

/* جرقه‌هایی که از خط آرام بالا می‌روند */
.icv-spark[b-84vutxmv6g] {
    position: absolute;
    left: 50%;
    top: calc(var(--i) * 10% + 6%);
    width: 5px;
    height: 5px;
    margin-left: -2.5px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 8px 2px rgba(160, 220, 255, .9);
    opacity: 0;
    animation: icv-rise-b-84vutxmv6g calc(6s + var(--i) * .55s) ease-in-out infinite;
    animation-delay: calc(var(--i) * -1.1s);
}

@keyframes icv-rise-b-84vutxmv6g {
    0%   { transform: translate(0, 0) scale(.4); opacity: 0; }
    20%  { opacity: 1; }
    100% { transform: translate(calc((var(--i) - 4) * 7px), -90px) scale(1.1); opacity: 0; }
}

/* دستگیره */
.icv-knob[b-84vutxmv6g] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--thumb);
    height: var(--thumb);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #fff, #e9f3ff 70%);
    box-shadow: 0 0 0 6px rgba(255, 255, 255, .2), 0 8px 24px rgba(0, 0, 0, .5), 0 0 30px rgba(120, 200, 255, .7);
    animation: icv-breathe-b-84vutxmv6g 4.5s ease-in-out infinite;
}

@keyframes icv-breathe-b-84vutxmv6g {
    0%, 100% { scale: 1; }
    50%      { scale: 1.07; }
}

/* حلقه‌های موجی دور دستگیره */
.icv-ring[b-84vutxmv6g] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .8);
    opacity: 0;
    animation: icv-ripple-b-84vutxmv6g 3.6s ease-out infinite;
}

.icv-ring-2[b-84vutxmv6g] { animation-delay: -1.8s; }

@keyframes icv-ripple-b-84vutxmv6g {
    0%   { transform: scale(1);   opacity: .8; }
    100% { transform: scale(2.4); opacity: 0; }
}

.icv-knob[b-84vutxmv6g]::before,
.icv-knob[b-84vutxmv6g]::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-style: solid;
}

.icv-knob[b-84vutxmv6g]::before {
    left: 9px;
    border-width: 6px 8px 6px 0;
    border-color: transparent #222 transparent transparent;
    animation: icv-nudge-l-b-84vutxmv6g 3.6s ease-in-out infinite;
}

.icv-knob[b-84vutxmv6g]::after {
    right: 9px;
    border-width: 6px 0 6px 8px;
    border-color: transparent transparent transparent #222;
    animation: icv-nudge-r-b-84vutxmv6g 3.6s ease-in-out infinite;
}

@keyframes icv-nudge-l-b-84vutxmv6g { 50% { translate: -3px 0; } }
@keyframes icv-nudge-r-b-84vutxmv6g { 50% { translate: 3px 0; } }

/* ============================================================
   اسلایدر واقعی: کاملاً شفاف و روی کل تصویر
   ============================================================ */
.icv-range[b-84vutxmv6g] {
    position: absolute;
    top: 0;
    left: calc(var(--thumb) / -2);
    width: calc(100% + var(--thumb));
    height: 100%;
    margin: 0;
    padding: 0;
    z-index: 3;
    opacity: 0;
    cursor: ew-resize;
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
}

.icv-range[b-84vutxmv6g]::-webkit-slider-runnable-track { height: 100%; background: transparent; }

.icv-range[b-84vutxmv6g]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: var(--thumb);
    height: 100%;
    background: transparent;
    border: 0;
    cursor: ew-resize;
}

.icv-range[b-84vutxmv6g]::-moz-range-track { height: 100%; background: transparent; }

.icv-range[b-84vutxmv6g]::-moz-range-thumb {
    width: var(--thumb);
    height: 100%;
    background: transparent;
    border: 0;
    border-radius: 0;
    cursor: ew-resize;
}

/* دسترس‌پذیری: با کیبورد (کلیدهای چپ/راست) هم قابل استفاده است */
.icv-range:focus-visible ~ .icv-line .icv-knob[b-84vutxmv6g] {
    outline: 3px solid #4c9ffe;
    outline-offset: 3px;
}

/* ============================================================
   دکمه‌ی پخش / توقف
   ============================================================ */
.icv-toggle[b-84vutxmv6g] {
    position: absolute;
    left: 50%;
    bottom: 14px;
    translate: -50% 0;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    font: inherit;
    font-size: .85rem;
    color: #fff;
    cursor: pointer;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .4);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-radius: 999px;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
    transition: background .5s ease, scale .5s ease;
}

.icv-toggle:hover[b-84vutxmv6g] { background: rgba(255, 255, 255, .3); scale: 1.06; }
.icv-toggle:focus-visible[b-84vutxmv6g] { outline: 3px solid #4c9ffe; outline-offset: 2px; }

.icv-ico[b-84vutxmv6g] { position: relative; width: 12px; height: 12px; display: inline-block; }

.icv-ico-play[b-84vutxmv6g] {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 10px;
    border-color: transparent transparent transparent #fff;
}

.icv-ico-pause[b-84vutxmv6g]::before,
.icv-ico-pause[b-84vutxmv6g]::after {
    content: "";
    position: absolute;
    top: 0;
    width: 4px;
    height: 12px;
    background: #fff;
    border-radius: 1px;
}

.icv-ico-pause[b-84vutxmv6g]::before { left: 0; }
.icv-ico-pause[b-84vutxmv6g]::after  { right: 0; }
/* /Components/Shared/HomeWidgets/TripleMadoleTabs.razor.rz.scp.css */
/* ==========================================================
   کادر سه‌تبه‌ی انتهای صفحه‌ی اصلی (TripleMadoleManagement)
   - فقط از ویژگی‌های منطقی (inline-start/end) استفاده شده تا RTL و LTR خودکار درست کار کند
   - رنگ‌ها از متغیرهای app.css (پالت نیلی-بنفش) می‌آیند
   ========================================================== */

.tm-section[b-4hxj926q2q] {
    width: 100%;
    padding: 30px 3% 14px;
    box-sizing: border-box;
}

/* ---------- کادر اصلی ---------- */
.tm-card[b-4hxj926q2q] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    max-width: 1120px;
    margin: 0 auto;
    padding: 36px 30px 30px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 28px;
    /* حاشیه‌ی گرادیانی: پس‌زمینه‌ی داخلی روی padding-box و گرادیان روی border-box */
    background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) padding-box, linear-gradient(135deg, var(--color-primary-light, #a5b4fc), var(--color-accent-light, #c4b5fd) 45%, rgba(99, 102, 241, .15)) border-box;
    box-shadow: 0 10px 30px rgba(99, 102, 241, .14), 0 34px 60px -34px rgba(99, 102, 241, .45);
}

/* ظهور نرم هنگام رسیدن اسکرول به کادر (فقط مرورگرهایی که پشتیبانی می‌کنند) */
@supports (animation-timeline: view()) {
    .tm-card[b-4hxj926q2q] {
        animation: tm-reveal-b-4hxj926q2q linear both;
        animation-timeline: view();
        animation-range: entry 0% entry 40%;
    }
}

@keyframes tm-reveal-b-4hxj926q2q {
    from {
        opacity: 0;
        transform: translateY(44px) scale(.97);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* ---------- حباب‌های رنگی شناور پشت کادر ---------- */
.tm-orb[b-4hxj926q2q] {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(58px);
    opacity: .55;
    pointer-events: none;
}

.tm-orb-a[b-4hxj926q2q] {
    width: 280px;
    height: 280px;
    top: -100px;
    inset-inline-start: -70px;
    background: radial-gradient(circle, var(--color-accent-light, #c4b5fd), transparent 70%);
    animation: tm-float-b-4hxj926q2q 14s ease-in-out infinite;
}

.tm-orb-b[b-4hxj926q2q] {
    width: 330px;
    height: 330px;
    bottom: -130px;
    inset-inline-end: -90px;
    background: radial-gradient(circle, var(--color-primary-light, #a5b4fc), transparent 70%);
    animation: tm-float-b-4hxj926q2q 18s ease-in-out infinite reverse;
}

@keyframes tm-float-b-4hxj926q2q {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(28px, 22px) scale(1.12);
    }
}

/* ---------- سرتیتر ---------- */
.tm-head[b-4hxj926q2q] {
    text-align: center;
}

.tm-eyebrow[b-4hxj926q2q] {
    display: inline-block;
    margin-bottom: 10px;
    padding: 4px 16px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: #4f46e5;
    background: rgba(99, 102, 241, .10);
}

.tm-title[b-4hxj926q2q] {
    margin: 0 0 8px;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.6;
    color: #4338ca; /* پشتیبان؛ اگر گرادیان متن پشتیبانی نشد */
    background: var(--gradient-primary, linear-gradient(135deg, #6366f1, #8b5cf6, #a78bfa));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.tm-sub[b-4hxj926q2q] {
    margin: 0;
    font-size: 14.5px;
    color: #6b7280;
}

/* ---------- نوار تب‌ها (کنترل قطعه‌ای با قرص متحرک) ---------- */
.tm-tablist[b-4hxj926q2q] {
    --tm-pad: 6px;
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--tm-n, 3), minmax(0, 1fr));
    max-width: 780px;
    margin: 26px auto 26px;
    padding: var(--tm-pad);
    box-sizing: border-box;
    border-radius: 20px;
    border: 1px solid rgba(99, 102, 241, .16);
    background: rgba(99, 102, 241, .08);
    box-shadow: inset 0 1px 4px rgba(67, 56, 202, .08);
}

/* قرص گرادیانی که زیر تب فعال می‌لغزد؛ موقعیتش با inline-start در RTL/LTR درست می‌شود */
.tm-pill[b-4hxj926q2q] {
    position: absolute;
    top: var(--tm-pad);
    bottom: var(--tm-pad);
    z-index: 0;
    width: calc((100% - 2 * var(--tm-pad)) / var(--tm-n, 3));
    inset-inline-start: calc(var(--tm-pad) + var(--tm-i, 0) * (100% - 2 * var(--tm-pad)) / var(--tm-n, 3));
    border-radius: 15px;
    background: var(--gradient-button, linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%));
    box-shadow: 0 8px 22px rgba(99, 102, 241, .40), inset 0 1px 0 rgba(255, 255, 255, .28);
    transition: inset-inline-start .55s cubic-bezier(.34, 1.36, .64, 1);
}

.tm-tab[b-4hxj926q2q] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 0;
    min-height: 54px;
    padding: 8px 12px;
    border: 0;
    border-radius: 15px;
    background: transparent;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    color: #4338ca;
    cursor: pointer;
    transition: color .3s ease, background-color .3s ease;
    -webkit-tap-highlight-color: transparent;
}

    .tm-tab:focus-visible[b-4hxj926q2q] {
        outline: 3px solid var(--color-focus-ring, #a5b4fc);
        outline-offset: 2px;
    }

    .tm-tab.is-active[b-4hxj926q2q] {
        color: #fff;
    }

.tm-tab-num[b-4hxj926q2q] {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 12.5px;
    font-weight: 800;
    background: rgba(99, 102, 241, .14);
    transition: background-color .3s ease, transform .5s cubic-bezier(.34, 1.56, .64, 1);
}

.tm-tab.is-active .tm-tab-num[b-4hxj926q2q] {
    background: rgba(255, 255, 255, .26);
    transform: scale(1.12) rotate(360deg);
}

.tm-tab-name[b-4hxj926q2q] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tm-tab-count[b-4hxj926q2q] {
    flex-shrink: 0;
    min-width: 22px;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.8;
    text-align: center;
    background: rgba(99, 102, 241, .12);
    transition: background-color .3s ease;
}

.tm-tab.is-active .tm-tab-count[b-4hxj926q2q] {
    background: rgba(255, 255, 255, .24);
}

/* ---------- ناحیه‌ی محتوای تب ---------- */
.tm-panel[b-4hxj926q2q] {
    min-height: 340px; /* کادر با عوض‌شدن تب‌ها بالا و پایین نمی‌پرد */
    outline: none;
}

    .tm-panel:focus-visible[b-4hxj926q2q] {
        outline: 3px solid var(--color-focus-ring, #a5b4fc);
        outline-offset: 4px;
        border-radius: 18px;
    }

.tm-panel-inner[b-4hxj926q2q] {
    animation: tm-panel-in-b-4hxj926q2q .55s cubic-bezier(.22, 1, .36, 1) backwards;
}

@keyframes tm-panel-in-b-4hxj926q2q {
    from {
        opacity: 0;
        transform: translateX(var(--tm-slide, 0px));
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.tm-panel-head[b-4hxj926q2q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px dashed rgba(99, 102, 241, .28);
}

.tm-panel-title[b-4hxj926q2q] {
    margin: 0;
    min-width: 0;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.7;
    color: #164a8a;
    overflow-wrap: anywhere;
}

.tm-panel-count[b-4hxj926q2q] {
    flex-shrink: 0;
    padding: 3px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: #4f46e5;
    background: rgba(99, 102, 241, .10);
}

/* ---------- شبکه‌ی آیتم‌ها ---------- */
.tm-grid[b-4hxj926q2q] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
    gap: 22px;
}

    /* فقط یک آیتم: چیدمان افقی و بزرگ */
    .tm-grid.is-single[b-4hxj926q2q] {
        grid-template-columns: minmax(0, 1fr);
    }

        .tm-grid.is-single .tm-item[b-4hxj926q2q] {
            display: grid;
            grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
            align-items: center;
        }

        .tm-grid.is-single .tm-item-media[b-4hxj926q2q] {
            height: 100%;
            aspect-ratio: 4 / 3;
        }

        .tm-grid.is-single .tm-item-body[b-4hxj926q2q] {
            padding: 22px 26px;
        }

        .tm-grid.is-single .tm-item-title[b-4hxj926q2q] {
            font-size: 21px;
        }

        .tm-grid.is-single .tm-item-text[b-4hxj926q2q] {
            font-size: 15px;
        }

/* ---------- کارت هر آیتم ---------- */
.tm-item[b-4hxj926q2q] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--color-border-light, #ddd6fe);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--shadow-sm, 0 2px 8px rgba(99, 102, 241, .1));
    transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease, border-color .35s ease;
    /* ورود پله‌ای: هر کارت کمی دیرتر از قبلی (backwards تا بعد از پایان انیمیشن، hover دوباره کار کند) */
    animation: tm-item-in-b-4hxj926q2q .65s cubic-bezier(.22, 1, .36, 1) backwards;
    animation-delay: calc(var(--tm-d, 0) * 90ms + 80ms);
}

@keyframes tm-item-in-b-4hxj926q2q {
    from {
        opacity: 0;
        transform: translateY(26px) scale(.96);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@media (hover: hover) {
    .tm-item:hover[b-4hxj926q2q] {
        transform: translateY(-6px);
        border-color: var(--color-primary-light, #a5b4fc);
        box-shadow: var(--shadow-lg, 0 16px 40px rgba(99, 102, 241, .22));
    }

        .tm-item:hover .tm-item-media img[b-4hxj926q2q] {
            transform: scale(1.08);
        }

        .tm-item:hover .tm-item-shine[b-4hxj926q2q] {
            transform: translateX(130%);
        }
}

.tm-item-media[b-4hxj926q2q] {
    position: relative;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #eef2ff;
}

    .tm-item-media img[b-4hxj926q2q] {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .9s cubic-bezier(.2, .7, .2, 1);
    }

    /* سایه‌ی ملایم پایین عکس */
    .tm-item-media[b-4hxj926q2q]::after {
        content: "";
        position: absolute;
        inset: auto 0 0 0;
        height: 42%;
        background: linear-gradient(to top, rgba(30, 27, 75, .26), transparent);
        pointer-events: none;
    }

/* برق عبوری روی عکس هنگام hover */
.tm-item-shine[b-4hxj926q2q] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .45) 50%, transparent 65%);
    transform: translateX(-130%);
    transition: transform .9s ease;
    pointer-events: none;
}

.tm-item-body[b-4hxj926q2q] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    padding: 16px 18px 18px;
    text-align: start;
}

.tm-item-title[b-4hxj926q2q] {
    position: relative;
    margin: 0;
    padding-inline-start: 14px;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.7;
    color: #1e1b4b;
    overflow-wrap: anywhere;
}

    /* خط رنگی کنار عنوان */
    .tm-item-title[b-4hxj926q2q]::before {
        content: "";
        position: absolute;
        inset-block: 6px;
        inset-inline-start: 0;
        width: 4px;
        border-radius: 4px;
        background: var(--gradient-primary, linear-gradient(180deg, #6366f1, #a78bfa));
    }

.tm-item-text[b-4hxj926q2q] {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    font-size: 14px;
    line-height: 2;
    color: #4b5563;
    white-space: normal;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
}

    .tm-item-text.is-open[b-4hxj926q2q] {
        display: block;
        overflow: visible;
        -webkit-line-clamp: unset;
        line-clamp: unset;
        animation: tm-fade-b-4hxj926q2q .4s ease backwards;
    }

@keyframes tm-fade-b-4hxj926q2q {
    from {
        opacity: .2;
    }

    to {
        opacity: 1;
    }
}

/* ---------- دکمه‌ی «نمایش بیشتر / کمتر» ---------- */
.tm-item-toggle[b-4hxj926q2q] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    margin-top: auto;
    padding: 6px 14px;
    border: 1px solid rgba(99, 102, 241, .26);
    border-radius: 999px;
    background: rgba(99, 102, 241, .07);
    font: inherit;
    font-size: 12.5px;
    font-weight: 700;
    color: #4f46e5;
    cursor: pointer;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
    -webkit-tap-highlight-color: transparent;
}

    .tm-item-toggle:hover[b-4hxj926q2q] {
        color: #fff;
        border-color: transparent;
        background: var(--gradient-button, linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%));
    }

    .tm-item-toggle:focus-visible[b-4hxj926q2q] {
        outline: 3px solid var(--color-focus-ring, #a5b4fc);
        outline-offset: 2px;
    }

/* فلش کوچک (با border فیزیکی، چون چرخش‌اش به جهت متن وابسته نیست) */
.tm-chev[b-4hxj926q2q] {
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .3s ease;
}

    .tm-chev.is-up[b-4hxj926q2q] {
        transform: rotate(-135deg) translate(-1px, -1px);
    }

/* ---------- تبلت و موبایل ---------- */
@media (max-width: 768px) {
    .tm-section[b-4hxj926q2q] {
        padding: 18px 12px 6px;
    }

    .tm-card[b-4hxj926q2q] {
        padding: 24px 14px 16px;
        border-radius: 22px;
    }

    .tm-title[b-4hxj926q2q] {
        font-size: 21px;
    }

    .tm-sub[b-4hxj926q2q] {
        font-size: 13px;
    }

    .tm-tablist[b-4hxj926q2q] {
        margin: 18px 0 18px;
        border-radius: 16px;
    }

    .tm-pill[b-4hxj926q2q] {
        border-radius: 12px;
    }

    /* در موبایل شماره بالا و نام زیرش (تا سه تب در یک ردیف جا شوند) */
    .tm-tab[b-4hxj926q2q] {
        flex-direction: column;
        gap: 4px;
        min-height: 66px;
        padding: 8px 4px;
        border-radius: 12px;
        font-size: 12.5px;
        line-height: 1.5;
    }

    .tm-tab-num[b-4hxj926q2q] {
        width: 22px;
        height: 22px;
        font-size: 11px;
    }

    .tm-tab-name[b-4hxj926q2q] {
        display: -webkit-box;
        white-space: normal;
        text-align: center;
        overflow-wrap: anywhere;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    .tm-tab-count[b-4hxj926q2q] {
        display: none;
    }

    .tm-panel[b-4hxj926q2q] {
        min-height: 0;
    }

    .tm-panel-title[b-4hxj926q2q] {
        font-size: 17px;
    }

    .tm-grid[b-4hxj926q2q] {
        gap: 14px;
    }

    .tm-item[b-4hxj926q2q] {
        border-radius: 16px;
    }

    .tm-item-body[b-4hxj926q2q] {
        padding: 14px 14px 16px;
    }

    .tm-item-title[b-4hxj926q2q] {
        font-size: 16px;
    }

    .tm-item-text[b-4hxj926q2q] {
        font-size: 13.5px;
    }

    .tm-grid.is-single .tm-item[b-4hxj926q2q] {
        display: flex;
    }

    .tm-grid.is-single .tm-item-media[b-4hxj926q2q] {
        height: auto;
        aspect-ratio: 16 / 10;
    }

    .tm-grid.is-single .tm-item-body[b-4hxj926q2q] {
        padding: 14px 14px 16px;
    }

    .tm-grid.is-single .tm-item-title[b-4hxj926q2q] {
        font-size: 17px;
    }

    .tm-grid.is-single .tm-item-text[b-4hxj926q2q] {
        font-size: 13.5px;
    }
}

/* صفحه‌ی نمایش بزرگ‌تر از تبلت: ارتفاع کادر محدود و داخل خودش اسکرول می‌شود */
@media (min-width: 769px) {
    .tm-panel[b-4hxj926q2q] {
        max-height: 640px;
        overflow-y: auto;
        padding: 6px 8px 10px;
        scrollbar-width: thin;
        scrollbar-color: var(--color-primary-light, #a5b4fc) transparent;
    }
}

@media (max-width: 380px) {
    .tm-tab[b-4hxj926q2q] {
        font-size: 11.5px;
    }

    .tm-card[b-4hxj926q2q] {
        padding-inline: 10px;
    }
}

/* ---------- کاربرانی که انیمیشن کم می‌خواهند ---------- */
@media (prefers-reduced-motion: reduce) {
    .tm-card[b-4hxj926q2q],
    .tm-orb[b-4hxj926q2q],
    .tm-panel-inner[b-4hxj926q2q],
    .tm-item[b-4hxj926q2q],
    .tm-item-text.is-open[b-4hxj926q2q] {
        animation: none !important;
    }

    .tm-pill[b-4hxj926q2q],
    .tm-tab[b-4hxj926q2q],
    .tm-tab-num[b-4hxj926q2q],
    .tm-item[b-4hxj926q2q],
    .tm-item-media img[b-4hxj926q2q],
    .tm-item-shine[b-4hxj926q2q],
    .tm-chev[b-4hxj926q2q] {
        transition: none !important;
    }

    .tm-tab.is-active .tm-tab-num[b-4hxj926q2q] {
        transform: none;
    }
}