/* ===========================================================================
   MARKEN-BLOCK — die einzige Stelle, die je Marke getauscht wird.
   Farben kommen aus dem Design-Repo der Marke (echtesnlp-design, nhr-design).
   Alles darunter ist markenneutral und bleibt unverändert.
   =========================================================================== */
:root {
  --farbe-akzent:      #1f6feb;
  --farbe-akzent-text: #ffffff;
  --farbe-text:        #1a1d21;
  --farbe-text-leise:  #5b6470;
  --farbe-flaeche:     #ffffff;
  --farbe-grund:       #f5f6f8;
  --farbe-linie:       #dfe3e8;
  --farbe-warnung:     #b42318;
  --farbe-gut:         #127a4a;
  --radius:            10px;
  --schrift:           system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --farbe-text: #e8eaed; --farbe-text-leise: #9aa4b2;
    --farbe-flaeche: #1b1f24; --farbe-grund: #111418; --farbe-linie: #2c333b;
  }
}

/* ---------- Grundgerüst ---------- */
* { box-sizing: border-box; }
body {
  margin: 0; font-family: var(--schrift); color: var(--farbe-text);
  background: var(--farbe-grund); -webkit-text-size-adjust: 100%;
}
button {
  font: inherit; padding: 9px 16px; border: 0; border-radius: var(--radius);
  background: var(--farbe-akzent); color: var(--farbe-akzent-text); cursor: pointer;
}
button:disabled { opacity: .5; cursor: not-allowed; }
input {
  font: inherit; padding: 9px 12px; border: 1px solid var(--farbe-linie);
  border-radius: var(--radius); background: var(--farbe-flaeche); color: inherit; width: 100%;
}
.fehler { color: var(--farbe-warnung); }

/* ---------- Anmeldung ---------- */
.login {
  max-width: 340px; margin: 12vh auto; padding: 24px 16px;
  display: flex; flex-direction: column; gap: 14px;
}
.login h1 { font-size: 1.25rem; margin: 0 0 4px; }
.login label { display: flex; flex-direction: column; gap: 5px; font-size: .9rem; color: var(--farbe-text-leise); }

/* ---------- Umgebungsband (Testsystem) ----------
   Serverseitig eingefügt, damit es VOR dem Login steht. */
.umgebungsband {
  background: var(--farbe-warnung); color: #fff; text-align: center;
  padding: 7px 12px; font-weight: 600; font-size: .9rem; letter-spacing: .02em;
}
body[data-umgebung="test"] { outline: 3px solid var(--farbe-warnung); outline-offset: -3px; }