/* © 2026 Bella Bardabareket — Supply Chain Stress Test styles. Namespaced .sc-* */
:root {
  --sc-cyan: #22d3ee; --sc-cyan-soft: #67e8f9;
  --sc-amber: #fbbf24; --sc-route: #38bdf8;
  --sc-ink: #e6edf5; --sc-ink-2: #98a3b3; --sc-ink-3: #5a6473;
  --sc-panel: rgba(10, 15, 23, 0.95); --sc-line: rgba(255,255,255,0.09); --sc-line-cyan: rgba(34,211,238,0.3);
}

/* trigger */
.sc-fab { display:inline-flex; align-items:center; gap:9px; height:38px; padding:0 16px; cursor:pointer; white-space:nowrap;
  background:linear-gradient(180deg, rgba(56,189,248,.2), rgba(56,189,248,.1)); border:1px solid rgba(56,189,248,.55);
  border-radius:7px; color:#bae6fd; font-family:"Space Grotesk",system-ui,sans-serif; font-size:12px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; transition:filter .15s, box-shadow .18s, transform .12s; }
.sc-fab:hover { filter:brightness(1.12); box-shadow:0 10px 28px rgba(0,0,0,.5), 0 0 24px rgba(56,189,248,.4); transform:translateY(-1px); }
.sc-fab:active { transform:scale(.97); }
.sc-fab-glyph { width:15px; height:15px; flex-shrink:0; }
html[lang="he"] .sc-fab { font-family:"Assistant",sans-serif; letter-spacing:.02em; font-size:12.5px; font-weight:700; }

/* shared atoms */
.sc-eyebrow { font-family:"JetBrains Mono",monospace; font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--sc-cyan-soft); }
.sc-h1 { font-family:"Heebo","Assistant",sans-serif; font-weight:800; letter-spacing:-.01em; color:#f5f8fc; margin:0; }
.sc-sect { display:flex; align-items:center; gap:9px; margin:2px 0 10px; }
.sc-sect-line { flex:1; height:1px; background:var(--sc-line); }
.sc-close { width:30px; height:30px; border-radius:6px; flex-shrink:0; background:rgba(255,255,255,.05); border:1px solid var(--sc-line);
  color:var(--sc-ink-2); font-size:16px; cursor:pointer; line-height:1; display:inline-flex; align-items:center; justify-content:center; transition:.15s; }
.sc-close:hover { background:rgba(244,63,94,.14); color:#fecdd3; border-color:rgba(244,63,94,.45); }
@keyframes sc-rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }

/* right console drawer (keeps globe visible + interactive) */
.sc-console { position:fixed; top:0; bottom:0; inset-inline-end:0; width:412px; max-width:94vw; z-index:55;
  background:var(--sc-panel); border-inline-start:1px solid var(--sc-line-cyan); box-shadow:-24px 0 70px rgba(0,0,0,.55);
  display:flex; flex-direction:column; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  animation:sc-slide .32s cubic-bezier(.2,.7,.2,1) both; }
@keyframes sc-slide { from { transform:translateX(var(--sc-s,100%)); } to { transform:none; } }
html[dir="rtl"] .sc-console { --sc-s:-100%; }
.sc-head { padding:15px 18px 12px; border-bottom:1px solid var(--sc-line); display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.sc-head .sc-h1 { font-size:18px; }
.sc-body { flex:1; overflow-y:auto; padding:14px 18px 28px; display:flex; flex-direction:column; gap:18px; }
.sc-body::-webkit-scrollbar { width:8px; } .sc-body::-webkit-scrollbar-thumb { background:rgba(255,255,255,.1); border-radius:4px; }
.sc-headbtns { display:flex; align-items:center; gap:8px; }

/* route builder */
.sc-route { display:flex; flex-direction:column; gap:7px; }
.sc-node { display:grid; grid-template-columns:22px 1fr auto auto; align-items:center; gap:9px; padding:8px 10px;
  background:rgba(255,255,255,.025); border:1px solid var(--sc-line); border-radius:8px; transition:border-color .15s; }
.sc-node:hover { border-color:var(--sc-line-cyan); }
.sc-node-ix { width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-family:"JetBrains Mono",monospace; font-size:11px; font-weight:600; background:rgba(56,189,248,.15); color:#bae6fd; }
.sc-node-nm { font-family:"Heebo","Assistant",sans-serif; font-weight:600; font-size:13.5px; color:var(--sc-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sc-node-sub { font-size:10.5px; color:var(--sc-ink-3); }
.sc-node-btns { display:flex; gap:2px; }
.sc-mini { appearance:none; border:0; background:transparent; color:var(--sc-ink-3); cursor:pointer; font-size:13px; padding:2px 4px; border-radius:4px; line-height:1; }
.sc-mini:hover { color:var(--sc-ink); background:rgba(255,255,255,.06); }
.sc-mini.del:hover { color:#fecdd3; background:rgba(244,63,94,.12); }
.sc-arrowdown { text-align:center; color:var(--sc-ink-3); font-size:11px; margin:-3px 0; }

.sc-add { position:relative; }
.sc-add-input { width:100%; box-sizing:border-box; padding:10px 12px; background:rgba(5,8,14,.7); border:1px solid var(--sc-line);
  border-radius:8px; color:var(--sc-ink); font-size:13px; font-family:"Heebo","Assistant",sans-serif; }
.sc-add-input::placeholder { color:var(--sc-ink-3); }
.sc-add-input:focus { outline:none; border-color:var(--sc-line-cyan); box-shadow:0 0 0 3px rgba(34,211,238,.1); }
.sc-add-menu { position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:5; max-height:240px; overflow-y:auto;
  background:var(--sc-panel); border:1px solid var(--sc-line-cyan); border-radius:8px; box-shadow:0 18px 46px rgba(0,0,0,.6); }
.sc-add-opt { display:flex; align-items:center; gap:9px; padding:8px 12px; cursor:pointer; font-size:13px; color:var(--sc-ink); }
.sc-add-opt:hover, .sc-add-opt.active { background:rgba(34,211,238,.12); }
.sc-add-opt .sc-node-sub { margin-inline-start:auto; }
.sc-hint { font-size:11px; color:var(--sc-ink-3); margin-top:7px; display:flex; align-items:center; gap:6px; }
.sc-hint b { color:var(--sc-cyan-soft); font-weight:600; }

/* scenarios */
.sc-scns { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.sc-scn { display:flex; align-items:center; gap:8px; padding:9px 10px; cursor:pointer; text-align:start;
  background:rgba(255,255,255,.025); border:1px solid var(--sc-line); border-radius:8px; color:var(--sc-ink-2);
  font-family:"Heebo","Assistant",sans-serif; font-size:12px; font-weight:600; transition:.15s; }
.sc-scn:hover { border-color:var(--sc-line-cyan); color:var(--sc-ink); }
.sc-scn.on { background:rgba(56,189,248,.16); border-color:rgba(56,189,248,.55); color:#e0f2fe; }
.sc-scn-ic { font-family:"JetBrains Mono",monospace; font-size:13px; flex-shrink:0; }
.sc-scn.danger.on { background:rgba(244,63,94,.16); border-color:rgba(244,63,94,.5); color:#fecdd3; }

/* results */
.sc-summary { display:flex; align-items:center; gap:15px; padding:14px; border-radius:10px; border:1px solid var(--sc-line); background:rgba(255,255,255,.02); }
.sc-gauge { position:relative; width:74px; height:74px; flex-shrink:0; }
.sc-gauge svg { transform:rotate(-90deg); display:block; }
.sc-gauge-c { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.sc-gauge-n { font-family:"JetBrains Mono",monospace; font-size:23px; font-weight:600; line-height:1; }
.sc-gauge-l { font-family:"JetBrains Mono",monospace; font-size:8px; letter-spacing:.12em; color:var(--sc-ink-3); text-transform:uppercase; margin-top:2px; }
.sc-tier { display:inline-flex; align-items:center; gap:7px; padding:4px 10px; border-radius:999px; font-family:"Heebo","Assistant",sans-serif; font-weight:700; font-size:12.5px; }
.sc-tier-dot { width:8px; height:8px; border-radius:50%; }

.sc-stats { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }
.sc-stat { padding:11px 10px; border-radius:9px; background:rgba(255,255,255,.03); border:1px solid var(--sc-line); text-align:center; }
.sc-stat-n { font-family:"JetBrains Mono",monospace; font-size:21px; font-weight:600; line-height:1; }
.sc-stat-l { font-size:9.5px; color:var(--sc-ink-3); text-transform:uppercase; letter-spacing:.08em; margin-top:5px; line-height:1.3; }

.sc-spof { display:flex; gap:10px; padding:11px 13px; border-radius:9px; background:rgba(244,63,94,.08); border:1px solid rgba(244,63,94,.32); align-items:flex-start; }
.sc-spof.warn { background:rgba(251,191,36,.08); border-color:rgba(251,191,36,.32); }
.sc-spof-ic { flex-shrink:0; color:#fb7185; width:17px; height:17px; margin-top:1px; }
.sc-spof.warn .sc-spof-ic { color:#fcd34d; }
.sc-spof-t { font-family:"Heebo","Assistant",sans-serif; font-weight:700; font-size:12.5px; color:#f5f8fc; margin:0 0 2px; }
.sc-spof-x { font-size:12px; line-height:1.45; color:var(--sc-ink-2); margin:0; }

/* legs breakdown */
.sc-legs { display:flex; flex-direction:column; gap:6px; }
.sc-leg { display:grid; grid-template-columns:8px 1fr auto; align-items:center; gap:10px; padding:8px 11px; border-radius:8px;
  background:rgba(255,255,255,.02); border:1px solid var(--sc-line); }
.sc-leg.ok { } .sc-leg.rer { border-color:rgba(251,191,36,.34); background:rgba(251,191,36,.05); }
.sc-leg.brk { border-color:rgba(244,63,94,.4); background:rgba(244,63,94,.07); }
.sc-leg-bar { width:8px; height:34px; border-radius:4px; }
.sc-leg-rt { font-family:"Heebo","Assistant",sans-serif; font-weight:600; font-size:12.5px; color:var(--sc-ink); }
.sc-leg-sub { font-size:10.5px; color:var(--sc-ink-3); margin-top:2px; }
.sc-leg-val { text-align:end; font-family:"JetBrains Mono",monospace; font-size:12px; }

/* buttons */
.sc-cta { display:inline-flex; align-items:center; justify-content:center; gap:9px; width:100%; box-sizing:border-box; padding:11px 14px;
  border-radius:8px; cursor:pointer; background:linear-gradient(180deg, rgba(34,211,238,.18), rgba(34,211,238,.08));
  border:1px solid var(--sc-line-cyan); color:#cefcff; font-family:"Heebo","Assistant",sans-serif; font-weight:700; font-size:13px; transition:.15s; }
.sc-cta:hover { filter:brightness(1.1); box-shadow:0 0 22px rgba(34,211,238,.22); }
.sc-cta[disabled] { opacity:.6; cursor:progress; }
.sc-export { display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:8px; cursor:pointer;
  background:linear-gradient(180deg, rgba(34,211,238,.2), rgba(34,211,238,.1)); border:1px solid var(--sc-line-cyan); color:#cefcff;
  font-family:"Heebo","Assistant",sans-serif; font-weight:700; font-size:12px; white-space:nowrap; transition:.15s; }
.sc-export:hover { filter:brightness(1.1); box-shadow:0 0 18px rgba(34,211,238,.25); }
.sc-clear { display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:7px; cursor:pointer;
  background:rgba(244,63,94,.1); border:1px solid rgba(244,63,94,.32); color:#fda4af;
  font-family:"Heebo","Assistant",sans-serif; font-weight:600; font-size:11.5px; transition:.15s; }
.sc-clear:hover { background:rgba(244,63,94,.18); border-color:rgba(244,63,94,.5); color:#fecdd3; }
.sc-back { display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:8px; cursor:pointer;
  background:rgba(255,255,255,.04); border:1px solid var(--sc-line); color:var(--sc-ink-2);
  font-family:"Heebo","Assistant",sans-serif; font-weight:600; font-size:12.5px; transition:.15s; }
.sc-back:hover { border-color:var(--sc-line-cyan); background:rgba(34,211,238,.08); color:#cefcff; }
html[dir="rtl"] .sc-back svg { transform:scaleX(-1); }
.sc-ai-out { font-family:"Assistant","Heebo",sans-serif; font-size:13.5px; line-height:1.62; color:#dbe6f1; white-space:pre-wrap;
  padding:13px 15px; border-radius:8px; background:rgba(34,211,238,.05); border:1px solid rgba(34,211,238,.18);
  border-inline-start:3px solid var(--sc-cyan); animation:sc-rise .3s ease both; }
.sc-ai-sig { margin-top:8px; font-family:"JetBrains Mono",monospace; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--sc-ink-3); }
.sc-spin { width:14px; height:14px; border:2px solid rgba(255,255,255,.25); border-top-color:var(--sc-cyan); border-radius:50%; animation:sc-spin .7s linear infinite; }
@keyframes sc-spin { to { transform:rotate(360deg); } }
.sc-empty { text-align:center; color:var(--sc-ink-3); font-size:13px; padding:22px 12px; line-height:1.6; }

@media (max-width:720px){ .sc-console{ width:100vw; } .sc-scns{ grid-template-columns:1fr; } }
