/* هدر، نوار پایین، نوار دانلود اپ و برگه‌ی «در اپ» — قالب‌هایشان در اپ home است (home/inc/).
   موبایل‌فرست: قاعده‌های بی‌قید مال گوشی‌اند و از lg (۹۹۲ پیکسل، همان نقطه‌ی navbar-expand-lg) به بالا
   دسکتاپ روی آن‌ها سوار می‌شود. ارتفاع هدر (۹۰ پیکسل) این‌جا عوض نمی‌شود. */

:root {
    --site-tabbar-h: 60px;
    /* هدر ۹۰ پیکسل است و main فقط ۷۲ پیکسل فاصله دارد؛ چیزی که اول main می‌آید باید این ۱۸ پیکسل را جبران کند */
    --site-header-overlap: 1.125rem;
    --site-app-green: #198754;
}

/* ===== دکمه‌ی ورود / حساب و لینک دانلود هدر ===== */
.site-account-btn {
    color: var(--bs-primary);
    border: 1px solid var(--bs-primary);
    border-radius: 999px;
    padding: .3rem 1rem;
    font-size: .85rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.site-account-btn:hover,
.site-account-btn:focus-visible {
    background: var(--bs-primary);
    color: #fff;
}

.site-download-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--site-app-green);
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.site-download-link:hover {
    text-decoration: underline;
}

/* ===== بخش‌های اصلی در هدر دسکتاپ: آیکون خطی + برچسب؛ بخش فعال آیکون پر و زمینه‌ی کم‌رنگ می‌گیرد ===== */
.site-header .site-nav-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem .95rem;
    border-radius: 999px;
    color: #6c757d;
    font-size: .94rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: color .2s ease, background-color .2s ease;
}

.site-header .site-nav-link i {
    font-size: 1.15rem;
    line-height: 1;
}

.site-header .site-nav-link:hover {
    color: #212529;
    background: rgba(0, 0, 0, .04);
}

.site-header .site-nav-link.is-active {
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .09);
    font-weight: 700;
}

.site-header .site-nav-link:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

/* ===== نوار دانلود اپ (فقط مرورگر اندروید) ===== */
.site-app-strip {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: var(--site-header-overlap);
    padding: .5rem 1rem;
    background: #e8f5ee;
    border-bottom: 1px solid #b7e0c7;
    font-size: .85rem;
}

.site-app-strip .bi-android2 {
    color: var(--site-app-green);
    font-size: 1.25rem;
}

.site-app-strip-text {
    flex: 1;
    min-width: 0;
}

.site-app-strip a {
    color: var(--site-app-green);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.site-app-strip-close {
    border: 0;
    background: none;
    color: #6c757d;
    font-size: 1.35rem;
    line-height: 1;
    padding: 0 .25rem;
}

/* ===== نوار پایین (بخش‌های اصلی و حساب؛ تعداد تب‌ها از فهرست home/navigation.py می‌آید) ===== */
.site-tabbar {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 1030;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    height: calc(var(--site-tabbar-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: #fff;
    border-top: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 -4px 24px rgba(0, 0, 0, .06);
}

.site-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 0;
    border: 0;
    background: none;
    color: #6c757d;
    font-size: .75rem;
    font-weight: 500;
    text-decoration: none;
}

.site-tab i {
    font-size: 1.35rem;
    line-height: 1;
}

.site-tab.is-active {
    color: var(--bs-primary);
    font-weight: 700;
}

.site-tab:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: -4px;
}

/* محتوا و پاورقی زیر نوار پایین نروند */
body {
    padding-bottom: calc(var(--site-tabbar-h) + env(safe-area-inset-bottom, 0px));
}

/* دکمه و پنل دستیار بالای نوار پایین (قالب assistant/widget.html جایشان را برای دسکتاپ گذاشته است) */
body #tabam-assistant-fab {
    bottom: calc(var(--site-tabbar-h) + 16px + env(safe-area-inset-bottom, 0px));
}

body #tabam-assistant-panel {
    bottom: calc(var(--site-tabbar-h) + 88px + env(safe-area-inset-bottom, 0px));
    max-height: calc(100vh - var(--site-tabbar-h) - 112px);
}

/* دکمه‌ی دستیار (z-index ۹۹۹۸) روی برگه‌ها و پنجره‌ها (مثل پخش‌کننده‌ی بنر) می‌افتاد و پیوندهایشان را می‌پوشاند */
body:has(.offcanvas.show, .offcanvas.showing, .modal.show) #tabam-assistant-fab {
    visibility: hidden;
}

/* ===== برگه‌ی «در اپ» (home/inc/app_sheet.html) ===== */
.site-sheet.offcanvas-bottom {
    height: auto;
    max-height: 85vh;
    border-radius: 16px 16px 0 0;
}

.site-sheet .offcanvas-body {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    padding: .75rem 1.25rem calc(1rem + env(safe-area-inset-bottom, 0px));
}

.site-sheet-handle {
    align-self: center;
    width: 36px;
    height: 4px;
    border-radius: 2px;
    background: rgba(0, 0, 0, .15);
}

.site-sheet-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.6;
}

.site-sheet-text {
    margin: 0;
    color: #6c757d;
    font-size: .9rem;
    line-height: 1.8;
}

.site-sheet-stores {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.site-sheet-store {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: .6rem 1rem;
    border-radius: 999px;
    background: var(--site-app-green);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.site-sheet-store:hover,
.site-sheet-store:focus-visible {
    color: #fff;
    filter: brightness(.92);
}

.site-sheet-ios {
    margin: 0;
    font-size: .9rem;
    font-weight: 600;
}

.site-sheet-install {
    text-align: start;
    background: #f2f4fb;
    border-radius: 12px;
    padding: .75rem 1rem;
}

.site-sheet-install-title {
    margin: 0 0 .35rem;
    font-weight: 700;
}

.site-sheet-install-steps {
    margin: 0;
    padding-inline-start: 1.25rem;
    font-size: .9rem;
    line-height: 2;
}

.site-sheet-install-steps .bi {
    color: var(--bs-primary);
}

.site-sheet-dismiss {
    padding: .4rem;
    border: 0;
    background: none;
    color: #6c757d;
    font-size: .9rem;
}

/* ===== وب اپ نصب‌شده (home/inc/standalone_bar.html) =====
   در مرورگر عادی نوار برگشت پنهان است. در پنجره‌ی نصب‌شده روی گوشی، صفحه‌ی داخلی به‌جای سربرگ سایت همین نوار را
   می‌گیرد، با همان ۹۰ پیکسل تا عنصرهای sticky صفحه‌ها جابه‌جا نشوند. نوار دانلود اپ هم آن‌جا معنایی ندارد. */
.site-standalone-bar {
    display: none;
}

@media (display-mode: standalone) {
    .site-app-strip {
        display: none !important;
    }
}

@media (display-mode: standalone) and (max-width: 991.98px) {
    body:has(.site-standalone-bar) .site-header {
        display: none;
    }

    .site-standalone-bar {
        position: fixed;
        inset: 0 0 auto 0;
        z-index: 1030;
        display: flex;
        align-items: center;
        gap: .5rem;
        height: 90px;
        padding: env(safe-area-inset-top, 0px) .75rem 0;
        box-sizing: border-box;
        background: #fff;
        border-bottom: 1px solid #e3e6ee;
    }

    .site-standalone-back {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        border-radius: 50%;
        color: #171b2e;
        font-size: 1.35rem;
        text-decoration: none;
    }

    .site-standalone-back:hover,
    .site-standalone-back:focus-visible {
        background: #eef0f6;
        color: #171b2e;
    }

    .site-standalone-title {
        flex: 1;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 1.05rem;
        font-weight: 700;
    }
}

/* ===== دسکتاپ ===== */
@media (min-width: 992px) {
    .site-tabbar {
        display: none;
    }

    body {
        padding-bottom: 0;
    }

    body #tabam-assistant-fab {
        bottom: 24px;
    }

    body #tabam-assistant-panel {
        bottom: 96px;
        max-height: calc(100vh - 120px);
    }

    /* روی دسکتاپ برگه تمام‌عرض نمی‌شود؛ وسط پایین صفحه می‌ماند */
    .site-sheet.offcanvas-bottom {
        max-width: 480px;
        margin-inline: auto;
    }
}
