/*
 * Design der Reinigungsapp (lange-material, Design-System 10u/10ax) fuer das
 * Mail-Dashboard, seit 27.09.2026. Nur Aussehen, keine Funktion: Diese
 * Datei wird NACH dem Stil in base.html geladen und ueberschreibt ihn.
 *
 * Schrift: Lato, selbst ausgeliefert (static/schrift, Lizenz SIL OFL 1.1,
 * dieselben Dateien, die next/font fuer die App gebaut hat). Keine Anfrage
 * an Google.
 */
@font-face { font-family: Lato; font-style: normal; font-weight: 400; font-display: swap;
  src: url(/static/schrift/lato-400.woff2) format("woff2"); }
@font-face { font-family: Lato; font-style: normal; font-weight: 700; font-display: swap;
  src: url(/static/schrift/lato-700.woff2) format("woff2"); }
@font-face { font-family: Lato; font-style: normal; font-weight: 900; font-display: swap;
  src: url(/static/schrift/lato-900.woff2) format("woff2"); }

:root {
  /* Werte wie in src/app/globals.css der App */
  --blau: #103878;
  --blau-70: #4a6aa0;
  --blau-15: #e3e8f1;
  --blau-dunkel: #0c2c5e;
  --anthrazit: #231f20;
  --hellgrau: #f2f4f7;
  --mittelgrau: #5f656e;   /* App: grau-text – lesbarer als grau-mittel */
  --rot: #8e2c2c;
  --orange: #8a5a12;
  --gruen: #1f6b45;
  --akzent: #0b6b7f;
  --leitgelb: #f2c230;
  --linie: #d5dae1;
}

body { font-family: Lato, Arial, Helvetica, sans-serif; font-size: 16px; }

header { border-bottom: 4px solid var(--leitgelb); }
header nav a { font-weight: 700; }

h1 { font-size: 1.75rem; font-weight: 900; }
h2 { font-size: 1.25rem; font-weight: 700; }

.karte { border-color: var(--linie); border-radius: 0.75rem; }
table { border-radius: 0.75rem; overflow: hidden; }
th { font-size: 14px; }
th, td { border-bottom-color: var(--linie); }

label { font-size: 14px; color: var(--mittelgrau); font-weight: 700; }
select, input[type=text], input[type=password], input[type=search], textarea {
  font-size: 16px; border: 2px solid var(--blau-70); border-radius: 0.5rem; padding: 9px 10px;
}

button { font-size: 16px; border-radius: 0.5rem; padding: 11px 18px; }
button:active { background: var(--blau-dunkel); }
button.sekundaer { border-width: 2px; }
button.sekundaer:active { background: var(--blau-15); }

.p1 { background: #f7e4e4; color: var(--rot); }
.p2 { background: #fbf0dc; color: var(--orange); }
.warnbox { background: #f7e4e4; }
.okbox { background: #e4f0ea; }
.hinweis { font-size: 14px; color: var(--mittelgrau); }

/* Fokusring der App: innen weiss, aussen blau - auf jedem Grund sichtbar. */
:focus-visible {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--blau);
}