/**
 * Dark Mode – Ergänzungen zur dunklen Palette (inc/dark-mode.php).
 * Die meisten Komponenten folgen automatisch den Paletten-Variablen; hier nur Stellen,
 * die im hellen Design bewusst Weiß als Fläche oder feste Farben verwenden.
 */
html.praxis-dark { background: var(--wp--preset--color--base); }
html.praxis-dark body { background: var(--wp--preset--color--base); color: var(--wp--preset--color--ink); }

/* Weiße Karten/Flächen → dunkle Fläche */
html.praxis-dark :is(
	.praxis-dl,
	.praxis-contact__formcard,
	.praxis-tone--surface .praxis-times__panel,
	.praxis-ftiles--white .praxis-ftile2,
	.praxis-lrows--white .praxis-lrow,
	.praxis-fgrid--white .praxis-ftile,
	.praxis-services--check.praxis-tone--surface .praxis-service,
	.praxis-rtable__scroll,
	.praxis-rtable__table tbody tr > *
) { background: var(--wp--preset--color--surface); }
html.praxis-dark .praxis-tone--surface .praxis-form__field :is(input, textarea) { background: var(--wp--preset--color--base); }
html.praxis-dark .praxis-lrow { background: color-mix(in srgb, var(--praxis-primary) 7%, var(--wp--preset--color--surface)); border-color: color-mix(in srgb, var(--praxis-primary) 18%, var(--wp--preset--color--surface)); }
html.praxis-dark .praxis-rtable--m-cards .praxis-rtable__table tbody tr { background: var(--wp--preset--color--surface); }

/* Kleine weiße Icon-Kreise auf Akzentflächen */
html.praxis-dark :is(.is-tone-accent .praxis-bento__icon, .praxis-services--bento .praxis-service:nth-child(4) .praxis-service__icon, .praxis-notice__icon) { background: var(--wp--preset--color--base); }

/* Weiße Knöpfe auf Fotos bleiben weiß – dann aber mit dunkler Schrift */
html.praxis-dark :is(.praxis-fslider--photo .praxis-fcard__arrow, .praxis-ftile__arrow) { color: #0F1B1E; }

/* Sektion „Primär“: weiße Schrift braucht die dunklere Original-Primärfarbe */
html.praxis-dark .praxis-tone--primary { background: var(--praxis-primary-deep, var(--wp--preset--color--primary)); }
html.praxis-dark .praxis-tone--primary .praxis-btn--primary:hover,
html.praxis-dark :is(.praxis-tone--dark, .praxis-tone--primary) .praxis-btn--primary:hover { color: #0F1B1E; }
html.praxis-dark :is(.praxis-tone--dark, .praxis-tone--primary) .praxis-btn--secondary:hover { color: #0F1B1E; }

/* Bildkacheln mit hellem Verlauf: Verlauf in Hintergrundfarbe, Text hell */
html.praxis-dark .praxis-services--ov-light .praxis-service::before { background: linear-gradient(180deg, transparent 35%, color-mix(in srgb, var(--wp--preset--color--base) 72%, transparent) 68%, color-mix(in srgb, var(--wp--preset--color--base) 92%, transparent) 100%); }
html.praxis-dark .praxis-services--ov-light .praxis-service { --praxis-ink-soft: var(--wp--preset--color--ink-soft); }

/* Logos (Graustufen-Variante): dunkle Logos hell darstellen */
html.praxis-dark .praxis-marquee.is-gray.praxis-marquee--logos img { filter: grayscale(1) invert(1) brightness(1.1); opacity: .7; }
html.praxis-dark .praxis-marquee.is-gray.praxis-marquee--logos .praxis-marquee__item:hover img { filter: grayscale(1) invert(1) brightness(1.25); opacity: 1; }

/* Schatten auf dunklem Grund: dezenter Rand statt unsichtbarem Schatten */
html.praxis-dark .praxis-card { border-color: var(--wp--preset--color--line); }

/* Native Formularelemente, Scrollbars */
html.praxis-dark :is(input, textarea, select) { color-scheme: dark; }

/* WordPress-Buttons (Suche, Button-Block, Theme-Elemente): Schrift passend zur aufgehellten Primärfarbe */
html.praxis-dark :is(.wp-element-button, .wp-block-button__link:not(.has-text-color), .wp-block-search__button, .wp-block-file__button) { color: var(--praxis-on-primary, #0F1B1E); }

/* Filter-Kacheln: Standardfläche leicht getönt statt fast weiß */
html.praxis-dark .praxis-ftile2 { background: color-mix(in srgb, var(--praxis-primary) 7%, var(--wp--preset--color--surface)); }
html.praxis-dark .praxis-ftiles--surface .praxis-ftile2 { background: var(--wp--preset--color--surface); }
html.praxis-dark .praxis-ftiles--outline .praxis-ftile2 { background: transparent; }

/* Hinweis-Box: dunkle, farbig getönte Fläche */
html.praxis-dark .praxis-notice--warning .praxis-notice__box { background: color-mix(in srgb, #E5A100 18%, var(--wp--preset--color--surface)); }
html.praxis-dark .praxis-notice--success .praxis-notice__box { background: color-mix(in srgb, var(--praxis-highlight) 16%, var(--wp--preset--color--surface)); }
html.praxis-dark .praxis-notice--warning .praxis-notice__icon { color: #F2C14E; }
html.praxis-dark .praxis-notice__close { border-color: var(--wp--preset--color--line); }

/* Glas-Karte im Hero */
html.praxis-dark .praxis-hero__card { background: color-mix(in srgb, var(--wp--preset--color--surface) 86%, transparent); }

/* Halbtransparente weiße Flächen (Kontakt-Band, Karten-Platzhalter) */
html.praxis-dark .praxis-cband__routes { background: color-mix(in srgb, var(--wp--preset--color--surface) 80%, transparent); }
html.praxis-dark .praxis-map-consent { background: color-mix(in srgb, var(--wp--preset--color--surface) 92%, transparent); color: var(--wp--preset--color--ink); }

/* Flächen in Primärfarbe mit weißer Schrift → dunklere Original-Primärfarbe */
html.praxis-dark .is-tone-primary { background: var(--praxis-primary-deep); color: #fff; }
html.praxis-dark :is(.praxis-stack__card--3 .praxis-stack__inner, .praxis-ed-item.praxis-stack__card--3) { background: var(--praxis-primary-deep); }

/* Highlight-Flächen: dunkle Schrift (die Textfarbe ist im Dark Mode hell) */
html.praxis-dark :is(.praxis-side__el, .is-tone-highlight .praxis-bento__title, .praxis-hours__row.is-today dt::after) { color: var(--praxis-on-highlight, #0F1B1E); }
html.praxis-dark ::selection { color: var(--praxis-on-highlight, #0F1B1E); }
html.praxis-dark .praxis-tone--primary .praxis-btn--primary { --btn-fg: var(--praxis-on-highlight, #0F1B1E); }
/* Side-Menü (Highlight-Fläche): Farben wie im hellen Modus */
html.praxis-dark .praxis-side__panel { color: #0F1B1E; --wp--preset--color--ink: #0F1B1E; --praxis-ink: #0F1B1E; --praxis-ink-soft: #3d4a4c; --wp--preset--color--ink-soft: #3d4a4c; --praxis-line: rgb(15 27 30 / .15); }
html.praxis-dark .praxis-rtable__table .is-hl { color: var(--wp--preset--color--ink); }

/* Hinweisbox „Gut zu wissen“: feste helle Flächen und dunkle Signalfarben an den Darkmode anpassen */
html.praxis-dark .praxis-infobox--warning { --nb-c: #F2C14E; --nb-bg: color-mix(in srgb, #E5A100 16%, var(--wp--preset--color--surface)); --nb-line: color-mix(in srgb, #E5A100 38%, transparent); }
html.praxis-dark .praxis-infobox--info { --nb-c: #8AB4FF; }
html.praxis-dark .praxis-infobox--success { --nb-c: #5FD39B; }
html.praxis-dark .praxis-infobox--danger { --nb-c: #FF8F85; }
html.praxis-dark .praxis-infobox--highlight { --nb-bg: color-mix(in srgb, var(--praxis-highlight) 18%, var(--wp--preset--color--surface)); --nb-line: color-mix(in srgb, var(--praxis-highlight) 40%, transparent); }
html.praxis-dark .praxis-infobox .praxis-infobox__icon { background: color-mix(in srgb, var(--nb-c) 18%, transparent); }
html.praxis-dark .praxis-infobox:not(.praxis-infobox--dark) { color: var(--wp--preset--color--ink); }