/* updatelog.css – Neuigkeiten nach Updates (S176, Backlog #242).
 * Fenster nach der Skizze S173-03, Seite unter Einstellungen → Neuigkeiten.
 * Nicht tragend (build.sh: .css ist optional); ohne die Datei stehen die
 * Einträge als schlichte Liste da. */

.updatelog__count {
  margin-bottom: var(--space-md);
}

/* Wichtiges oben im Fenster und am Eintrag der Seite: Kasten mit Rahmen in der
 * Grundfarbe — kein Warnorange, es ist eine Ankündigung, kein Fehler. */
.updatelog__important {
  border: 2px solid var(--color-primary);
  border-radius: var(--radius-sm);
  padding: var(--space-sm) var(--space-md);
  margin-bottom: var(--space-md);
}

.updatelog__important-title {
  font-weight: 700;
  margin-bottom: var(--space-xs);
}

.updatelog__date {
  font-size: var(--font-size-base);
  font-weight: 700;
  color: var(--color-text-muted);
  margin-bottom: var(--space-xs);
}

/* Punkte ausdrücklich: die Grundformatierung nimmt Listen den Punkt, übrig
 * bliebe ein Einzug ohne Grund (CDP-Lauf S176). */
.updatelog__items {
  list-style: disc outside;
  margin: 0 0 var(--space-md);
  padding-left: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  line-height: 1.45;
}

.updatelog__items li::marker {
  color: var(--color-text-muted);
}

.updatelog__older {
  margin-bottom: var(--space-sm);
}

/* Mit dem Pfeil des Browsers wie der Schattentest-Aufklapper (kein eigenes
 * Zeichen, #152). Das Polster bringt das Tippziel auf gut 44 px. */
.updatelog__older-summary {
  cursor: pointer;
  padding-block: var(--space-sm);
}

.updatelog__older-summary .updatelog__date {
  display: inline;
}

.updatelog__older-summary:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* Seite: je Eintrag eine Karte wie die Einträge der übrigen Einstellungs-Seiten. */
.updatelog-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.updatelog-page__entry {
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}

.updatelog-page__entry .updatelog__items {
  margin-bottom: 0;
}

.updatelog-page__empty {
  color: var(--color-text-muted);
}