/* ==========================================================
   لایه‌ی مدرن ویوان — هویت بصری تازه روی قالب پنل ادمین ویوان
   رنگ‌ها همچنان از تم ویوان (--sc-primary و --bs-primary) می‌آیند؛ با «رنگ تم» هدر عوض می‌شوند.
   ========================================================== */

body {
    --vv-cyan: #22d3ee;
    --vv-radius: 22px;
    --vv-radius-sm: 14px;
    --vv-line: color-mix(in srgb, var(--bs-body-color, #222) 9%, transparent);
    --vv-glass: color-mix(in srgb, var(--bs-card-bg) 78%, transparent);
    --vv-shadow: 0 1px 2px rgba(20, 16, 60, .05), 0 14px 34px -18px rgba(20, 16, 60, .28);
    --vv-shadow-hover: 0 2px 4px rgba(20, 16, 60, .06), 0 24px 46px -20px rgba(var(--sc-primary-rgb), .45);
    letter-spacing: 0;
}
[data-bs-theme="dark"] body {
    --vv-line: rgba(255, 255, 255, .08);
    --vv-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 16px 40px -20px rgba(0, 0, 0, .8);
    --vv-shadow-hover: 0 2px 4px rgba(0, 0, 0, .5), 0 26px 50px -22px rgba(var(--sc-primary-rgb), .6);
}

/* ---------- پس‌زمینه‌ی صفحه ---------- */
html, body { min-height: 100%; }
body {
    background:
        radial-gradient(900px 420px at 92% -6%, rgba(var(--sc-primary-rgb), .13), transparent 70%),
        radial-gradient(760px 380px at -6% 8%, rgba(34, 211, 238, .10), transparent 70%),
        var(--bs-body-bg);
    background-attachment: fixed;
}
[data-bs-theme="dark"] body {
    background:
        radial-gradient(900px 460px at 92% -6%, rgba(var(--sc-primary-rgb), .22), transparent 70%),
        radial-gradient(760px 400px at -6% 10%, rgba(34, 211, 238, .08), transparent 70%),
        var(--bs-body-bg);
    background-attachment: fixed;
}
#main-content, .content-wrapper, .content-area { background: transparent !important; }

/* ---------- هدر شیشه‌ای + برند ویوان ---------- */
.header.sticky-top {
    background: color-mix(in srgb, var(--bs-body-bg) 72%, transparent) !important;
    -webkit-backdrop-filter: saturate(1.5) blur(18px);
    backdrop-filter: saturate(1.5) blur(18px);
    border-bottom: 1px solid var(--vv-line);
    box-shadow: none;
}
.header.sticky-top::after {
    content: ""; position: absolute; inset-inline: 0; bottom: -1px; height: 2px; pointer-events: none;
    background: linear-gradient(90deg, transparent, var(--sc-primary) 25%, var(--vv-cyan) 60%, transparent);
    background-size: 220% 100%; animation: vvFlow 10s linear infinite; opacity: .85;
}
@keyframes vvFlow { to { background-position: 220% 0; } }

.vivan-brand { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; color: inherit; padding: .15rem .25rem; border-radius: 16px; transition: transform .3s var(--sc-ease); }
.vivan-brand:hover { transform: translateY(-1px); color: inherit; }
.vivan-brand__mark { width: 42px; height: 42px; border-radius: 14px; box-shadow: 0 10px 22px -8px rgba(var(--sc-primary-rgb), .65); transition: transform .5s var(--sc-ease); }
.vivan-brand:hover .vivan-brand__mark { transform: rotate(-8deg) scale(1.06); }
.vivan-brand__txt { display: flex; flex-direction: column; line-height: 1.15; }
.vivan-brand__txt b {
    font-size: 1.45rem; font-weight: 900; letter-spacing: -.01em;
    background: linear-gradient(100deg, var(--sc-primary), var(--vv-cyan));
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.vivan-brand__txt small { font-size: .7rem; color: var(--sc-muted); font-weight: 600; margin-top: 2px; }
.vivan-sign { background: linear-gradient(100deg, var(--sc-primary), var(--vv-cyan)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.btn-toggle-leftsidebar { color: var(--bs-body-color); width: 40px; height: 40px; display: inline-grid; place-items: center; border-radius: 12px; transition: background .2s; }
.btn-toggle-leftsidebar:hover { background: var(--sc-primary-50); color: var(--sc-primary); }
.header .right-header .hover-svg, .header .right-header .nav-link { border-radius: 12px; }
.header .right-header .hover-svg:hover { background: var(--sc-primary-50); }
.header #profileDropdown > .btn { padding: 4px 12px 4px 6px; border-radius: 999px; border: 1px solid var(--vv-line); background: var(--vv-glass); }
@media (max-width: 575.98px) { .vivan-brand__txt small { display: none; } .vivan-brand__txt b { font-size: 1.2rem; } .vivan-brand__mark { width: 36px; height: 36px; } }

/* ---------- نوار کناری ---------- */
.left-sidebar.bz-sidebar {
    background: var(--vv-glass) !important;
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border: 1px solid var(--vv-line) !important;
    border-radius: 26px !important;
    box-shadow: var(--vv-shadow);
}
.bz-sidebar .nav-title { font-size: .72rem !important; font-weight: 800; letter-spacing: .04em; color: var(--sc-muted) !important; display: flex; align-items: center; gap: .5rem; }
.bz-sidebar .nav-title::after { content: ""; flex: 1; height: 1px; background: var(--vv-line); }
.bz-sidebar .nav-link { border-radius: 14px; font-size: .8rem; font-weight: 600; color: var(--bs-body-color); }
.bz-sidebar .nav-link:hover { background: var(--sc-primary-50); color: var(--sc-primary); }
.bz-sidebar .nav-link.active { background: linear-gradient(135deg, var(--sc-primary), color-mix(in srgb, var(--sc-primary) 55%, var(--vv-cyan))) !important; box-shadow: 0 12px 24px -10px rgba(var(--sc-primary-rgb), .7); }
.bz-sidebar .nav-link i { width: 1.3rem; text-align: center; font-size: 1.05rem; }
.bz-shopcard { padding: .9rem; border-radius: 20px; background: linear-gradient(135deg, var(--sc-primary-50), rgba(34, 211, 238, .08)); border: 1px solid var(--vv-line); margin-bottom: .6rem; }
.bz-shopcard__ic { width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; color: #fff; font-size: 1.1rem; background: linear-gradient(135deg, var(--sc-primary), var(--vv-cyan)); box-shadow: 0 10px 20px -8px rgba(var(--sc-primary-rgb), .7); }
.bz-shopcard__head { display: flex; align-items: center; gap: .7rem; }
.bz-badge { background: linear-gradient(135deg, #ff4d6a, #ff1f35); box-shadow: 0 6px 14px -4px rgba(255, 31, 53, .6); }
.bz-helpcard { border-radius: 20px !important; background: linear-gradient(160deg, var(--sc-primary-50), transparent) !important; border: 1px solid var(--vv-line) !important; }

/* ---------- کارت‌ها ---------- */
.sc-card, .card:not(.footer-main), .bzk, .bzm-card, .af-task, .bzp-feat {
    border-radius: var(--vv-radius) !important;
    border: 1px solid var(--vv-line) !important;
    background: var(--vv-glass) !important;
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    box-shadow: var(--vv-shadow);
}
.sc-card { padding: 1.25rem 1.35rem; margin-bottom: 1.1rem; transition: box-shadow .3s var(--sc-ease), transform .3s var(--sc-ease); }
.sc-card:hover { box-shadow: var(--vv-shadow-hover); }
.sc-card--flush { padding: 0; overflow: hidden; }
.bzk { padding: 1.15rem 1.3rem; overflow: hidden; }
.bzk::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--k), transparent); opacity: .9; }
.bzk b { font-size: 1.75rem; letter-spacing: -.01em; }
.bzk > i { border-radius: 16px; box-shadow: 0 12px 22px -10px var(--k); }
.bzk:hover, .af-task:hover { transform: translateY(-4px); box-shadow: var(--vv-shadow-hover); }
.bzp-h { font-size: 1.02rem; margin-bottom: 1rem; }
.bzp-h i { width: 34px; height: 34px; display: inline-grid; place-items: center; border-radius: 11px; background: var(--sc-primary-50); color: var(--sc-primary); font-size: 1rem; }
.footer-main { background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--sc-muted); }

/* ---------- عنوان صفحه ---------- */
.bz-head { align-items: center; margin-bottom: 1.3rem; gap: 1rem; }
.bz-head h1 { font-size: 1.55rem; font-weight: 900; letter-spacing: -.01em; margin: 0; display: flex; flex-direction: column; gap: .2rem; position: relative; padding-inline-start: 1rem; }
.bz-head h1::before { content: ""; position: absolute; inset-inline-start: 0; top: .2rem; bottom: .25rem; width: 5px; border-radius: 6px; background: linear-gradient(180deg, var(--sc-primary), var(--vv-cyan)); }
.bz-head h1 small { font-size: .82rem; font-weight: 500; color: var(--sc-muted); }
.sc-updated { background: var(--sc-primary-50); color: var(--sc-primary); padding: .35rem .9rem; border-radius: 999px; font-weight: 700; font-size: .78rem; }

/* ---------- هیرو ---------- */
.bz-hero2 {
    border-radius: 30px;
    background: linear-gradient(125deg, #2a1a78 0%, var(--sc-primary) 50%, color-mix(in srgb, var(--sc-primary) 40%, var(--vv-cyan)) 100%);
    background-size: 200% 200%;
    box-shadow: 0 30px 60px -28px rgba(var(--sc-primary-rgb), .7);
}
.bz-hero2::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(600px 220px at 85% 0, rgba(255, 255, 255, .16), transparent 70%); }
.bz-hero2 h1 { letter-spacing: -.01em; }
.bz-qa__i { border-radius: 26px; }

/* ---------- جدول‌ها ---------- */
.sc-table-wrap { padding: .25rem 1.1rem 1rem; }
.sc-card .sc-table-wrap { padding-inline: 0; }
.sc-table { border-collapse: separate; border-spacing: 0; width: 100%; }
.sc-table thead th { position: sticky; top: 0; background: color-mix(in srgb, var(--sc-primary) 7%, var(--bs-card-bg)); color: var(--sc-muted); font-size: .74rem; font-weight: 800; text-transform: none; padding: .8rem .85rem; border-bottom: 1px solid var(--vv-line); white-space: nowrap; }
.sc-table thead th:first-child { border-start-start-radius: 14px; }
.sc-table thead th:last-child { border-start-end-radius: 14px; }
.sc-table tbody td { padding: .85rem .85rem; border-bottom: 1px solid var(--vv-line); vertical-align: middle; background: transparent; color: var(--bs-body-color); }
.sc-table tbody tr { transition: background .2s; }
.sc-table tbody tr:hover td { background: color-mix(in srgb, var(--sc-primary) 5%, transparent); }
.sc-table tbody tr:last-child td { border-bottom: 0; }

/* ---------- چیپ‌ها و تب‌ها ---------- */
.sc-filters { gap: .45rem; }
.sc-chip { border-radius: 999px; padding: .4rem 1rem; border: 1px solid var(--vv-line); background: var(--vv-glass); color: var(--bs-body-color); font-weight: 700; font-size: .8rem; }
.sc-chip:hover { border-color: var(--sc-primary); color: var(--sc-primary); }
.bz-tabsbar { border-radius: 20px; background: var(--vv-glass); border: 1px solid var(--vv-line); box-shadow: var(--vv-shadow); }
.sc-search { padding: 1.1rem 1.35rem .6rem; }
.sc-search__box, .bz-search { border-radius: 16px; border: 1px solid var(--vv-line); background: color-mix(in srgb, var(--bs-card-bg) 85%, transparent); }
.sc-search__box input, .bz-search input { background: transparent; color: var(--bs-body-color); border: 0; outline: 0; }
.sc-search__box:focus-within, .bz-search:focus-within { border-color: var(--sc-primary); box-shadow: 0 0 0 4px rgba(var(--sc-primary-rgb), .14); }

/* ---------- فرم‌ها ---------- */
.form-control, .form-select { border-radius: var(--vv-radius-sm); border: 1px solid var(--vv-line); padding: .6rem .9rem; min-height: 44px; background-color: color-mix(in srgb, var(--bs-card-bg) 92%, var(--bs-body-color) 3%); }
.form-control-sm, .form-select-sm { min-height: 36px; padding: .35rem .7rem; border-radius: 12px; }
.bzt-set label, .bzp-row label { font-weight: 700; color: var(--bs-body-color); }
.bz-switch span { background: color-mix(in srgb, var(--bs-body-color) 22%, transparent); }
.af-field { border-bottom: 1px solid var(--vv-line); }
.af-btn { border-radius: 999px; background: var(--vv-glass); border: 1px solid var(--vv-line); }
.af-tag { border: 1px solid transparent; }

/* ---------- دکمه‌ها ---------- */
.bzb--primary, .bz-wrap .btn-primary, .af-btn--p { background: linear-gradient(135deg, var(--sc-primary), color-mix(in srgb, var(--sc-primary) 60%, var(--vv-cyan))) !important; }
.bzb { height: 44px; }
.bzb--ghost { background: var(--vv-glass); }

/* ---------- مودال، منو، آف‌کانواس ---------- */
.modal-content { border-radius: 28px !important; background: var(--bs-card-bg) !important; border: 1px solid var(--vv-line) !important; }
.modal-backdrop.show { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.dropdown-menu { border-radius: 20px !important; border: 1px solid var(--vv-line) !important; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .45) !important; }
.page-modules .module-box { border-radius: 22px; transition: transform .3s var(--sc-ease), box-shadow .3s; }
.page-modules .module-item a:hover .module-box { transform: translateY(-6px); box-shadow: 0 22px 34px -16px rgba(var(--sc-primary-rgb), .6); }
.module-title { font-size: .92rem; font-weight: 800; }

/* ---------- جزئیات ---------- */
.af-row { border-bottom: 1px solid var(--vv-line); }
.af-alert { border-radius: 16px; }
.af-timeline li::before { box-shadow: 0 0 0 4px rgba(var(--sc-primary-rgb), .15); }
.sc-empty { color: var(--sc-muted); }
.bzk-person > span, .bz-dot { background: linear-gradient(135deg, var(--sc-primary-50), rgba(34, 211, 238, .14)); color: var(--sc-primary); border-radius: 14px; font-weight: 900; }
.bz-flash, .bz-errors { border-radius: 16px; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--bs-body-color) 22%, transparent); border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--sc-primary) 55%, transparent); background-clip: padding-box; }

/* ---------- ورود ---------- */
.af-login { background:
        radial-gradient(900px 480px at 100% 0, rgba(var(--sc-primary-rgb), .22), transparent 70%),
        radial-gradient(700px 420px at 0 100%, rgba(34, 211, 238, .16), transparent 70%),
        var(--bs-body-bg) !important; }
.af-login__hero { border-radius: 32px !important; }
.af-login__card { border-radius: 32px !important; }
.af-login__mark { background: transparent !important; border: 0 !important; padding: 0; }
.af-login__mark img { width: 72px; height: 72px; border-radius: 22px; box-shadow: 0 18px 34px -12px rgba(0, 0, 0, .5); }
.af-login__by { position: relative; z-index: 2; font-size: .82rem; opacity: .9; display: flex; align-items: center; gap: .5rem; }
.af-login__by img { width: 22px; height: 22px; border-radius: 7px; }

@media (prefers-reduced-motion: reduce) { .header.sticky-top::after { animation: none; } }

/* ---------- حالت تاریک: رنگ تم روی متن روشن‌تر تا خوانا باشد ---------- */
[data-bs-theme="dark"] body { --vv-ptext: color-mix(in srgb, var(--sc-primary) 52%, #ffffff); }
[data-bs-theme="dark"] .af-row__id a, [data-bs-theme="dark"] .af-tag--p, [data-bs-theme="dark"] .sc-updated,
[data-bs-theme="dark"] .bz-dot, [data-bs-theme="dark"] .bzk-person > span, [data-bs-theme="dark"] .bzp-h i,
[data-bs-theme="dark"] .bzb--soft, [data-bs-theme="dark"] .bz-mini, [data-bs-theme="dark"] .bz-wrap .btn-outline-primary,
[data-bs-theme="dark"] .bz-page .btn-outline-primary, [data-bs-theme="dark"] .bz-sidebar .nav-link i,
[data-bs-theme="dark"] .af-login__demo h3, [data-bs-theme="dark"] .arefi-module-ic, [data-bs-theme="dark"] .sc-table a:not(.af-btn):not(.bz-mini) { color: var(--vv-ptext); }
[data-bs-theme="dark"] .bz-sidebar .nav-link.active i, [data-bs-theme="dark"] .bz-sidebar .nav-link.active { color: #fff !important; }
[data-bs-theme="dark"] .af-btn--p, [data-bs-theme="dark"] .af-btn--ok, [data-bs-theme="dark"] .bzb--primary { color: #fff; }
.btn-outline-primary { --bs-btn-color: var(--sc-primary); }
[data-bs-theme="dark"] .btn-outline-primary:hover { color: #fff; }

/* ---------- جلوگیری از سرریز افقی ---------- */
.bzk-two > *, .af-grid2 > *, .af-pos > *, .bz-wrap .content-area, .content-area > * { min-width: 0; }
.sc-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sc-table td, .sc-table th { white-space: normal; }
.sc-table td .af-inline { flex-wrap: wrap; }
img, svg { max-width: 100%; }

code { color: color-mix(in srgb, var(--sc-primary) 78%, #000); background: var(--sc-primary-50); padding: .1rem .45rem; border-radius: 8px; font-size: .85em; }
[data-bs-theme="dark"] code { color: color-mix(in srgb, var(--sc-primary) 45%, #fff); }
.bzt-url code { background: var(--sc-primary-50); }