/* stuv Mensaparty · Projektschicht über dem stuv-CI-Paket (static/stuv-ci/css/stuv.css).
   App-Stil (body.stuv-app, Muster PLEITE, wie stuv Tix): nur Inter, 40-px-
   Bedienelemente, 8/12 px Rundung. Hier steht nur, was das Paket nicht
   mitbringt – Präfix mp-. Ausschließlich Tokens des Pakets (--stuv-*), keine
   eigenen Farben, Radien oder Schriftgrößen. */

/* ── Seite ───────────────────────────────────────────────────────────────── */
body { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body > main { flex: 1 0 auto; min-width: 0; width: 100%; box-sizing: border-box; }
.stuv-app main.stuv-inhalt-app { align-content: start; }
.stuv-app .stuv-inhalt-app { max-width: calc(62rem + 2 * var(--stuv-s6)); padding-bottom: var(--stuv-s10); }

/* ── Kopfzeile ───────────────────────────────────────────────────────────── */
.stuv-app .stuv-menue a span { display: inline; }
.stuv-app .stuv-menue a { white-space: nowrap; }
.stuv-app .stuv-menue { min-width: 0; flex: 0 1 auto; overflow-x: auto; }
.stuv-app .stuv-menue-form { display: inline; }
.stuv-app .stuv-menue-form button { height: var(--stuv-app-hoehe); color: var(--stuv-text-2); white-space: nowrap; }
.stuv-app .stuv-kopf-rechts { display: flex; align-items: center; gap: var(--stuv-s3); }
.mp-name { font-size: var(--stuv-app-klein); color: var(--stuv-text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 16rem; }
@media (max-width: 640px) {
  .mp-name { display: none; }
  .stuv-app .stuv-menue a span { display: none; }
}
.stuv-app .stuv-seite-kopf h1 { margin-right: auto; }
.mp-werkzeuge .stuv-knopf { gap: var(--stuv-s2); }

/* ── Fußzeile ────────────────────────────────────────────────────────────── */
.mp-fuss { max-width: var(--stuv-app-breite); margin: 0 auto; padding: 0 var(--stuv-s6) var(--stuv-s8); width: 100%; box-sizing: border-box;
           font-size: var(--stuv-app-klein); color: var(--stuv-text-2); }
.mp-fuss nav { display: flex; flex-wrap: wrap; gap: var(--stuv-s2) var(--stuv-s4); }
.mp-fuss a { color: var(--stuv-text-2); }
@media (max-width: 640px) { .mp-fuss { padding: 0 var(--stuv-s4) var(--stuv-s6); } }

/* ── Inhalt ──────────────────────────────────────────────────────────────── */
.stuv-app .stuv-karte p, .stuv-app .stuv-meldung { line-height: 1.5; }
.stuv-app .stuv-meldungen { margin: 0; }
.stuv-app .stuv-abschnitt > p { margin: 0; }
.stuv-app .stuv-anmeldung .stuv-karte { width: 100%; box-sizing: border-box; }
.stuv-app .stuv-karte { display: grid; gap: var(--stuv-s4); }
.stuv-app .stuv-karte > h2, .stuv-app .stuv-karte > p { margin: 0; }
.mp-absatz { white-space: pre-line; }
.zeit { font-variant-numeric: tabular-nums; }
.zeile--vorbei td { color: var(--stuv-text-3); }
.stuv-app .stuv-tabelle td { vertical-align: top; }
.stuv-app .stuv-tabelle td.stuv-aktion { vertical-align: middle; }
.mp-breit { grid-column: span 2; }
@media (max-width: 520px) { .mp-breit { grid-column: auto; } }
details.stuv-karte > summary { cursor: pointer; list-style: revert; }
.mp-inline { display: inline; margin: 0; }

/* Schichten als Zeilen (Helfende): links Zeit und Bereich, rechts die Tat.
   Auf dem Handy rutscht die Tat unter die Angaben. */
.mp-liste { list-style: none; margin: 0; padding: 0; background: var(--stuv-flaeche);
            border: 1px solid var(--stuv-linie-leicht); border-radius: var(--stuv-r-karte); }
.mp-liste li { display: flex; align-items: center; justify-content: space-between; gap: var(--stuv-s2) var(--stuv-s4);
               flex-wrap: wrap; padding: var(--stuv-s3) var(--stuv-s4); }
.mp-liste li + li { border-top: 1px solid var(--stuv-linie-leicht); }
.mp-info { display: grid; gap: var(--stuv-s1); min-width: 0; }
.mp-info strong { font-weight: 600; }
.mp-tat { margin-left: auto; text-align: right; }

/* Löschen/Entfernen nie primär – rot, ganz rechts */
.stuv-app .stuv-knopf--gefahr, .stuv-app button.stuv-knopf--gefahr { color: var(--stuv-negativ); }
.stuv-app .stuv-knopf--gefahr:hover, .stuv-app button.stuv-knopf--gefahr:hover { background: var(--stuv-akzent-heller); }
.stuv-app .stuv-aktionen .stuv-knopf--gefahr { margin-left: auto; }

/* Rechtstexte: Fließtext in einer Karte, Zeilenlänge begrenzt */
.mp-text { --zeile: min(70ch, 100%); line-height: 1.6; }
.mp-text h1 { margin: 0 0 var(--stuv-s4); }
.mp-text p, .mp-text ul, .mp-text .stuv-tabelle { margin: 0 0 var(--stuv-s4); max-width: var(--zeile); }
.mp-text ul { padding-left: 1.5rem; }
.mp-text h2 { margin: var(--stuv-s8) 0 var(--stuv-s3); }
.mp-text > :last-child { margin-bottom: 0; }
.mp-text a { overflow-wrap: anywhere; text-decoration: underline; }
.mp-text code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: var(--stuv-app-klein);
                background: var(--stuv-linie-leicht); border-radius: var(--stuv-r-chip); padding: 0 var(--stuv-s1); }

/* ── Schmale Fenster ─────────────────────────────────────────────────────── */
@media (max-width: 639px) {
  .stuv-app .stuv-aktionen > * { flex: 1 1 auto; }
  .stuv-app .stuv-kennzahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stuv-app .stuv-kennzahl { padding: var(--stuv-s3) var(--stuv-s4); }
  .mp-plan td.zeit { white-space: nowrap; }
  .stuv-app .stuv-tabelle td.stuv-aktion { white-space: normal; }
}

/* ── Druck: nur der Plan ─────────────────────────────────────────────────── */
@media print {
  .stuv-kopf, .mp-fuss, .mp-werkzeuge, .mp-druck-aus, .stuv-meldungen { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }