/**
 * Dunkle Fassung, gesteuert von der Geraeteeinstellung.
 *
 * Die Richtung Wabe steckt in Tokens, deshalb genuegt es, sie neu zu belegen.
 * Danach folgen die Stellen, an denen im Hellen Farben fest eingetragen sind:
 * das dunkle Band und der Fussbereich benutzen --ml-ink als Grund und wuerden
 * sonst hell auf hell stehen.
 */
@media (prefers-color-scheme: dark) {

/* Doppelt notiert: global-settings.css laedt spaeter und setzt die
   Breakdance-Tokens ebenfalls auf :root. Nur mit hoeherer Spezifitaet
   bleibt die dunkle Fassung stehen. */
:root,:root:root{
 --ml-bg:#15171A;--ml-surface:#1E2125;--ml-ink:#ECEAE3;--ml-muted:#A5A199;
 --ml-accent:#FFC300;--ml-accent-deep:#FFD24D;--ml-line:#32353A;
 --bde-headings-color:#ECEAE3;--bde-body-text-color:#ECEAE3}

/* Greift auch dort, wo keine Breakdance-Sektion drumherum steht. */
:root h1,:root h2,:root h3,:root h4,:root h5,:root h6{color:var(--ml-ink)}
.ml-scope h1,.ml-scope h2,.ml-scope h3{color:var(--ml-ink)}
.ml-card__title,.ml-naehe__titel,.ml-comment__author{color:inherit}

.ml-scope{background:var(--ml-bg);color:var(--ml-ink)}
body{background:var(--ml-bg) !important;color:var(--ml-ink)}

/* Flaechen, die im Hellen weiss sind */
.ml-card__pin{background:var(--ml-surface)}
.ml-melden__form select,.ml-melden__form textarea,.ml-melden__form input[type=email]{background:var(--ml-surface);color:var(--ml-ink)}
.ml-ortverweis:hover{background:#26282D}

/* Das Band und der Fuss nehmen im Hellen --ml-ink als Grund. */
.ml-band{background:#22252B}
.ml-band h2{color:var(--ml-ink)}
.ml-band p{color:var(--ml-muted)}
.ml-band__list a{color:var(--ml-ink);border-color:#3D4046}
.ml-band__list a.is-on{color:#1A1C20}
.ml-footer{background:#101216;color:var(--ml-muted)}
.ml-footer__claim{color:var(--ml-ink)}
.ml-footer__nav a{color:var(--ml-muted)}
.ml-footer__legal{color:#7C7972;border-top-color:#2A2D32}
#site-footer,.site-footer,footer#colophon{background:#101216 !important;color:var(--ml-muted) !important}

/* Gelb bleibt Flaeche, darauf steht weiterhin Anthrazit. */
.ml-abstand,.ml-empfohlen,.ml-chip--on,.ml-chips--wahl input:checked + label{color:#1A1C20}
.ml-btn{color:#1A1C20}
input[type=submit],button,.button,.btn{color:#1A1C20 !important}
.ml-search button.ml-suche__standort{color:var(--ml-muted) !important}
.ml-search button.ml-suche__standort:hover{color:#1A1C20 !important}
.ml-nav a.is-on{color:#1A1C20}

/* Eingabefelder */
.ml-search input[type=search],.ml-naehe__ort,.ml-naehe__auswahl{background:var(--ml-surface);color:var(--ml-ink);border-color:var(--ml-line)}
.ml-search input[type=search]::placeholder,.ml-naehe__ort::placeholder{color:var(--ml-muted)}

/* Breakdance faerbt alles in einer Sektion fest auf Anthrazit. Das muss
   ausgestochen werden, sonst steht dunkelgrau auf dunklem Grund. */
#bde-main .bde-section *:not(.button-atom__text){color:var(--ml-ink)}

/* Wo Gelb den Grund bildet, bleibt die Schrift dunkel. */
#bde-main .bde-section .ml-chip--on,
#bde-main .bde-section .ml-abstand,
#bde-main .bde-section .ml-empfohlen,
#bde-main .bde-section .ml-btn,
#bde-main .bde-section .ml-nav a.is-on,
#bde-main .bde-section button,
#bde-main .bde-section input[type=submit]{color:#1A1C20}

/* Und die Nebentoene bleiben Nebentoene. */
#bde-main .bde-section .ml-card__kicker{color:var(--ml-accent-deep)}
#bde-main .bde-section .ml-card__place,
#bde-main .bde-section .ml-rating,
#bde-main .bde-section .ml-chip,
#bde-main .bde-section .ml-hero__lede,
#bde-main .bde-section .ml-map__note{color:var(--ml-muted)}
#bde-main .bde-section .ml-rating__stars{color:var(--ml-accent)}
#bde-main .bde-section .ml-link,
#bde-main .bde-section .ml-map__cat{color:var(--ml-accent-deep)}

/* Bilder wirken auf dunklem Grund schnell zu grell. */
.ml-card__media img,.ml-detail__hero img{filter:brightness(.94)}
.ml-card:hover .ml-card__media img{filter:none}

/* Das Ausklappfeld unter der Suche */
.ml-suche__panel{background:var(--ml-surface);border-color:var(--ml-line);box-shadow:0 14px 34px rgba(0,0,0,.55)}
.ml-naehe__zeile:hover{background:#26282D}

/* Backend-Kaesten nicht anfassen, die folgen dem WordPress-Schema. */
}
