/* ==========================================================================
   Dunkelmodus (nt-ai Barrierefreiheits-Widget, 28.10.2026)
   Das Widget setzt am <html> data-nt-theme="dark" und färbt nur sich selbst dunkel –
   das Design der Seite liefert das Sitepackage (wie www.villingen-schwenningen.de).
   Kontraste: Text #ececec auf #121212 ≈ 16:1, Links #8fbcf0 auf #121212 ≈ 9:1,
   auf #1e1f23 ≈ 8:1; gedämpfter Text #b9bac0 ≈ 9:1.
   ========================================================================== */
html[data-nt-theme="dark"] {
    color-scheme: dark;
    --fm-dark-bg: #121212;
    --fm-dark-panel: #1e1f23;
    --fm-dark-panel-2: #26272c;
    --fm-dark-line: #3a3b42;
    --fm-dark-text: #ececec;
    --fm-dark-muted: #b9bac0;
    --fm-dark-link: #8fbcf0;
    --fm-dark-link-hover: #c2dbf7;
}
html[data-nt-theme="dark"] body {
    background: var(--fm-dark-bg) !important;
    color: var(--fm-dark-text) !important;
}

/* Grundtypografie */
html[data-nt-theme="dark"] body h1, html[data-nt-theme="dark"] body h2, html[data-nt-theme="dark"] body h3,
html[data-nt-theme="dark"] body h4, html[data-nt-theme="dark"] body h5, html[data-nt-theme="dark"] body h6,
html[data-nt-theme="dark"] body p, html[data-nt-theme="dark"] body li, html[data-nt-theme="dark"] body td,
html[data-nt-theme="dark"] body th, html[data-nt-theme="dark"] body dt, html[data-nt-theme="dark"] body dd,
html[data-nt-theme="dark"] body label, html[data-nt-theme="dark"] body legend,
html[data-nt-theme="dark"] body figcaption, html[data-nt-theme="dark"] body blockquote,
html[data-nt-theme="dark"] body .subhead, html[data-nt-theme="dark"] body .breadcrumb,
html[data-nt-theme="dark"] body .breadcrumb a, html[data-nt-theme="dark"] body .divider {
    color: var(--fm-dark-text) !important;
}
html[data-nt-theme="dark"] body .blog-card-date,
html[data-nt-theme="dark"] body .fm-lang__english,
html[data-nt-theme="dark"] body .text-muted { color: var(--fm-dark-muted) !important; }
html[data-nt-theme="dark"] body hr { border-color: var(--fm-dark-line) !important; }

/* Links */
html[data-nt-theme="dark"] main a,
html[data-nt-theme="dark"] main .csc-menu a,
html[data-nt-theme="dark"] main .breadcrumb a { color: var(--fm-dark-link) !important; }
html[data-nt-theme="dark"] main a:hover,
html[data-nt-theme="dark"] main a:focus { color: var(--fm-dark-link-hover) !important; }
/* Pfeil-Grafiken: helle Variante */
html[data-nt-theme="dark"] body .csc-menu a,
html[data-nt-theme="dark"] body .fm-form-privacy a { background-image: url('../images/arrow-bright.png') !important; }

/* Kopf und Navigation */
html[data-nt-theme="dark"] body header .header,
html[data-nt-theme="dark"] body .header { background: var(--fm-dark-panel) !important; border-color: var(--fm-dark-line) !important; }
html[data-nt-theme="dark"] body header .header a,
html[data-nt-theme="dark"] body header .nav > li > a,
html[data-nt-theme="dark"] body header .dropdown-menu > li > a { color: var(--fm-dark-text) !important; }
html[data-nt-theme="dark"] body header .nav > li > a:hover,
html[data-nt-theme="dark"] body header .nav > li > a:focus,
html[data-nt-theme="dark"] body header .dropdown-menu > li > a:hover,
html[data-nt-theme="dark"] body header .dropdown-menu > li > a:focus { background: var(--fm-dark-panel-2) !important; color: #fff !important; }
html[data-nt-theme="dark"] body header .dropdown-menu,
html[data-nt-theme="dark"] body #mobi-navbar { background: var(--fm-dark-panel) !important; border-color: var(--fm-dark-line) !important; }
html[data-nt-theme="dark"] body header .dropdown-menu li { border-color: var(--fm-dark-line) !important; }
/* Logo (dunkle Schrift) und Such-Lupe hell darstellen */
html[data-nt-theme="dark"] body header .c2 img,
html[data-nt-theme="dark"] body header img[src*="ico-search"] { filter: invert(1) brightness(1.1); }
html[data-nt-theme="dark"] body .navbar-toggle { border-color: var(--fm-dark-line) !important; }
html[data-nt-theme="dark"] body .navbar-toggle .icon-bar { background: var(--fm-dark-text) !important; }

/* Sprachwahl */
html[data-nt-theme="dark"] .fm-lang > summary { background: var(--fm-dark-panel-2) !important; color: var(--fm-dark-text) !important; }
html[data-nt-theme="dark"] .fm-lang__menu { background: var(--fm-dark-panel) !important; border-color: var(--fm-dark-line) !important; }
html[data-nt-theme="dark"] .fm-lang__item,
html[data-nt-theme="dark"] .fm-lang__check { color: var(--fm-dark-text) !important; }
html[data-nt-theme="dark"] .fm-lang__item:hover,
html[data-nt-theme="dark"] .fm-lang__item:focus-visible { background: var(--fm-dark-panel-2) !important; }
html[data-nt-theme="dark"] .fm-lang__item--easy { background: rgba(143, 188, 240, .14) !important; color: var(--fm-dark-link) !important; border-left-color: var(--fm-dark-link) !important; }
html[data-nt-theme="dark"] .fm-lang__icon { color: var(--fm-dark-link) !important; }
html[data-nt-theme="dark"] .fm-lang__easy { border-top-color: var(--fm-dark-line) !important; }

/* Inhaltsbereiche, Kästen, Kacheln */
html[data-nt-theme="dark"] body .body,
html[data-nt-theme="dark"] body .container,
html[data-nt-theme="dark"] body .colLeft,
html[data-nt-theme="dark"] body .colFull { background-color: transparent !important; }
html[data-nt-theme="dark"] body .colRight,
html[data-nt-theme="dark"] body .body .c5.colRight,
html[data-nt-theme="dark"] body .teaser,
html[data-nt-theme="dark"] body .blog-card,
html[data-nt-theme="dark"] body .panel,
html[data-nt-theme="dark"] body .well { background: var(--fm-dark-panel) !important; border-color: var(--fm-dark-line) !important; }
html[data-nt-theme="dark"] body .teaser h1,
html[data-nt-theme="dark"] body .teaser h2 a { color: var(--fm-dark-text) !important; border-color: var(--fm-dark-line) !important; }

/* Tabellen */
html[data-nt-theme="dark"] body table,
html[data-nt-theme="dark"] body th,
html[data-nt-theme="dark"] body td { border-color: var(--fm-dark-line) !important; background-color: transparent !important; }
html[data-nt-theme="dark"] body th,
html[data-nt-theme="dark"] body thead td { background-color: var(--fm-dark-panel-2) !important; }

/* Formulare (Suche, Gruppenanmeldung) */
html[data-nt-theme="dark"] body .form-control,
html[data-nt-theme="dark"] body input[type="text"],
html[data-nt-theme="dark"] body input[type="search"],
html[data-nt-theme="dark"] body input[type="email"],
html[data-nt-theme="dark"] body input[type="tel"],
html[data-nt-theme="dark"] body textarea,
html[data-nt-theme="dark"] body select {
    background-color: var(--fm-dark-panel) !important; color: var(--fm-dark-text) !important; border-color: #6a6b72 !important;
}
html[data-nt-theme="dark"] body form[id^="gruppenanmeldung-"] .form-navigation .btn,
html[data-nt-theme="dark"] body .tx-indexedsearch-searchbox-button { background: #4a4b52 !important; color: #fff !important; }

/* Fußzeile */
html[data-nt-theme="dark"] body footer { background: #0b0b0c !important; border-top: 1px solid var(--fm-dark-line); }
html[data-nt-theme="dark"] body footer, html[data-nt-theme="dark"] body footer p,
html[data-nt-theme="dark"] body footer li, html[data-nt-theme="dark"] body footer a,
html[data-nt-theme="dark"] body footer div { color: var(--fm-dark-text) !important; }
html[data-nt-theme="dark"] body footer hr { border-color: var(--fm-dark-line) !important; }

/* Skip-Link, Dialoge */
html[data-nt-theme="dark"] .skip-link { background: var(--fm-dark-panel) !important; color: var(--fm-dark-link) !important; border-color: var(--fm-dark-link) !important; }
html[data-nt-theme="dark"] .filme-consent-inner { background: var(--fm-dark-panel) !important; color: var(--fm-dark-text) !important; }

/* Startseite „Mit Ihrer Gruppe ins Franziskanermuseum" (#c2136, heller Kasten) und Blog-Kacheln */
html[data-nt-theme="dark"] body #c2136 { background: var(--fm-dark-panel) !important; border-color: var(--fm-dark-line) !important; box-shadow: none !important; }
html[data-nt-theme="dark"] body .blog-card-excerpt { color: var(--fm-dark-muted) !important; }
html[data-nt-theme="dark"] body .blog-card-title,
html[data-nt-theme="dark"] body .blog-card a { color: var(--fm-dark-text) !important; }

/* Mobilmenü: geöffneter/fokussierter Punkt (Bootstrap .open > a, :hover, :focus hellgrau) dunkel */
html[data-nt-theme="dark"] body #mobi-navbar .open > a,
html[data-nt-theme="dark"] body #mobi-navbar .open > a:hover,
html[data-nt-theme="dark"] body #mobi-navbar .open > a:focus,
html[data-nt-theme="dark"] body #mobi-navbar a:hover,
html[data-nt-theme="dark"] body #mobi-navbar a:focus,
html[data-nt-theme="dark"] body #mobi-navbar .dropdown-menu { background: var(--fm-dark-panel-2) !important; color: #fff !important; }
html[data-nt-theme="dark"] body #mobi-navbar a { color: var(--fm-dark-text) !important; }