/* apple-mobil.css – Navigation am Handy (Breite bis 800 px): Tab-Leiste unten, Umschalter unter der Kopfleiste, schlanke Kopfleiste.
   Am Desktop bleibt das Menüband unverändert; hier sind die neuen Teile ausgeblendet. */
body.apple .kopf-marke-mobil, body.apple .umschalter, body.apple .tab-leiste, body.apple .wiki-zurueck, body.apple .statistik-auswahl-mobil { display: none; }

@media (max-width: 800px) {
  /* Kopfleiste: Symbol der App links, "+ Neuer Einsatz" rechts; Menü-Knopf, Menüliste und Benutzerleiste entfallen (Tab "Konto") */
  body.apple .kopf { flex-wrap: nowrap; align-items: center; gap: 8px; }
  body.apple .nav-toggle, body.apple .nav-burger, body.apple .kopf-nav, body.apple .kopf-benutzer { display: none !important; }
  body.apple .kopf-marke-link { display: none; }
  body.apple .kopf-marke-mobil {
    display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: none;
    color: var(--a-petrol, #0c577f); font-weight: 600; font-size: 15px;
  }
  body.apple .kopf-pwa-symbol { width: 36px; height: 36px; border-radius: 9px; display: block; }

  /* Zähler bis zur automatischen Abmeldung: zwischen App-Symbol und "+ Neuer Einsatz" (der Zähler in der Benutzerleiste entfällt mit ihr) */
  body.apple .abmelde-zaehler-mobil { display: inline-flex; }
  body.apple .abmelde-zaehler-knopf { min-height: 44px; padding: 0 10px; }

  /* Umschalter: eng verwandte Ansichten, gleich breite Teile, Auswahl als blaue Pille */
  body.apple .umschalter { display: flex; gap: 4px; padding: 12px 12px 4px; }
  body.apple .umschalter a {
    flex: 1 1 0; min-width: 0; min-height: 44px; display: flex; align-items: center; justify-content: center;
    border-radius: 999px; font-size: 14px; color: var(--farbe-text-mittel, #5f554a); text-decoration: none;
  }
  body.apple .umschalter a[aria-current="page"] { background: var(--a-petrol-tint, #e3eef3); color: var(--a-petrol-dunkel, #084660); font-weight: 700; }
  body.apple .umschalter a:focus-visible, body.apple .tab-leiste a:focus-visible { outline: 2px solid var(--a-petrol, #0c577f); outline-offset: 2px; }

  /* Die Seitenüberschrift ist durch die Pille ersetzt: nur noch für Screenreader da (Ausnahme: Seiten mit der Klasse h1-zeigen, zum Beispiel eine geöffnete Wiki-Seite). Die alte Reihe Aktiv/Erledigt/Suche entfällt (nur dort; Jahr und Monat der Statistik und die Verfügbarkeit der Übersicht bleiben). */
  body.apple .umschalter ~ main:not(.h1-zeigen) h1 {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  body.apple :is(.seite-einsaetze-liste, .seite-einsaetze-suche) .status-auswahl { display: none; }
  /* Der Zoom-Regler entfällt am Handy (dort zoomt man mit zwei Fingern); am Desktop bleibt er */
  body.apple .zoom-box { display: none; }

  /* Tab-Leiste: schwebende, abgerundete Leiste unten; der Bereich der Seite endet darüber */
  body.apple .tab-leiste {
    display: flex; align-items: center; position: fixed; z-index: 50; left: max(10px, env(safe-area-inset-left)); right: max(10px, env(safe-area-inset-right));
    bottom: calc(10px + env(safe-area-inset-bottom)); height: 64px; padding: 0 6px;
    background: #fff; border: 1px solid var(--a-rand, #c4b399); border-radius: 32px;
  }
  body.apple .tab-leiste a {
    flex: 1 1 0; min-width: 0; height: 52px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
    border-radius: 26px; font-size: 12px; color: var(--farbe-text-mittel, #5f554a); text-decoration: none; text-align: center;
  }
  body.apple .tab-leiste svg { width: 24px; height: 24px; fill: currentColor; }
  body.apple .tab-leiste a[aria-current="page"] { background: var(--a-petrol-tint, #e3eef3); color: var(--a-petrol, #0c577f); font-weight: 700; }
  body.apple main.inhalt { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  body.apple .chat-eingabe { bottom: calc(84px + env(safe-area-inset-bottom)); }
  body.apple .live-hinweis { bottom: calc(84px + env(safe-area-inset-bottom)); }
  body.apple #beitrag-kopieren-knopf { bottom: calc(84px + env(safe-area-inset-bottom)); }

  /* Alarm-Automatik: kleiner Knopf, die Erklärung als kleine Zeile darunter statt daneben */
  body.apple .alarm-automatik-zeile { margin: 4px 0 8px; }
  body.apple .alarm-automatik > span, body.apple .alarm-automatik { display: block; }
  body.apple .alarm-automatik .aa-name { min-height: 40px; padding: 0 16px; font-size: 14px; }
  body.apple .alarm-automatik .aa-rest { display: block; margin: 4px 2px 0; font-size: 12px; line-height: 1.35; }
  body.apple .alarm-automatik .aa-rest::before { content: none; }
  body.apple .koordinator-filter { padding: 4px 14px; }

  /* Einsatzkarten in der Liste: Beschriftung und Wert in einer Zeile, Name als Titel, Knöpfe ohne Beschriftung */
  body.apple .seite-einsaetze-liste .tabelle-karten tr { padding: 12px 14px; }
  body.apple .seite-einsaetze-liste .tabelle-karten td.einsatz-name { font-size: 17px; font-weight: 700; padding: 0 0 6px; }
  body.apple .seite-einsaetze-liste .tabelle-karten td[data-label]:not(:empty) {
    display: flex; align-items: center; gap: 8px; min-height: 34px; padding: 2px 0; font-size: 14px;
  }
  body.apple .seite-einsaetze-liste .tabelle-karten td[data-label]:not(:empty)::before {
    content: attr(data-label); flex: 0 0 104px; font-size: 12px; font-weight: 500; color: var(--farbe-text-mittel, #5f554a);
  }
  body.apple .seite-einsaetze-liste .tabelle-karten td[data-label="Kopieren"]::before,
  body.apple .seite-einsaetze-liste .tabelle-karten td[data-label="Forum"]::before { display: none; }
  body.apple .seite-einsaetze-liste .tabelle-karten td[data-label] > :is(select, .naechster-alarm-zeile, .letzte-nachfrage-zeile) { flex: 1 1 0; min-width: 0; }
  body.apple .seite-einsaetze-liste .tabelle-karten td[data-label="Forum"] { padding-top: 6px; }
  /* Leere Angaben (Situation, Fotograf ohne Eintrag) sparen am Handy eine Zeile */
  body.apple .seite-einsaetze-liste .tabelle-karten td.leer-mobil[data-label]:not(:empty) { display: none; }

  /* Suche: Auswahl-Pillen als gleich breite Zeilen bzw. zwei Spalten statt unregelmäßig umbrechender Pillen */
  body.apple .suche-gruppe { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  body.apple .suche-gruppe[aria-label="Endstatus"] { grid-template-columns: 1fr; }
  body.apple .suche-gruppen-name { grid-column: 1 / -1; }
  body.apple .suche-chip, body.apple .suche-chip span { display: flex; width: 100%; }
  body.apple .suche-chip span { justify-content: flex-start; text-align: left; box-sizing: border-box; }

  /* Wiki: geöffnete Seite zeigt statt der langen Seitenliste nur einen Rückweg zur Liste, der Text beginnt gleich oben */
  body.apple .wiki-layout-detail .wiki-sidebar { display: none; }
  body.apple .wiki-zurueck {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; font-weight: 600; text-decoration: none;
    color: var(--a-petrol, #0c577f);
  }

  /* Statistik: Jahr und Monat als Auswahlfelder statt Pillen */
  body.apple .statistik-jahre, body.apple .statistik-monate { display: none; }
  body.apple .statistik-auswahl-mobil { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 0 12px; }
  body.apple .statistik-auswahl-mobil label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--farbe-text-mittel, #5f554a); }
  body.apple .statistik-auswahl-mobil select {
    min-height: 44px; font-size: 16px; width: 100%; padding: 0 12px; box-sizing: border-box;
    background-color: #fff; border: 1px solid var(--a-rand, #c4b399); border-radius: var(--a-r-feld, 12px); color: var(--a-text, #3a332c);
  }

  /* Konto */
  body.apple .konto-liste { list-style: none; margin: 0 0 16px; padding: 0; background: #fff; border: 1px solid var(--a-linie, #e8dccb); border-radius: 14px; overflow: hidden; }
  body.apple .konto-liste li + li { border-top: 1px solid var(--a-linie, #e8dccb); }
  body.apple .konto-liste a { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 14px; color: var(--a-text, #3a332c); text-decoration: none; }
  body.apple .konto-hinweis { margin-left: auto; font-size: 12px; color: var(--farbe-text-mittel, #5f554a); }
  body.apple .konto-abmelden .button { width: 100%; min-height: 48px; }
}

/* Die Konto-Seite am Desktop (Karte mit Zeilen) steht in apple-benutzer.css */
