/* =====================================================================
   Niterra MPS - dark theme.
   Everything here is a variable override: the layout sheets were changed
   to draw their surfaces from tokens, so nothing structural is repeated.
   Applied when the root carries data-theme="dark".
   ===================================================================== */

:root[data-theme="dark"]{
  color-scheme:dark;

  /* Brand - lifted so teal stays legible on a dark ground */
  --c-brand:#3FBFB6;
  --c-brand-d:#5AD3C9;
  --c-brand-l:#123B39;

  /* Surfaces */
  --c-ink:#E8ECF4;
  --c-ink-2:#B9C2D4;
  --c-mute:#8994A8;
  --c-line:#2A3346;
  --c-line-2:#232B3C;
  --c-bg:#0D1220;
  --c-panel:#151C2C;
  --c-surface-2:#1B2334;
  --c-hover:#212A3D;
  --c-row-hover:#1A2231;
  --c-chip:#232C3E;
  --c-tint:#14262B;
  --c-code:#CBD4E6;

  /* The pale brand yellow is used as a fill, so it needs a dark equivalent.
     The yellow itself stays: it reads well as an accent on dark. */
  --c-tittle-l:#3A2E0C;

  /* Sidebar - a shade deeper than the content so the split still reads */
  --sb-bg:#0A0F1B;
  --sb-bg-2:#141C2C;
  --sb-line:#232C3E;
  --sb-text:#B7C1D4;
  --sb-mute:#77839A;
  --sb-active:#1D2739;

  /* Functional - text brightened, fills darkened */
  --ok:#4ADE9B;      --ok-bg:#102A20;
  --warn:#FBBF5B;    --warn-bg:#31240D;
  --bad:#FF7A8F;     --bad-bg:#331420;
  --info:#7FA9FF;    --info-bg:#15213C;

  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow:0 10px 28px rgba(0,0,0,.5);
}

/* Gradients and images are not tokens, so they are restated for dark. */
:root[data-theme="dark"] .landing-body{
  background:linear-gradient(160deg,#0C1220 0%,#111A2B 45%,#0E1726 100%)}
:root[data-theme="dark"] .prof-band{
  background:linear-gradient(135deg,#1B2A44 0%,#241E3F 60%,#2A1B33 100%)}
:root[data-theme="dark"] .mod-card{
  background:var(--c-panel);border-color:var(--c-line)}
:root[data-theme="dark"] .login-right{background:var(--c-panel)}
:root[data-theme="dark"] .login{background:var(--c-panel)}

/* The Niterra wordmark on dark: white on the menu's navy, the lifted brand teal elsewhere,
   the yellow tittle kept - no light plate behind it. */
:root[data-theme="dark"] .side .logo-wrap{background:var(--sb-bg)}
:root[data-theme="dark"] .landing-bar{background:var(--c-panel);border-bottom-color:var(--c-line)}
:root[data-theme="dark"] .landing-bar .niterra-logo svg text,
:root[data-theme="dark"] .login-left .login-logo svg text{fill:var(--c-brand)}

/* Inputs sit on the panel, so give them a touch more contrast. */
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea{background:var(--c-surface-2);color:var(--c-ink);
  border-color:var(--c-line)}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder{color:var(--c-mute)}
:root[data-theme="dark"] input[readonly]{background:var(--c-bg);color:var(--c-mute)}

/* Excel-yellow dev banner and temp passwords need dark-safe equivalents. */
:root[data-theme="dark"] .dev-link{background:#2A2410;border-color:#6B5A16;color:#F0DFA8}
:root[data-theme="dark"] code.temp-pass{background:#2A2410;border-color:#6B5A16;color:#F5E6B8}

:root[data-theme="dark"] th{background:var(--c-surface-2);color:var(--c-mute)}
:root[data-theme="dark"] .badge.b-tag{background:var(--c-brand-l);color:var(--c-brand-d)}
:root[data-theme="dark"] code{color:var(--c-code)}