/* ============================================================
   DESIGN-TESTMODUS · „Warm & Redaktionell" (Vorschau 3)
   Wird NACH static/style.css geladen und überschreibt den Master.
   Aktivierung: /design-test/warm — Standard: /design-test/klassisch
   ============================================================ */

:root {
  /* Werte aus Vorschau 3 — überschreiben die --dm-* Tokens */
  --dm-blau:        #2c4434;  /* Kopf/Nav: tiefes Waldgrün */
  --dm-blau-hell:   #e7ede3;  /* helle Flächen: grün-graues Papier */
  --dm-gruen:       #2f6b42;  /* Positiv/Speichern */
  --dm-gruen-knz:   #c2603c;  /* Primär-CTA: Terrakotta */
  --dm-rot:         #b3402c;
  --dm-linie:       #d4c6a8;  /* sichtbare warme Tabellenlinien */
  --dm-hintergrund: #f7f2ea;  /* Papier-Creme */
  --dm-box:         #f0e8da;
  --dm-text:        #2c2318;
  --dm-text-grau:   #8d7c66;
  --dm-band-feiertag: #f9b46a;
  --dm-band-ferien:   #fbd08c;
  --dm-feiertag-spalte: #f9edd8;
  --warm-gold:      #c99a2e;
  --warm-gruen-tief:#24382c;
  --warm-akzent:    #c2603c;
  --warm-papier:    #f7f2ea;
  --warm-karte:     #fffdf8;
}

/* --- Schrift & Fläche --- */
body {
  background: var(--warm-papier) !important;
  color: var(--dm-text) !important;
}
h1, h2, h3, header h1, .monat-nav b, .score-karte b {
  font-family: Georgia, 'Times New Roman', serif !important;
  letter-spacing: -.2px;
}
header, nav.topbar {
  background: var(--warm-gruen-tief) !important;
  border-bottom: 3px solid var(--warm-gold);
}
nav a { color: #cfe0d2 !important; }
nav a.aktiv, nav a:hover { background: rgba(255,255,255,.14) !important; color:#fff !important; }

/* --- Buttons: Pillen, Terrakotta-Primär --- */
button, input[type=submit], .monat-nav a, .knopf, a.btn {
  border-radius: 999px !important;
  font-weight: 650;
  transition: background .15s ease, box-shadow .15s ease;
}
button:hover, input[type=submit]:hover { filter: brightness(1.05); }
button:not([class]), button.primaer, button.gruen, .btn-primar {
  background: var(--warm-akzent) !important;
  border-color: var(--warm-akzent) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(194,96,60,.25);
}
.monat-nav a { background: var(--warm-karte) !important; color: var(--warm-gruen-tief) !important; border: 1px solid var(--dm-linie); }
.monat-nav { background: var(--warm-karte) !important; border-bottom: 1px solid var(--dm-linie) !important; }
.monat-nav b { color: var(--warm-gruen-tief) !important; font-size: 1.2rem; }

/* --- Tabellen: warme Karte, sichtbares Gitter, Chip-Farben wie Vorschau 3 --- */
table.plan, table {
  background: var(--warm-karte) !important;
}
table.plan {
  border-collapse: separate !important;
  border-spacing: 3px !important;
  font-size: .82rem;
  border: 1px solid var(--dm-linie) !important;
  border-radius: 12px;
}
table.plan td, table.plan th {
  border: 1px solid var(--dm-linie) !important;
}
table.plan tr, table.plan tbody, table.plan thead, table.plan tfoot {
  border-color: var(--dm-linie) !important;
}
table.plan thead th {
  background: var(--warm-papier) !important;
  color: var(--dm-text) !important;
  border-bottom: 2px solid var(--warm-gruen-tief) !important;
  border-radius: 8px;
}
table.plan thead th.we { background: #efe6d6 !important; color: var(--dm-text) !important; }
table.plan th, table.plan td { height: 34px !important; }
table.plan td.name, table th, table td { color: var(--dm-text); }
table.plan td.name {
  background: var(--warm-karte) !important;
  border-right: 2px solid var(--warm-gruen-tief) !important;
  font-family: Georgia, serif;
  font-size: .82rem;
}
table.plan tr:not(.besatz) td.stat:nth-last-child(11),
table.plan tr:not(.besatz) th.stat:nth-last-child(11) { border-left: 2px solid var(--warm-gruen-tief) !important; }
table.plan tr:not(.besatz) td.stat:last-child,
table.plan tr:not(.besatz) th.stat:last-child { border-right: 2px solid var(--warm-gruen-tief) !important; }
th { background: var(--warm-papier) !important; }
td.we { background: #f4ece0 !important; }
td.feiertag { background: var(--dm-feiertag-spalte) !important; }

/* --- Schichtfarben: Pillen nur bei belegten Zellen --- */
.sch-F { background: #dceddc !important; color: #2f6b42 !important; }
.sch-T { background: #d9e7f4 !important; color: #2f5f8c !important; }
.sch-S { background: #f9e0cf !important; color: #b05a32 !important; }
.sch-N { background: #e4def4 !important; color: #5a4a8c !important; }
td.zelle.sch-F, td.zelle.sch-T, td.zelle.sch-S, td.zelle.sch-N,
td.zelle.typ-urlaub, td.zelle.typ-krank_au, td.zelle.typ-krank_ohne_au {
  border-radius: 8px !important;
  font-weight: 750;
  font-size: .85rem;
  border-color: transparent !important;
}
.typ-urlaub        { background: #d9e7c9 !important; color: #3d6b2f !important; font-weight: 800 !important; }
.typ-krank_au      { background: #f3c4b8 !important; color: #8c2f1e !important; font-weight: 800 !important; }
.typ-krank_ohne_au { background: #f8ddd4 !important; color: #8c2f1e !important; font-weight: 800 !important; }
.band-feiertag { background: var(--dm-band-feiertag) !important; }
.band-ferien   { background: var(--dm-band-ferien) !important; }
table.plan tr.band2 th.is-feiertag { background: var(--dm-band-feiertag) !important; }
table.plan tr.band2 th.is-ferien   { background: var(--dm-band-ferien) !important; }

/* --- Boxen, Karten, Statusleisten --- */
.freigabe-leiste {
  background: var(--warm-karte) !important;
  border-bottom: 1px solid var(--dm-linie) !important;
}
.score-karte {
  background: #eaf1e6 !important;
  border-color: #cdd9c4 !important;
  color: var(--warm-gruen-tief) !important;
  border-radius: 14px !important;
}
.sprung-pool {
  background: #f6ead8 !important;
  border-color: #e0cba4 !important;
  color: #6b5310 !important;
  border-radius: 14px !important;
}
.kasten, .box, .hinweisbox {
  background: var(--warm-karte) !important;
  border: 1px solid var(--dm-linie) !important;
  border-radius: 14px !important;
}
select, input[type=text], input[type=date], input[type=password], input[type=email], textarea {
  border: 1px solid var(--dm-linie) !important;
  border-radius: 10px !important;
  background: var(--warm-karte) !important;
}

/* --- Status-Pillen --- */
.pille, .badge {
  border-radius: 999px !important;
  padding: 3px 12px !important;
  font-weight: 700 !important;
}

/* --- Design-Test-Banner --- */
#design-test-hinweis {
  position: sticky; top: 0; z-index: 9999;
  background: var(--warm-gruen-tief); color: #f7f2ea;
  border-bottom: 2px solid var(--warm-gold);
  padding: 7px 14px; text-align: center;
  font: 600 13px system-ui, sans-serif;
}
#design-test-hinweis a { color: var(--warm-gold); font-weight: 800; text-decoration: underline; }