:root {
    color-scheme: dark;
    --btac-red: #E10600;
    --btac-red-dark: #a80400;
    --btac-red-soft: rgba(225, 6, 0, 0.12);
    --btac-bg: #050505;
    --btac-bg-soft: #0d0d0d;
    --btac-panel: #111111;
    --btac-panel-2: #161616;
    --btac-border: #262626;
    --btac-text: #F5F6F8;
    --btac-muted: #9aa0aa;
    --btac-green: #22c55e;
    --btac-globe-color: rgba(190, 205, 235, 0.25);
}

html, body { height: 100%; }

body {
    font-family: Vazirmatn, Vazirmatn FD, Tahoma, sans-serif;
    background: var(--btac-bg);
    color: var(--btac-text);
    font-size: 0.92rem;
    text-align: right;
}

a { text-decoration: none; }

/* ---------- Brand ---------- */
.brand-mark {
    width: 34px; height: 34px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--btac-red);
    color: #fff; font-weight: 800; font-size: 1.15rem;
    border-radius: 8px;
}
.brand-text { font-weight: 800; font-size: 1.15rem; letter-spacing: 0.5px; }

/* ---------- Buttons ---------- */
.btn-btac {
    --bs-btn-bg: var(--btac-red);
    --bs-btn-border-color: var(--btac-red);
    --bs-btn-hover-bg: var(--btac-red-dark);
    --bs-btn-hover-border-color: var(--btac-red-dark);
    --bs-btn-color: #fff; --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--btac-red-dark);
    --bs-btn-active-border-color: var(--btac-red-dark);
}
.btn-outline-btac {
    --bs-btn-color: var(--btac-red);
    --bs-btn-border-color: var(--btac-red);
    --bs-btn-hover-bg: var(--btac-red);
    --bs-btn-hover-border-color: var(--btac-red);
    --bs-btn-hover-color: #fff;
}
.btn-icon {
    color: var(--btac-text);
    background: transparent; border: none; padding: 0.35rem 0.6rem;
    border-radius: 8px; position: relative;
}
.btn-icon:hover { background: var(--btac-panel-2); color: var(--btac-red); }

/* ---------- Cards / panels ---------- */
.panel {
    background: var(--btac-panel);
    border: 1px solid var(--btac-border);
    border-radius: 14px;
    padding: 1.25rem;
}
.panel-title { font-weight: 700; font-size: 1rem; margin-bottom: 1rem; }
.stat-card {
    background: linear-gradient(145deg, #141414, #0b0b0b);
    border: 1px solid var(--btac-border);
    border-radius: 14px; padding: 1.25rem;
    position: relative; overflow: hidden;
}
.stat-card .stat-icon {
    width: 46px; height: 46px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: var(--btac-red-soft); color: var(--btac-red); font-size: 1.3rem;
}
.stat-card .stat-label { color: var(--btac-muted); font-size: 0.82rem; margin-top: 0.6rem; }
.stat-card .stat-value { font-weight: 800; font-size: 1.45rem; }
.stat-card .stat-delta { font-size: 0.78rem; }

/* ---------- Public page ---------- */
.public-body { padding-top: 70px; }
.btac-navbar {
    background: rgba(5,5,5,0.85);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--btac-border);
}
.btac-navbar .nav-link { color: var(--btac-text); }
.btac-navbar .nav-link:hover { color: var(--btac-red); }
.navbar-toggler { border-color: var(--btac-border); }
.navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }

.hero {
    min-height: 78vh;
    display: flex; align-items: center;
    background:
        radial-gradient(ellipse 60% 50% at 70% 20%, rgba(225,6,0,0.18), transparent 60%),
        radial-gradient(ellipse 40% 40% at 20% 80%, rgba(225,6,0,0.1), transparent 60%),
        var(--btac-bg);
    position: relative; overflow: hidden;
}
.hero-grid {
    position: absolute; inset: 0; opacity: 0.35;
    background-image: linear-gradient(var(--btac-border) 1px, transparent 1px), linear-gradient(90deg, var(--btac-border) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black, transparent);
}
.home-globe {
    position: absolute; top: 50%; left: 50%;
    width: min(120vmax, 2000px); aspect-ratio: 1;
    transform: translate(-50%, -50%);
    opacity: 0.7;
    pointer-events: none;
    z-index: 0;
    border-radius: 50%;
    background: transparent;
    mask-image: radial-gradient(circle at center, black 40%, rgba(0, 0, 0, 0.6) 68%, transparent 82%);
    -webkit-mask-image: radial-gradient(circle at center, black 40%, rgba(0, 0, 0, 0.6) 68%, transparent 82%);
}
.home-globe canvas { display: block; width: 100%; height: 100%; }
.hero .container { z-index: 2; }
.hero .display-3 { font-weight: 900; }
.hero .lead { color: var(--btac-muted); }
.hero .ticker {
    font-variant-numeric: tabular-nums;
    font-size: 0.85rem;
    border: 1px solid var(--btac-border);
    background: var(--btac-panel);
    border-radius: 12px; padding: 0.6rem 1rem;
    display: inline-flex; gap: 1.2rem;
}

.btac-footer { background: #030303; border-top: 1px solid var(--btac-border); padding: 3rem 0 1.5rem; }
.btac-footer h6 { color: var(--btac-text); font-weight: 700; }
.btac-footer .link-light:hover { color: var(--btac-red) !important; }

/* ---------- App shell (dashboard / admin) ---------- */
.app-body { overflow-x: hidden; }
.app-wrapper { display: flex; min-height: 100vh; }

.btac-sidebar {
    width: 264px; min-width: 264px;
    background: #090909;
    border-left: 1px solid var(--btac-border);
    display: flex; flex-direction: column;
    position: sticky; top: 0; height: 100vh;
    z-index: 1050;
    transition: margin 0.3s ease;
}
.btac-sidebar.collapsed-sidebar { margin-right: -264px; }
.sidebar-brand { padding: 1.1rem 1.25rem; border-bottom: 1px solid var(--btac-border); display: flex; align-items: center; gap: 0.6rem; }
.sidebar-nav { flex: 1; overflow-y: auto; padding: 0.75rem; }
.sidebar-label { color: var(--btac-muted); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 1px; margin: 1.1rem 0.5rem 0.4rem; }
.sidebar-nav a {
    display: flex; align-items: center; gap: 0.7rem;
    color: #c9c9c9; padding: 0.55rem 0.75rem; border-radius: 9px;
    margin-bottom: 2px; font-size: 0.88rem;
}
.sidebar-nav a i { font-size: 1.05rem; min-width: 20px; }
.sidebar-nav a:hover { background: var(--btac-panel-2); color: var(--btac-text); }
.sidebar-nav a.active { background: var(--btac-red-soft); color: var(--btac-red); font-weight: 700; }
.sidebar-foot { padding: 0.9rem; border-top: 1px solid var(--btac-border); }
.sidebar-foot a { color: var(--btac-muted); font-size: 0.85rem; display: flex; align-items: center; gap: 0.6rem; padding: 0.4rem; }
.sidebar-foot a:hover { color: var(--btac-red); }

.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--btac-bg); }

.btac-topbar {
    background: rgba(5,5,5,0.9);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--btac-border);
    padding: 0.7rem 1.4rem;
    display: flex; align-items: center; gap: 0.5rem;
    position: sticky; top: 0; z-index: 1040;
}
.topbar-title { font-weight: 700; }
.unread-badge { position: absolute; top: 2px; inset-inline-start: 2px; font-size: 0.6rem; }

.app-content { padding: 1.4rem; flex: 1; }

/* ---------- Tables ---------- */
.table-theme { --bs-table-bg: transparent; --bs-table-color: #e9e9e9; --bs-table-border-color: var(--btac-border); }
.table-theme thead th {
    background: var(--btac-panel-2);
    color: var(--btac-muted); font-size: 0.78rem; font-weight: 700;
    border-bottom: 1px solid var(--btac-border); white-space: nowrap;
}
.table-theme tbody tr:hover { background: rgba(255,255,255,0.025); }

/* ---------- Forms ---------- */
.form-control, .form-select {
    background-color: var(--btac-bg-soft);
    border-color: var(--btac-border);
    color: var(--btac-text);
}
.form-control:focus, .form-select:focus {
    background-color: var(--btac-bg-soft);
    border-color: var(--btac-red);
    color: var(--btac-text);
    box-shadow: 0 0 0 0.2rem var(--btac-red-soft);
}
.form-control::placeholder { color: #5a5a5a; }

/* ---------- Auth pages ---------- */
.auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.auth-card { width: 100%; max-width: 420px; }
.auth-card .otp-box {
    width: 3rem; height: 3.4rem; text-align: center; font-size: 1.4rem; font-weight: 800;
    background: var(--btac-bg-soft); border: 1px solid var(--btac-border); color: var(--btac-text);
    border-radius: 10px; font-variant-numeric: tabular-nums;
}
.auth-card .otp-box:focus { border-color: var(--btac-red); outline: none; box-shadow: 0 0 0 0.2rem var(--btac-red-soft); }

/* ---------- Misc ---------- */
.text-money { font-variant-numeric: tabular-nums; letter-spacing: 0.3px; }

/* ---------- Consultation slot picker ---------- */
.slot-taken {
    background: var(--btac-red-soft);
    color: #b96a6a;
    border: 1px dashed rgba(225, 6, 0, 0.45);
    text-decoration: line-through;
    cursor: not-allowed;
    font-variant-numeric: tabular-nums;
    opacity: 0.95;
}
.slot-taken:hover {
    background: var(--btac-red-soft);
    color: #b96a6a;
}
.section-chip-free {
    background: var(--btac-red);
    color: #fff;
}
.section-chip-taken {
    background: var(--btac-red-soft);
    color: #b96a6a;
    border: 1px dashed rgba(225, 6, 0, 0.45);
    text-decoration: line-through;
}
.badge { font-weight: 600; }
.progress { background: var(--btac-panel-2); }
.list-group-item { background: transparent; border-color: var(--btac-border); color: var(--btac-text); }
.dropdown-menu { background: var(--btac-panel); border: 1px solid var(--btac-border); }
.dropdown-item { color: var(--btac-text); }
.dropdown-item:hover { background: var(--btac-panel-2); color: var(--btac-red); }
.dropdown-header { color: var(--btac-muted); }

.alert { border-radius: 12px; }

@media (max-width: 991.98px) {
    .btac-sidebar { position: fixed; inset-inline-start: 0; top: 0; height: 100vh; margin-right: 0; transform: translateX(100%); transition: transform 0.3s ease; }
    html[dir="rtl"] .btac-sidebar.open { transform: translateX(0); }
}

/* ============================================================
   Public theme — dark by default; light when data-theme="light"
   ============================================================ */
html[data-theme="light"] body.public-body { background: var(--btac-bg); color: var(--btac-text); }

html[data-theme="light"] body.public-body .btac-navbar { background: rgba(16, 19, 26, 0.9); }

html[data-theme="light"] body.public-body .hero { min-height: 68vh; }
html[data-theme="light"] body.public-body .hero .lead { color: var(--btac-muted); }

/* ---------- Homepage slider ---------- */
.home-slider-section {
    position: relative; overflow: hidden;
}
.home-slider-section .container { position: relative; z-index: 1; }
#homeCarousel .carousel-item {
    position: relative;
    min-height: 100vh;
    background: transparent;
}
.home-slide-media { position: absolute; inset: 0; }
.home-slide-img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0.08; }
.home-slide-scrim {
    position: absolute; inset: 0; z-index: 1;
    opacity: 0.08;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.15) 45%, rgba(0, 0, 0, 0.5));
}
.home-slide-text {
    position: relative; z-index: 2;
    min-height: 100vh;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 2.5rem 1.5rem;
}
.home-slide-inner {
    max-width: 820px; width: 100%;
    text-align: center;
    padding: 2.6rem 2rem;
    color: var(--btac-text);
    background: rgba(9, 11, 16, 0.62);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45);
}
.home-slide-inner h2 { font-size: 1.9rem; font-weight: 800; }
.home-slide-sub { color: var(--btac-muted); font-size: 1.02rem; }

#homeCarousel .carousel-indicators { z-index: 3; margin-bottom: 3.4rem; }
#homeCarousel .carousel-indicators [data-bs-target],
#homeCarousel .carousel-indicators .active { background-color: var(--btac-red); border-color: var(--btac-red); }
#homeCarousel .carousel-control-prev,
#homeCarousel .carousel-control-next {
    top: auto; bottom: 2rem; width: 2.6rem; height: 2.6rem; border-radius: 50%;
    border: 1px solid var(--btac-border);
    background: color-mix(in srgb, var(--btac-bg) 40%, var(--btac-panel));
}
#homeCarousel .carousel-control-prev-icon,
#homeCarousel .carousel-control-next-icon { filter: invert(1); opacity: 0.9; }
:root[data-theme="light"] #homeCarousel .carousel-control-prev-icon,
:root[data-theme="light"] #homeCarousel .carousel-control-next-icon { filter: none; }

/* ---------- Section headers with description ---------- */
.section-head h2 { position: relative; padding-inline-start: 0.9rem; }
body.public-body .section-head h2::before {
    content: ""; position: absolute; inset-inline-start: 0; top: 8px; bottom: 8px; width: 4px;
    background: var(--btac-red); border-radius: 4px;
}

/* ---------- News cards ---------- */
.news-card { transition: transform 0.2s ease, border-color 0.2s ease; }
.news-card:hover { transform: translateY(-3px); border-color: var(--btac-red); }
.news-cover { width: 100%; height: 170px; object-fit: cover; border-radius: 12px; border: 1px solid var(--btac-border); }
.news-body { line-height: 2.1; }

/* ---------- Persian datepicker (pdatepicker) dark theme ---------- */
.datepicker-plot-area {
    background: var(--btac-panel-1) !important;
    border-color: var(--btac-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.55) !important;
    font-family: Vazirmatn, Tahoma, sans-serif !important;
}
.datepicker-plot-area .datepicker-header,
.datepicker-plot-area .datepicker-header .datepicker-header-navigator {
    background: transparent !important;
}
.datepicker-plot-area .datepicker-header .datepicker-header-navigator .navigator-today-btn,
.datepicker-plot-area .datepicker-header .datepicker-header-navigator .navigator-btn,
.datepicker-plot-area .datepicker-header .datepicker-header-navigator .datepicker-header-label {
    color: var(--btac-text) !important;
    border-color: var(--btac-border) !important;
}
.datepicker-plot-area .datepicker-header .datepicker-header-navigator .navigator-btn:hover { background: var(--btac-panel-2) !important; }
.datepicker-plot-area .datepicker-day-view,
.datepicker-plot-area .datepicker-month-view,
.datepicker-plot-area .datepicker-year-view { background: transparent !important; }
.datepicker-plot-area .datepicker-day-view .table-days td span {
    color: var(--btac-text) !important;
    border-radius: 8px !important;
    border-color: transparent !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td span:hover { background: var(--btac-panel-2) !important; color: #fff !important; }
.datepicker-plot-area .datepicker-day-view .table-days td.selected span,
.datepicker-plot-area .datepicker-day-view .table-days td.selected span:hover {
    background: var(--btac-red) !important; color: #fff !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td.today span { border-color: var(--btac-red) !important; color: var(--btac-red) !important; }
.datepicker-plot-area .datepicker-day-view .month-grid-box .td .day-item { background: transparent !important; }
.datepicker-plot-area .datepicker-day-view .table-days td.off-day span { color: #5a5a5a !important; }
.datepicker-plot-area .datepicker-month-view .month-item,
.datepicker-plot-area .datepicker-year-view .year-item { color: var(--btac-text) !important; }
.datepicker-plot-area .datepicker-month-view .month-item:hover,
.datepicker-plot-area .datepicker-year-view .year-item:hover { background: var(--btac-panel-2) !important; }
.datepicker-plot-area .datepicker-other-month { color: #5a5a5a !important; }
.datepicker-plot-area .datepicker-inline .datepicker-header,
.datepicker-plot-area .datepicker-inline .datepicker-day-view { background: transparent !important; }
.datepicker-container { z-index: 1070 !important; }

/* ---------- Light theme ----------
   Text colors are FIXED (identical in both themes). The light theme
   only shifts ambient surfaces/tones so content always reads the same. */
:root[data-theme="light"] {
    color-scheme: dark;
    --btac-bg: #14161d;
    --btac-bg-soft: #191c24;
    --btac-panel: #1a1e26;
    --btac-panel-2: #21262f;
    --btac-border: #323845;
    --btac-globe-color: rgba(170, 195, 240, 0.3);
}
html[data-theme="light"] body { background: var(--btac-bg); }
html[data-theme="light"] .navbar-light { background: var(--btac-bg-soft); }

#themeToggle {
    position: fixed; bottom: 1rem; left: 1rem; z-index: 1100;
    width: 42px; height: 42px; border-radius: 50%;
    border: 1px solid var(--btac-border); background: var(--btac-panel);
    color: var(--btac-text); display: inline-flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 14px rgba(0,0,0,.18); transition: color .2s, background .2s;
}
#themeToggle:hover { color: var(--btac-red); border-color: var(--btac-red); }

/* ============================================================
   PWA & Responsive refinements
   (additive rules — keep BTAC visual identity)
   ============================================================ */

html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }
img { max-width: 100%; }

/* ---------- iOS safe areas (notch / home indicator) ---------- */
.public-body { padding-top: calc(70px + env(safe-area-inset-top)); }
.btac-navbar { padding-top: env(safe-area-inset-top); }
.btac-topbar { padding-top: calc(0.7rem + env(safe-area-inset-top)); }
.btac-sidebar { padding-top: env(safe-area-inset-top); }
#themeToggle { bottom: calc(1rem + env(safe-area-inset-bottom)); }
.btac-footer { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }

/* ---------- Dynamic viewport height for mobile browsers ---------- */
.hero { min-height: 78vh; min-height: 78svh; }
#homeCarousel .carousel-item { min-height: 100vh; min-height: 100svh; }
.home-slide-text { min-height: 100vh; min-height: 100svh; }
.auth-wrap { min-height: 100vh; min-height: 100svh; }

/* ---------- Keyboard focus visibility ---------- */
a:focus-visible, button:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible,
.form-control:focus-visible, .form-select:focus-visible, .page-link:focus-visible {
    outline: 2px solid var(--btac-red);
    outline-offset: 2px;
}

/* ---------- Mobile drawer: lock background scroll ---------- */
body.drawer-open { overflow: hidden; }

/* ---------- Tablets and below (≤ 991px) ---------- */
@media (max-width: 991.98px) {
    /* financial tables always stay readable: scroll, never squash */
    .table-responsive > .table { min-width: 560px; }

    .app-content { padding: 1rem 0.9rem; }
    .btac-topbar { padding-inline: 0.9rem; }

    /* collapsed public navbar fits inside the viewport */
    .navbar-collapse.show,
    .navbar-collapse.collapsing { max-height: calc(100svh - 76px); overflow-y: auto; }
}

/* ---------- Phones (≤ 767px) ---------- */
@media (max-width: 767.98px) {
    .panel { padding: 1rem; }
    .stat-card { padding: 1rem; }
    .stat-card .stat-value { font-size: 1.2rem; }
    .stat-card .stat-icon { width: 40px; height: 40px; font-size: 1.1rem; }

    .app-content { padding: 0.8rem; }
    .btac-topbar { padding: 0.55rem 0.8rem; }
    .topbar-title {
        font-size: 0.95rem; max-width: 52vw;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }

    .hero .display-3 { font-size: clamp(1.7rem, 7vw, 2.4rem); }
    .hero .lead { font-size: 0.95rem; }
    .hero .ticker { font-size: 0.72rem; gap: 0.5rem 1rem; flex-wrap: wrap; padding: 0.5rem 0.75rem; }

    .home-slide-inner { padding: 1.6rem 1rem; }
    .home-slide-inner h2 { font-size: 1.35rem; }
    .home-slide-sub { font-size: 0.92rem; }
    #homeCarousel .carousel-indicators { margin-bottom: 2.6rem; }

    .btac-footer { padding: 2rem 0 1rem; }

    .auth-wrap { padding: 1rem 0.75rem; }
    .auth-card { max-width: 100%; margin-inline: auto; }
    .otp-box { width: 2.5rem; height: 3rem; font-size: 1.25rem; }

    /* touch-friendly controls */
    .btn { min-height: 42px; }
    .btn-icon, .navbar-toggler { min-height: 42px; min-width: 42px; }
    .nav-link { padding-block: 0.6rem; }
    .dropdown-item { padding-block: 0.55rem; }
    .sidebar-nav a { min-height: 44px; }

    /* forms fit the viewport (16px prevents iOS zoom) */
    .form-control, .form-select,
    .form-floating > .form-control { font-size: 1rem; }

    /* modal fits small screens */
    .modal-dialog { margin: 0.6rem; }
    .modal-content { max-height: calc(100svh - 1.2rem); overflow-y: auto; }

    .pagination .page-link { min-width: 40px; text-align: center; }
}

/* ---------- Small phones (≤ 414px) ---------- */
@media (max-width: 414.98px) {
    .topbar-title { max-width: 46vw; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}