/* ZWT Backstage — gemeinsames Layout */
:root {
  --bg: #f6f5f2;
  --flaeche: #ffffff;
  --text: #1d1d1f;
  --gedaempft: #6b6b70;
  --linie: #dedcd6;
  --akzent: #7a1f3d;       /* Bordeaux */
  --akzent-hell: #f4e7ec;
  --ok: #1d7a46;
  --warn: #a35c00;
  --fehler: #b3261e;
  --radius: 8px;
  --menu-0: #b3413b;
  --menu-1: #2f6db3;
  --menu-2: #3f8a3a;
  --menu-3: #8a5bb3;
  --menu-4: #b38a2f;
  --menu-5: #2f9aa0;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 15px;
  color: var(--text);
  background: var(--bg);
  line-height: 1.4;
}
a { color: var(--akzent); }
button, input, select, textarea { font: inherit; color: inherit; }
button {
  cursor: pointer;
  border: 1px solid var(--linie);
  background: var(--flaeche);
  border-radius: 6px;
  padding: 0.35rem 0.75rem;
}
button:hover { border-color: #b9b6ad; }
button.primaer { background: var(--akzent); border-color: var(--akzent); color: #fff; }
button.primaer:hover { filter: brightness(1.1); }
button.gefahr { color: var(--fehler); }
button.klein { padding: 0.15rem 0.45rem; font-size: 0.85rem; }
button:disabled { opacity: 0.5; cursor: default; }
input[type=text], input[type=password], input[type=date], input[type=time], input[type=number], input[type=search], input[type=email], select, textarea {
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: 0.3rem 0.45rem;
  background: #fff;
  min-width: 0;
}
input:focus, select:focus, textarea:focus, button:focus-visible { outline: 2px solid var(--akzent); outline-offset: 1px; }

.kopf {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  padding: 0.6rem 1rem; background: var(--flaeche); border-bottom: 1px solid var(--linie);
  position: sticky; top: 0; z-index: 50;
}
.kopf .marke { font-weight: 700; letter-spacing: 0.02em; text-decoration: none; color: var(--text); display: inline-flex; align-items: center; gap: 0.1rem; }
.kopf .marke img { display: block; margin-right: 0.4rem; }
.kopf .marke .marke-text { color: var(--text); white-space: pre; }
.kopf .marke .marke-text span { color: var(--akzent); }
.kopf .marke span { color: var(--akzent); }
.kopf nav { display: flex; gap: 0.9rem; flex-wrap: wrap; }
.kopf nav a { text-decoration: none; color: var(--gedaempft); }
.kopf nav a.aktiv, .kopf nav a:hover { color: var(--text); }
.kopf .rechts { margin-left: auto; display: flex; gap: 0.5rem; align-items: center; color: var(--gedaempft); font-size: 0.9rem; }

main { max-width: 1200px; margin: 0 auto; padding: 1rem; }
h1 { font-size: 1.35rem; margin: 0.2rem 0 0.8rem; }
h2 { font-size: 1.1rem; margin: 1.2rem 0 0.6rem; }
h3 { font-size: 1rem; margin: 0.8rem 0 0.4rem; }
.gedaempft { color: var(--gedaempft); }
.klein-text { font-size: 0.85rem; }

.karte { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 1rem; }
.zeile { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.spalten { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
label.feld { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.85rem; color: var(--gedaempft); }
label.feld > input, label.feld > select, label.feld > textarea { color: var(--text); font-size: 0.95rem; }

#meldung { position: fixed; bottom: 1rem; left: 50%; transform: translateX(-50%); z-index: 200; max-width: 90vw; }
#meldung div { padding: 0.55rem 1rem; border-radius: 6px; color: #fff; background: #333; box-shadow: 0 4px 16px rgba(0,0,0,0.2); }
#meldung div.fehler { background: var(--fehler); }
#meldung div.ok { background: var(--ok); }

table.liste { width: 100%; border-collapse: collapse; background: var(--flaeche); }
table.liste th, table.liste td { padding: 0.35rem 0.45rem; border-bottom: 1px solid var(--linie); text-align: left; vertical-align: middle; }
table.liste th { font-size: 0.8rem; color: var(--gedaempft); font-weight: 600; background: #faf9f6; position: sticky; top: 0; z-index: 4; }
/* Die Kopfzeile klebt unter der Navigation, damit die Spaltenbezeichnungen beim Scrollen
   sichtbar bleiben (Rafi 18.09.2026). Beim Drucken wieder normal. */
@media print { table.liste th { position: static; } }
table.liste tr.storniert td { color: var(--gedaempft); text-decoration: line-through; }
table.liste tr.storniert td.aktionen, table.liste tr.storniert td.aktionen * { text-decoration: none; }
table.liste td input[type=text], table.liste td select { width: 100%; }
/* Die Tabelle scrollt in ihrem eigenen Fenster — so bleiben die Spaltenbezeichnungen oben
   und die klebenden Spalten links/rechts stehen (Rafi 18.09.2026). */
.tabelle-scroll {
  overflow: auto; max-height: calc(100vh - 9rem); border: 1px solid var(--linie); border-radius: var(--radius);
  /* Platz unter der letzten Zeile: sonst liegt der waagrechte Scrollbalken auf der Totalzeile */
  padding-bottom: 0.9rem; scrollbar-gutter: stable;
}
/* Die Totalzeile bleibt beim Scrollen unten stehen, oberhalb des Scrollbalkens */
.tabelle-scroll table.fin tr.fin-total td {
  position: sticky; bottom: 0; z-index: 2; background: #faf7f2;
  box-shadow: 0 -6px 6px -6px rgba(0, 0, 0, 0.22);
}
.tabelle-scroll table.fin tr.fin-total td.fin-fix { z-index: 4; }
@media print {
  .tabelle-scroll { padding-bottom: 0; }
  .tabelle-scroll table.fin tr.fin-total td { position: static; box-shadow: none; }
}
@media print { .tabelle-scroll { overflow: visible; max-height: none; } }

.badge { display: inline-block; font-size: 0.72rem; padding: 0.05rem 0.4rem; border-radius: 999px; background: #eee; color: #444; white-space: nowrap; vertical-align: middle; }
.badge.hz { background: #e8eef8; color: #2f4f86; }
.badge.warn { background: #fff1dc; color: var(--warn); }
.badge.storno { background: #fde8e6; color: var(--fehler); }
.badge.ok { background: #e3f3e9; color: var(--ok); }
.menu-punkt { display: inline-block; width: 0.65rem; height: 0.65rem; border-radius: 50%; vertical-align: middle; margin-right: 0.25rem; background: #bbb; }

.reiter { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--linie); margin-bottom: 1rem; overflow-x: auto; }
.reiter button { border: none; border-bottom: 3px solid transparent; border-radius: 0; background: none; padding: 0.5rem 0.8rem; color: var(--gedaempft); white-space: nowrap; }
.reiter button.aktiv { color: var(--text); border-bottom-color: var(--akzent); font-weight: 600; }

.kennzahlen { display: flex; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 0.8rem; }
.kennzahl { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 0.45rem 0.75rem; min-width: 7rem; }
.kennzahl .wert { font-size: 1.35rem; font-weight: 700; }
.kennzahl .titel { font-size: 0.78rem; color: var(--gedaempft); }
.kennzahl.warn .wert { color: var(--warn); }

/* Tischplan */
.tischplan { display: grid; grid-template-columns: 260px 1fr; gap: 1rem; align-items: start; }
@media (max-width: 760px) {
  .tischplan { grid-template-columns: 1fr; }
  .ohne-tisch { position: static; max-height: 45vh; }
  .kennzahl { min-width: 5.5rem; padding: 0.35rem 0.55rem; }
  .kennzahl .wert { font-size: 1.1rem; }
}
.ohne-tisch { position: sticky; top: 3.6rem; max-height: calc(100vh - 5rem); overflow-y: auto; }
.tische { display: grid; gap: 0.8rem; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.tisch { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 0.55rem; min-height: 6rem; }
.tisch.voll { border-color: #c9c3b3; }
.tisch.ueberbucht { border-color: var(--fehler); box-shadow: inset 0 0 0 1px var(--fehler); }
.tisch.ziel, .ohne-tisch.ziel { background: var(--akzent-hell); border-color: var(--akzent); }
.tisch-kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 0.4rem; margin-bottom: 0.35rem; }
.tisch-kopf strong { font-size: 1rem; }
.tisch-kopf .belegung { font-size: 0.85rem; color: var(--gedaempft); }
.tisch.ueberbucht .belegung { color: var(--fehler); font-weight: 700; }
.tisch-menues { font-size: 0.75rem; color: var(--gedaempft); margin-bottom: 0.3rem; }
.chip {
  display: flex; align-items: center; gap: 0.3rem; padding: 0.2rem 0.35rem; margin: 0.15rem 0;
  border: 1px solid var(--linie); border-radius: 6px; background: #fcfbf9; font-size: 0.88rem; cursor: grab; user-select: none;
}
.chip.gewaehlt { border-color: var(--akzent); background: var(--akzent-hell); box-shadow: 0 0 0 1px var(--akzent); }
.chip .name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chip .funktion { font-size: 0.7rem; color: var(--gedaempft); }
.chip .hinweis { color: var(--warn); font-size: 0.8rem; }
.chip button.weg { border: none; background: none; padding: 0 0.2rem; color: var(--gedaempft); }
.auswahl-hinweis { background: var(--akzent-hell); border: 1px solid var(--akzent); border-radius: 6px; padding: 0.35rem 0.6rem; margin-bottom: 0.6rem; font-size: 0.9rem; }

.import-ergebnis ul { margin: 0.2rem 0 0.6rem; padding-left: 1.2rem; }
.import-ergebnis li { margin: 0.1rem 0; }

.login-box { max-width: 22rem; margin: 12vh auto; }
.login-box h1 { text-align: center; }

.anlass-liste { display: grid; gap: 0.7rem; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.anlass-karte { text-decoration: none; color: inherit; display: block; }
.anlass-karte:hover { border-color: var(--akzent); }

/* Druck */
#druckbereich { display: none; }
@media print {
  body { background: #fff; font-size: 11pt; }
  body > *:not(#druckbereich) { display: none !important; }
  #druckbereich { display: block; }
  .druck-tische { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8pt; }
  .druck-tisch { border: 1px solid #999; padding: 6pt; break-inside: avoid; }
  .druck-tisch h3 { margin: 0 0 4pt; font-size: 12pt; }
  .druck-tisch ul { margin: 0; padding-left: 12pt; }
  table.druck { width: 100%; border-collapse: collapse; }
  table.druck th, table.druck td { border-bottom: 1px solid #ccc; padding: 2pt 4pt; text-align: left; }
  h1 { font-size: 15pt; }
}

/* Runde 2 */
select.menu-offen { background: #fff1dc; border-color: #d9a441; }
.menu-punkt.offen { background: transparent !important; border: 1.5px dashed var(--warn); box-sizing: border-box; }
.badge.offen { background: #fff1dc; color: var(--warn); }
.badge.schedule { background: #efe8f6; color: #5a3d80; }
.gruppen-wahl { display: flex; gap: 0.9rem; flex-wrap: wrap; align-items: center; }
.gruppen-wahl label { white-space: nowrap; }
.abschnitt { margin-top: 1rem; }
.datenblatt-kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.formular-raster { display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); align-items: end; }
.formular-raster .breit { grid-column: 1 / -1; }
textarea { width: 100%; min-height: 4rem; resize: vertical; }
a.name-link { color: var(--text); text-decoration: none; }
a.name-link:hover { text-decoration: underline; color: var(--akzent); }
.hotel-karte { margin-bottom: 1rem; }
.hotel-karte summary { cursor: pointer; list-style: none; }
.hotel-karte summary::-webkit-details-marker { display: none; }
@media print {
  .druck-datenblatt h2 { font-size: 12pt; margin: 10pt 0 4pt; }
  .druck-datenblatt dl { display: grid; grid-template-columns: 9rem 1fr; gap: 2pt 8pt; margin: 0; }
  .druck-datenblatt dt { color: #555; }
  .druck-datenblatt dd { margin: 0; }
  .druck-seite { break-after: page; }
}

/* Runde 3 */
tr.klickbar { cursor: pointer; }
tr.klickbar:hover td { background: var(--akzent-hell); }
table.zimmerliste td { white-space: nowrap; }
table.zimmerliste input[type=text], table.zimmerliste input[type=number] { width: 100%; min-width: 4.5rem; }
table.zimmerliste input.breit { min-width: 11rem; }
table.zimmerliste td.zahl, table.zimmerliste th.zahl { text-align: right; }
table.zimmerliste tr.total td { font-weight: 700; background: #faf9f6; }
.ueberbucht-text { color: var(--fehler); font-weight: 700; }

/* Mehrfachauswahl Instrument / Aufgabe */
.feld.breit { grid-column: 1 / -1; }
div.feld { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.85rem; color: var(--gedaempft); }
.mehrfachwahl { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; color: var(--text); font-size: 0.95rem; }
.chip-wert { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.15rem 0.2rem 0.15rem 0.55rem; border-radius: 999px; background: var(--akzent-hell); border: 1px solid #e3c9d3; }
.chip-wert button { border: none; background: none; padding: 0 0.35rem; font-size: 1rem; line-height: 1; color: var(--gedaempft); }
.chip-wert button:hover { color: var(--fehler); }

/* Runde 5: Sponsoring pro Nacht, Belegungsplan */
.naechte-chips { display: flex; flex-wrap: wrap; gap: 0.3rem; margin-top: 0.3rem; }
.nacht { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.8rem; padding: 0.15rem 0.5rem; border-radius: 999px; border: 1px solid var(--linie); background: #fff; white-space: nowrap; }
.nacht.g, .zelle.g { background: #e3f3e8; border-color: #9fd0ae; color: #145c33; }
.nacht.z, .zelle.z { background: #fff1dc; border-color: #efc98f; color: #7a4600; }
.nacht input { margin: 0; }
.legende { display: inline-flex; gap: 0.4rem; align-items: center; font-size: 0.8rem; }
table.belegung { border-collapse: collapse; font-size: 0.82rem; }
table.belegung th, table.belegung td { border: 1px solid var(--linie); padding: 0.2rem 0.35rem; text-align: center; white-space: nowrap; }
table.belegung th.name, table.belegung td.name { text-align: left; position: sticky; left: 0; background: var(--flaeche); z-index: 1; }
table.belegung th.ausserhalb { background: #f0efeb; color: var(--gedaempft); font-weight: 400; }
table.belegung td.zelle { min-width: 2.2rem; font-weight: 600; }
table.belegung td.zelle.klickbar { cursor: pointer; }
table.belegung td.zelle.klickbar:hover { outline: 2px solid var(--akzent); outline-offset: -2px; }
table.belegung tr.fuss td { background: #faf9f6; font-weight: 600; }
table.belegung td.voll { color: var(--ok); }
table.belegung td.frei { color: var(--gedaempft); }
.mini-belegung { display: inline-flex; gap: 1px; vertical-align: middle; }
.mini-belegung span { width: 9px; height: 16px; border-radius: 2px; background: #e6e4de; }
.mini-belegung span.teil { background: #9fd0ae; }
.mini-belegung span.voll { background: #1d7a46; }
.mini-belegung span.ueber { background: var(--fehler); }
.mini-belegung span.nur-z { background: #efc98f; }
table.liste td.zahl, table.liste th.zahl { text-align: right; }
a.button { display: inline-block; text-decoration: none; color: var(--text); border: 1px solid var(--linie); background: var(--flaeche); border-radius: 6px; padding: 0.35rem 0.75rem; }
a.button:hover { border-color: #b9b6ad; }
table.liste input.klein-feld { width: 100%; min-width: 7rem; }
/* Allergien / Präferenzen bei Anlässen */
.allergie { display: inline-block; font-size: 0.82rem; padding: 0.1rem 0.45rem; border-radius: 6px; background: #fde8e6; color: #8a1c15; line-height: 1.3; }
.chip .hinweis.allergie-zeichen { color: var(--fehler); }
/* Duplikate zusammenführen */
table.vergleich th:first-child { text-align: left; white-space: nowrap; }
table.vergleich td { vertical-align: top; min-width: 12rem; }
table.vergleich input[type=text], table.vergleich select, table.vergleich textarea { width: 100%; min-width: 12rem; }
table.vergleich tr.unterschied > th:first-child { color: var(--akzent); }
label.wahl { display: flex; gap: 0.35rem; align-items: flex-start; cursor: pointer; padding: 0.1rem 0; }
label.wahl input { margin-top: 0.2rem; }
tr.aktiv-zeile td { background: var(--akzent-hell); }
@media (max-width: 700px) {
  table.vergleich, table.vergleich tbody, table.vergleich tr, table.vergleich td, table.vergleich th { display: block; width: 100%; }
  table.vergleich thead { display: none; }
  table.vergleich tr { border-bottom: 1px solid var(--linie); padding: 0.35rem 0; }
  table.vergleich td { min-width: 0; border: none; padding: 0.2rem 0.5rem; }
  table.vergleich td[data-label]::before { content: attr(data-label); display: block; font-size: 0.72rem; color: var(--gedaempft); }
  .tabelle-scroll:has(table.vergleich) { overflow-x: visible; }
}
tr.angekreuzt td { background: #f3f9f5; }
/* Verlauf */
table.verlauf td { vertical-align: top; }
table.verlauf tr.gruppe-start td { border-top: 2px solid var(--linie); }
.aenderung-felder { font-size: 0.85rem; display: grid; gap: 0.1rem; }
.aenderung-felder del { color: var(--gedaempft); }
nav a.extern { color: var(--gedaempft); }

/* Importe & Duplikate nur am Computer (Runde 16) */
@media (max-width: 760px) { .nur-desktop { display: none !important; } }

/* iOS: Eingabefelder mit mind. 16px, sonst zoomt Safari/Chrome beim Antippen (stört auch das Ausfüllen) */
@media (max-width: 760px) { input, select, textarea { font-size: 16px !important; } }

/* Infomail */
.infomail-raster { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0.8rem; margin-top: 0.8rem; }
.infomail-raster textarea { width: 100%; box-sizing: border-box; }
@media (max-width: 900px) { .infomail-raster { grid-template-columns: 1fr; } }
.mail-vorschau { border-top: 1px solid var(--linie); padding-top: 0.8rem; overflow-wrap: anywhere; }
dialog.dialog-breit { border: 1px solid var(--linie); border-radius: var(--radius); padding: 1rem; }

/* Menü mit Untermenüs */
.kopf nav { align-items: center; }
.nav-gruppe { position: relative; }
.nav-knopf { background: none; border: none; padding: 0; font: inherit; color: var(--gedaempft); cursor: pointer; display: inline-flex; align-items: center; gap: 0.2rem; }
.nav-knopf:hover, .nav-knopf.aktiv, .nav-gruppe.offen .nav-knopf { color: var(--text); }
.nav-pfeil { font-size: 0.75em; }
.nav-menue { display: none; position: absolute; top: calc(100% + 0.45rem); left: -0.6rem; min-width: 12rem; background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); box-shadow: 0 6px 18px rgba(0,0,0,0.08); padding: 0.3rem 0; z-index: 60; }
.nav-gruppe.offen > .nav-menue { display: block; }
@media (hover: hover) { .nav-gruppe:hover > .nav-menue { display: block; } .nav-gruppe:hover > .nav-menue::before { content: ''; position: absolute; left: 0; right: 0; top: -0.5rem; height: 0.5rem; } }
/* Zweite Ebene: klappt seitlich auf (Finanzen -> Aufwand -> Gagen …) */
.nav-menue .nav-gruppe.nav-unter { position: relative; display: block; }
.nav-menue .nav-gruppe.nav-unter > .nav-knopf { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.4rem 0.9rem; text-align: left; font: inherit; border: none; background: none; color: var(--gedaempft); }
.nav-menue .nav-gruppe.nav-unter > .nav-knopf:hover, .nav-menue .nav-gruppe.nav-unter:hover > .nav-knopf { background: var(--akzent-hell); color: var(--text); }
.nav-menue .nav-gruppe.nav-unter > .nav-menue { top: -0.3rem; left: 100%; }
@media (hover: hover) { .nav-menue .nav-gruppe.nav-unter:hover > .nav-menue::before { left: -0.4rem; right: auto; top: 0; bottom: 0; width: 0.4rem; height: auto; } }
/* Budgetgruppe als Zwischenüberschrift, darunter eingerückt die Seiten */
.nav-menue a.nav-titel { padding: 0.5rem 0.9rem 0.15rem; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; color: var(--gedaempft); }
.nav-menue a.nav-titel:first-child { padding-top: 0.2rem; }
.kopf nav .nav-menue a.nav-titel:hover, .fin-reiter .nav-menue a.nav-titel:hover { background: none; color: var(--text); text-decoration: underline; }
.nav-menue a.nav-untereintrag { padding-left: 1.4rem; }
.kopf nav .nav-menue a { display: block; padding: 0.4rem 0.9rem; white-space: nowrap; }
.kopf nav .nav-menue a:hover { background: var(--akzent-hell); }
.kopf nav .nav-menue a.aktiv { color: var(--text); font-weight: 600; }
@media print { .nav-menue { display: none !important; } }

/* Datenblatt-Reiter */
.reiter button.ungespeichert::after { content: ' •'; color: var(--warn); }
@media print { .reiter { display: none; } }

/* Gruppenzeile in Listen (z.B. Konzert) */
table.liste tr.tag-kopf td { background: var(--akzent-hell); padding-top: 0.45rem; padding-bottom: 0.35rem; }
.ipad-zahl { color: #1f5fa8; font-weight: 600; }

/* Notenständer-Plan */
.tag-plan-raster { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 1rem; align-items: start; }
@media (max-width: 800px) { .tag-plan-raster { grid-template-columns: 1fr; } }
ul.umstellen { margin: 0.2rem 0 0; padding-left: 1.1rem; }
ul.umstellen li { margin: 0.15rem 0; }
@media print { .tag-plan { break-inside: avoid; } details { display: block; } }
ul.regel-rueckmeldung { list-style: none; margin: 0.3rem 0 0; padding: 0; font-size: 0.85rem; }
ul.regel-rueckmeldung li { display: flex; gap: 0.4rem; margin: 0.1rem 0; color: var(--gedaempft, #666); }
ul.regel-rueckmeldung li .regel-zeichen { color: var(--ok, #2e7d32); font-weight: 700; width: 1em; }
ul.regel-rueckmeldung li.fehlt, ul.regel-rueckmeldung li.fehlt .regel-zeichen { color: var(--fehler, #b00020); }
@media print { #inhalt > form { display: none; } }
table.liste tr.ausgewaehlt td { background: var(--akzent-hell, #f6e9ee); }
.zeile > button.aktiv { border-color: var(--akzent); color: var(--akzent); font-weight: 600; }
/* Finanzen (Runde 30) */
.fin-reiter a.fin-reiter-link { padding: 0.5rem 0.8rem; color: var(--gedaempft); text-decoration: none; border-bottom: 3px solid transparent; white-space: nowrap; }
.fin-reiter a.fin-reiter-link.aktiv { color: var(--text); border-bottom-color: var(--akzent); font-weight: 600; }
input.fin-zelle { width: 100%; min-width: 6.5rem; text-align: right; font-variant-numeric: tabular-nums; border-color: transparent; background: transparent; padding: 0.2rem 0.35rem; }
input.fin-zelle:hover { border-color: var(--linie); }
input.fin-zelle:focus { text-align: left; border-color: var(--akzent); background: #fff; }
input.fin-zelle.formel { color: #2f4f86; }
input.fin-zelle.automatisch { color: var(--gedaempft); font-style: italic; }
input.fin-zelle.fehler { color: var(--fehler); border-color: var(--fehler); }
input.fin-zelle.text { text-align: left; color: var(--gedaempft); }
table.fin td, table.fin th { padding: 0.15rem 0.35rem; }
table.fin td.zahl, table.fin th.zahl { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.fin tr.fin-gruppe td { background: #f4f1ec; font-weight: 700; padding-top: 0.45rem; }
table.fin tr.fin-summe td { font-weight: 700; border-top: 1px solid var(--linie); }
table.fin tr.fin-total td { font-weight: 800; border-top: 2px solid var(--text); background: #faf7f2; }
table.fin tr.fin-seite td { font-size: 1.05rem; font-weight: 800; padding-top: 0.9rem; border-bottom: 2px solid var(--akzent); }
table.fin td input[type=text].fin-name { width: 100%; border-color: transparent; background: transparent; padding: 0.2rem 0.3rem; min-width: 12rem; }
table.fin td input[type=text].fin-name:hover { border-color: var(--linie); }
table.fin td input[type=text].fin-name:focus { border-color: var(--akzent); background: #fff; }
.fin-knopf { padding: 0.05rem 0.35rem; min-width: 1.6rem; }
.fin-aktionen { white-space: nowrap; opacity: 0.55; }
.fin-fix .fin-aktionen { display: flex; gap: 0.15rem; align-items: center; margin-top: 0.15rem; }
/* Erste Spalte (Name) bleibt beim seitlichen Scrollen stehen */
.tabelle-scroll table.fin th.fin-fix, .tabelle-scroll table.fin td.fin-fix {
  position: sticky; left: 0; z-index: 3; background: var(--flaeche);
  box-shadow: 8px 0 8px -8px rgba(0, 0, 0, 0.18);
}
.tabelle-scroll table.fin th.fin-fix { z-index: 5; }
.tabelle-scroll table.fin tr.fin-gruppe td.fin-fix { background: #f4f1ec; }
.tabelle-scroll table.fin tr.fin-total td.fin-fix { background: #faf7f2; }
@media print { .tabelle-scroll table.fin th.fin-fix, .tabelle-scroll table.fin td.fin-fix { position: static; box-shadow: none; } }


tr:hover .fin-aktionen, .fin-aktionen:focus-within { opacity: 1; }
.fin-vorschlaege { position: absolute; z-index: 50; background: #fff; border: 1px solid var(--linie); border-radius: 6px; box-shadow: 0 6px 18px rgba(0,0,0,0.12); max-height: 16rem; overflow-y: auto; font-size: 0.85rem; min-width: 14rem; }
.fin-vorschlag { padding: 0.25rem 0.55rem; cursor: pointer; white-space: nowrap; }
.fin-vorschlag.aktiv, .fin-vorschlag:hover { background: var(--akzent-hell, #f6e9ee); }
.fin-negativ { color: var(--fehler); }
@media print {
  .nicht-drucken, .fin-reiter, .fin-aktionen, .fin-neu { display: none !important; }
  input.fin-zelle, table.fin td input[type=text].fin-name { border: none; }
}
.fin-blatt { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; align-items: start; }
@media (max-width: 800px) { .fin-blatt { grid-template-columns: 1fr; } }
@media print { .fin-blatt { grid-template-columns: 1fr 1fr; gap: 0.8rem; font-size: 0.85rem; } }
main:has(.fin-reiter) { max-width: none; }

/* Finanzseiten: oben so wenig Platz wie moeglich, damit viel fuer die Listen bleibt
   (Rafi 26.09.2026). Reiter, Jahr und Drucken in einer Zeile, Kennzahlen einzeilig. */
.nur-drucken { display: none; }
@media print { .nur-drucken { display: block; } }
.fin-reiter { align-items: flex-end; overflow-x: visible; margin-bottom: 0.4rem; }
/* Die Reiterzeile ist seit Runde 75 kurz (Budget · Aufwand · Ertrag · Rechnungen · Kontenplan),
   darum kein eigener Scrollbereich mehr -- der wuerde die Klappmenues abschneiden. */
.fin-reiter-tabs { display: flex; gap: 0.25rem; flex-wrap: wrap; min-width: 0; }
.fin-reiter button.fin-reiter-link { border: none; border-bottom: 3px solid transparent; border-radius: 0; background: none; padding: 0.5rem 0.8rem; color: var(--gedaempft); white-space: nowrap; font: inherit; cursor: pointer; }
.fin-reiter button.fin-reiter-link:hover { color: var(--text); }
.fin-reiter button.fin-reiter-link.aktiv { color: var(--text); border-bottom-color: var(--akzent); font-weight: 600; }
.fin-reiter .nav-gruppe { display: flex; }
.fin-reiter .nav-menue { left: 0; }
.fin-reiter .nav-menue a { display: block; padding: 0.35rem 0.9rem; white-space: nowrap; text-decoration: none; color: var(--gedaempft); border: none; }
.fin-reiter .nav-menue a:hover { background: var(--akzent-hell); color: var(--text); }
.fin-reiter .nav-menue a.aktiv { color: var(--text); font-weight: 600; }
.fin-reiter .nav-menue a.nav-untereintrag { padding-left: 1.4rem; }
/* Budget: die Gruppe, auf die ein Menülink zeigt, hervorheben */
.tabelle-scroll table.fin tr.fin-gruppe:target td,
.tabelle-scroll table.fin tr.fin-gruppe:target td.fin-fix { background: var(--akzent-hell); }
.fin-reiter-rechts { display: flex; gap: 0.4rem; align-items: center; margin-left: auto; padding: 0 0 0.25rem 0.8rem; }
.fin-reiter-rechts select { font-size: 0.85rem; padding: 0.1rem 0.2rem; }
main:has(.fin-reiter) .kennzahlen { gap: 0.3rem; margin-bottom: 0.4rem; }
main:has(.fin-reiter) .kennzahl { display: flex; align-items: baseline; gap: 0.35rem; padding: 0.1rem 0.5rem; min-width: 0; }
main:has(.fin-reiter) .kennzahl .wert { font-size: 1rem; }
main:has(.fin-reiter) .kennzahl .titel { font-size: 0.78rem; white-space: nowrap; }
main:has(.fin-reiter) h2 { font-size: 1.05rem; margin: 0.1rem 0 0.3rem; }
/* Werkzeugzeilen (Filter, Knoepfe) dichter -- die Seiten setzen dort eigene Abstaende */
main:has(.fin-reiter) > #inhalt > .zeile { margin-bottom: 0.4rem !important; row-gap: 0.3rem; }
main:has(.fin-reiter) > #inhalt > p.klein-text { margin: 0.15rem 0 0.4rem; }
main:has(.fin-reiter) { padding-top: 0.5rem; }
main:has(.fin-reiter) > #inhalt > details.karte { padding: 0.35rem 0.7rem; }
main:has(.fin-reiter) > #inhalt > details.karte[open] { padding: 0.6rem 0.9rem 0.8rem; }
table.fin td select { width: auto; min-width: 4.8rem; max-width: 16rem; }
table.fin td input[type=date] { width: 9.5rem; }
tr.fin-offen td { background: #fffaf2; }

/* Badges / Welcome Packages abgeben: auf dem Handy als Karten, Knopf zuoberst links */
@media (max-width: 760px) {
  .tabelle-scroll:has(table.ausgabe) { overflow-x: visible; }
  table.ausgabe, table.ausgabe tbody, table.ausgabe tr, table.ausgabe td { display: block; width: auto; }
  table.ausgabe thead { display: none; }
  table.ausgabe tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.1rem 0.7rem; padding: 0.5rem 0.2rem; border-bottom: 1px solid var(--linie); }
  table.ausgabe td { border: none; padding: 0.1rem 0; min-width: 0; }
  table.ausgabe td.ausgabe-aktion { order: -2; width: 100%; display: flex; gap: 0.4rem; flex-wrap: wrap; }
  table.ausgabe td.ausgabe-aktion button { flex: 0 0 auto; }
  table.ausgabe td.ausgabe-name { order: -1; font-weight: 600; }
  table.ausgabe td[data-label]::before { content: attr(data-label) ' '; color: var(--gedaempft); font-size: 0.72rem; }
  table.ausgabe td:empty { display: none; }
}

/* Vertragsvorlage und Vertragsvorschau (Runde 33) */
dl.vertrag-platzhalter { display: grid; grid-template-columns: auto 1fr; gap: 0.1rem 0.6rem; margin: 0; font-size: 0.82rem; }
dl.vertrag-platzhalter dt { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--akzent); white-space: nowrap; }
dl.vertrag-platzhalter dd { margin: 0; color: var(--gedaempft); }
.vertrag-vorschau { max-height: 70vh; overflow-y: auto; border-top: 1px solid var(--linie); margin-top: 0.5rem; padding-top: 0.5rem; font-size: 0.9rem; }
.vertrag-vorschau h4 { font-size: 0.95rem; }

/* Anlass: Übersicht Gäste und Menüs nach Besucher:innen und übrigen (Rafi 21.09.2026) */
.anlass-uebersicht { padding-bottom: 0; }
.anlass-uebersicht table.liste td, .anlass-uebersicht table.liste th { padding: 0.3rem 0.6rem; }
.anlass-uebersicht tr.anlass-total td { font-weight: 700; background: #faf7f2; }
.warn-text { color: var(--warn, #8a6d00); font-weight: 600; }

/* Runde 49: Hotel mit freien gesponserten Nächten */
.name-link.spons-frei { background: #d8f3dc; padding: 0.1rem 0.35rem; border-radius: 4px; }

/* Runde 83: Buchhaltung (Journal, Erfolgsrechnung, Bilanz) */
table.bh-tabelle td.zahl, table.bh-tabelle th.zahl { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
table.bh-tabelle td.bh-nr { width: 4.2rem; color: var(--gedaempft); font-variant-numeric: tabular-nums; }
table.bh-tabelle tr.bh-kopf td { font-weight: 700; background: #faf9f6; padding-top: 0.6rem; }
table.bh-tabelle tr.bh-untertitel td { font-weight: 600; color: var(--gedaempft); font-size: 0.85rem; }
table.bh-tabelle tr.bh-summe td { font-weight: 700; border-top: 1px solid #bbb; }
table.bh-tabelle tr.bh-summe.bh-ebene0 td { border-top: 2px solid #555; background: #faf9f6; }
table.bh-tabelle tr.bh-konto.klickbar, table.bh-journal tr.klickbar { cursor: pointer; }
table.bh-tabelle tr.klickbar:hover td { background: #f6f3ec; }
table.bh-journal tr.bh-aktiv td { background: #fff6dd; }
table.bh-tabelle td.negativ { color: var(--fehler); }
.bh-bilanz { display: grid; grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr)); gap: 1rem; align-items: start; }
.bh-titel { font-size: 1.05rem; margin: 0.2rem 0 0.5rem; }
.bh-flagge { opacity: 0.25; }
.bh-flagge-an { color: var(--warn); border-color: var(--warn); }
.fehler-text { color: var(--fehler); }
@media print {
  table.bh-tabelle { font-size: 9.5pt; }
  table.bh-tabelle tr.bh-kopf td, table.bh-tabelle tr.bh-summe td { background: none; }
  .bh-bilanz { grid-template-columns: 1fr 1fr; }
}
.bh-scroll { overflow-x: auto; max-width: 100%; }
@media (max-width: 760px) { .bh-bilanz { grid-template-columns: 1fr; } table.bh-tabelle td.bh-nr { width: auto; } }
/* Die Buchhaltung druckt die Seite selbst (kein #druckbereich) */
@media print { html body:has(#inhalt .bh-tabelle) > main { display: block !important; } }

/* Runde 83: Mandanten ZWT · MCS · MQP */
.fin-mandant-wahl, .fin-mandant { align-self: center; font-weight: 600; border: 2px solid var(--mandant, var(--akzent)); border-radius: 6px; padding: 0.25rem 0.45rem; margin-right: 0.6rem; background: var(--flaeche, #fff); max-width: 22rem; width: auto; }
.fin-mandant { display: inline-block; font-size: 0.9rem; }
/* Runde 87: «auch in MCS» / «auch in ZWT» in den Stiftungslisten */
.auch-in { display: inline-flex; gap: 0.25rem; flex-wrap: nowrap; }
.auch-in-marke { display: inline-block; white-space: nowrap; font-size: 0.8rem; font-weight: 600; border: 1.5px solid; border-radius: 999px; padding: 0.05rem 0.45rem; text-decoration: none; }
.auch-in-marke:hover { text-decoration: underline; }
body[data-mandant] .fin-reiter a.fin-reiter-link.aktiv, body[data-mandant] .fin-reiter button.fin-reiter-link.aktiv { border-bottom-color: var(--mandant, var(--akzent)); }
.mandant-punkt { display: inline-block; width: 0.7rem; height: 0.7rem; border-radius: 50%; margin-right: 0.35rem; vertical-align: middle; }
.mandant-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 0.8rem; margin: 0.6rem 0 1rem; }
.mandant-karte { border: 1px solid var(--linie, #ddd); border-top: 5px solid var(--farbe, #888); border-radius: 8px; padding: 0.8rem 0.9rem; background: var(--flaeche, #fff); }
.mandant-karte h3 { margin: 0 0 0.4rem; font-size: 1.05rem; }
.mandant-karte .zahlen { display: grid; grid-template-columns: 1fr auto; gap: 0.15rem 0.8rem; font-size: 0.92rem; }
.mandant-karte .zahlen .zahl { text-align: right; font-variant-numeric: tabular-nums; }
.mandant-karte .links { display: flex; flex-wrap: wrap; gap: 0.3rem 0.8rem; margin-top: 0.6rem; font-size: 0.9rem; }
table.zz td.zahl, table.zz th.zahl { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.zz tr.zz-klasse td { font-weight: 600; padding-top: 0.6rem; }
table.zz tr.zz-summe td { font-weight: 600; border-top: 1px solid var(--linie, #ccc); }
table.zz tr.zz-total td { font-weight: 700; border-top: 2px solid var(--text, #222); }
table.zz tr.zz-warnung td { color: var(--fehler, #b00020); }
table.zz tr.zz-verrechnung td { color: var(--gedaempft); font-style: italic; }
.zz-hinweis { border-left: 4px solid var(--fehler, #b00020); padding: 0.4rem 0.7rem; background: rgba(176, 0, 32, 0.06); margin: 0.5rem 0; }
.zz-ok { border-left: 4px solid #2e7d32; padding: 0.4rem 0.7rem; background: rgba(46, 125, 50, 0.07); margin: 0.5rem 0; }
.gesuch-status { display: inline-block; border-radius: 10px; padding: 0.05rem 0.5rem; font-size: 0.82rem; white-space: nowrap; background: #eee; color: #333; }
.gesuch-status.zugesagt { background: #dcefdc; color: #1b5e20; }
.gesuch-status.absage { background: #f6dcdc; color: #8a1c1c; }
.gesuch-status.angefragt { background: #fff1c9; color: #6d5200; }
.gesuch-status.geplant { background: #e3ecf7; color: #174a7c; }
.gesuch-status.zurueckgezogen { background: #eee; color: #777; text-decoration: line-through; }
.frist-bald { color: var(--fehler, #b00020); font-weight: 600; }
.stiftung-detail { border: 1px solid var(--linie, #ddd); border-radius: 8px; padding: 0.7rem 0.9rem; margin: 0.3rem 0 0.8rem; background: var(--flaeche, #fff); }
.stiftung-detail .raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 0.4rem 0.8rem; }
.stiftung-detail label { display: flex; flex-direction: column; font-size: 0.85rem; color: var(--gedaempft); gap: 0.15rem; }
.stiftung-detail label input, .stiftung-detail label textarea, .stiftung-detail label select { color: var(--text); }