/* ==============================================================
   EvoSoft — umumiy dizayn tokenlari va yon menyu
   Barcha kabinet sahifalari shu faylni <link> bilan chaqiradi.
   Rangni bir joyda o'zgartirsangiz, hamma sahifada o'zgaradi.
   ============================================================== */

:root{
  --canvas:#EDF0F6;
  --card:#FFFFFF;
  --ink:#101522;
  --ink-2:#4C566B;
  --ink-3:#8892A6;
  --line:#DCE2EC;
  --line-2:#EAEEF5;
  --brand:#143C8C;
  --brand-2:#2A5CC7;
  --brand-soft:#E8EEFB;
  --gold:#B08B4F;
  --new:#0F7A5A;
  --new-soft:#E6F4EF;
  --repl:#9A5B00;
  --repl-soft:#FBF0E1;
  --danger:#B3261E;
  --danger-soft:#FBEBEA;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --r:14px;
  --shadow:0 1px 2px rgba(16,21,34,.05), 0 12px 30px -14px rgba(16,21,34,.16);
  --side:238px;
}

/* ---------- yon menyu ---------- */
aside.side{
  width:var(--side); flex:none; background:#fff; border-right:1px solid var(--line);
  position:sticky; top:0; height:100vh; display:flex; flex-direction:column; z-index:60;
}
.side-top{padding:16px 16px 14px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--line-2)}
.glyph{width:31px;height:31px;border-radius:9px;background:var(--brand);display:grid;place-items:center;flex:none;
  box-shadow:0 6px 14px -8px rgba(20,60,140,.8)}
.glyph svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.brandname{font-weight:650;letter-spacing:-.01em;font-size:14.5px;line-height:1.15;color:var(--ink)}
.brandsub{font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}

.side nav{flex:1; overflow-y:auto; padding:12px 10px}
.nav-grp{font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-3); padding:12px 8px 7px}
.nav-grp:first-child{padding-top:4px}

.nav-item{
  width:100%; display:flex; align-items:center; gap:10px; text-align:left; cursor:pointer;
  text-decoration:none; border:0; background:transparent; color:var(--ink-2);
  font-family:var(--sans); font-size:13.5px; font-weight:520; padding:9px 10px;
  border-radius:9px; transition:.14s; position:relative;
}
.nav-item svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;opacity:.75}
.nav-item:hover{background:#F5F7FB; color:var(--ink)}
.nav-item[aria-current=true]{background:var(--brand-soft); color:var(--brand); font-weight:600}
.nav-item[aria-current=true] svg{opacity:1}
.nav-item[aria-current=true]::before{
  content:""; position:absolute; left:-10px; top:9px; bottom:9px; width:3px;
  border-radius:0 3px 3px 0; background:linear-gradient(180deg,var(--brand),var(--gold));
}
.nav-item .badge{
  margin-left:auto; font-family:var(--mono); font-size:10px; padding:1px 6px; border-radius:20px;
  background:#F0F2F6; color:var(--ink-3); font-weight:400;
}
.nav-item[aria-current=true] .badge{background:#fff; color:var(--brand)}
.nav-item .soon{
  margin-left:auto; font-family:var(--mono); font-size:8.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold); border:1px solid #EADCC4; padding:2px 5px; border-radius:5px;
}

.side-foot{border-top:1px solid var(--line-2); padding:12px}
.rootbox{
  font-family:var(--mono); font-size:10.5px; color:var(--ink-3); line-height:1.5;
  background:#FAFBFD; border:1px solid var(--line-2); border-radius:9px; padding:8px 9px;
  word-break:break-all; margin-bottom:9px;
}
.rootbox b{display:block; color:var(--ink-2); letter-spacing:.1em; text-transform:uppercase;
  font-size:9px; font-weight:500; margin-bottom:3px}

/* ---------- mobil uchun tugma va parda ---------- */
.burger{display:none; border:1px solid var(--line); background:#fff; border-radius:9px;
  width:34px; height:34px; cursor:pointer; padding:0}
.burger svg{width:17px;height:17px;stroke:var(--ink-2);fill:none;stroke-width:1.9;stroke-linecap:round}
.scrim{position:fixed; inset:0; background:rgba(16,21,34,.35); z-index:55; display:none}
.scrim.on{display:block}

@media (max-width:1000px){
  aside.side{position:fixed; left:0; top:0; transform:translateX(-100%);
    transition:transform .22s; box-shadow:0 0 40px rgba(16,21,34,.2)}
  aside.side.open{transform:none}
  .burger{display:grid; place-items:center}
}
@media (prefers-reduced-motion:reduce){
  aside.side{transition:none}
}