/* apple-sonstige: Ansicht "Neu" für Wiki, Links, Statistik, Support und Design-Einstellungen.
   Alle Regeln hängen an body.apple (ohne die Klasse bleibt alles wie heute). Farben wie heute, nur Ordnung, Lesbarkeit,
   gleiche Radien/Höhen und Tippflächen von 44 px auf dem Handy. Gemeinsame Bausteine stehen in apple-global.css. */

/* ===== Gemeinsam: Hauptknopf "Speichern" in Terrakotta (wie bei "Einsatz bearbeiten") ===== */
body.apple :is(.seite-wiki-formular, .seite-design) .karte form button[type="submit"] {
  background: var(--a-terrakotta, #c17668);
}
body.apple :is(.seite-wiki-formular, .seite-design) .karte form button[type="submit"]:hover { background: var(--a-terrakotta-dunkel, #a85f52); }
body.apple :is(.seite-wiki-formular, .seite-design) .karte form button[type="submit"]:active { background: #924f43; }

/* Formulare aus {{ form.as_p }}: ruhiger Abstand, Hilfetext unter dem Feld */
body.apple :is(.seite-wiki-formular, .seite-support, .seite-design) .karte form p { margin: 0 0 16px; }
body.apple :is(.seite-wiki-formular, .seite-support, .seite-design) .karte form input:where(:not([type="checkbox"], [type="radio"], [type="color"], [type="file"], [type="hidden"], .hex-farbe-feld *)),
body.apple :is(.seite-wiki-formular, .seite-support, .seite-design) .karte form :is(select, textarea) { width: 100%; box-sizing: border-box; }
body.apple :is(.seite-wiki-formular, .seite-support, .seite-design) .karte form .helptext { margin-top: 6px; }
body.apple :is(.seite-wiki-formular, .seite-support, .seite-design) .karte form .errorlist { margin: 0 0 6px; }
/* Kästchen-Zeilen (z. B. "Nur für Administrator:innen"): Kästchen und Text in einer Zeile, Hilfetext darunter */
body.apple :is(.seite-wiki-formular, .seite-design) .karte form p:has(> input[type="checkbox"]) { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; }
body.apple :is(.seite-wiki-formular, .seite-design) .karte form p:has(> input[type="checkbox"]) label { order: 2; flex: 1 1 0; min-width: 0; margin: 0; }
body.apple :is(.seite-wiki-formular, .seite-design) .karte form p:has(> input[type="checkbox"]) input[type="checkbox"] { order: 1; margin: 0; }
body.apple :is(.seite-wiki-formular, .seite-design) .karte form p:has(> input[type="checkbox"]) .helptext { order: 3; flex: 1 1 100%; }
body.apple :is(.seite-wiki-formular, .seite-design) .karte form p:has(> input[type="checkbox"]) .errorlist { order: 0; flex: 1 1 100%; }
@media (pointer: coarse), (max-width: 800px) {
  body.apple :is(.seite-wiki-formular, .seite-design) .karte form p:has(> input[type="checkbox"]) { min-height: 44px; }
}

/* ===== Wiki: Seitenleiste + Inhalt ===== */
body.apple .seite-wiki .wiki-layout { gap: 24px; }
body.apple .seite-wiki .wiki-sidebar { width: 240px; }
body.apple .seite-wiki .wiki-sidebar h3 {
  margin: 20px 0 6px; padding: 0 12px; font-size: 12px; line-height: 1.3; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--farbe-text-mittel);
}
body.apple .seite-wiki .wiki-sidebar h3:first-child { margin-top: 0; }
body.apple .seite-wiki .wiki-sidebar li { margin: 0 0 2px; }
body.apple .seite-wiki .wiki-sidebar a {
  display: block; padding: 8px 12px; min-height: 36px; box-sizing: border-box; border-radius: 12px;
  font-size: 15px; line-height: 1.3; font-weight: 500; color: var(--farbe-text-mittel);
  transition: background-color var(--a-sprung), color var(--a-sprung);
}
body.apple .seite-wiki .wiki-sidebar a:hover { background: var(--a-gruppe-bg, #f5efe8); color: var(--farbe-text); }
body.apple .seite-wiki .wiki-sidebar a.wiki-aktiv { background: var(--a-petrol-tint, #e3eef3); color: var(--a-petrol-dunkel, #084660); font-weight: 700; }
body.apple .seite-wiki .wiki-sidebar a.button { display: inline-flex; margin-top: 4px; color: #fff; font-weight: 600; }
body.apple .seite-wiki .wiki-leer { color: var(--farbe-text-mittel); }

body.apple .seite-wiki .wiki-inhalt {
  background: var(--farbe-flaeche); border: 1px solid var(--a-linie, #e8dccb); border-radius: var(--a-r-karte, 16px);
  box-shadow: 0 1px 2px rgba(58, 38, 28, .06); padding: 24px 32px;
}
body.apple .seite-wiki .wiki-inhalt h1 { margin-bottom: 8px; }
body.apple .seite-wiki .kopfzeile-mit-aktion { margin-bottom: 8px; }
body.apple .seite-wiki .kopfzeile-mit-aktion > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
body.apple .seite-wiki .wiki-meta { font-size: 14px; line-height: 1.4; margin: 0 0 16px; }
body.apple .seite-wiki .wiki-admin-band { border-radius: 12px; margin: 0 0 16px; font-size: 15px; }

/* gerenderter Text: gut lesbare Zeilenlänge, ruhige Überschriften */
body.apple .seite-wiki .wiki-text { font-size: 16px; line-height: 1.6; color: var(--farbe-text); }
body.apple .seite-wiki .wiki-text > :is(p, ul, ol, blockquote) { max-width: 78ch; }
body.apple .seite-wiki .wiki-text :is(h1, h2, h3, h4) { line-height: 1.3; letter-spacing: 0; }
body.apple .seite-wiki .wiki-text h1 { font-size: 24px; margin: 32px 0 8px; }
body.apple .seite-wiki .wiki-text h2 { font-size: 20px; margin: 28px 0 8px; padding-bottom: 6px; border-bottom-color: var(--a-linie, #e8dccb); }
body.apple .seite-wiki .wiki-text h3 { font-size: 17px; margin: 24px 0 6px; }
body.apple .seite-wiki .wiki-text h4 { font-size: 15px; margin: 20px 0 4px; }
body.apple .seite-wiki .wiki-text :is(h1, h2, h3, h4):first-child { margin-top: 0; }
body.apple .seite-wiki .wiki-text p { margin: 8px 0 12px; }
body.apple .seite-wiki .wiki-text li { margin: 4px 0; }
body.apple .seite-wiki .wiki-text a { text-underline-offset: 2px; }
body.apple .seite-wiki .wiki-text code { font-size: 14px; border-radius: 6px; padding: 1px 6px; }
body.apple .seite-wiki .wiki-text pre { border-radius: 12px; font-size: 14px; }
body.apple .seite-wiki .wiki-text blockquote { border-left-width: 4px; border-radius: 0 12px 12px 0; padding: 8px 14px; color: var(--farbe-text-mittel); }
body.apple .seite-wiki .wiki-text hr { border-top-color: var(--a-linie, #e8dccb); margin: 24px 0; }

/* Tabellen im Text: gleiche Optik wie die App-Tabellen */
body.apple .seite-wiki .wiki-text table { font-size: 15px; border-collapse: separate; border-spacing: 0; }
body.apple .seite-wiki .wiki-text table th:first-child { border-top-left-radius: 10px; }
body.apple .seite-wiki .wiki-text table th:last-child { border-top-right-radius: 10px; }
body.apple .seite-wiki .wiki-text table :is(th, td) { border: 0; border-bottom: 1px solid var(--a-linie, #e8dccb); padding: 10px 14px; vertical-align: top; }
body.apple .seite-wiki .wiki-text table th {
  font-size: 13px; line-height: 1.3; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--farbe-text-mittel);
  background: var(--a-gruppe-bg, #f5efe8); border-bottom-color: var(--a-rand, #c4b399);
}
body.apple .seite-wiki .wiki-text table tr:last-child td { border-bottom: 0; }

/* Aufklapper: Zeile mind. 44 px hoch, weicher Hover, Fokusring (kommt aus apple-global) */
body.apple .seite-wiki .wiki-text details { border-color: var(--a-linie, #e8dccb); border-radius: 14px; box-shadow: none; padding: 0 16px; margin: 12px 0; background: var(--farbe-flaeche); }
body.apple .seite-wiki .wiki-text details[open] { padding-bottom: 14px; }
body.apple .seite-wiki .wiki-text details > summary { min-height: 44px; box-sizing: border-box; display: flex; align-items: center; padding: 8px 0; line-height: 1.35; }
body.apple .seite-wiki .wiki-text details > summary:hover { color: var(--a-petrol, #0c577f); }
body.apple .seite-wiki .wiki-text details > summary::before { flex: 0 0 1em; }
body.apple .seite-wiki .wiki-text details > :is(p, ul, ol) { max-width: 78ch; }

/* Nur-Admin-Kasten und farbige Boxen: Farben bleiben, Ecken passend */
body.apple .seite-wiki .wiki-text .wiki-admin { border-radius: 12px; }
body.apple .seite-wiki .wiki-text .wiki-callout { border-radius: 12px; }

/* Handy: Seitenleiste oben als gruppierte Listen (je Kategorie eine Karte mit Zeilen), statt als Pillen, die unregelmäßig umbrechen */
@media (max-width: 800px) {
  body.apple .seite-wiki .wiki-layout { gap: 16px; }
  body.apple .seite-wiki .wiki-sidebar { width: 100%; }
  body.apple .seite-wiki .wiki-sidebar h3 { margin: 16px 0 6px; padding: 0 4px; }
  body.apple .seite-wiki .wiki-sidebar h3:first-child { margin-top: 0; }
  body.apple .seite-wiki .wiki-sidebar ul { background: #fff; border: 1px solid var(--a-linie, #e8dccb); border-radius: 14px; overflow: hidden; }
  body.apple .seite-wiki .wiki-sidebar li { margin: 0; max-width: 100%; }
  body.apple .seite-wiki .wiki-sidebar li + li { border-top: 1px solid var(--a-linie, #e8dccb); }
  body.apple .seite-wiki .wiki-sidebar a:not(.button) {
    min-height: 48px; display: flex; align-items: center; gap: 8px; border: 0; border-radius: 0; background: transparent; padding: 8px 14px;
  }
  body.apple .seite-wiki .wiki-sidebar a:not(.button)::after { content: "›"; margin-left: auto; color: #b4a78f; font-size: 18px; }
  body.apple .seite-wiki .wiki-sidebar a:not(.button):hover { background: var(--a-gruppe-bg, #f5efe8); }
  body.apple .seite-wiki .wiki-sidebar a.wiki-aktiv { background: var(--a-petrol-tint, #e3eef3); border: 0; }
  body.apple .seite-wiki .wiki-sidebar .button { margin-top: 4px; }
  body.apple .seite-wiki .wiki-inhalt { padding: 16px; }
  body.apple .seite-wiki .wiki-text h1 { font-size: 22px; }
  body.apple .seite-wiki .wiki-text h2 { font-size: 19px; }
}

/* ===== Wiki: Bearbeiten ===== */
body.apple .seite-wiki-formular #id_inhalt {
  min-height: 360px; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 14px; line-height: 1.5;
}
body.apple .seite-wiki-formular .karte form > a.button { margin-left: 8px; }
body.apple .seite-wiki-formular > .hinweis { margin: 0 0 12px; }
/* Der Hilfetext zum Inhalt enthält die Zeichen <details>/<summary> als Roh-HTML (Modell-Hilfetext) und wird deshalb vom Browser als echte
   Aufklapper gelesen (landet dann direkt im Formular); hier nur optisch zurück auf Fließtext (der Fehler selbst steckt im Hilfetext, siehe Bericht). */
body.apple .seite-wiki-formular .karte form :is(details, summary) {
  display: inline; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; font-weight: 400; color: inherit;
}

/* ===== Wiki: Löschen bestätigen ===== */
body.apple .seite-wiki-loeschen > h1 { font-size: 26px; max-width: 32ch; }
body.apple .seite-wiki-loeschen > p { font-size: 16px; color: var(--farbe-text-mittel); margin: 0 0 20px; }
body.apple .seite-wiki-loeschen form { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
body.apple .seite-wiki-loeschen form button.button-gefahr {
  display: inline-flex; align-items: center; justify-content: center; min-height: var(--a-h-knopf); padding: 0 18px; box-sizing: border-box;
  border: 0; border-radius: 999px; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1.2; cursor: pointer;
  background: var(--a-gefahr); color: #fff; transition: background-color var(--a-sprung), transform var(--a-sprung);
}
body.apple .seite-wiki-loeschen form button.button-gefahr:hover { background: var(--a-gefahr-dunkel); }
body.apple .seite-wiki-loeschen form button.button-gefahr:active { background: #752a24; transform: translateY(.5px); }

/* ===== Links ===== */
body.apple .seite-links .link-karte {
  position: relative; padding: 14px 52px 14px 20px; margin-bottom: 12px; text-decoration: none;
  transition: border-color var(--a-sprung), box-shadow var(--a-sprung);
}
body.apple .seite-links .link-karte::after {
  content: "↗" / ""; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);
  font-size: 18px; line-height: 1; color: var(--farbe-text-mittel); transition: color var(--a-sprung);
}
body.apple .seite-links .link-karte:hover { border-color: var(--a-petrol, #0c577f); box-shadow: 0 4px 12px -6px rgba(58, 38, 28, .22); }
body.apple .seite-links .link-karte:hover::after { color: var(--a-petrol, #0c577f); }
body.apple .seite-links .link-karte:active { background: #fcfaf6; }
body.apple .seite-links .link-domain { font-size: 13px; line-height: 1.3; color: var(--farbe-text-mittel); overflow-wrap: anywhere; }
body.apple .seite-links .link-titel { font-size: 17px; line-height: 1.3; font-weight: 600; color: var(--farbe-text); margin: 2px 0; overflow-wrap: anywhere; }
body.apple .seite-links .link-karte:hover .link-titel { color: var(--a-petrol, #0c577f); }
body.apple .seite-links .link-beschreibung { font-size: 15px; line-height: 1.4; color: var(--farbe-text-mittel); }
body.apple .seite-links .link-logo { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--a-linie, #e8dccb); }
body.apple .seite-links .link-logo img { border-radius: 12px; border: 1px solid var(--a-linie, #e8dccb); }
body.apple .seite-links .link-logo p { margin: 12px 0 0; }
@media (max-width: 800px) {
  body.apple .seite-links .link-karte { padding: 14px 44px 14px 16px; }
  body.apple .seite-links .link-karte::after { right: 16px; }
}

/* ===== Statistik ===== */
body.apple .seite-statistik .statistik-jahre { margin: 4px 0 8px; }
body.apple .seite-statistik .statistik-monate { margin: 0 0 16px; }
body.apple .seite-statistik :is(.statistik-jahre, .statistik-monate) .status-knopf { padding: 0 14px; }
body.apple .seite-statistik .statistik-jahre .status-knopf { min-width: 64px; }
body.apple .seite-statistik .koordinator-filter {
  border-color: var(--a-linie, #e8dccb); border-radius: var(--a-r-karte, 16px); padding: 12px 16px; box-shadow: 0 1px 2px rgba(58, 38, 28, .06);
  font-size: 15px;
}
body.apple .seite-statistik .koordinator-filter-label { font-size: 14px; color: var(--farbe-text); }
body.apple .seite-statistik .koordinator-filter-optionen { gap: 4px 16px; margin-top: 8px; }
body.apple .seite-statistik .koordinator-filter-option { min-height: 32px; gap: 8px; }
body.apple .seite-statistik > .hinweis-klein { max-width: 80ch; margin: 0 0 20px; }
body.apple .seite-statistik .statistik-person { padding: 20px 24px; margin-bottom: 20px; }
body.apple .seite-statistik .statistik-person h2 { font-size: 20px; margin-bottom: 12px; }
body.apple .seite-statistik .statistik-person h3 { font-size: 16px; margin: 28px 0 8px; color: var(--farbe-text); }
body.apple .seite-statistik .statistik-person .tabelle { width: 100%; }
body.apple .seite-statistik .statistik-person .tabelle td strong { font-size: 16px; font-variant-numeric: tabular-nums; }
@media (max-width: 800px) {
  body.apple .seite-statistik .statistik-person { padding: 14px 16px; }
  body.apple .seite-statistik .statistik-person h2 { font-size: 18px; }
  body.apple .seite-statistik .statistik-person .tabelle-karten tr { background: #fff; }
  body.apple .seite-statistik .statistik-person .tabelle-karten tr:last-child { margin-bottom: 0; }
  body.apple .seite-statistik .koordinator-filter-option { min-height: 44px; }
}
@media (pointer: coarse) { body.apple .seite-statistik .koordinator-filter-option { min-height: 44px; } }

/* ===== Support ===== */
body.apple .seite-support .karte { max-width: 760px; padding: 20px 24px; }
body.apple .seite-support .karte > p:first-child { font-size: 16px; line-height: 1.5; margin: 0 0 12px; }
body.apple .seite-support .karte > .hinweis-klein {
  background: #faedd6; border: 1px solid #ebd2a4; border-radius: 12px; padding: 10px 14px; margin: 0 0 20px;
  font-size: 15px; line-height: 1.4; color: var(--a-hinweis-text);
}
body.apple .seite-support .karte form button[type="submit"] { min-width: 120px; }
@media (max-width: 800px) { body.apple .seite-support .karte { padding: 16px; } }

/* ===== Design-Einstellungen (Admin, gilt sofort für alle) ===== */
body.apple .seite-design > h1 { margin-bottom: 8px; }
body.apple .seite-design > .hinweis-klein { font-size: 15px; margin: 0 0 20px; max-width: 80ch; }
body.apple .seite-design > .hinweis { margin: 0 0 12px; }
body.apple .seite-design .karte { max-width: 760px; padding: 20px 24px; }
body.apple .seite-design .karte img { border-radius: 12px; border: 1px solid var(--a-linie, #e8dccb); background: #fff; padding: 8px; box-sizing: content-box; }
body.apple .seite-design .karte form label { margin-bottom: 6px; }
/* Hexcode-Feld + Farbfeld: gleiche Höhe, nebeneinander */
body.apple .seite-design .hex-farbe-feld { display: flex; align-items: center; gap: 8px; max-width: 280px; }
body.apple .seite-design .hex-farbe-feld > input:not([type="color"]) { flex: 1 1 auto; min-width: 0; width: auto; font-variant-numeric: tabular-nums; }
body.apple .seite-design .hex-farbe-feld input[type="color"] {
  flex: 0 0 auto; width: 52px; height: var(--a-h-feld, 40px); min-height: 0; padding: 4px; box-sizing: border-box;
  border: 1px solid var(--a-rand, #c4b399); border-radius: var(--a-r-feld, 12px); background: #fff; cursor: pointer;
}
body.apple .seite-design .hex-farbe-feld input[type="color"]:hover { border-color: #a8977a; }
/* Datei-Auswahl: Knopf wie ein Sekundärknopf */
body.apple .seite-design .karte input[type="file"] { font-family: inherit; font-size: 14px; color: var(--farbe-text-mittel); max-width: 100%; }
body.apple .seite-design .karte input[type="file"]::file-selector-button {
  min-height: var(--a-h-knopf); padding: 0 16px; margin-right: 12px; border: 1.5px solid var(--a-rand, #c4b399); border-radius: 999px;
  background: transparent; color: var(--farbe-text); font: inherit; font-weight: 600; cursor: pointer;
}
body.apple .seite-design .karte input[type="file"]::file-selector-button:hover { background: var(--a-gruppe-bg, #f5efe8); }
@media (max-width: 800px) { body.apple .seite-design .karte { padding: 16px; } }

@media (prefers-reduced-motion: reduce) {
  body.apple :is(.link-karte, .wiki-sidebar a) { transition: none; }
}

/* Design-Seite: "Chat aktiviert" als Ein/Aus-Schalter (gleiche Optik wie "Chat ausblenden" im Profil) */
body.apple .seite-design .karte form p:has(> input[name="chat_aktiviert"]) { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; min-height: 44px; }
body.apple .seite-design .karte form p:has(> input[name="chat_aktiviert"]) label { margin: 0; font-size: 16px; font-weight: 600; cursor: pointer; }
body.apple .seite-design .karte form input[name="chat_aktiviert"] {
  -webkit-appearance: none; appearance: none; order: -1; flex: 0 0 auto; position: relative; cursor: pointer;
  width: 48px; height: 28px; min-height: 0; margin: 0; padding: 0; border-radius: 999px; box-sizing: border-box;
  background: #8a7d68; border: 0; transition: background-color var(--a-sprung, .15s ease);
}
body.apple .seite-design .karte form input[name="chat_aktiviert"]::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3); transition: transform var(--a-sprung, .15s ease);
}
body.apple .seite-design .karte form input[name="chat_aktiviert"]:checked { background: var(--farbe-primaer); }
body.apple .seite-design .karte form input[name="chat_aktiviert"]:checked::after { transform: translateX(20px); }
body.apple .seite-design .karte form input[name="chat_aktiviert"]:focus-visible { outline: 2px solid var(--a-petrol, #0c577f); outline-offset: 2px; }
body.apple .seite-design .karte form p:has(> input[name="chat_aktiviert"]) .helptext { flex-basis: 100%; margin: 0; }