/* © 2026 Abderrahim El Otmani – All rights reserved. Confidential. */
/* === NEXREPS — Status page (delta only; reuses styles.css tokens) === */

:root{
  --st-green:#30a46c;
  --st-amber:#f5a623;
  --st-red:#e5484d;
  --st-blue:#4a9eea;
  --st-gray:#d2d2d7;
}
html[data-theme="dark"]{
  --st-green:#3dd68c;
  --st-amber:#ffb224;
  --st-red:#ff6369;
  --st-blue:#5ac8fa;
  --st-gray:#3a3a3f;
}

.st-main{padding-top:80px}

/* Banner */
.st-banner{
  display:flex;align-items:center;gap:16px;
  border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--bg-alt);padding:22px 28px;
  max-width:var(--container-narrow);margin:0 auto 22px;
}
.st-banner .bdot{width:14px;height:14px;border-radius:50%;flex:0 0 auto}
.st-banner .btext{font-family:var(--font-display);font-size:21px;font-weight:600;letter-spacing:-0.02em}
.st-banner .bmeta{margin-left:auto;font-size:12.5px;color:var(--text-3);text-align:right;line-height:1.4}

/* Board card */
.st-card{
  border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--bg);padding:8px 30px;
  max-width:var(--container-narrow);margin:0 auto 20px;
}

/* Per-component row */
.st-row{padding:22px 0;border-bottom:1px solid var(--border)}
.st-row:last-child{border-bottom:none}
.st-row-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.st-row-label{font-size:16px;font-weight:500;letter-spacing:-0.01em}

/* Status pill (color set inline per status) */
.st-pill{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;padding:5px 12px;border-radius:999px}
.st-pill .pdot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}

/* 90-day track of dots */
.st-track{display:grid;grid-template-columns:repeat(90,1fr);gap:3px;align-items:center;margin-bottom:10px}
.st-dot{width:100%;max-width:9px;aspect-ratio:1;border-radius:50%;margin:0 auto;background:var(--st-gray)}

.st-row-foot{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--text-3)}
.st-row-foot .up{color:var(--st-green);font-weight:500}

/* Legend */
.st-legend{display:flex;gap:22px;flex-wrap:wrap;padding:2px 30px 0;max-width:var(--container-narrow);margin:0 auto 8px}
.st-legend span{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2)}
.st-legend i{width:10px;height:10px;border-radius:50%;display:inline-block}

.st-msg{color:var(--text-3);font-size:14px;padding:16px 0}
.st-msg.err{color:var(--st-amber)}

@media(max-width:640px){
  .st-banner{flex-wrap:wrap;gap:10px;padding:20px}
  .st-banner .bmeta{margin-left:0;width:100%;text-align:left}
  .st-card{padding-left:18px;padding-right:18px}
  .st-track{gap:2px}
  .st-dot{max-width:6px}
  .st-legend{padding:2px 18px 0;gap:14px}
}