@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@300;400;500;700;800;900&display=swap');

*{box-sizing:border-box;margin:0;padding:0;}
:root{
    --orange:#F5820A;
    --orange-dim:rgba(245,130,10,0.1);
    --orange-border:rgba(245,130,10,0.25);
    --bg:#0a0a0a;
    --surface:#101010;
    --card:#191919;
    --card2:#202020;
    --border:rgba(255,255,255,0.06);
    --border2:rgba(255,255,255,0.12);
    --text:#F0EEE8;
    --muted:#6B6878;
    --sub:#9B98A8;
    --green:#22C55E;
    --red:#EF4444;
    --blue:#3B82F6;
    --purple:#A855F7;
    --gold:#FFD700;
}


/* ── تم روشن (body.light) — فقط زمینه/کارت/متن، رنگ‌های accent ثابت ── */
body.light{
    --bg:#EEF1F5;
    --surface:#FFFFFF;
    --card:#FFFFFF;
    --card2:#F7F9FB;
    --border:rgba(15,23,42,0.07);
    --border2:rgba(15,23,42,0.12);
    --text:#1A1D21;
    --muted:#64748B;
    --sub:#475569;
}
/* عمق تم روشن: کارت سفید روی زمینه خاکستری + سایه ظریف */
body.light .card,
body.light .kpi,
body.light .panel,
body.light .table-wrap,
body.light .modal,
body.light .sidebar,
body.light .topbar{
    box-shadow:0 1px 3px rgba(15,23,42,0.06),0 1px 2px rgba(15,23,42,0.04);
}
body.light .card:hover,
body.light .kpi:hover{
    box-shadow:0 4px 12px rgba(15,23,42,0.10);
}
/* سایدبار تم روشن: کمی متمایز از محتوا */
body.light .sidebar{
    background:var(--surface);
    border-left:1px solid var(--border);
}

html,body{height:100%;background:var(--bg);color:var(--text);font-family:'Noto Sans Arabic',Tahoma,sans-serif;direction:rtl;}
a{text-decoration:none;color:inherit;}
input,select,textarea,button{font-family:inherit;}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-thumb{background:var(--orange);border-radius:4px;}

/* ── Animations ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
@keyframes spin{to{transform:rotate(360deg);}}
.fade-in{animation:fadeUp .3s ease both;}

/* ── Layout ── */
.layout{display:flex;height:100vh;overflow:hidden;}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.content{flex:1;overflow-y:auto;padding:20px 24px;}

/* ── Sidebar ── */
.sidebar{
    width:220px;min-width:220px;
    background:var(--surface);
    border-left:1px solid rgba(255,255,255,0.06);
    display:flex;flex-direction:column;
    height:100vh;overflow-y:auto;
}
.sidebar-brand{
    padding:20px 16px;
    border-bottom:1px solid rgba(255,255,255,0.06);
    display:flex;align-items:center;gap:10px;
}
.sidebar-brand .logo{
    width:36px;height:36px;
    border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    font-size:16px;font-weight:900;color:#000;
    background:var(--orange);
    flex-shrink:0;
}
.sidebar-brand .name{font-size:13px;font-weight:800;color:var(--text);}
.sidebar-brand .role{font-size:10px;color:var(--orange);font-weight:700;letter-spacing:1px;}
.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto;}
.nav-section{
    font-size:10px;color:#3a3848;
    padding:10px 16px 4px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    font-weight:700;
}
.nav-item{
    display:flex;align-items:center;gap:10px;
    padding:10px 16px;
    margin:2px 8px;
    border-radius:10px;
    cursor:pointer;
    border-right:2px solid transparent;
    color:#FFFFFF;
    font-size:13px;font-weight:500;
    transition:all .2s;
}
.nav-item:hover{background:rgba(16,185,129,0.08);color:#10B981;}
.nav-item.active{
    background:rgba(245,130,10,0.15);
    border-right-color:#10B981;
    color:#10B981;
    font-weight:700;
}
.nav-item .icon{font-size:16px;width:20px;text-align:center;}
.sidebar-footer{
    padding:14px 16px;
    border-top:1px solid rgba(255,255,255,0.05);
}

/* ── Topbar ── */
.topbar{
    background:var(--surface);
    border-bottom:1px solid rgba(255,255,255,0.06);
    padding:14px 24px;
    display:flex;align-items:center;justify-content:space-between;
    flex-shrink:0;
}

/* ── Cards ── */
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;}
.card-sm{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px 16px;}
.card-hover{transition:all .2s;cursor:pointer;}
.card-hover:hover{border-color:var(--orange-border);transform:translateY(-1px);}

/* ── KPI Grid ── */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:24px;}

/* ── نوار خلاصه فشرده (جایگزین کارت‌های KPI بزرگ در صفحات عملیاتی) ── */
.summary-bar{display:flex;align-items:stretch;background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:18px;}
.summary-bar .s-item{flex:1;padding:13px 16px;display:flex;flex-direction:column;gap:3px;border-left:1px solid var(--border);}
.summary-bar .s-item:last-child{border-left:none;}
.summary-bar .s-val{font-size:19px;font-weight:800;color:var(--text);line-height:1.2;}
.summary-bar .s-val.green{color:var(--green);}
.summary-bar .s-val.orange{color:var(--orange);}
.summary-bar .s-val.red{color:var(--red);}
.summary-bar .s-label{font-size:11.5px;color:var(--muted);}
@media(max-width:600px){.summary-bar{flex-wrap:wrap;}.summary-bar .s-item{flex:1 1 50%;border-bottom:1px solid var(--border);}}

.kpi{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;border-top:2px solid var(--c,var(--green));}
.kpi .kpi-icon{font-size:22px;margin-bottom:8px;}
.kpi .kpi-val{font-size:24px;font-weight:900;color:var(--c,var(--green));letter-spacing:-0.5px;}
.kpi .kpi-label{font-size:11px;color:var(--muted);margin-top:3px;}

/* ── Buttons ── */
.btn{border:none;border-radius:10px;padding:10px 18px;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;}
.btn:active{transform:scale(0.97);}
.btn:disabled{opacity:.4;cursor:not-allowed;}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 4px 14px rgba(16,185,129,0.3);}
.btn-primary:hover{background:#0e9e6e;}
.btn-ghost{background:rgba(255,255,255,0.05);color:var(--sub);border:1px solid rgba(255,255,255,0.1);}
.btn-ghost:hover{background:rgba(255,255,255,0.08);color:var(--text);}
.btn-danger{background:rgba(239,68,68,0.1);color:var(--red);border:1px solid rgba(239,68,68,0.2);}
.btn-danger:hover{background:rgba(239,68,68,0.15);}
.btn-sm{padding:7px 12px;font-size:12px;border-radius:8px;}

/* ── Forms ── */
.form-group{margin-bottom:14px;}
.form-label{display:block;font-size:11px;color:var(--sub);font-weight:600;margin-bottom:5px;letter-spacing:.3px;}
.form-input{
    width:100%;
    background:var(--surface);
    border:1px solid var(--border2);
    border-radius:8px;
    padding:10px 13px;
    color:var(--text);
    font-size:13px;
    outline:none;
    transition:border-color .2s;
}
.form-input:focus{border-color:var(--orange);}
.form-input::placeholder{color:var(--muted);}
.form-select{
    background:var(--surface) !important;
    color:var(--text) !important;
    -webkit-appearance:none;
    cursor:pointer;
}
.form-select option{
    background:var(--card);
    color:var(--text);
}
select{
    background:var(--surface) !important;
    color:var(--text) !important;
}
select option{
    background:var(--card) !important;
    color:var(--text) !important;
}
textarea.form-input{resize:vertical;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}

/* ── Badges ── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;}
.badge-green{background:rgba(34,197,94,0.12);color:#22C55E;border:1px solid rgba(34,197,94,0.25);}
.badge-red{background:rgba(239,68,68,0.12);color:#EF4444;border:1px solid rgba(239,68,68,0.25);}
.badge-orange{background:var(--orange-dim);color:var(--orange);border:1px solid var(--orange-border);}
.badge-blue{background:rgba(59,130,246,0.12);color:#3B82F6;border:1px solid rgba(59,130,246,0.25);}
.badge-gray{background:rgba(255,255,255,0.06);color:var(--sub);border:1px solid var(--border);}
.badge-gold{background:rgba(255,215,0,0.12);color:#FFD700;border:1px solid rgba(255,215,0,0.25);}
.badge-purple{background:rgba(168,85,247,0.12);color:#A855F7;border:1px solid rgba(168,85,247,0.25);}
.dot{width:6px;height:6px;border-radius:50%;background:currentColor;display:inline-block;}

/* ── Progress ── */
.progress{background:rgba(255,255,255,0.06);border-radius:4px;height:5px;overflow:hidden;}
.progress-bar{height:100%;border-radius:4px;transition:width .8s ease;}

/* ── Table ── */
.table-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:13px;}
thead tr{background:rgba(255,255,255,0.03);border-bottom:1px solid rgba(255,255,255,0.08);}
th{padding:11px 14px;text-align:right;font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.5px;white-space:nowrap;}
td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,0.04);color:var(--text);}
tr:hover td{background:rgba(255,255,255,0.02);}

/* ── Modal ── */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.8);z-index:1000;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px);}
.modal-bg.open{display:flex;}
.modal{background:var(--card);border:1px solid var(--border2);border-radius:16px;padding:24px;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;animation:fadeUp .3s ease;}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
.modal-title{font-size:16px;font-weight:800;color:var(--text);}
.modal-close{background:rgba(255,255,255,0.06);border:none;color:var(--muted);width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;}
.modal-close:hover{background:rgba(239,68,68,0.15);color:var(--red);}

/* ── Alert ── */
.alert{padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.alert-error{background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.25);color:#EF9A9A;}
.alert-success{background:rgba(34,197,94,0.1);border:1px solid rgba(34,197,94,0.25);color:#86EFAC;}

/* ── Tabs ── */
.tabs{
    display:flex;gap:4px;
    background:var(--surface);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:12px;
    padding:4px;
}
.tab{
    flex:1;padding:9px 14px;
    border-radius:9px;
    border:1px solid transparent;
    background:transparent;
    color:var(--muted);
    font-size:13px;font-weight:600;
    cursor:pointer;
    font-family:inherit;
    transition:all .2s;
    text-align:center;
}
.tab:hover{color:var(--sub);background:rgba(255,255,255,0.04);}
.tab.active{
    background:rgba(16,185,129,0.12);
    color:#10B981;
    font-weight:800;
    border-color:rgba(245,130,10,0.3);
}

/* ── Empty ── */
.empty{text-align:center;padding:50px 20px;color:var(--muted);}
.empty .empty-icon{font-size:48px;margin-bottom:12px;opacity:.4;}

/* ── Avatar ── */
.avatar{border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;}
.avatar-sm{width:30px;height:30px;font-size:12px;}

/* ── Page header ── */
.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px;}
.page-title{font-size:20px;font-weight:900;color:var(--text);}
.page-sub{font-size:12px;color:var(--muted);margin-top:2px;}

/* ── Spinner ── */
.spinner{width:32px;height:32px;border:3px solid rgba(16,185,129,0.2);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite;margin:20px auto;}

/* ── Responsive ── */
.menu-toggle{display:none;background:none;border:1px solid rgba(255,255,255,0.12);border-radius:8px;color:var(--text);font-size:20px;padding:4px 10px;cursor:pointer;}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:998;}
@media(max-width:900px){
    .sidebar{
        position:fixed;top:0;right:0;z-index:999;
        transform:translateX(100%);
        transition:transform .25s ease;
        box-shadow:-8px 0 30px rgba(0,0,0,0.5);
    }
    .sidebar.open{transform:translateX(0);}
    .sidebar-overlay.show{display:block;}
    .menu-toggle{display:inline-block;}
    .form-grid{grid-template-columns:1fr;}
    .content{padding:14px;}
    .kpi-grid{grid-template-columns:repeat(2,1fr) !important;}
}

/* ── Fix blue to orange ── */
a { color: var(--text) !important; }
a:hover { color: #F5820A !important; }
input:focus, textarea:focus, select:focus {
    border-color: var(--orange) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(245,130,10,0.1) !important;
}
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    accent-color: var(--orange) !important;
}
::selection {
    background: rgba(245,130,10,0.3) !important;
    color: var(--text) !important;
}
::-moz-selection {
    background: rgba(245,130,10,0.3) !important;
    color: var(--text) !important;
}

/* dash-grid-responsive */
@media(max-width:900px){
  div[style*="grid-template-columns:1.4fr 1fr"],
  div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr !important;
  }
}

/* grid-2col responsive */
@media(max-width:900px){
  .grid-2col{grid-template-columns:1fr !important;}
}

/* ══════════ texture-v1 — بافت یکسان پس‌زمینه ══════════ */
:root{
  --tex-base:#0a0a0a;
  --tex-glow:rgba(70,70,70,0.22);
  --tex-line:rgba(255,255,255,0.020);
  --tex-dark:rgba(0,0,0,0.35);
}
:root[data-theme="light"]{
  --tex-base:#F2F4F7;
  --tex-glow:rgba(15,23,42,0.05);
  --tex-line:rgba(15,23,42,0.016);
  --tex-dark:rgba(15,23,42,0.030);
}

/* سطح دارای بافت */
.kc-tex,
body.kc-tex,
.fg-home,
.screen,
.layout,
.main{
  background-color:var(--tex-base);
  background-image:
    radial-gradient(ellipse at 50% 30%, var(--tex-glow) 0%, transparent 60%),
    repeating-linear-gradient(90deg, var(--tex-line) 0px, var(--tex-line) 1px,
                              transparent 1px, transparent 3px),
    repeating-linear-gradient(90deg, var(--tex-dark) 0px, var(--tex-dark) 1px,
                              transparent 1px, transparent 2px);
  background-size:100% 100%, 100% 100%, 100% 100%;
  background-attachment:fixed;
}

/* ══════════ design-sync-v1 — زبان بصری یکسان ══════════ */
:root{
  /* سطوح گرادیانی — از صفحهٔ اصلی ویزیتور */
  --sf1:linear-gradient(135deg,#1c1c1c 0%,#242424 100%);   /* کارت شاخص */
  --sf2:linear-gradient(135deg,#191919,#202020);            /* کارت معمولی */
  --sf3:linear-gradient(135deg,#3a3a3a,#222);               /* آواتار و مدور */
  --sf-flat:#101010;                                        /* دکمهٔ میانبر */
  --nav-bg:linear-gradient(180deg,#1c1c1c,#141414);

  /* سایه‌ها */
  --sh-sm:0 4px 12px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.04);
  --sh-md:0 4px 16px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.04);
  --sh-lg:0 8px 32px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.06);
  --sh-nav:0 8px 32px rgba(0,0,0,0.7), inset 0 1px 0 rgba(255,255,255,0.07);

  /* گوشه‌ها */
  --rc-sm:15px; --rc-md:17px; --rc-lg:20px; --rc-xl:24px;
}

:root[data-theme="light"]{
  --sf1:linear-gradient(135deg,#FFFFFF 0%,#F7F9FB 100%);
  --sf2:linear-gradient(135deg,#FFFFFF,#F5F7FA);
  --sf3:linear-gradient(135deg,#E9EDF2,#DDE3EA);
  --sf-flat:#FFFFFF;
  --nav-bg:linear-gradient(180deg,#FFFFFF,#F4F6F8);

  --sh-sm:0 2px 8px rgba(15,23,42,0.07), inset 0 1px 0 rgba(255,255,255,0.9);
  --sh-md:0 3px 12px rgba(15,23,42,0.08), inset 0 1px 0 rgba(255,255,255,0.9);
  --sh-lg:0 6px 24px rgba(15,23,42,0.10), inset 0 1px 0 rgba(255,255,255,0.9);
  --sh-nav:0 6px 24px rgba(15,23,42,0.13), inset 0 1px 0 rgba(255,255,255,0.9);
}

/* ── کارت‌ها ── */
.card,
.kc-card,
.gl-card,
.vt-item,
.tk-item{
  background:var(--sf2);
  border-radius:var(--rc-md);
  box-shadow:var(--sh-md);
}

/* کارت شاخص — KPI و آمار */
.stat-card,
.kpi-card,
.card-hover,
.gd-profit{
  background:var(--sf1);
  border-radius:var(--rc-xl);
  box-shadow:var(--sh-lg);
}

/* ── آواتار و عناصر مدور ── */
.avatar,
.kc-avatar,
.up-slot{
  background:var(--sf3);
  box-shadow:0 2px 8px rgba(0,0,0,0.4);
}

/* ── دکمه‌ها ── */
.btn{
  border-radius:12px;
  transition:transform .15s;
}
.btn:active{transform:scale(0.97);}

.btn-primary{
  box-shadow:0 4px 14px rgba(16,185,129,0.28);
}

.btn-ghost{
  background:var(--l4);
  box-shadow:var(--sh-sm);
}

/* ── مودال و شیت ── */
.modal,
.sheet-bg > div{
  border-radius:var(--rc-xl) var(--rc-xl) 0 0;
  box-shadow:var(--sh-lg);
}
@media(min-width:640px){
  .modal{border-radius:var(--rc-xl);}
}

/* ── ورودی‌ها ── */
.form-input,
.input,
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="number"],
input[type="password"],
textarea,
select{
  border-radius:12px;
  transition:border-color .15s;
}
.form-input:focus,
.input:focus,
textarea:focus,
select:focus{
  border-color:rgba(16,185,129,.45);
  outline:none;
}

/* ── نوار کناری پنل ── */
.sidebar{
  background:var(--sf2);
  box-shadow:var(--sh-md);
}
.nav-item{
  border-radius:12px;
  transition:.15s;
}

/* ── جدول‌ها ── */
.table-wrap,
.data-table{
  border-radius:var(--rc-md);
  overflow:hidden;
  box-shadow:var(--sh-md);
}

/* ── نشان‌ها ── */
.badge{
  border-radius:8px;
}

/* ══════════ panel-theme-fix-v1 ══════════ */

/* هر دو سازوکار تم روشن یکسان عمل کنند */
body.light,
:root[data-theme="light"] body,
:root[data-theme="light"]{
  --sf1:linear-gradient(135deg,#FFFFFF 0%,#F7F9FB 100%);
  --sf2:linear-gradient(135deg,#FFFFFF,#F5F7FA);
  --sf3:linear-gradient(135deg,#E9EDF2,#DDE3EA);
  --sf-flat:#FFFFFF;
  --nav-bg:linear-gradient(180deg,#FFFFFF,#F4F6F8);
  --sh-sm:0 2px 8px rgba(15,23,42,0.07), inset 0 1px 0 rgba(255,255,255,0.9);
  --sh-md:0 3px 12px rgba(15,23,42,0.08), inset 0 1px 0 rgba(255,255,255,0.9);
  --sh-lg:0 6px 24px rgba(15,23,42,0.10), inset 0 1px 0 rgba(255,255,255,0.9);
  --tex-base:#F2F4F7;
  --tex-glow:rgba(15,23,42,0.05);
  --tex-line:rgba(15,23,42,0.016);
  --tex-dark:rgba(15,23,42,0.030);
  --bg:#F4F6F8;      --surface:#FFFFFF;  --card:#FFFFFF;   --card2:#F7F9FB;
  --border:rgba(15,23,42,0.09);          --border2:rgba(15,23,42,0.17);
  --text:#0F172A;    --muted:#78849A;    --sub:#475569;
  --l3:rgba(15,23,42,0.03);   --l4:rgba(15,23,42,0.04);
  --l5:rgba(15,23,42,0.05);   --l6:rgba(15,23,42,0.06);
  --l8:rgba(15,23,42,0.08);   --l10:rgba(15,23,42,0.10);
  --l12:rgba(15,23,42,0.13);
}

/* بافت روی body در هر دو حالت */
body,
body.light{
  background-color:var(--tex-base);
  background-image:
    radial-gradient(ellipse at 50% 30%, var(--tex-glow) 0%, transparent 60%),
    repeating-linear-gradient(90deg, var(--tex-line) 0px, var(--tex-line) 1px,
                              transparent 1px, transparent 3px),
    repeating-linear-gradient(90deg, var(--tex-dark) 0px, var(--tex-dark) 1px,
                              transparent 1px, transparent 2px);
  background-attachment:fixed;
}

/* ── سطوح گرادیانی — با مشخصگی کافی ── */
body .card,
body.light .card,
body .card-sm,
body.light .card-sm,
body .panel,
body.light .panel{
  background:var(--sf2);
  border-radius:var(--rc-md,17px);
  box-shadow:var(--sh-md);
}

body .kpi,
body.light .kpi,
body .kpi-card,
body.light .kpi-card,
body .stat-card,
body.light .stat-card{
  background:var(--sf1);
  border-radius:var(--rc-xl,24px);
  box-shadow:var(--sh-lg);
}

body .table-wrap,
body.light .table-wrap{
  background:var(--sf2);
  border-radius:var(--rc-md,17px);
  box-shadow:var(--sh-md);
  overflow:hidden;
}

body .modal,
body.light .modal{
  background:var(--sf1);
  border-radius:var(--rc-xl,24px);
  box-shadow:var(--sh-lg);
}

body .sidebar,
body.light .sidebar{
  background:var(--sf2);
  box-shadow:var(--sh-md);
}

body .avatar,
body.light .avatar{
  background:var(--sf3);
  box-shadow:0 2px 8px rgba(0,0,0,0.35);
}

/* ── دکمه‌ها ── */
body .btn{transition:transform .15s;}
body .btn:active{transform:scale(0.97);}
body .btn-primary{box-shadow:0 4px 14px rgba(16,185,129,0.28);}
body .btn-ghost,
body.light .btn-ghost{background:var(--l4);box-shadow:var(--sh-sm);}

/* ── گوشه‌های گردتر ── */
body .form-input,
body .form-select,
body textarea,
body select{border-radius:12px;}
body .badge{border-radius:8px;}
body .nav-item{border-radius:12px;}

/* ══════════ visual-sync-v2 — سلسله‌مراتب سطوح و فاصله ══════════ */

/* ── لایهٔ ۲: کارت داخل کارت ساده‌تر می‌شود ── */
body .card .card,
body .card .card-sm,
body .card .kpi,
body .panel .card,
body .card .stat-card{
  background:var(--l3);
  box-shadow:none;
  border:1px solid var(--border);
  border-radius:14px;
}

/* ── لایهٔ ۳: بدون پس‌زمینه، فقط جداکننده ── */
body .card .card .card,
body .card .card .card-sm{
  background:transparent;
  border:none;
  border-top:1px solid var(--border);
  border-radius:0;
  box-shadow:none;
}

/* ── فاصلهٔ کارت‌ها ── */
body .kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:16px;
  margin-bottom:24px;
}
body .card + .card{margin-top:16px;}
body .card{padding:20px;}
body .card .card{padding:15px;}

/* KPI — سلسله‌مراتب عدد و برچسب مثل ویزیتور */
body .kpi{padding:22px 18px;}
body .kpi-val{font-size:30px;font-weight:900;line-height:1.1;letter-spacing:-.5px;}
body .kpi-label{font-size:11.5px;color:var(--muted);margin-top:8px;font-weight:600;}

/* خط رنگی بالای KPI حذف — رنگ روی خود عدد */
body .kpi::before,
body .kpi::after{display:none !important;}
body .kpi{border-top:1px solid var(--border) !important;}

/* ── آواتار مثل ویزیتور ── */
body .avatar{
  background:var(--sf3);
  box-shadow:0 2px 8px rgba(0,0,0,0.35);
  font-weight:800;
}

/* ── جدول‌ها ── */
body .table-wrap{padding:0;}
body table{border-collapse:separate;border-spacing:0;}
body thead th{
  background:var(--l3);
  font-size:11.5px;
  font-weight:700;
  color:var(--muted);
  padding:13px 14px;
}
body tbody td{padding:14px;border-top:1px solid var(--border);}
body tbody tr{transition:background .15s;}
body tbody tr:hover{background:var(--l3);}

/* ══════════ نارنجی فقط لهجه ══════════ */
/* عنوان‌ها، آیکون‌های بخش، و منوی فعال → سبز */
body .page-title,
body .card-title,
body .section-title,
body .sidebar-brand,
body .nav-item.active{
  color:var(--green) !important;
}
body .nav-item.active{
  background:rgba(16,185,129,.10) !important;
  border-color:rgba(16,185,129,.28) !important;
}
body .nav-item.active svg{stroke:var(--green) !important;}

/* آیکون کنار عنوان بخش */
body .card-title svg,
body .section-title svg,
body .page-title svg{stroke:var(--green) !important;}

/* فوکوس ورودی → سبز */
body .form-input:focus,
body .form-select:focus,
body textarea:focus,
body select:focus{
  border-color:rgba(16,185,129,.45) !important;
}

/* hover کارت → سبز */
body .card-hover:hover{
  border-color:rgba(16,185,129,.35) !important;
}

/* نارنجی می‌ماند فقط برای: هشدار، انقضا، اولویت */
body .badge-orange,
body .warn,
body .expiry{color:var(--orange);}

/* ── l3-fix — مقادیر تیره که جا مانده بودند ── */
:root{
  --l1:rgba(255,255,255,0.018);  --l2:rgba(255,255,255,0.020);
  --l3:rgba(255,255,255,0.03);   --l4:rgba(255,255,255,0.04);
  --l5:rgba(255,255,255,0.05);   --l6:rgba(255,255,255,0.06);
  --l7:rgba(255,255,255,0.07);   --l8:rgba(255,255,255,0.08);
  --l10:rgba(255,255,255,0.10);  --l12:rgba(255,255,255,0.12);
  --l15:rgba(255,255,255,0.15);  --l20:rgba(255,255,255,0.20);
}

/* تم روشن دوباره بعد از پایه تا غالب بماند */
body.light,
:root[data-theme="light"],
:root[data-theme="light"] body{
  --l1:rgba(15,23,42,0.012);  --l2:rgba(15,23,42,0.018);
  --l3:rgba(15,23,42,0.03);   --l4:rgba(15,23,42,0.04);
  --l5:rgba(15,23,42,0.05);   --l6:rgba(15,23,42,0.06);
  --l7:rgba(15,23,42,0.07);   --l8:rgba(15,23,42,0.08);
  --l10:rgba(15,23,42,0.10);  --l12:rgba(15,23,42,0.13);
  --l15:rgba(15,23,42,0.16);  --l20:rgba(15,23,42,0.20);
}

/* ══════════ unify-surfaces-v1 — سطوح یکدست ══════════ */

/* ── سطح ۱: همهٔ کارت‌های هم‌رده یک زبان ── */
body .card,
body .card-sm,
body .kpi,
body .summary-bar,
body .modal,
body .table-wrap,
body .panel,
body .stat-card{
  background:var(--sf2) !important;
  border:1px solid var(--border);
  box-shadow:var(--sh-md);
}

/* کارت شاخص کمی برجسته‌تر */
body .kpi,
body .stat-card{
  background:var(--sf1) !important;
  box-shadow:var(--sh-lg);
}

/* ── summary-bar: از نوار یکپارچه به کارت‌های مجزا ── */
body .summary-bar{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:14px;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  overflow:visible !important;
  margin-bottom:22px;
}
body .summary-bar .s-item{
  background:var(--sf1);
  border:1px solid var(--border) !important;
  border-radius:var(--rc-lg,20px);
  box-shadow:var(--sh-lg);
  padding:20px 18px !important;
  gap:6px !important;
}
body .summary-bar .s-val{
  font-size:28px !important;
  font-weight:900;
  line-height:1.1;
  letter-spacing:-.5px;
}
body .summary-bar .s-label{
  font-size:11.5px !important;
  font-weight:600;
  margin-top:4px;
}

/* ── KPI: خط رنگی بالا حذف، عدد رنگی ── */
body .kpi{
  border-top:1px solid var(--border) !important;
  border-radius:var(--rc-lg,20px);
  padding:20px 18px;
}
body .kpi .kpi-val{font-size:28px;line-height:1.1;}
body .kpi .kpi-label{font-size:11.5px;margin-top:6px;font-weight:600;}

/* ── گوشه‌ها یکدست ── */
body .card{border-radius:var(--rc-md,17px);}
body .card-sm{border-radius:14px;}
body .modal{border-radius:var(--rc-xl,24px);}
body .table-wrap{border-radius:var(--rc-md,17px);}

/* ── لایهٔ داخلی همچنان ساده ── */
body .card .card,
body .card .card-sm,
body .card .kpi,
body .card .s-item{
  background:var(--l3) !important;
  box-shadow:none !important;
  border-radius:14px;
}

/* ── دکمه‌های عملیات جدول: یک زبان ── */
body td .btn,
body td .btn-sm{
  background:var(--l5);
  border:1px solid var(--border);
  color:var(--sub);
  box-shadow:none;
  font-weight:600;
}
body td .btn:hover{
  border-color:rgba(16,185,129,.35);
  color:var(--text);
}
/* فقط کنش اصلی و مخرب رنگ دارند */
body td .btn-primary{
  background:rgba(16,185,129,.14);
  border-color:rgba(16,185,129,.32);
  color:var(--green);
}
body td .btn-danger,
body td .btn-red{
  background:rgba(239,68,68,.12);
  border-color:rgba(239,68,68,.28);
  color:var(--red);
}

/* ══════════ select-theme-v1 — رنگ گزینه‌های منوی کشویی ══════════ */
select{
  color-scheme:dark;                    /* منوی بومی تیره شود */
  cursor:pointer;
}
:root[data-theme="light"] select,
body.light select{
  color-scheme:light;
}

select option{
  background:var(--card) !important;
  color:var(--text) !important;
  padding:9px 12px;
}
select option:checked,
select option:hover,
select option:focus{
  background:var(--green) !important;
  color:#fff !important;
  font-weight:700;
}
select optgroup{
  background:var(--card) !important;
  color:var(--green) !important;
  font-weight:800;
  font-size:12px;
}
select option:disabled{
  color:var(--muted);
}

/* فایرفاکس هایلایت را جدا مدیریت می‌کند */
@-moz-document url-prefix(){
  select option:checked{
    box-shadow:0 0 10px 100px var(--green) inset;
    color:#fff;
  }
}

/* فوکوس خود select */
select:focus{
  border-color:rgba(16,185,129,.45);
  outline:none;
}