/* ==========================================================================
   Starshop Design System — Navy + Orange
   هویت بصری ۲۰۲۷: Premium / Modern / Elegant / Clean
   --------------------------------------------------------------------------
   قانون نسبت:  ~70% Neutral   ~22% Navy   ~8% Orange
   نارنجی فقط Accent است: CTA، نشان فعال، بج مهم، هایلایت، پیشرفت.
   این فایل باید آخرین استایل لود شود.
   ========================================================================== */

:root {
    /* —— Navy scale (brand structure) —— */
    --navy-50:  #F4F7FB;
    --navy-100: #E7EEF6;
    --navy-200: #C9D6E8;
    --navy-300: #9BB3D0;
    --navy-400: #6483AB;
    --navy-500: #3A5A84;
    --navy-600: #243E64;
    --navy-700: #173052;
    --navy-800: #10243F;
    --navy-900: #0B1A30;
    --navy-950: #07111F;

    /* —— Orange scale (accent only) —— */
    --orange-50:  #FFF7F1;
    --orange-100: #FFEDDE;
    --orange-200: #FFD7B8;
    --orange-300: #F8B784;
    --orange-400: #F3924A;
    --orange-500: #E36F1E;
    --orange-600: #C65610;
    --orange-700: #9C430E;
    --orange-800: #7A350F;
    --orange-900: #5C2910;

    /* —— Neutrals, navy-tinted (not flat gray) —— */
    --neutral-0:   #FFFFFF;
    --neutral-25:  #F7F8FB;
    --neutral-50:  #F3F5F8;
    --neutral-100: #E8EDF3;
    --neutral-200: #D7DEE8;
    --neutral-300: #C1CAD6;
    --neutral-400: #8E9AAD;
    --neutral-500: #66758A;
    --neutral-600: #4C5B70;
    --neutral-700: #334155;
    --neutral-800: #1C2A3D;
    --neutral-900: #122033;

    /* —— Semantic tokens —— */
    --color-primary:        var(--navy-800);
    --color-primary-hover:  var(--navy-700);
    --color-primary-dark:   var(--navy-950);
    --color-primary-soft:   var(--navy-50);
    --color-accent:         var(--orange-500);
    --color-accent-hover:   var(--orange-600);
    --color-accent-dark:    var(--orange-700);
    --color-accent-soft:    var(--orange-50);
    --color-background:     #F6F7FA;
    --color-surface:        #FFFFFF;
    --color-surface-muted:  #F3F5F8;
    --color-surface-elevated: #FFFFFF;
    --color-text-primary:   #122033;
    --color-text-secondary: #4C5B70;
    --color-text-muted:     #7B879C;
    --color-border:         #E4E9F0;
    --color-divider:        #EEF1F6;
    --color-disabled:       #B7C0CE;
    --color-success:        #0F9F6E;
    --color-success-soft:   #E8F7F1;
    --color-warning:        var(--orange-600);
    --color-warning-soft:   var(--orange-50);
    --color-danger:         #D4264A;
    --color-danger-soft:    #FDECEF;
    --color-info:           var(--navy-600);

    --navy-rgb:   16 36 63;
    --orange-rgb: 227 111 30;
    --ink-rgb:    18 32 51;

    /* radius / elevation / motion */
    --ds-radius-sm: 10px;
    --ds-radius:    16px;
    --ds-radius-lg: 22px;
    --ds-radius-xl: 28px;
    --ds-shadow-sm: 0 1px 2px rgb(18 32 51 / .04), 0 8px 20px -16px rgb(16 36 63 / .28);
    --ds-shadow:    0 1px 2px rgb(18 32 51 / .04), 0 16px 36px -24px rgb(16 36 63 / .32);
    --ds-shadow-lg: 0 8px 20px -16px rgb(16 36 63 / .28), 0 28px 60px -32px rgb(16 36 63 / .38);
    --ds-ring:      0 0 0 3px rgb(16 36 63 / .16), 0 0 0 6px rgb(227 111 30 / .16);
    --ds-fast:      160ms cubic-bezier(.32, .72, 0, 1);
    --ds-ease:      180ms cubic-bezier(.32, .72, 0, 1);

    /* legacy storefront aliases */
    --az-primary-50:  var(--navy-50);
    --az-primary-100: var(--navy-100);
    --az-primary-200: var(--navy-200);
    --az-primary-300: var(--navy-300);
    --az-primary-400: var(--navy-400);
    --az-primary-500: var(--navy-700);
    --az-primary:     var(--navy-800);
    --az-primary-700: var(--navy-900);
    --az-primary-800: var(--navy-900);
    --az-primary-900: var(--navy-950);
    --az-primary-2:   var(--navy-700);
    --az-primary-rgb: var(--navy-rgb);
    --az-accent:      var(--orange-500);
    --az-accent-2:    var(--orange-600);
    --az-accent-soft: var(--orange-50);
    --az-accent-rgb:  var(--orange-rgb);
    --az-success: var(--color-success);
    --az-success-soft: var(--color-success-soft);
    --az-warning: var(--orange-500);
    --az-warning-soft: var(--orange-50);
    --az-danger: var(--color-danger);
    --az-danger-soft: var(--color-danger-soft);
    --az-ink: var(--color-text-primary);
    --az-text: #1C2A3D;
    --az-muted: var(--color-text-secondary);
    --az-subtle: var(--color-text-muted);
    --az-border: var(--color-border);
    --az-line: var(--color-divider);
    --az-surface: var(--color-surface);
    --az-bg: var(--color-background);
    --az-soft: var(--navy-50);
    --az-grad: linear-gradient(160deg, var(--navy-900) 0%, var(--navy-800) 62%, var(--navy-700) 100%);
    --az-grad-soft: linear-gradient(180deg, #fff 0%, var(--navy-50) 100%);
    --az-grad-accent: linear-gradient(135deg, var(--orange-500), var(--orange-600));
    --az-grad-dark: linear-gradient(165deg, var(--navy-950) 0%, var(--navy-900) 100%);
    --az-shadow-sm: var(--ds-shadow-sm);
    --az-shadow: var(--ds-shadow);
    --az-shadow-lg: var(--ds-shadow-lg);

    --vt-navy: var(--navy-900);
    --vt-navy2: var(--navy-950);
    --vt-blue: var(--navy-800);
    --vt-sky: var(--orange-400);
    --vt-red: var(--orange-500);
    --vt-red2: var(--orange-600);
    --vt-bg: var(--color-background);
    --vt-line: var(--color-border);
    --vt-mut: var(--color-text-secondary);
    --vt-ink: var(--color-text-primary);
    --vt-green: var(--color-success);
    --vt-gold: var(--orange-500);

    --hm-primary: var(--navy-800);
    --hm-primary-2: var(--navy-600);
    --hm-accent: var(--orange-500);
    --hm-ink: var(--color-text-primary);
    --hm-muted: var(--color-text-secondary);
    --hm-bg: var(--color-background);
    --hm-border: var(--color-border);

    /* admin aliases */
    --ax-primary: var(--navy-800);
    --ax-primary-strong: var(--navy-900);
    --ax-primary-soft: var(--navy-50);
    --ax-accent: var(--orange-500);
    --ax-bg: var(--color-background);
    --ax-surface: #fff;
    --ax-surface-2: var(--neutral-50);
    --ax-sidebar: var(--navy-950);
    --ax-sidebar-2: var(--navy-900);
    --ax-text: var(--color-text-primary);
    --ax-text-muted: var(--color-text-secondary);
    --ax-border: var(--color-border);
    --ax-border-strong: var(--neutral-200);
    --ax-ring: var(--ds-ring);
    --axs-bg: var(--navy-950);
    --axs-bg-2: var(--navy-900);
    --axs-ink: #E7EEF6;
    --axs-muted: #93A3BA;
    --axs-hover: rgb(255 255 255 / .05);
    --axs-active: transparent;
    --axs-line: rgb(255 255 255 / .08);
}

/* ==========================================================================
   Base
   ========================================================================== */
body {
    background: var(--color-background);
    color: var(--color-text-primary);
}
::selection { background: rgb(var(--orange-rgb) / .22); color: var(--navy-950); }

:focus-visible {
    outline: none;
    box-shadow: var(--ds-ring);
    border-radius: 8px;
}

a { color: var(--navy-800); transition: color var(--ds-fast); }
a:hover { color: var(--orange-600); }

/* ==========================================================================
   Storefront — vitrine language
   ========================================================================== */
.vt-home {
    --vt-navy: var(--navy-900);
    --vt-navy2: var(--navy-950);
    --vt-blue: var(--navy-800);
    --vt-sky: var(--orange-400);
    --vt-red: var(--orange-500);
    --vt-red2: var(--orange-600);
    --vt-bg: var(--color-background);
    --vt-line: var(--color-border);
    --vt-mut: var(--color-text-secondary);
    --vt-ink: var(--color-text-primary);
    --vt-gold: var(--orange-500);
    background: var(--color-background);
    color: var(--color-text-primary);
}
.vt-home [data-bg="bg"] { background: var(--color-background); }
.vt-home [data-bg="white"] { background: #fff; }
.vt-home [data-bg="navy"] {
    background:
        radial-gradient(80% 60% at 100% 0%, rgb(227 111 30 / .14), transparent 55%),
        linear-gradient(165deg, var(--navy-950), var(--navy-800) 70%);
    color: #fff;
}
/* باندهای بزرگ دیگر غرق نارنجی نیستند؛ سرمه‌ای با خط تأکید */
.vt-home [data-bg="red"] {
    background:
        linear-gradient(180deg, transparent, transparent) padding-box,
        linear-gradient(165deg, var(--navy-950), var(--navy-800));
    background: linear-gradient(165deg, var(--navy-900), var(--navy-800));
    color: #fff;
    box-shadow: inset 0 3px 0 var(--orange-500);
}
.vt-home .vt-eyebrow { color: var(--orange-600); letter-spacing: 0; }
.vt-home [data-bg="navy"] .vt-eyebrow,
.vt-home [data-bg="red"] .vt-eyebrow { color: var(--orange-300); }
.vt-home .vt-h2, .vt-home h1, .vt-home h2, .vt-home h3 { color: var(--navy-900); }

.vt-home h1 {
    color: #FFF;
}

h1 {}
.vt-home [data-bg="navy"] .vt-h2,
.vt-home [data-bg="navy"] h2,
.vt-home [data-bg="red"] .vt-h2,
.vt-home [data-bg="red"] h2 { color: #fff; }
/* .vt-home .vt-word { color: var(--navy-700); } */
.vt-home .vt-word {color: #e36f1e;}

.vt-home .vt-word--red { color: var(--orange-600) !important; }
.vt-home [data-bg="navy"] .vt-word,
.vt-home [data-bg="red"] .vt-word { color: var(--orange-300); }

.vt-home .vt-btn {
    border-radius: 12px;
    transition: background var(--ds-fast), color var(--ds-fast), transform var(--ds-fast), box-shadow var(--ds-fast), border-color var(--ds-fast);
}
.vt-home .vt-btn:hover { transform: translateY(-1px); }
.vt-home .vt-btn--red,
.vt-btn--red {
    background: var(--orange-600) !important;
    border-color: var(--orange-600) !important;
    color: #fff !important;
    box-shadow: 0 10px 22px -14px rgb(198 86 16 / .9) !important;
}
.vt-home .vt-btn--red:hover,
.vt-btn--red:hover { background: var(--orange-700) !important; border-color: var(--orange-700) !important; }
.vt-home .vt-btn--blue,
.vt-home .vt-btn--navy,
.vt-btn--blue,
.vt-btn--navy {
    background: var(--navy-800) !important;
    border-color: var(--navy-800) !important;
    color: #fff !important;
    box-shadow: 0 10px 22px -14px rgb(16 36 63 / .8) !important;
}
.vt-home .vt-btn--blue:hover,
.vt-home .vt-btn--navy:hover { background: var(--navy-700) !important; }
.vt-home .vt-btn--white,
.vt-home .vt-btn--line,
.vt-btn--white,
.vt-btn--line {
    background: #fff !important;
    color: var(--navy-800) !important;
    border: 1px solid var(--neutral-200) !important;
}
.vt-home .vt-btn--ghost { border-color: rgb(255, 94, 0) !important; }

.vt-home .vt-ib { background: var(--navy-50); color: var(--navy-800); border-radius: 14px; }
.vt-home .vt-ib--red,
.vt-home .vt-ib--sky { background: var(--orange-50); color: var(--orange-700); }
.vt-home .vt-ib--blue,
.vt-home .vt-ib--navy { background: var(--navy-800); color: #fff; }

.vt-home .vt-card,
.vt-home .vt-pcard,
.vt-home article.vt-card {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--ds-radius);
    box-shadow: var(--ds-shadow-sm);
    transition: transform var(--ds-ease), box-shadow var(--ds-ease), border-color var(--ds-ease);
}
.vt-home .vt-card:hover,
.vt-home .vt-pcard:hover {
    transform: translateY(-3px);
    box-shadow: var(--ds-shadow);
    border-color: var(--navy-200);
}
.vt-home .vt-hero {
    background:
        radial-gradient(50% 80% at 0% 100%, rgb(227 111 30 / .18), transparent 60%),
        linear-gradient(160deg, var(--navy-950), var(--navy-800) 68%);
}
.vt-home .vt-badge i,
.vt-home .vt-ind.is-on,
.vt-home .vt-ind.is-on {
    background: var(--orange-600);
    border-color: var(--orange-500);
}
.vt-home .vt-thumbs button.is-on {
    border-color: var(--orange-500);
    background: rgb(227 111 30 / .12);
    box-shadow: inset 3px 0 0 var(--orange-500);
}

/* ==========================================================================
   Header — white, not a second sidebar
   ========================================================================== */
header.sh, .sh {
    background: rgb(255 255 255 / .92) !important;
    backdrop-filter: saturate(1.2) blur(14px);
    border-bottom: 1px solid var(--color-border);
    box-shadow: none;
}
.sh-top {
    background: var(--navy-950) !important;
    color: #E7EEF6 !important;
}
.sh-top__links a { color: #D5DEEA !important; }
.sh-top__links a:hover { color: var(--orange-300) !important; }
.sh-top__phone {
    background: rgb(227 111 30 / .16) !important;
    color: #fff !important;
    border: 1px solid rgb(227 111 30 / .35);
}
.sh-main { border-bottom: 0 !important; }
.hsx, .sh-search .hsx {
    background: var(--neutral-50) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 14px !important;
}
.hsx:focus-within, .sh-search.is-open .hsx {
    background: #fff !important;
    border-color: var(--navy-300) !important;
    box-shadow: var(--ds-ring) !important;
}
.hsx__go, .sh-search button[type="submit"] {
    background: var(--navy-800) !important;
    border-radius: 10px !important;
}
.hsx__go:hover { background: var(--navy-700) !important; }
.sh-nav a, .sh-links a { color: var(--navy-800); }
.sh-nav a:hover, .sh-links a:hover, .sh-nav a.is-on { color: var(--orange-600); }
.sh-bag, .sh-iconbtn, .sh-act {
    border: 1px solid var(--color-border);
    background: #fff;
    color: var(--navy-800);
    border-radius: 12px;
}
.sh-bag__count, .sh-dot, .badge-notify {
    background: var(--orange-600) !important;
    color: #fff !important;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer, footer.footer, .ft, .vt-foot, .main-footer.site {
    background: var(--navy-950) !important;
    color: #D5DEEA !important;
}
.site-footer a, footer.footer a, .ft a { color: #E7EEF6 !important; }
.site-footer a:hover, footer.footer a:hover, .ft a:hover { color: var(--orange-300) !important; }
.site-footer h4, .site-footer h5, footer.footer h4, .ft h4 { color: #fff !important; }

/* ==========================================================================
   Buttons — shared
   ========================================================================== */
.btn-primary, .btn.btn-primary, button.btn-primary {
    background: var(--navy-800) !important;
    border-color: var(--navy-800) !important;
    color: #fff !important;
    border-radius: 12px;
    box-shadow: none;
    transition: background var(--ds-fast), transform var(--ds-fast);
}
.btn-primary:hover, .btn.btn-primary:hover {
    background: var(--navy-700) !important;
    border-color: var(--navy-700) !important;
    transform: translateY(-1px);
}
.btn-accent, .btn-warning.ds-cta, .btn-orange {
    background: var(--orange-600) !important;
    border-color: var(--orange-600) !important;
    color: #fff !important;
}
.btn-accent:hover { background: var(--orange-700) !important; }
.btn-outline-primary, .btn-secondary {
    background: #fff !important;
    color: var(--navy-800) !important;
    border: 1px solid var(--navy-200) !important;
    border-radius: 12px;
}
.btn-outline-primary:hover, .btn-secondary:hover {
    background: var(--navy-50) !important;
    color: var(--navy-900) !important;
}
.btn-link { color: var(--navy-800) !important; }
.btn-link:hover { color: var(--orange-600) !important; }
.btn-danger, .btn-outline-danger:hover {
    background: var(--color-danger) !important;
    border-color: var(--color-danger) !important;
    color: #fff !important;
}
.btn-success { background: var(--color-success) !important; border-color: var(--color-success) !important; }

/* ==========================================================================
   Cards, badges, tables, forms
   ========================================================================== */
.card, .modal-content, .dropdown-menu {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--ds-radius) !important;
    box-shadow: var(--ds-shadow) !important;
    background: #fff;
}
.card-header, .modal-header {
    background: transparent;
    border-bottom: 1px solid var(--color-divider);
    color: var(--navy-900);
    font-weight: 800;
}
.dropdown-item:hover, .dropdown-item:focus {
    background: var(--navy-50) !important;
    color: var(--navy-900) !important;
}
.dropdown-item.active, .dropdown-item:active {
    background: var(--navy-800) !important;
    color: #fff !important;
}

.badge, .badge-primary { border-radius: 999px; font-weight: 700; letter-spacing: 0; }
.badge-primary, .bg-primary { background: var(--navy-800) !important; }
.badge-warning, .bg-warning { background: var(--orange-100) !important; color: var(--orange-800) !important; }
.badge-success, .bg-success { background: var(--color-success-soft) !important; color: #0B7A54 !important; }
.badge-danger, .bg-danger { background: var(--color-danger-soft) !important; color: var(--color-danger) !important; }
.badge-secondary, .bg-secondary { background: var(--neutral-100) !important; color: var(--neutral-700) !important; }
.text-primary { color: var(--navy-800) !important; }
.text-accent, .text-warning { color: var(--orange-700) !important; }
.bg-dark { background: var(--navy-900) !important; }

.table { color: var(--color-text-primary); }
.table thead th {
    background: var(--navy-900);
    color: #F4F7FB;
    border: 0;
    font-weight: 700;
    font-size: 13px;
}
.table td, .table th { border-color: var(--color-divider) !important; }
.table tbody tr:hover { background: var(--navy-50); }
.table tbody tr.selected, .table tbody tr.is-selected { background: var(--orange-50); }
.table a { color: var(--navy-800); font-weight: 700; }
.table a:hover { color: var(--orange-600); }

.form-control, .form-select, input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], textarea, select {
    border: 1px solid var(--neutral-200);
    border-radius: 12px;
    background: #fff;
    color: var(--color-text-primary);
    transition: border-color var(--ds-fast), box-shadow var(--ds-fast);
}
.form-control:focus, .form-select:focus, input:focus, textarea:focus, select:focus {
    border-color: var(--navy-400) !important;
    box-shadow: var(--ds-ring) !important;
    outline: none;
}
label, .form-label, .col-form-label { color: var(--navy-800); font-weight: 700; }
.is-invalid, .form-control.is-invalid { border-color: var(--color-danger) !important; }
.invalid-feedback { color: var(--color-danger); }
.is-valid { border-color: var(--color-success) !important; }

.page-item.active .page-link {
    background: var(--navy-800) !important;
    border-color: var(--navy-800) !important;
}
.page-link { color: var(--navy-800); }
.page-link:hover { color: var(--orange-700); background: var(--navy-50); }
.progress-bar { background: var(--orange-500) !important; }
.nav-tabs .nav-link.active {
    color: var(--navy-900) !important;
    border-color: var(--color-border) var(--color-border) #fff !important;
    box-shadow: inset 0 -2px 0 var(--orange-500);
}

/* ==========================================================================
   Login / auth
   ========================================================================== */
body.auth-page, .c-auth, .page-wrapper:has(.c-auth) {
    background:
        radial-gradient(40% 40% at 100% 0%, rgb(227 111 30 / .16), transparent 60%),
        var(--navy-950);
}
.c-auth, .auth-card, .login-box .card {
    background: #fff;
    border-radius: 22px;
    border: 1px solid rgb(255 255 255 / .08);
    box-shadow: var(--ds-shadow-lg);
}
.c-auth .btn-primary, .auth-card .btn-primary, #login button[type="submit"], .c-auth__form button[type="submit"] {
    background: var(--orange-600) !important;
    border-color: var(--orange-600) !important;
}
.c-auth .btn-primary:hover, #login button[type="submit"]:hover {
    background: var(--orange-700) !important;
}

/* ==========================================================================
   Admin shell — sidebar, topbar, content
   ========================================================================== */
body.ax-shell { background: var(--color-background); }
body.ax-shell .content-wrapper { background: var(--color-background) !important; }

.axs {
    background:
        radial-gradient(70% 40% at 100% 0%, rgb(227 111 30 / .12), transparent 58%),
        linear-gradient(180deg, var(--navy-950) 0%, var(--navy-900) 100%) !important;
    border-left: 1px solid rgb(255 255 255 / .06) !important;
    box-shadow: none !important;
}
.axs__brand { border-bottom-color: rgb(255 255 255 / .06) !important; }
.axs__logo {
    background: #fff !important;
    box-shadow: none !important;
    border-radius: 12px;
}
.axs__logo i { color: var(--orange-500) !important; }
.axs__name, .axs__brand strong { color: #fff !important; }
.axs__name small, .axs__brand small { color: #93A3BA !important; }

.axs a, .axs__nav a, .axs__sub a { color: #D5DEEA !important; }
.axs a:hover, .axs__nav a:hover {
    background: rgb(255 255 255 / .05) !important;
    color: #fff !important;
}
.axs .is-active > a,
.axs a.is-active,
.axs__nav > li.is-active > a,
.axs__sub a.is-active,
.axs li.active > a {
    background: rgb(255 255 255 / .06) !important;
    color: #fff !important;
    box-shadow: inset -3px 0 0 var(--orange-500) !important;
}
.axs .is-active > a i,
.axs a.is-active i,
.axs li.active > a i,
.axs__nav > li.is-active > a i { color: var(--orange-400) !important; }
.axs__section, .axs__label { color: #7E90A8 !important; letter-spacing: .04em; }

body.ax-shell .axt, .axt {
    background: rgb(255 255 255 / .9) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--color-border) !important;
    box-shadow: none !important;
}
.axt__search {
    background: var(--neutral-50) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
}
.axt__search:focus-within { box-shadow: var(--ds-ring); border-color: var(--navy-300) !important; background: #fff !important; }
.axt__btn, .axt__user {
    border-color: var(--color-border) !important;
    background: #fff !important;
    color: var(--navy-800) !important;
    border-radius: 12px !important;
}
.axt__btn:hover, .axt__user:hover { border-color: var(--navy-300) !important; }
.axt__dot {
    background: var(--orange-600) !important;
    box-shadow: 0 0 0 3px #fff !important;
}
.axt__pop, .axk {
    border: 1px solid var(--color-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--ds-shadow-lg) !important;
}

body.ax-shell .card,
body.ax-shell .ao-card,
body.ax-shell .ax-card {
    border: 1px solid var(--color-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--ds-shadow-sm) !important;
    background: #fff;
}
body.ax-shell .ao-top { border-bottom-color: var(--color-divider) !important; }
body.ax-shell .ao-top h1 { color: var(--navy-900); }
body.ax-shell .btn-primary,
body.ax-shell .ao-btn--primary {
    background: var(--navy-800) !important;
    border-color: var(--navy-800) !important;
}
body.ax-shell .btn-primary:hover { background: var(--navy-700) !important; }
body.ax-shell .ao-btn--accent,
body.ax-shell .btn-accent {
    background: var(--orange-600) !important;
    border-color: var(--orange-600) !important;
    color: #fff !important;
}
body.ax-shell table thead th,
body.ax-shell .table thead th {
    background: var(--navy-900) !important;
    color: #F4F7FB !important;
}
body.ax-shell .main-footer {
    background: #fff !important;
    border-top: 1px solid var(--color-border) !important;
    color: var(--color-text-muted) !important;
}

/* status chips keep meaning */
.ak-status--ok, .st-ok, .badge-ok { background: var(--color-success-soft) !important; color: #0B7A54 !important; }
.ak-status--warn, .st-warn { background: var(--orange-50) !important; color: var(--orange-800) !important; }
.ak-status--bad, .st-bad { background: var(--color-danger-soft) !important; color: var(--color-danger) !important; }
.ak-status--info, .st-info { background: var(--navy-50) !important; color: var(--navy-800) !important; }

/* ==========================================================================
   Dark mode — navy, not pure black
   ========================================================================== */
html[data-theme="dark"], body.theme-dark, html.dark {
    --color-background: #0B1220;
    --color-surface: #121B2C;
    --color-surface-muted: #182436;
    --color-surface-elevated: #1A2740;
    --color-text-primary: #E8EEF7;
    --color-text-secondary: #B7C3D6;
    --color-text-muted: #8EA0B8;
    --color-border: #24344C;
    --color-divider: #1E2C42;
    --az-bg: #0B1220;
    --az-surface: #121B2C;
    --az-text: #E8EEF7;
    --az-ink: #F4F7FB;
    --az-muted: #B7C3D6;
    --az-border: #24344C;
    --ax-bg: #0B1220;
    --ax-surface: #121B2C;
    --ax-surface-2: #182436;
    --ax-text: #E8EEF7;
    --ax-text-muted: #A9B7CC;
    --ax-border: #24344C;
    --ax-sidebar: #070E1A;
    --ax-sidebar-2: #0C1626;
    color-scheme: dark;
}
html[data-theme="dark"] body,
body.theme-dark {
    background: #0B1220;
    color: #E8EEF7;
}
html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] body.ax-shell .card,
html[data-theme="dark"] .axt,
html[data-theme="dark"] header.sh {
    background: #121B2C !important;
    color: #E8EEF7;
    border-color: #24344C !important;
}
html[data-theme="dark"] .table thead th { background: #07111F !important; }
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background: #0E1726;
    color: #E8EEF7;
    border-color: #24344C;
}
html[data-theme="dark"] a { color: #D5E2F2; }
html[data-theme="dark"] a:hover { color: var(--orange-300); }
html[data-theme="dark"] .axs {
    background: linear-gradient(180deg, #070E1A, #0C1626) !important;
}

/* ==========================================================================
   Motion restraint + small screens
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation: none !important;
        transition: none !important;
    }
}
@media (max-width: 768px) {
    .vt-home [data-bg="red"] { box-shadow: inset 0 2px 0 var(--orange-500); }
    .sh-top { font-size: 12px; }
}

/* legacy black/yellow theme must not win */
.vt-home .vt-btn--red,
.vt-home .vt-btn--blue,
.vt-home .vt-btn--navy { color: #fff !important; }


/* ==========================================================================
   اصلاح لکه‌های ناهماهنگ — کارت نارنجی یکدست، ویزارد، نوار برند، قاب بنر
   ========================================================================== */
.vt-home .vt-cat--red {
    background: linear-gradient(155deg, var(--navy-800), var(--navy-950)) !important;
    color: #fff !important;
    box-shadow: inset 0 3px 0 var(--orange-500);
}
.vt-home .vt-cat--red .vt-cat__go {
    background: var(--orange-600) !important;
    color: #fff !important;
}
.vt-home .vt-cat--xl {
    background: linear-gradient(155deg, var(--navy-800), var(--navy-950)) !important;
}
.vt-home .vt-wiz {
    background: var(--navy-900) !important;
    border: 1px solid rgb(255 255 255 / .06);
}
.vt-home .vt-wiz__side {
    background:
        radial-gradient(80% 50% at 0% 0%, rgb(227 111 30 / .22), transparent 60%),
        linear-gradient(180deg, var(--navy-950), var(--navy-800)) !important;
    box-shadow: inset -3px 0 0 var(--orange-500);
}
.vt-home .vt-wiz__steps li.is-on em {
    background: var(--orange-500) !important;
    color: #fff !important;
    border-color: var(--orange-500) !important;
}
.vt-home .vt-bs--2 {
    background: linear-gradient(120deg, var(--navy-900), var(--navy-700)) !important;
    box-shadow: inset 0 3px 0 var(--orange-500);
}
.vt-home .vt-bs {
    border-radius: 22px;
    box-shadow: var(--ds-shadow-sm);
}
.vt-home .vt-spot__art {
    background: radial-gradient(circle at 50% 50%, rgb(227 111 30 / .16), transparent 62%) !important;
}
.vt-home .vt-bnr__slide {
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 24px 50px -32px rgb(7 17 31 / .55);
}
.vt-home .vt-bnr__slide img { width: 100%; height: 100%; object-fit: cover; }
.vt-home .vt-bnr__tabs button.is-on {
    color: var(--navy-900);
    box-shadow: inset 0 -2px 0 var(--orange-500);
}
.vt-home .vt-bnr__nav {
    background: #fff;
    color: var(--navy-900);
    border: 0;
    box-shadow: var(--ds-shadow);
}
.vt-home .vt-ind.is-on { box-shadow: inset 0 -2px 0 var(--orange-500); background: #fff !important; color: var(--navy-900) !important; }

/* بنر دسکتاپ: عکس کامل، بدون برش دکمه */
.vt-bnr__set--desk .vt-bnr__slide,
.vt-bnr__set--all .vt-bnr__slide,
.vt-home .vt-bnr__set--desk .vt-bnr__slide,
.vt-home .vt-bnr__set--all .vt-bnr__slide {
    aspect-ratio: 21 / 9 !important;
    max-height: none !important;
    height: auto !important;
    overflow: hidden !important;
    background: #0B1A30 !important;
}
.vt-bnr__set--desk .vt-bnr__slide img,
.vt-bnr__set--all .vt-bnr__slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}
.vt-bnr__set--mob .vt-bnr__slide { aspect-ratio: auto !important; max-height: none !important; }
.vt-bnr__set--mob .vt-bnr__slide img { width: 100% !important; height: auto !important; object-fit: contain !important; }
.vt-bnr__tabs { position: relative !important; z-index: 5; margin-top: 18px !important; }

/* متن روی زمینه سرمه‌ای باید روشن بماند */
.vt-home .vt-consult h2,
.vt-home .vt-consult .vt-word,
.vt-home .vt-consult__copy > p,
.vt-home .vt-svc h2,
.vt-home .vt-svc .vt-word,
.vt-home .vt-svc__list,
.vt-home .vt-svc__list small,
.vt-home .vt-plist__card h2,
.vt-home .vt-plist__card .vt-word,
.vt-home .vt-plist__card > p,
.vt-home .vt-bs,
.vt-home .vt-bs__t,
.vt-home .vt-bs__t b,
.vt-home .vt-faq__side h3,
.vt-home .vt-faq__side p,
.vt-home [data-bg="navy"] h2,
.vt-home [data-bg="navy"] h3,
.vt-home [data-bg="navy"] .vt-h2,
.vt-home [data-bg="navy"] .vt-word {
    color: #fff !important;
}
.vt-home .vt-consult__copy > p,
.vt-home .vt-plist__card > p,
.vt-home .vt-bs__t small,
.vt-home .vt-svc__list small { color: #D5E0F5 !important; }

/* کارت برند: سفید با نشان سرمه‌ای، نه نارنجی یکدست */
.vt-home .vt-logo,
.vt-home .vt-logo.is-official {
    background: #fff !important;
    border: 1px solid #E6E0D6 !important;
    box-shadow: 0 10px 24px -18px rgba(11, 26, 48, .35);
    color: #10243F;
}
.vt-home .vt-logo b,
.vt-home .vt-logo small { color: #10243F !important; }
.vt-home .vt-logo img { filter: none; }
.vt-home .vt-logo em {
    background: #10243F !important;
    color: #fff !important;
}
.vt-home .vt-bs {
    background: #10243F !important;
    color: #fff !important;
}
.vt-home .vt-bs__t em {
    background: #E36F1E !important;
    color: #fff !important;
}


/* کنتراست: متن روشن فقط روی پنل سرمه‌ای، کارت سفید دست نخورده */
.vt-home .vt-svc,
.vt-home .vt-svc h2,
.vt-home .vt-svc .vt-h2,
.vt-home .vt-svc .vt-word,
.vt-home .vt-svc .vt-sub,
.vt-home .vt-svc__list,
.vt-home .vt-svc__list b,
.vt-home .vt-consult,
.vt-home .vt-consult h2,
.vt-home .vt-consult .vt-word,
.vt-home .vt-consult p,
.vt-home .vt-help,
.vt-home .vt-help h3,
.vt-home .vt-help p,
.vt-home .vt-wiz,
.vt-home .vt-wiz h2,
.vt-home .vt-wiz h3,
.vt-home .vt-wiz p,
.vt-home .vt-plist__card,
.vt-home .vt-plist__card h2,
.vt-home .vt-plist__card .vt-word,
.vt-home .vt-plist__card p,
.vt-home .vt-plist__card th,
.vt-home .vt-plist__card td,
.vt-home .vt-bs,
.vt-home .vt-bs__t,
.vt-home .vt-bs__t b,
.vt-home [data-bg="navy"] h2,
.vt-home [data-bg="navy"] h3,
.vt-home [data-bg="navy"] p,
.vt-home [data-bg="red"] h2,
.vt-home [data-bg="red"] .vt-h2,
.vt-home [data-bg="red"] .vt-word,
.vt-home [data-bg="red"] .vt-sub {
    color: #fff !important;
}
.vt-home .vt-svc__list small,
.vt-home .vt-svc .vt-sub,
.vt-home .vt-consult p,
.vt-home .vt-help p,
.vt-home .vt-wiz p,
.vt-home .vt-plist__card p,
.vt-home .vt-bs__t small {
    color: #D7E3F6 !important;
}
.vt-home .vt-svc__card:not(.is-dark),
.vt-home .vt-svc__card:not(.is-dark) b { color: #10243F !important; background: #fff; }
.vt-home .vt-svc__card:not(.is-dark) p { color: #5C6B80 !important; }
.vt-home .vt-acc,
.vt-home .vt-acc summary,
.vt-home .vt-acc__a { color: #10243F !important; }
.vt-home .vt-help .vt-btn--ghost { color: #fff !important; border-color: rgb(255 255 255 / .35) !important; }
.vt-home .vt-help .vt-btn--white { color: #10243F !important; background: #fff !important; }

/* برند: کارت سفید، صحنه سرمه‌ای، نشان نارنجی */
.vt-home .vt-logos { gap: 18px; }
.vt-home .vt-logo,
.vt-home .vt-logo.is-official {
    background: #fff !important;
    border: 1px solid #E4EAF3 !important;
    border-radius: 22px !important;
    height: 168px !important;
    padding: 16px 16px 34px !important;
    box-shadow: 0 16px 30px -22px rgba(16, 36, 63, .45) !important;
    overflow: visible;
}
.vt-home .vt-logo.is-official { box-shadow: inset 0 3px 0 #E36F1E, 0 16px 30px -22px rgba(16, 36, 63, .4) !important; }
.vt-home .vt-logo::before {
    content: "";
    position: absolute;
    inset: 16px 16px 40px;
    border-radius: 16px;
    background: linear-gradient(180deg, #10243F, #1C3358);
}
.vt-home .vt-logo img {
    position: relative;
    z-index: 1;
    max-height: 64px;
    mix-blend-mode: normal !important;
    filter: none !important;
}
.vt-home .vt-logo b {
    position: relative;
    z-index: 1;
    color: #fff !important;
}
.vt-home .vt-logo small {
    color: #10243F !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}
.vt-home .vt-logo em {
    background: #E36F1E !important;
    color: #fff !important;
    z-index: 2;
}
.vt-home .vt-logo:hover { transform: translateY(-4px); border-color: #E36F1E !important; }


/* متن روشن روی هر پنل سرمه‌ای، حتی اگر کلاس والد vt-home نباشد */
.vt-svc,
.vt-svc h2,
.vt-svc .vt-h2,
.vt-svc .vt-word,
.vt-svc .vt-sub,
.vt-svc__list,
.vt-svc__list b,
.vt-svc__copy,
.vt-wiz__side,
.vt-wiz__side h2,
.vt-wiz__side .vt-word,
.vt-wiz__side p,
.vt-best--dark .vt-h2,
.vt-best--dark .vt-h2 em,
.vt-best--dark .vt-word,
.vt-best--dark .vt-head,
.vt-help,
.vt-help h3,
.vt-help p,
.vt-consult,
.vt-consult h2,
.vt-consult .vt-word,
.vt-consult p,
.vt-plist__card,
.vt-plist__card h2,
.vt-plist__card .vt-word,
.vt-plist__card p,
.vt-plist__card th,
.vt-plist__card td {
    color: #fff !important;
    background-color: transparent !important;
}
.vt-svc__list small,
.vt-svc .vt-sub,
.vt-wiz__side p,
.vt-best--dark .vt-sub,
.vt-help p,
.vt-consult p,
.vt-plist__card p {
    color: #D7E3F6 !important;
}
.vt-svc__card:not(.is-dark),
.vt-svc__card:not(.is-dark) b { color: #10243F !important; background: #fff !important; }
.vt-svc__card:not(.is-dark) p { color: #5C6B80 !important; }
.vt-acc, .vt-acc summary, .vt-acc__a { color: #10243F !important; background: #fff; }
.sh-drop, .sh-menu, .sh-user__menu, .dropdown-menu { z-index: 80; }


/* هیرو: عنوان و توضیح روشن روی سرمه‌ای */
.vt-hero,
.vt-hero h1,
.vt-hero h2,
.vt-hero .vt-word,
.vt-hero__copy,
.vt-hero__copy p,
.vt-hero__lead,
.vt-slide__copy,
.vt-slide__copy h3,
.vt-slide__copy a,
.vt-slide__price,
.vt-slide__price b,
.vt-slide__tag {
    color: #fff !important;
}
.vt-hero__lead,
.vt-hero__copy p { color: #D7E3F6 !important; }
.vt-hero .vt-word--red,
.vt-slide__tag { color: #F0B27A !important; }
.vt-slide__minis,
.vt-slide__minis b,
.vt-slide__minis p,
.vt-slide__minis small { color: #10243F !important; }
.vt-slide__minis small { color: #5C6B80 !important; }