/* Online-Bewerbung und interner Bereich. Baut auf style.css auf. */

[hidden] { display: none !important; }

body.app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--gray-light);
}

.app-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: var(--surface);
  border-bottom: 1px solid var(--gray-border);
}
.app-header .brand { font-size: 0.95rem; }
.app-header .brand img { height: 34px; }
.app-header-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }

.menue-link { font-size: 0.85rem; font-weight: 600; color: var(--text-dim); display: inline-flex; align-items: center; min-height: 44px; }
.menue-link:hover { color: var(--orange-deep); }

.sprache {
  border: 1.5px solid var(--gray-border);
  background: transparent;
  color: var(--text);
  border-radius: 999px;
  padding: 6px 14px;
  font: inherit;
  font-weight: 700;
  font-size: 0.8rem;
  cursor: pointer;
}

.sprach-wahl {
  margin-left: auto;
  min-height: 44px;
  border: 1.5px solid var(--gray-border);
  background: var(--surface);
  color: var(--text);
  border-radius: 999px;
  padding: 6px 12px;
  font: inherit;
  font-weight: 700;
  font-size: 0.8rem;
  cursor: pointer;
}

.app-main { flex: 1; width: 100%; max-width: 640px; margin: 0 auto; padding: 24px 16px 40px; }
.app-main.breit { max-width: 1100px; }

.app-footer { text-align: center; padding: 18px 16px 28px; font-size: 0.85rem; color: var(--text-dim); }
.app-footer a:hover { color: var(--orange-deep); }

.app-hinweis { color: var(--text-dim); font-size: 0.92rem; }
.app-hinweis.klein { font-size: 0.8rem; margin-top: 12px; }

.app h1 { font-size: clamp(1.4rem, 5vw, 1.9rem); line-height: 1.25; margin-bottom: 18px; }
.app h2 { font-size: 1.05rem; margin-bottom: 10px; }

.link-button {
  background: none;
  border: none;
  color: var(--orange-deep);
  font: inherit;
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
  padding: 4px 0;
  min-height: 44px;
}
.link-button:disabled { opacity: 0.55; cursor: progress; }
.link-button:hover { text-decoration: underline; }

/* Bewerbungsstrecke */

.wizard {
  background: var(--surface);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius);
  padding: 22px 18px 24px;
  box-shadow: var(--shadow);
}
.wizard.fertig { text-align: center; padding: 36px 20px; }
.wizard.fertig p { margin-bottom: 24px; color: var(--text-dim); }

.wizard-fortschritt { height: 6px; background: var(--gray-light); border-radius: 999px; overflow: hidden; margin-bottom: 12px; }
.wizard-fortschritt span { display: block; height: 100%; width: 0; background: var(--orange); transition: width 0.25s ease; }
.wizard-schritt { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-dim); margin-bottom: 6px; }

.wizard-aktionen { display: flex; gap: 12px; justify-content: space-between; margin-top: 22px; }
.wizard-aktionen .btn { flex: 1; justify-content: center; padding: 15px 18px; }
.wizard-aktionen .btn[hidden] { display: none; }

.honig { position: absolute; left: -10000px; width: 1px; height: 1px; opacity: 0; }

.feld { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.feld > label,
.feld legend { font-size: 0.92rem; font-weight: 600; color: var(--text); }
.feld fieldset { border: none; display: flex; flex-direction: column; gap: 10px; }
.feld input[type="text"],
.feld input[type="tel"],
.feld input[type="email"],
.feld textarea {
  background: var(--gray-light);
  border: 2px solid var(--input-border);
  border-radius: 10px;
  padding: 14px 16px;
  color: var(--text);
  font: inherit;
  font-size: 1rem; /* verhindert Zoom auf iOS */
}
.feld textarea { min-height: 110px; resize: vertical; }
.feld input:focus,
.feld textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(201, 150, 44, 0.2); }
.feld.hat-fehler input,
.feld.hat-fehler textarea,
.feld.hat-fehler .chip span { border-color: #c2413a; }
.feld-fehler { color: #c2413a; font-size: 0.85rem; min-height: 0; }
.feld-fehler:empty { display: none; }

.karten { display: flex; flex-direction: column; gap: 12px; }
.karte {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  align-items: center;
  border: 2px solid var(--gray-border);
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
}
.karte input { grid-row: span 2; width: 22px; height: 22px; accent-color: var(--orange); }
.karte span { color: var(--text-dim); font-size: 0.88rem; }
.karte:has(input:checked) { border-color: var(--orange); background: rgba(201, 150, 44, 0.08); }

.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; display: inline-block; }
.chip input { position: absolute; opacity: 0; inset: 0; }
.chip span {
  display: inline-block;
  min-width: 56px;
  text-align: center;
  padding: 11px 16px;
  border: 2px solid var(--input-border);
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.92rem;
  cursor: pointer;
  user-select: none;
}
.chip input:checked + span { background: var(--orange); border-color: var(--orange); color: var(--navy); }
.chip input:focus-visible + span { box-shadow: 0 0 0 3px rgba(201, 150, 44, 0.35); }
.chips-tage .chip span { min-width: 48px; padding: 11px 10px; }

.uebersicht { display: flex; flex-direction: column; gap: 14px; margin-bottom: 18px; }
.uebersicht section { border: 1px solid var(--gray-border); border-radius: 12px; padding: 14px 16px; }
.uebersicht-kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.uebersicht dl { display: grid; gap: 4px; font-size: 0.92rem; }
.uebersicht dt { color: var(--text-dim); font-size: 0.8rem; margin-top: 6px; }
.uebersicht dt:empty { display: none; }
.uebersicht dd { font-weight: 600; overflow-wrap: anywhere; }

.zustimmung { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; font-size: 0.9rem; }
.zustimmung input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--orange); }
.zustimmung a { color: var(--orange-deep); text-decoration: underline; }

/* Interner Bereich */

.karte-form { max-width: 440px; margin: 0 auto; }
.karte-form h1 { margin-bottom: 4px; }

.filter { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 16px; }
.chip-knopf {
  flex: none;
  border: 1.5px solid var(--gray-border);
  background: var(--surface);
  color: var(--text);
  border-radius: 999px;
  padding: 8px 14px;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}
.chip-knopf.aktiv { background: var(--navy); color: var(--white); border-color: var(--navy); }
:root[data-theme="dark"] .chip-knopf.aktiv { background: var(--orange); color: var(--navy); border-color: var(--orange); }

.eingang { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.eingang-zeile,
.team-zeile {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 12px;
  background: var(--surface);
  border: 1px solid var(--gray-border);
  border-radius: 12px;
  padding: 14px 16px;
}
a.eingang-zeile:hover { border-color: var(--orange); }
.eingang-name { font-weight: 700; overflow-wrap: anywhere; }
.eingang-meta { grid-column: 1 / -1; color: var(--text-dim); font-size: 0.85rem; overflow-wrap: anywhere; }
.team-zeile .knopf-reihe { grid-column: 1 / -1; }

.status {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  background: var(--gray-light);
  color: var(--text-dim);
  white-space: nowrap;
  align-self: start;
}
.status-neu { background: rgba(201, 150, 44, 0.18); color: var(--orange-deep); }
.status-kontaktiert,
.status-gespraech,
.status-in_pruefung { background: rgba(43, 108, 176, 0.14); color: #235a94; }
.status-zusage { background: rgba(26, 127, 55, 0.14); color: #136a2c; }
.status-absage,
.status-zurueckgezogen { background: rgba(194, 65, 58, 0.12); color: #c2413a; }
:root[data-theme="dark"] .status-kontaktiert,
:root[data-theme="dark"] .status-gespraech,
:root[data-theme="dark"] .status-in_pruefung { color: #8ab8ea; }
:root[data-theme="dark"] .status-zusage { color: #6fd08c; }
:root[data-theme="dark"] .status-absage,
:root[data-theme="dark"] .status-zurueckgezogen { color: #f08b84; }

.zurueck-link { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 4px; font-weight: 600; color: var(--orange-deep); }

.kontakt-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.kontakt-links .btn { padding: 12px 20px; }

.akte-raster { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 900px) {
  .akte-raster { grid-template-columns: 3fr 2fr; align-items: start; }
}
.akte-raster > div { display: flex; flex-direction: column; gap: 16px; }
.akte-box {
  background: var(--surface);
  border: 1px solid var(--gray-border);
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.akte-box label { font-size: 0.78rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }
.akte-box select,
.akte-box textarea,
.site-form select {
  background: var(--gray-light);
  border: 2px solid var(--input-border);
  border-radius: 8px;
  padding: 11px 14px;
  color: var(--text);
  font: inherit;
  font-size: 1rem;
}
.akte-box textarea { min-height: 90px; resize: vertical; }
.akte-box .btn { justify-content: center; margin-top: 6px; }
.knopf-reihe { display: flex; flex-wrap: wrap; gap: 10px 16px; }

.antworten { display: grid; grid-template-columns: 1fr; gap: 2px; }
.antworten dt { color: var(--text-dim); font-size: 0.8rem; margin-top: 8px; }
.antworten dd { font-weight: 600; overflow-wrap: anywhere; white-space: pre-wrap; }

.verlauf { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.verlauf li { border-left: 3px solid var(--gray-border); padding-left: 12px; }
.verlauf-kopf { display: block; font-size: 0.78rem; color: var(--text-dim); }
.verlauf p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 0.92rem; }

.startpasswort {
  display: inline-block;
  margin: 0 6px;
  padding: 2px 8px;
  border-radius: 6px;
  background: var(--gray-light);
  font-family: ui-monospace, Menlo, Consolas, monospace;
  user-select: all;
}

.kontakt-links.zentriert { justify-content: center; }

/* Personal */

.ma-onboarding { background: rgba(201, 150, 44, 0.18); color: var(--orange-deep); }
.ma-aktiv { background: rgba(26, 127, 55, 0.14); color: #136a2c; }
.ma-ausgeschieden { background: var(--gray-light); color: var(--text-dim); }
:root[data-theme="dark"] .ma-aktiv { color: #6fd08c; }

.akte-box input[type="text"],
.akte-box input[type="tel"],
.akte-box input[type="email"],
.akte-box input[type="date"],
.akte-box input[type="month"],
.akte-box input[type="time"],
.akte-box input[type="number"],
.site-form input[type="number"] {
  background: var(--gray-light);
  border: 2px solid var(--input-border);
  border-radius: 8px;
  padding: 11px 14px;
  color: var(--text);
  font: inherit;
  font-size: 1rem;
  width: 100%;
}
.akte-box h2.unter { margin-top: 12px; }
.akte-box summary { font-weight: 700; cursor: pointer; }
.formular-spalte { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }

.tid-aktuell { font-weight: 700; color: #1a7f37; }
:root[data-theme="dark"] .tid-aktuell { color: #6fd08c; }
.verlauf li.storniert strong { text-decoration: line-through; color: var(--text-dim); }

.checkliste { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.checkliste label { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; cursor: pointer; }
.checkliste input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--orange); }
.checkliste small { display: block; color: var(--text-dim); }
.checkliste .verlauf-kopf { margin-left: 32px; }

/* Anfragen, Dokumente, Fahrerbereich */

.an-eingegangen { background: rgba(201, 150, 44, 0.18); color: var(--orange-deep); }
.an-in_pruefung { background: rgba(43, 108, 176, 0.14); color: #235a94; }
.an-erledigt { background: rgba(26, 127, 55, 0.14); color: #136a2c; }
.an-abgelehnt { background: rgba(194, 65, 58, 0.12); color: #c2413a; }
:root[data-theme="dark"] .an-in_pruefung { color: #8ab8ea; }
:root[data-theme="dark"] .an-erledigt { color: #6fd08c; }
:root[data-theme="dark"] .an-abgelehnt { color: #f08b84; }

.breit-knopf { width: 100%; justify-content: center; }
.app h2.abstand { margin-top: 24px; }
.vorformatiert { white-space: pre-wrap; overflow-wrap: anywhere; }

.anhang-feld { display: flex; flex-direction: column; gap: 6px; }
.anhang-feld input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.anhang-feld .datei-knopf {
  align-self: flex-start;
  border: 2px dashed var(--input-border);
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  text-transform: none;
  letter-spacing: 0;
  margin: 0;
  cursor: pointer;
}
.anhang-feld input[type="file"]:focus-visible + .datei-knopf,
.anhang-feld .datei-knopf:hover { border-color: var(--orange); }
.anhaenge { list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: 0.9rem; }
.anhaenge li { display: flex; gap: 12px; align-items: baseline; justify-content: space-between; overflow-wrap: anywhere; }
.datei-link { color: var(--orange-deep); text-decoration: underline; overflow-wrap: anywhere; }

.dokumente { list-style: none; display: flex; flex-direction: column; gap: 14px; }
.dokumente > li { border-bottom: 1px solid var(--gray-border); padding-bottom: 12px; }
.dokument-kopf { display: flex; justify-content: space-between; gap: 8px; align-items: center; flex-wrap: wrap; }
.versionen { list-style: none; font-size: 0.88rem; margin: 6px 0; }
.akte-box details summary { margin-top: 6px; font-size: 0.9rem; color: var(--orange-deep); }

.kurzliste { list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: 0.92rem; }
.verlauf li.intern-notiz { border-left-color: var(--orange); background: rgba(201, 150, 44, 0.06); }
.verlauf li.von-mir { border-left-color: var(--orange); }
.akte-box.entscheidung { border-color: var(--orange); }

/* Stationen und Qualifikation */
.verlauf li.aktuell { border-left: 3px solid var(--orange); padding-left: 8px; }
.cycle-gruppe + .cycle-gruppe { margin-top: 14px; }
.cycle-gruppe h3 { font-size: 16px; margin: 0 0 6px; }
.check-zeile { display: flex; align-items: center; gap: 8px; margin: 10px 0; }
.akte-box details label { display: block; margin-top: 8px; }
.akte-box details label.check-zeile { display: flex; margin: 6px 0; }
.akte-box label.auswahl-zeile { font-size: inherit; color: inherit; text-transform: none; letter-spacing: normal; margin: 0; }
.check-liste { border: none; padding: 0; margin: 8px 0; }
.antrag-offen { border-left: 3px solid var(--orange); background: rgba(201, 150, 44, 0.06); border-radius: 6px; padding: 10px 12px; margin: 10px 0; }
.antrag-offen .einfach-liste { margin: 6px 0; }
.check-liste legend { font-size: 13px; color: var(--text-dim); margin-bottom: 4px; }
.einfach-liste { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.ansichten-liste > li { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ansichten-liste a { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Verfügbarkeit */
.vf-liste { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.vf-tag { display: grid; grid-template-columns: 92px 1fr; gap: 4px 10px; align-items: baseline; padding: 10px 12px; border: 1px solid var(--input-border); border-radius: 8px; }
.vf-tag.gemeldet { border-left: 4px solid var(--orange); }
.vf-tag .knopf-reihe { grid-column: 2; }
.vf-datum { font-weight: 700; }
.vf-stand { color: var(--text-dim); }
.vf-tag.gemeldet .vf-stand { color: var(--text); }
.vf-form { display: flex; flex-direction: column; gap: 6px; }
.vf-form input { background: var(--gray-light); border: 2px solid var(--input-border); border-radius: 8px; padding: 9px 12px; color: var(--text); font: inherit; width: 100%; }
.vf-woche { display: flex; flex-direction: column; gap: 12px; }
.vf-hinweis { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #fdecc8; color: #7a4b00; margin: 2px 4px 0 0; }
:root[data-theme="dark"] .vf-hinweis { background: #4a3a12; color: #f3d48a; }
.vf-zusatz { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.vf-person { padding: 6px 0; border-top: 1px solid var(--input-border); }
.vf-person:first-of-type { border-top: 0; }
.vf-blaettern { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 12px 0; }
.vf-blaettern .btn { width: auto; padding: 10px 16px; font-size: 13px; }

/* Capacity */
.cap-tabelle { width: 100%; border-collapse: collapse; font-size: 14px; }
.cap-tabelle th { text-align: left; font-size: 12px; color: var(--text-dim); font-weight: 600; padding: 4px 6px; }
.cap-tabelle td { padding: 8px 6px; border-top: 1px solid var(--input-border); }
.cap-tabelle td + td, .cap-tabelle th + th { text-align: center; width: 18%; }
.cap-tabelle td.leer { color: var(--text-dim); }
.cap-tabelle tr.storniert td:not(:last-child) { text-decoration: line-through; color: var(--text-dim); }
.bank-tabelle td.bank-zweck { white-space: normal; min-width: 220px; max-width: 420px; }
.bank-konto + .bank-konto { border-top: 1px solid var(--gray-border); margin-top: 12px; padding-top: 8px; }
.cap-tabelle td.gut { font-weight: 700; color: #1a7f37; }
.cap-tabelle td.nursery { font-weight: 700; color: #7a4b00; }
.cap-tabelle td.mehrfach { font-weight: 700; }
:root[data-theme="dark"] .cap-tabelle td.gut { color: #6fd08c; }
:root[data-theme="dark"] .cap-tabelle td.nursery { color: #f3d48a; }
.sync-box { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.sync-box .btn { width: auto; }

/* Dienstplan */
.plan-slot { border-left: 5px solid var(--input-border); }
.plan-slot.ampel-gruen { border-left-color: #1a7f37; }
.plan-slot.ampel-gelb { border-left-color: var(--orange); }
.plan-slot.ampel-rot { border-left-color: #c2413a; }
.ampel { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 999px; background: var(--gray-light); }
.ampel-gruen .ampel, .ampel.ampel-gruen { background: #d8f3df; color: #135c28; }
.ampel-gelb .ampel, .ampel.ampel-gelb { background: #fdecc8; color: #7a4b00; }
.ampel-rot .ampel, .ampel.ampel-rot { background: #f8d7d4; color: #8a231c; }
.plan-liste { list-style: none; display: flex; flex-direction: column; gap: 10px; margin: 10px 0; }
.plan-einsatz { padding: 10px; border: 1px solid var(--input-border); border-radius: 8px; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; }
.plan-einsatz > .knopf-reihe, .plan-einsatz > .plan-ersatz, .plan-einsatz > p { flex-basis: 100%; }
.plan-einsatz.st-ersetzt, .plan-einsatz.st-zurueckgenommen { opacity: 0.6; }
.plan-problem { color: #8a231c; font-size: 14px; }
:root[data-theme="dark"] .plan-problem { color: #f2a19a; }
.plan-ersatz { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.plan-ersatz select, .plan-slot select { background: var(--gray-light); border: 2px solid var(--input-border); border-radius: 8px; padding: 9px 12px; color: var(--text); font: inherit; width: 100%; }
.plan-ersatz .btn { align-self: flex-start; width: auto; }
.status.es-bestaetigt { background: #d8f3df; color: #135c28; }
.status.es-freigegeben, .status.es-entwurf { background: #fdecc8; color: #7a4b00; }
.status.es-abgesagt, .status.es-zurueckgenommen { background: #f8d7d4; color: #8a231c; }
#planTag { background: var(--gray-light); border: 2px solid var(--input-border); border-radius: 8px; padding: 8px 10px; color: var(--text); font: inherit; }
.einsatz-karte { border-left: 5px solid var(--orange); }
.einsatz-karte.st-bestaetigt { border-left-color: #1a7f37; }
.einsatz-karte.st-abgesagt, .einsatz-karte.st-ersetzt, .einsatz-karte.st-zurueckgenommen { border-left-color: var(--input-border); opacity: 0.75; }
.einsatz-hinweis { display: block; font-weight: 700; color: #7a4b00; background: #fdecc8; margin-bottom: 12px; }
.einsatz-ort { font-size: 17px; font-weight: 600; }
.akte-box textarea.gross { min-height: 220px; font-family: inherit; }
.lern-inhalt { white-space: pre-wrap; line-height: 1.6; }
.lern-frage { border: 1px solid var(--input-border); border-radius: 8px; padding: 12px; margin: 10px 0; }
.lern-frage legend { font-weight: 700; padding: 0 4px; }
.lern-frage label { display: flex; gap: 10px; align-items: flex-start; padding: 6px 0; cursor: pointer; }
.lern-frage input { width: 22px; height: 22px; accent-color: var(--orange); flex: none; }
.lern-frage.falsch { border-color: #c2413a; }
.lern-frage.richtig { border-color: #1a7f37; }
.lern-feedback { font-size: 14px; margin-top: 6px; }
.tabelle-scroll { overflow-x: auto; }
.tabelle-scroll .cap-tabelle td + td, .tabelle-scroll .cap-tabelle th + th { width: auto; white-space: nowrap; font-size: 13px; }

/* Tastaturbedienung: deutlich sichtbarer Fokus */
.app a:focus-visible,
.app button:focus-visible,
.app select:focus-visible,
.app summary:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; border-radius: 4px; }
.app button:disabled { cursor: progress; }

/* Schmale Bildschirme: Menü als eigene Zeile unter dem Logo, ohne Leerraum */
@media (max-width: 700px) {
  .app-header { flex-wrap: wrap; row-gap: 4px; padding-bottom: 6px; }
  .app-header-actions { width: 100%; justify-content: flex-start; column-gap: 16px; row-gap: 0; }
}
[dir="auto"] { unicode-bidi: plaintext; }

/* Fahrzeuge und Morgenstatus */
.gedimmt { opacity: 0.6; }
.morgen { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--gray-light); color: var(--text-dim); }
.morgen-startklar { background: #d8f3df; color: #135c28; }
.morgen-verspaetet { background: #fdecc8; color: #7a4b00; }
.morgen-box { margin: 14px 0; padding: 12px; border: 1px dashed var(--input-border); border-radius: 8px; }
.morgen-box h3 { font-size: 1rem; margin-bottom: 6px; }
.morgen-box details, .einsatz-karte details { margin-top: 10px; }
.morgen-box select, .morgen-box input, .einsatz-karte select, .einsatz-karte textarea { width: 100%; font: inherit; padding: 9px 12px; border: 2px solid var(--input-border); border-radius: 8px; background: var(--gray-light); color: var(--text); margin: 4px 0 8px; }
.einsatz-fahrzeug { font-weight: 600; }
.plan-fahrzeug p { margin: 0; }
.vg-tabelle td + td, .vg-tabelle th + th { text-align: left; width: auto; }
.vg-tabelle td { white-space: nowrap; }

/* Bewerbung: WhatsApp als Alternative, Erstreaktion und Kanäle im Eingang */
.wa-hinweis { margin-top: 18px; text-align: center; font-size: 0.92rem; }
.wa-hinweis a { color: var(--accent, inherit); font-weight: 600; text-decoration: underline; display: inline-block; padding: 10px 4px; min-height: 44px; }
.erst-liste { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.erst-karte { border: 1px solid var(--border, #ddd); border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.erst-karte .erst-kopf { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; justify-content: space-between; }
.erst-karte .erst-zeit { font-weight: 700; }
.erst-karte .erst-zeit.alt { color: #b42318; }
.erst-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; }
.erst-knoepfe .btn { flex: 1 1 140px; justify-content: center; }
.kanal-links { display: flex; flex-direction: column; gap: 6px; }
.kanal-links code { word-break: break-all; }
.wa-einwilligung { margin: 4px 0 18px; }
.hinweis-marken { display: flex; flex-wrap: wrap; gap: 6px; }
.hinweis-marke { font-size: 0.8rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: #fef0c7; color: #7a4a00; }
.hinweis-marke.dublette { background: #e0eaff; color: #1d3a8a; }

/* Tagesüberblick */
.heute-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 8px; }
.heute-kachel { display: flex; flex-direction: column; gap: 2px; padding: 12px; border: 1px solid var(--input-border); border-radius: 10px; text-decoration: none; color: inherit; }
.heute-kachel strong { font-size: 1.6rem; line-height: 1.1; }
.heute-kachel span { font-size: 0.85rem; color: var(--text-dim); }
.heute-kachel.warnung { border-color: var(--orange); }
.heute-kachel.warnung strong { color: var(--orange-deep); }
.heute-ampeln { display: flex; flex-wrap: wrap; gap: 6px; }

/* Wochenansicht */
.woche-rahmen { overflow-x: auto; margin-top: 12px; border: 1px solid var(--input-border); border-radius: 10px; }
.woche-tabelle { border-collapse: collapse; font-size: 13px; min-width: 100%; }
.woche-tabelle th, .woche-tabelle td { padding: 6px 8px; border-bottom: 1px solid var(--input-border); text-align: left; white-space: nowrap; vertical-align: top; }
.woche-tabelle thead th { font-size: 12px; color: var(--text-dim); font-weight: 600; }
.woche-tabelle thead th.heute { color: var(--orange-deep); }
.woche-tabelle tbody th { position: sticky; left: 0; background: var(--surface); font-weight: 600; z-index: 1; }
.woche-tabelle td.einsatz span { display: block; font-size: 11px; }
.woche-tabelle td.zahl { text-align: right; font-weight: 700; }
.woche-legende { display: flex; flex-wrap: wrap; gap: 6px; font-size: 12px; }
.woche-legende span { padding: 2px 8px; border-radius: 999px; }
.einsatz.bestaetigt { background: #d8f3df; color: #135c28; }
.einsatz.offen { background: #fdecc8; color: #7a4b00; }
.einsatz.entwurf { background: var(--gray-light); outline: 1px dashed var(--input-border); outline-offset: -3px; }
.einsatz.abgesagt { background: #f8d7d4; color: #8a231c; text-decoration: line-through; }
.einsatz a { color: inherit; }
.woche-tabelle td.einsatz span { color: inherit; opacity: 0.8; }
.frei { color: var(--text-dim); }
.abwesend { background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.06) 0 6px, transparent 6px 12px); color: var(--text-dim); }
.woche-tabelle td.einsatz span.woche-warnung { font-weight: 700; opacity: 1; }
.frei.gemeldet { background: rgba(0, 0, 0, 0.03); color: inherit; font-style: italic; }

.suche-form { display: flex; gap: 8px; margin: 8px 0 16px; }
.suche-form input { flex: 1; min-width: 0; padding: 10px 12px; border: 1px solid var(--input-border); border-radius: 10px; background: var(--surface); color: inherit; font: inherit; }

/* Importe */
.import-roh td, .import-vorschau td { white-space: nowrap; max-width: 240px; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.tabelle-scroll .import-roh td + td, .tabelle-scroll .import-roh th + th, .tabelle-scroll .import-vorschau td + td, .tabelle-scroll .import-vorschau th + th { text-align: left; width: auto; }
.import-roh tr.import-kopf td { font-weight: 700; background: rgba(201, 150, 44, 0.12); }
.import-felder { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 16px; }
.import-feld select, .import-feld input { width: 100%; }
a.aktiv { text-decoration: underline; }
.import-vorschau td:last-child { white-space: normal; min-width: 220px; max-width: none; }
.import-spalten { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 12px; }
.import-feld-breit { grid-column: 1 / -1; }
.schwelle-zeile { display: grid; grid-template-columns: 1fr auto 110px auto; gap: 8px; align-items: center; margin: 6px 0; }
@media (max-width: 520px) { .schwelle-zeile { grid-template-columns: 1fr 1fr; } }

/* Tourabschluss */
.tour-felder { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0 12px; align-items: end; }
.tour-felder input { width: 100%; }
.tour-stand { margin: 6px 0; }
.cap-tabelle tr.summe td { font-weight: 700; }
.fall-liste > li { padding: 8px 0; border-bottom: 1px solid var(--input-border); }
.fall-liste > li.storniert summary { color: var(--text-dim); text-decoration: line-through; }
.quellen-eingaenge li.storniert { color: var(--text-dim); text-decoration: line-through; }
.assistent-entwurf { white-space: pre-wrap; }
.assistent-belege > li { padding: 6px 0; }
.akte-box.entwurf .knopf-reihe { margin-top: 8px; }
.entwurf-alle { margin-bottom: 14px; }
.fruehwarnung > .einfach-liste > li { padding-left: 10px; border-left: 4px solid #e0b25a; }
.fruehwarnung > .einfach-liste > li.warnung-hoch { border-left-color: #8a231c; }
.fruehwarnung li ul { margin: 4px 0 0; padding-left: 18px; }
.fruehwarnung .grund-hoch { color: #8a231c; font-weight: 600; }
:root[data-theme="dark"] .fruehwarnung .grund-hoch { color: #f2a19a; }
:root[data-theme="dark"] .fruehwarnung > .einfach-liste > li.warnung-hoch { border-left-color: #f2a19a; }
.fristen .einfach-liste > li { padding-left: 10px; border-left: 4px solid transparent; }
.fristen .einfach-liste > li.frist-bald { border-left-color: #e0b25a; }
.fristen .einfach-liste > li.frist-ueber { border-left-color: #8a231c; }
:root[data-theme="dark"] .fristen .einfach-liste > li.frist-ueber { border-left-color: #f2a19a; }
.export-felder { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 260px)); gap: 4px 16px; margin-bottom: 12px; }
.export .btn { display: inline-block; width: auto; }