/* Header im syslinx.org-Dunkelgrün statt Carbon-Schwarz.
   Lokale Ergänzung, nicht Teil des weewx-wdc-Skins. */
bx-header {
  background-color: #2d7a5a !important;
  border-bottom: 1px solid #256a4e;
}

/* Stationsname, "WeeWX"-Prefix und Navigationslinks hell */
bx-header-name::part(link),
bx-header-name::part(prefix),
bx-header-nav-item::part(link) {
  color: #f2f4f0 !important;
}

bx-header-nav-item::part(link):hover {
  background-color: #256a4e !important;
  color: #ffffff !important;
}

/* Hamburger-Menü-Icon (nutzt currentColor) */
bx-header-menu-button::part(button) {
  color: #f2f4f0 !important;
}
bx-header-menu-button::part(button):hover {
  background-color: #256a4e !important;
}

/* Das blaue WDC-Logo ausblenden (Blau passt nicht zum Gruen) */
bx-header-name > svg {
  display: none;
}

/* MQTT-Statusbanner: hell im Light Mode statt pauschal dunkel.
   Die Komponente nutzt --cds-inverse-*-Variablen. */
bx-inline-notification {
  --cds-inverse-02: #e0e0e0;
  --cds-inverse-01: #161616;
  --cds-inverse-support-02: #2d7a5a;
  --cds-inverse-focus-ui: #2d7a5a;
}
html.dark bx-inline-notification {
  --cds-inverse-02: #393939;
  --cds-inverse-01: #f4f4f4;
  --cds-inverse-support-02: #42be65;
}

/* Blitz-Kachel: darf mit der "Letzter Blitz"-Info hoeher werden */
.stat-tile[data-observation="lightning_strike_count"] {
  height: auto;
}

/* Blitz-Detailzeilen: oben ausrichten statt vertikal zentrieren */
.stat-tile .bx--row.lightning-last-detail {
  align-items: flex-start;
}
.stat-tile .bx--row.lightning-last-detail .stat-value + .stat-label {
  margin-top: 0.375rem;
}

/* Beschreibungstext ueber den Tabellen der klimatologischen Tage */
.climatological-day-table .clim-day-description {
  margin: 0.5rem 0 1rem;
  color: var(--cds-text-02, #6f6f6f);
  font-size: 0.875rem;
}

/* Trennlinie im Header: dunkelgrau und buendig mit der Seitenleisten-Kante.
   Der Titelbereich bekommt die Seitenleisten-Breite (16rem), dadurch rueckt
   der Divider der Header-Nav exakt an die Kante ("Heute" bleibt direkt
   daneben); Farbe ueber das Shadow-Part des Carbon-Divider-Elements. */
@media (min-width: 66rem) {
  bx-header-name {
    width: 16rem;
  }
}
bx-header-nav::part(divider) {
  background-color: #b8c0bc; /* gedaempftes Grau, sichtbar auf dem Gruen */
}

/* Warn-Kachel auf der Startseite: per Default zugeklappt, Klick klappt
   Beschreibung/Verhaltenshinweise/Quelle auf (Kopfzeile bleibt sichtbar). */
.warning-collapsible .bx--tile {
  cursor: pointer;
  /* gleicher Abstand wie zwischen den Beobachtungskacheln (.stat-tile) */
  margin-bottom: var(--cds-spacing-05, 1rem) !important;
}
.warning-collapsible.collapsed .dwd-warning-row > :not(header),
.warning-collapsible.collapsed .dwd-warning > p {
  display: none;
}
.warning-collapsible .warning-header h4::after {
  content: " \25B4"; /* ▴ */
  font-size: 0.75em;
  opacity: 0.6;
}
.warning-collapsible.collapsed .warning-header h4::after {
  content: " \25BE"; /* ▾ */
}