/* iCommand cockpit — כהה, צפוף-נתונים, RTL, רמז iBrand (gold accent) */
:root{
  --bg:#0c0f14; --bg2:#12161d; --panel:#161b24; --panel2:#1b212c;
  --line:#232b38; --line2:#2c3646;
  --txt:#e6ebf2; --muted:#8b97a8; --dim:#5d6779;
  --gold:#d8b673; --gold-dim:#8a7442;
  --green:#3ecf8e; --green-bg:#0f2a20;
  --yellow:#e6c04d; --yellow-bg:#2a2410;
  --red:#f0616d; --red-bg:#2c1216;
  --blue:#5aa9e6;
  --r:10px; --r-sm:6px;
  --mono:'SF Mono',ui-monospace,'Menlo',monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--txt);
  font-family:'Heebo',system-ui,-apple-system,'Segoe UI',sans-serif;
  direction:rtl; font-size:14px; line-height:1.45;
}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:600}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ---- shell ---- */
.shell{display:grid;grid-template-columns:210px 1fr;min-height:100vh}
.side{background:var(--bg2);border-inline-start:1px solid var(--line);padding:16px 12px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px}
.brand{display:flex;align-items:center;gap:9px;padding:6px 8px 14px;border-bottom:1px solid var(--line);margin-bottom:10px}
.brand .dot{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold)}
.brand b{font-size:17px;letter-spacing:.3px}
.brand small{color:var(--gold);font-size:10px;font-weight:600}
.navlink{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:var(--r-sm);color:var(--muted);font-weight:500;transition:.12s}
.navlink:hover{background:var(--panel);color:var(--txt)}
.navlink.on{background:var(--panel2);color:var(--txt);box-shadow:inset 3px 0 0 var(--gold)}
.navlink .ic{width:18px;text-align:center;opacity:.85}
.side .foot{margin-top:auto;font-size:11px;color:var(--dim);padding:8px}

.main{padding:22px 26px;max-width:1280px}
.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:16px;flex-wrap:wrap}
.top h1{font-size:22px}
.top .sub{color:var(--muted);font-size:12px;margin-top:3px}
.phasebar{display:flex;align-items:center;gap:10px}
.pill{padding:4px 10px;border-radius:20px;font-size:11px;font-weight:600;border:1px solid var(--line2)}
.pill.advisor{background:var(--yellow-bg);color:var(--yellow);border-color:var(--gold-dim)}
.pill.lock-on{background:var(--red-bg);color:var(--red);border-color:var(--red)}
.pill.lock-off{background:var(--panel);color:var(--muted)}

/* ---- cards / grid ---- */
.grid{display:grid;gap:14px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
@media(max-width:1000px){.g4,.g3{grid-template-columns:repeat(2,1fr)}.shell{grid-template-columns:1fr}.side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;overflow:auto}}
@media(max-width:620px){.g4,.g3,.g2{grid-template-columns:1fr}}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.card .lbl{color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.4px;margin-bottom:7px;text-transform:uppercase}
.kpi{font-size:30px;font-weight:700;font-family:var(--mono);letter-spacing:-.5px}
.kpi small{font-size:13px;color:var(--muted);font-weight:500}
.delta{font-size:12px;margin-top:5px}
.card.accent{border-color:var(--gold-dim);box-shadow:inset 0 0 0 1px rgba(216,182,115,.08)}

/* color states */
.c-green{color:var(--green)} .c-yellow{color:var(--yellow)} .c-red{color:var(--red)}
.c-gold{color:var(--gold)} .c-blue{color:var(--blue)} .c-muted{color:var(--muted)}
.bg-green{background:var(--green-bg);border-color:#1c4a38}
.bg-yellow{background:var(--yellow-bg);border-color:#4a4018}
.bg-red{background:var(--red-bg);border-color:#4a2028}

.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:700;border:1px solid transparent}
.tag.green{background:var(--green-bg);color:var(--green);border-color:#1c4a38}
.tag.yellow{background:var(--yellow-bg);color:var(--yellow);border-color:#4a4018}
.tag.red{background:var(--red-bg);color:var(--red);border-color:#4a2028}
.tag.gold{background:rgba(216,182,115,.12);color:var(--gold);border-color:var(--gold-dim)}
.dotc{width:8px;height:8px;border-radius:50%;display:inline-block}
.dotc.green{background:var(--green)} .dotc.yellow{background:var(--yellow)} .dotc.red{background:var(--red)} .dotc.gold{background:var(--gold)}

/* ---- table ---- */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.panel .head{padding:13px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.panel .head h3{font-size:14px}
.panel .head .hint{font-size:11px;color:var(--dim)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:right;color:var(--muted);font-weight:600;font-size:11px;letter-spacing:.3px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--bg2)}
td{padding:11px 14px;border-bottom:1px solid var(--line);font-family:var(--mono);font-variant-numeric:tabular-nums}
td.txt{font-family:inherit}
tr:last-child td{border-bottom:none}
tr:hover td{background:var(--panel2)}

/* ---- bars ---- */
.bar{height:8px;background:var(--line);border-radius:20px;overflow:hidden}
.bar>i{display:block;height:100%;border-radius:20px}
.bar.green>i{background:var(--green)} .bar.yellow>i{background:var(--yellow)} .bar.red>i{background:var(--red)} .bar.gold>i{background:var(--gold)}
.trust-row{display:flex;align-items:center;gap:14px}

/* ---- chart ---- */
.chart{display:flex;align-items:flex-end;gap:10px;height:150px;padding:10px 4px}
.chart .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;align-items:center}
.chart .col .b{width:70%;border-radius:4px 4px 0 0;min-height:2px}
.chart .col .b.spend{background:var(--line2)}
.chart .col small{font-size:10px;color:var(--dim)}

/* ---- feed ---- */
.feeditem{border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:11px;background:var(--panel)}
.feeditem.critical{border-inline-start:3px solid var(--red)}
.feeditem.warn{border-inline-start:3px solid var(--yellow)}
.feeditem.info{border-inline-start:3px solid var(--blue)}
.feeditem .fh{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.feeditem .fh b{font-size:14px}
.feeditem p{margin:6px 0 12px;color:var(--muted);font-size:13px;line-height:1.55}
.feeditem .acts{display:flex;gap:8px}

/* ---- forms / buttons ---- */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 15px;border-radius:var(--r-sm);border:1px solid var(--line2);background:var(--panel2);color:var(--txt);font:inherit;font-weight:600;font-size:13px;cursor:pointer;transition:.12s}
.btn:hover{border-color:var(--gold-dim)}
.btn.ok{background:var(--green-bg);border-color:#1c4a38;color:var(--green)}
.btn.no{background:var(--red-bg);border-color:#4a2028;color:var(--red)}
.btn.gold{background:var(--gold);color:#1a1408;border-color:var(--gold)}
.btn.sm{padding:5px 11px;font-size:12px}
input[type=text],input[type=password],input[type=number]{background:var(--bg2);border:1px solid var(--line2);color:var(--txt);padding:9px 12px;border-radius:var(--r-sm);font:inherit;width:100%}
input:focus{outline:none;border-color:var(--gold-dim)}
label.fl{display:block;color:var(--muted);font-size:12px;margin-bottom:6px;font-weight:600}
.field{margin-bottom:14px}
.hintline{font-size:11px;color:var(--dim);margin-top:4px}

/* ---- login ---- */
.login-wrap{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:34px;width:360px}
.login-card .lg{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.login-card .lg b{font-size:22px}
.login-card .tagline{color:var(--muted);font-size:12px;margin-bottom:22px}
.err{background:var(--red-bg);border:1px solid #4a2028;color:var(--red);padding:9px 12px;border-radius:var(--r-sm);font-size:12px;margin-bottom:14px}
.divider{display:flex;align-items:center;gap:10px;color:var(--dim);font-size:11px;margin:16px 0}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
.passkey{width:100%;justify-content:center;padding:11px;background:var(--bg2)}

.note{font-size:12px;color:var(--dim);line-height:1.6}
.sec-title{font-size:12px;color:var(--gold);font-weight:700;letter-spacing:.5px;margin:22px 0 12px;text-transform:uppercase}
.keyrow{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:9px;background:var(--bg2)}
.keyrow .kl b{font-size:13px}
.keyrow .kl small{display:block;color:var(--dim);font-size:11px;margin-top:2px}
.badge-empty{color:var(--yellow);font-size:11px;font-weight:700;background:var(--yellow-bg);padding:3px 9px;border-radius:20px;border:1px solid #4a4018}
.badge-set{color:var(--green);font-size:11px;font-weight:700;background:var(--green-bg);padding:3px 9px;border-radius:20px}

/* ============================================================
   ☀️ מצב בהיר (light) — פלטת iBrand: קרם/שנהב, פחם, זהב-עתיק.
   "הזהב חתימה, לא מילוי". opt-in דרך [data-theme="light"] על <html>.
   ============================================================ */
[data-theme="light"]{
  --bg:#F4EFE6; --bg2:#EBE3D4; --panel:#FCFAF5; --panel2:#F0E9DB;
  --line:#D9D1BF; --line2:#C7BCA3;
  --txt:#161613; --muted:#6B6660; --dim:#938C80;
  --gold:#9C7A3C; --gold-dim:#7E6230;
  --green:#2E8B5E; --green-bg:#E4EFE4;
  --yellow:#8A6D12; --yellow-bg:#F3ECD4;
  --red:#C43D48; --red-bg:#F7E5E3;
  --blue:#2F72B0;
}
/* עומק עדין לצל-כרטיס במקום גבולות כהים */
[data-theme="light"] .card{box-shadow:0 1px 2px rgba(22,22,19,.04)}
[data-theme="light"] .brand .dot{box-shadow:0 0 8px rgba(156,122,60,.55)}
[data-theme="light"] .card.accent{box-shadow:inset 0 0 0 1px rgba(156,122,60,.14)}
[data-theme="light"] .tag.gold{background:rgba(156,122,60,.12);border-color:var(--gold-dim)}
[data-theme="light"] .btn.gold{color:#FCFAF5}
/* גבולות-סטטוס בהירים (במקום ההקסים הכהים המקובעים) */
[data-theme="light"] .bg-green,[data-theme="light"] .tag.green,[data-theme="light"] .btn.ok{border-color:#BFDCC6}
[data-theme="light"] .bg-yellow,[data-theme="light"] .tag.yellow,[data-theme="light"] .badge-empty{border-color:#E3D3A0}
[data-theme="light"] .bg-red,[data-theme="light"] .tag.red,[data-theme="light"] .btn.no,[data-theme="light"] .err{border-color:#E8C4C0}

/* כפתור מתג-נושא בסרגל-הצד */
.theme-toggle{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:6px 10px;border-radius:var(--r-sm);border:1px solid var(--line2);background:var(--panel);color:var(--muted);font:inherit;font-size:11px;font-weight:600;cursor:pointer;transition:.12s;width:100%;justify-content:center}
.theme-toggle:hover{border-color:var(--gold-dim);color:var(--txt)}

/* נייד: תפריט בשורה אחת נגללת במקום מסך-שלם של קישורים; מספרים בשתי עמודות */
@media(max-width:620px){
  .side{flex-wrap:nowrap;overflow-x:auto;gap:4px;padding:8px 10px;align-items:center;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .side .brand{border:0;margin:0;padding:4px 6px}
  .side .brand small{display:none}
  .navlink{white-space:nowrap;padding:7px 10px;flex:none}
  .side .foot{flex:none;display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:11px}
  .side .foot br{display:none}
  .side .foot .theme-toggle{width:auto;margin:0}
  .main{padding:16px 14px}
  .g4{grid-template-columns:repeat(2,1fr)}
  .kpi{font-size:22px}
}