/* ===========================================================================
   Mein Arbeitsplatz — nur das Zusaetzliche (Praefix `ap-`)
   ===========================================================================

   Die gemeinsame Huelle der neuen Ansichten (Kopfzeile, Knoepfe, Karten,
   Felder, Pillen, Hinweise) steht in `sitzung.css`. Hier steht nur, was der
   Arbeitsplatz darueber hinaus braucht.

   KEIN EINZIGER FARBWERT. Alles ueber die Theme-Tokens aus `styles.css` —
   der Markenton hat genau einen Austauschpunkt (Whitelabel), ein Test wacht
   darueber.
   =========================================================================== */

/* ---------- Begruessung --------------------------------------------------- */
.ap-gruss{margin-bottom:var(--sp-5)}
.ap-gruss h1{font-size:1.625rem;margin-bottom:var(--sp-1)}
.ap-lage{color:var(--text-muted);margin:0;font-size:.9375rem}
.ap-warnung{color:var(--status-offen)}

/* ---------- Naechste Sitzung ---------------------------------------------- */
.ap-sitzung{display:flex;gap:var(--sp-5);align-items:center;flex-wrap:wrap;
  border-color:var(--accent);background:linear-gradient(135deg,var(--accent-soft),var(--bg-elevated));
  margin-bottom:var(--sp-5)}
.ap-countdown{font-size:2rem;font-weight:800;color:var(--accent-strong);white-space:nowrap;
  line-height:1.15}
.ap-countdown small{display:block;font-size:.6875rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--text-muted)}
.ap-sitzung-text{flex:1 1 260px;min-width:0}
.ap-sitzung-text h2{margin:2px 0 6px;font-size:1.125rem}
.ap-sitzung-meta{display:flex;gap:var(--sp-4);flex-wrap:wrap;margin:0 0 var(--sp-2);
  font-size:.875rem;color:var(--text-muted)}
.ap-sitzung-meta span{display:inline-flex;align-items:center;gap:6px}
.ap-sitzung-aktion{display:flex;flex-direction:column;gap:var(--sp-2);align-items:stretch}

.ap-avatare{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.ap-avatar{width:28px;height:28px;border-radius:50%;background:var(--accent-soft);
  color:var(--accent-strong);display:inline-flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.6875rem;flex:none;border:2px solid var(--bg-elevated);
  margin-left:-8px}
.ap-avatare .ap-avatar:first-child{margin-left:0}
.ap-avatar-rest{background:var(--bg-sunken);color:var(--text-muted)}

/* ---------- Zweispaltiges Raster ------------------------------------------ */
.ap-raster{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--sp-5);align-items:start}
.ap-spalte{display:flex;flex-direction:column;gap:var(--sp-5);min-width:0}
@media (max-width:900px){.ap-raster{grid-template-columns:1fr}}

.ap-karte-kopf{display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.ap-karte-kopf h2{margin:0;font-size:1.0625rem}

/* ---------- Meine offenen Aufgaben ---------------------------------------- */
.ap-gruppe + .ap-gruppe{margin-top:var(--sp-4)}
.ap-gruppe h3{font-size:.8125rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--text-muted);margin-bottom:var(--sp-2);display:flex;align-items:center;gap:6px}
.ap-gruppe-warnung h3{color:var(--status-offen)}
.ap-liste{list-style:none;margin:0;padding:0}
.ap-aufgabe{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;
  padding:var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);
  margin-bottom:var(--sp-2);background:var(--bg-elevated)}
.ap-aufgabe-warnung{border-color:var(--status-offen);background:var(--status-offen-bg)}
.ap-a-haupt{flex:1 1 240px;min-width:0}
.ap-a-titel{font-weight:600;font-size:.9375rem;color:var(--accent-strong);
  text-decoration:none}
.ap-a-titel:hover{color:var(--accent-strong-hover);text-decoration:underline}
.ap-a-meta{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;
  font-size:.75rem;color:var(--text-muted);margin-top:4px}
.ap-a-meta span{display:inline-flex;align-items:center;gap:5px}
.ap-a-frist{white-space:nowrap;font-weight:700;font-size:.8125rem;
  display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.ap-prio-dringend{color:var(--prio-dringend);background:var(--prio-dringend-bg)}
.ap-prio-mittel{color:var(--prio-mittel);background:var(--prio-mittel-bg)}
.ap-prio-niedrig{color:var(--prio-niedrig);background:var(--prio-niedrig-bg)}

/* ---------- Seit dem letzten Protokoll ------------------------------------ */
.ap-strom{list-style:none;margin:var(--sp-3) 0 0;padding:0}
.ap-strom li{position:relative;padding:0 0 var(--sp-4) var(--sp-5);
  border-left:2px solid var(--border)}
.ap-strom li:last-child{border-color:transparent;padding-bottom:0}
.ap-strom li::before{content:"";position:absolute;left:-7px;top:2px;width:12px;height:12px;
  border-radius:50%;background:var(--accent);border:2px solid var(--bg-elevated)}
.ap-strom-titel{font-weight:600;font-size:.875rem}
.ap-strom-titel a{color:var(--accent-strong)}
.ap-strom-meta{font-size:.75rem;color:var(--text-muted);display:flex;align-items:center;gap:6px}
.ap-strom-fuss{margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:1px solid var(--border)}

/* ---------- Schnellerfassung ---------------------------------------------- */
.ap-schnell{display:flex;gap:var(--sp-3);align-items:flex-end;flex-wrap:wrap;
  margin-top:var(--sp-3)}
.ap-schnell-titel{flex:1 1 220px;min-width:0}
.ap-schnell-liste{flex:0 1 190px}
.ap-schnell-wer{flex:0 1 170px}
/* Die Folgezeile unter „Verantwortlich": „… hat kein Benutzerkonto"
   (15.08.2026). `.ap-schnell` ist eine Flex-Zeile, deshalb `flex-basis:100%` —
   sonst stuende der Satz neben dem Anlegen-Knopf statt darunter. Ohne Wahl
   ist der Kasten leer; dann darf er weder Hoehe noch die Luecke der Zeile
   kosten. */
.ap-zugang{flex-basis:100%}
.ap-zugang:empty{display:none}
.ap-zugang .sz-hinweis{margin-bottom:0}
.ap-neu{list-style:none;margin:var(--sp-3) 0 0;padding:0;display:flex;
  flex-direction:column;gap:6px}
.ap-neu li{display:flex;align-items:center;gap:8px;font-size:.8125rem;
  background:var(--bg-sunken);border-radius:var(--radius-sm);padding:6px 10px}
.ap-neu li svg{color:var(--status-erledigt);flex:none}
.ap-neu li span{flex:1;min-width:0}
.ap-neu li a{color:var(--accent-strong)}

/* ---------- Weckliste (16.08.2026) ----------------------------------------
   Dieselbe Formensprache wie „Meine offenen Aufgaben" darueber: Gruppe mit
   kleiner Ueberschrift, gerahmte Zeilen, und die Warnrolle nur dort, wo sie
   etwas heisst. `verpasst` bekommt sie, weil dafuer keine Mail mehr kommt.
   Neben der Farbe steht immer das Wort „Verpasst" — Rot allein traegt weder im
   Graustufendruck noch bei Farbsehschwaeche eine Aussage. */
.ap-wecker .ap-karte-kopf h2{display:inline-flex;align-items:center;gap:8px}
.ap-w-gruppe + .ap-w-gruppe{margin-top:var(--sp-4)}
.ap-w-gruppe h3{font-size:.8125rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--text-muted);margin-bottom:var(--sp-1);display:flex;align-items:center;gap:6px}
.ap-w-gruppe-warnung h3{color:var(--status-offen)}
.ap-w-gruppe > p{margin:0 0 var(--sp-2)}
.ap-w-zeile{display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap;
  padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);
  border-radius:var(--radius-md);margin-bottom:6px;background:var(--bg-elevated)}
.ap-w-zeile-warnung{border-color:var(--status-offen);background:var(--status-offen-bg)}
.ap-w-zeit{white-space:nowrap;font-weight:700;font-size:.8125rem;flex:none;
  display:inline-flex;align-items:center;gap:6px;color:var(--text-muted)}
.ap-w-zeile-warnung .ap-w-zeit{color:var(--status-offen)}
.ap-w-titel{font-size:.875rem;color:var(--accent-strong);text-decoration:none;
  flex:1 1 150px;min-width:0}
.ap-w-titel:hover{color:var(--accent-strong-hover);text-decoration:underline}

/* Der Zustand des Versandlaufs. Abgesetzt durch eine Linie: er gehoert zur
   Karte, ist aber keine Aufgabe. „Frisch" ist eine stille graue Zeile,
   „alt" ein Kasten in der Warnrolle -- der Unterschied muss ins Auge fallen,
   sonst sieht ein toter Lauf aus wie ein ruhiger Tag. */
.ap-w-lauf{margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:1px solid var(--border)}
.ap-w-lauf p{margin:0;display:flex;gap:6px;align-items:flex-start}
.ap-w-lauf svg{flex:none;margin-top:2px}
.ap-w-lauf-alt{font-size:.8125rem;color:var(--status-offen);
  background:var(--status-offen-bg);border:1px solid var(--status-offen);
  border-radius:var(--radius-md);padding:var(--sp-2) var(--sp-3)}

/* ---------- Startseite ----------------------------------------------------- */
.ap-start .sz-feld{max-width:320px}
