/* ══ Apple-Kalender (frontend/kalender.js, seit 28.10.2026)
   Heute › Termine als ruhige Liste wie in der Kalender-App (Zeit links,
   Titel, Kalender rechts) und die Auswahl in System › Apple-Kalender.
   Der Punkt trägt die Farbe des Kalenders aus iCloud; ohne gültige Farbe
   bleibt er neutral. Schrift und Abstände nur aus der Skala. */

.kal-liste { padding-top: var(--sp-2); padding-bottom: var(--sp-2); }
.kal-tag {
  font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .04em;
  padding: var(--sp-3) 0 var(--sp-1);
}
.kal-tag:first-child { padding-top: var(--sp-1); }
.kal-zeile {
  display: flex; align-items: baseline; gap: var(--sp-3);
  min-height: 36px; padding: var(--sp-2) 0;
  border-top: 1px solid var(--border);
}
.kal-tag + .kal-zeile { border-top: 0; }
.kal-zeit { flex: none; width: 96px; white-space: nowrap; font-size: var(--fs-sm); color: var(--text-muted); font-variant-numeric: tabular-nums; }
.kal-text { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; }
.kal-titel { color: var(--text); font-size: var(--fs-base); }
.kal-ort { color: var(--text-muted); font-size: var(--fs-sm); }
.kal-kal { flex: none; color: var(--text-subtle); font-size: var(--fs-xs); }
.kal-punkt {
  display: inline-block; flex: none; width: 9px; height: 9px; border-radius: 50%;
  background: var(--text-subtle); align-self: center;
}

.kal-auswahl { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin: var(--sp-2) 0; }
.kal-wahl { display: inline-flex; align-items: center; gap: var(--sp-2); font-size: var(--fs-sm); color: var(--text); cursor: pointer; min-height: 32px; }
.kal-wahl input { margin: 0; }
.kal-eigene { margin-top: var(--sp-2); }

@media (max-width: 640px) {
  .kal-zeit { width: 92px; }
  .kal-kal { display: none; }
}