/* ═══════════════════════════════════════════════════════
   dark.css  — Hell/Dunkel-System + neue Sektionen
   Lädt immer; scoped Overrides unter [data-theme="dark"]
═══════════════════════════════════════════════════════ */

/* ── 0. Dark-Mode Farbvariablen ──
   Zentrale Quelle aller Dark-Mode-Farben. Alle [data-theme="dark"]-
   Regeln in dieser Datei referenzieren ausschließlich diese
   Variablen statt Hex-/RGB-Literale — für künftige Anpassungen
   (z. B. Gold-Ton wechseln) reicht eine Änderung an dieser Stelle.
   RGB-Tripel (--dark-*-rgb) ermöglichen variable Opacity via
   rgba(var(--dark-gold-rgb), .4) etc. ── */
[data-theme="dark"] {
  color-scheme: dark;

  /* Flächen */
  --dark-bg:          #080810;  /* Body-/Hero-Grund, tiefstes Schwarz-Blau */
  --dark-bg-alt:       #0f0f18; /* nc-panel-hero */
  --dark-panel:        #12121e; /* cal-menu */
  --dark-panel-2:      #18181f; /* nc-panel-inner, nc-share-menu */

  /* Text */
  --dark-text:         #e8e8f0; /* Primärtext, Überschriften */
  --dark-text-strong:  #ffffff; /* Hero-Titel (max. Kontrast) */

  /* Akzent Gold */
  --dark-gold:         #c8a96e; /* alleiniger Akzent im Dark Mode */
  --dark-gold-hover:   #dbbf82; /* Hover-/Active-Variante */
  --dark-gold-light:   #e8d5a0; /* Scroll-Progress-Gradient-Ende */
  --dark-gold-title:   #e8c86a; /* Hero-Title-Sub (Italic) */
  --dark-stat-gold:    #c9a227; /* Hero-Kennzahlen */

  /* RGB-Tripel für Opacity-Varianten (rgba(var(--x-rgb), .4)) */
  --dark-gold-rgb:  200, 169, 110;
  --dark-text-rgb:  232, 232, 240;
  --dark-white-rgb: 255, 255, 255;
  --dark-black-rgb: 0, 0, 0;
  --dark-bg-rgb:    8, 8, 16;   /* = --dark-bg, für halbtransparenten Header-Blur */
}

/* ── 1. Show / Hide Utility ── */
.show-dark  { display: none !important; }
.show-light { display: block; }

[data-theme="dark"] .show-light { display: none !important; }
[data-theme="dark"] .show-dark  { display: block !important; }
/* flex-spezifische Elemente brauchen eigenes !important, da sie display:block überschreiben */

/* ── 2. Theme-Toggle Button ── */
#theme-toggle {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 2000;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid #161312;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f0e8;
  color: #161312;
  box-shadow: 0 2px 12px rgba(0,0,0,.15);
  transition: background .25s, color .25s, border-color .25s, transform .2s;
}
#theme-toggle:hover { transform: scale(1.1); background: #161312; color: #f5f0e8; }
#theme-toggle .icon-moon { display: none; }
#theme-toggle .icon-sun  { display: block; }

[data-theme="dark"] #theme-toggle {
  background: var(--dark-gold);
  color: var(--dark-bg);
  border-color: var(--dark-gold);
  box-shadow: 0 2px 16px rgba(var(--dark-gold-rgb), .35);
}
[data-theme="dark"] #theme-toggle:hover { background: var(--dark-gold-hover); border-color: var(--dark-gold-hover); transform: scale(1.1); }
[data-theme="dark"] #theme-toggle .icon-moon { display: block; }
[data-theme="dark"] #theme-toggle .icon-sun  { display: none; }

/* ── 3. Eigener Mauszeiger im Dark Mode entfernt (03.10.2026) –
   überall der normale Mauszeiger ── */
#particles-canvas { display: none; }

[data-theme="dark"] #particles-canvas {
  display: block; position: fixed; inset: 0;
  pointer-events: none; z-index: 0; opacity: .4;
}

/* ── 4. Über-uns-Sektion ── */
/* max-width/padding bewusst identisch zu .section, damit die Überschrift
   auf derselben Linie wie bei allen anderen Abschnitten steht. */
.ueber-section {
  padding: clamp(3rem, 8vw, 5.5rem) var(--pad);
  max-width: var(--max-w);
  margin: 0 auto;
}
.ueber-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
@media (max-width: 768px) {
  .ueber-inner { grid-template-columns: 1fr; gap: 2rem; }
}
.ueber-img-wrap {
  position: relative; border-radius: 1rem; overflow: hidden; aspect-ratio: 4/3;
}
.ueber-img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.ueber-tag {
  position: absolute; bottom: 1rem; right: 1rem;
  background: rgba(0,0,0,.55); color: #fff;
  padding: .3rem .8rem; border-radius: .4rem;
  font-size: .8rem; letter-spacing: .04em;
}
.ueber-text { display: flex; flex-direction: column; gap: 1.2rem; }
.ueber-stats-row { display: flex; gap: 2rem; margin-top: .5rem; flex-wrap: wrap; }
.ueber-stat { display: flex; flex-direction: column; }
.ueber-stat-num { font-size: 2rem; font-weight: 700; line-height: 1; color: var(--brass, #b8943f); }
.ueber-stat-label { font-size: .8rem; opacity: .6; letter-spacing: .04em; text-transform: uppercase; margin-top: .25rem; }

/* ── 6. Footer ── */
.footer-nav {
  display: flex;
  gap: 3rem;
  flex-wrap: wrap;
  justify-content: center;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--pad) 2rem;
}
.footer-col h4 { font-size: .98rem; text-transform: uppercase; letter-spacing: .08em; opacity: .45; margin: 0 0 1rem; }
/* Light Mode: .45 auf dunklem Ink-Text ist auf dem neuen hellen paper-blue-Footer zu kontrastarm (2.9:1) — auf .6 angehoben (4.6:1, AA-Sicherheitsmarge wie im Kontrast-Audit). Nur Light Mode, da Dark Mode (Gold-Text) bereits geprüft ist. */
:root:not([data-theme="dark"]) .footer-col h4 { opacity: .6; }
.footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.footer-col li, .footer-col a { font-size: .98rem; opacity: .65; text-decoration: none; }
.footer-col a:hover { opacity: 1; }

/* ── 8. Section-Eyebrow (unscoped) ── */
.section-eyebrow {
  font-size: .92rem; letter-spacing: .12em; text-transform: uppercase;
  opacity: .5; margin: 0 0 .75rem; display: block;
}

/* ── 9. Fotos & Videos: Dark-Mode-Styling (wie der Rest der Seite) ── */
[data-theme="dark"] #fotos-videos .section-eyebrow {
  color: var(--dark-gold);
  opacity: 1;
}
[data-theme="dark"] #fotos-videos .section-intro {
  color: rgba(var(--dark-text-rgb), .6);
}
[data-theme="dark"] #fotos-videos .folder-card {
  background: rgba(var(--dark-white-rgb), .05);
  box-shadow: none;
  border: 1px solid rgba(var(--dark-white-rgb), .08);
}
[data-theme="dark"] #fotos-videos .folder-card:hover {
  background: rgba(var(--dark-white-rgb), .09);
  border-color: rgba(var(--dark-gold-rgb), .4);
  box-shadow: none;
}
[data-theme="dark"] #fotos-videos .folder-name {
  color: var(--dark-text);
}
[data-theme="dark"] #fotos-videos .folder-year {
  color: var(--dark-gold);
}
[data-theme="dark"] #fotos-videos .gnav-pill {
  border-color: rgba(var(--dark-white-rgb), .18);
  color: rgba(var(--dark-text-rgb), .65);
  background: transparent;
}
[data-theme="dark"] #fotos-videos .gnav-pill:hover {
  border-color: rgba(var(--dark-gold-rgb), .6);
  color: var(--dark-text);
}
[data-theme="dark"] #fotos-videos .gnav-pill.active {
  background: var(--dark-gold);
  border-color: var(--dark-gold);
  color: var(--dark-bg);
}
[data-theme="dark"] #fotos-videos .gnav-arrow {
  background: rgba(var(--dark-gold-rgb), .12);
  border-color: rgba(var(--dark-gold-rgb), .55);
  color: var(--dark-gold);
}
[data-theme="dark"] #fotos-videos .gnav-arrow:hover {
  background: var(--dark-gold);
  border-color: var(--dark-gold);
  color: var(--dark-bg);
}
[data-theme="dark"] #fotos-videos .gallery-empty {
  color: rgba(var(--dark-text-rgb), .6);
}
[data-theme="dark"] #fotos-videos .folder-mosaic {
  background: rgba(var(--dark-white-rgb), .03);
}

/* ═══════════════════════════════════════════════════════
   DARK THEME OVERRIDES — [data-theme="dark"]
═══════════════════════════════════════════════════════ */

[data-theme="dark"] body {
  background: var(--dark-bg);
  color: var(--dark-text);
  font-family: 'Inter', system-ui, sans-serif;
}

/* Überschriften im Dark-Mode lesbar */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3 { color: var(--dark-text); }
[data-theme="dark"] h2 em,
[data-theme="dark"] h3 em { color: var(--dark-gold); font-style: italic; }

/* Foto-Overlay/Lightbox bleiben bewusst theme-unabhängig (heller Hintergrund,
   siehe MK.md) — die pauschale h1/h2/h3-Regel oben würde den Ordnertitel sonst
   hell-auf-hell (--dark-text auf var(--paper)) unlesbar machen. */
[data-theme="dark"] .folder-overlay-header h3 { color: var(--ink); }

/* ── Staff-line (dekorativer Notenlinien-Balken ganz oben) ──
   Nutzt sonst unverändert --ink/--brass-soft aus dem hellen Design
   (dunkelbraun + Bordeaux-Akzent) statt der Dark-Mode-Palette. */
[data-theme="dark"] .staff-line {
  background: var(--dark-bg);
}
[data-theme="dark"] .staff-line line {
  stroke: var(--dark-gold);
}

/* ── Nav / Header ── */
[data-theme="dark"] .site-header {
  background: rgba(var(--dark-bg-rgb), .88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(var(--dark-gold-rgb), .12);
}
[data-theme="dark"] .brand-text strong,
[data-theme="dark"] .brand-text em { color: var(--dark-text); }
[data-theme="dark"] .main-nav a { color: var(--dark-text); }
[data-theme="dark"] .main-nav a:hover { color: var(--dark-gold); }
[data-theme="dark"] .nav-toggle span { background: var(--dark-text); }

/* Mobile nav dark */
@media (max-width: 720px) {
  [data-theme="dark"] .main-nav.open ul {
    background: rgba(var(--dark-bg-rgb), .97);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(var(--dark-gold-rgb), .15);
  }
  [data-theme="dark"] .main-nav a { color: var(--dark-text); }
  [data-theme="dark"] .main-nav a:hover { color: var(--dark-gold); }
}

/* ── Scroll progress ── */
[data-theme="dark"] #scroll-progress {
  background: linear-gradient(90deg, var(--dark-gold), var(--dark-gold-light));
}
/* ── Hero (Dark-Mode) — 1:1 nach V2-Original ── */
[data-theme="dark"] .hero {
  /* Layout */
  max-width: none; width: 100%; margin: 0;
  min-height: 100vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  padding: 0 2rem;
  /* Stacking: z-index:1 erzeugt Stacking-Context, hero-bg (ohne z-index) bleibt darunter */
  position: relative; overflow: hidden;
  z-index: 1;
  background: var(--dark-bg);
}

/* Hintergrundbild — kein expliziter z-index, DOM-Reihenfolge reicht */
[data-theme="dark"] .hero-bg {
  display: block !important;
  position: absolute; inset: 0;
  background-image: url('Kapelle-Master.jpg'); /* hochauflösend 2676×1784 (Hero-Video entfernt 28.09.2026) */
  background-size: cover;
  background-position: center 30%;
  filter: brightness(.18) saturate(.6);
  transform: scale(1.08);
  will-change: transform;
}
/* Radialer Gradient direkt auf hero-bg (wie V2-Original, filter betrifft Bild+Gradient) */
[data-theme="dark"] .hero-bg::after {
  content: '';
  position: absolute; inset: 0;
  /* dezenter: wird erst näher am Rand dunkel und bleibt halbtransparent statt
     komplett deckend zu werden — mehr vom Gruppenfoto bleibt erkennbar */
  background: radial-gradient(ellipse at center, transparent 55%, rgba(var(--dark-bg-rgb), .45) 100%);
}


/* Text-Spalte — normaler Flex-Child nach hero-bg im DOM → automatisch darüber */
[data-theme="dark"] .hero-text-col {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  max-width: 860px; width: 100%;
}
/* .hero-title/.hero-title-sub sind jetzt in style.css themenunabhängig
   identisch definiert (Wunsch: Hero-Überschrift im Hellen = im Dunklen) —
   keine eigene Dark-Mode-Regel mehr nötig. */


/* ── Stats-Strip (dark) ── */
[data-theme="dark"] .strip {
  background: var(--dark-bg);
  color: var(--dark-text);
}
[data-theme="dark"] .strip-num {
  color: var(--dark-stat-gold);
}
[data-theme="dark"] .strip-label {
  color: rgba(var(--dark-text-rgb), .6);
}

/* ── Buttons ── */
[data-theme="dark"] .btn-primary { background: var(--dark-gold); color: var(--dark-bg); border-color: var(--dark-gold); }
[data-theme="dark"] .btn-primary:hover { background: var(--dark-gold-hover); border-color: var(--dark-gold-hover); }
[data-theme="dark"] .btn-ghost { color: var(--dark-text); border-color: rgba(var(--dark-text-rgb), .3); }
[data-theme="dark"] .btn-ghost:hover { border-color: var(--dark-gold); color: var(--dark-gold); }

/* ── Section eyebrow (dark) ── */
[data-theme="dark"] .section-eyebrow { color: var(--dark-gold); opacity: 1; }

/* ── Instagram Karussell (dark) ── */
[data-theme="dark"] .ig-card { background: rgba(var(--dark-white-rgb), .04); border: 1px solid rgba(var(--dark-white-rgb), .08); }
[data-theme="dark"] .ig-card-handle { color: var(--dark-gold); }
[data-theme="dark"] .ig-card-text   { color: rgba(var(--dark-text-rgb), .7); }
[data-theme="dark"] .ig-arrow { background: rgba(var(--dark-gold-rgb), .12); color: var(--dark-gold); border-color: rgba(var(--dark-gold-rgb), .55); }
[data-theme="dark"] .ig-arrow:hover { background: var(--dark-gold); color: var(--dark-bg); border-color: var(--dark-gold); }
[data-theme="dark"] .ig-card--cta { background: rgba(var(--dark-gold-rgb), .1); border-color: rgba(var(--dark-gold-rgb), .3); }
[data-theme="dark"] .ig-cta-label,
[data-theme="dark"] .ig-cta-handle { color: var(--dark-gold); }
[data-theme="dark"] .ig-btn { background: rgba(var(--dark-white-rgb), .05); border-color: rgba(var(--dark-white-rgb), .15); color: var(--dark-text); }
[data-theme="dark"] .ig-btn:hover { border-color: var(--dark-gold); color: var(--dark-gold); }
[data-theme="dark"] .ig-dot { background: rgba(var(--dark-white-rgb), .25); }
[data-theme="dark"] .ig-dot--active { background: var(--dark-gold); }

/* ── Über-uns (dark) ── */
[data-theme="dark"] .ueber-tag { background: rgba(var(--dark-gold-rgb), .25); color: var(--dark-gold); }
[data-theme="dark"] .ueber-stat-num { color: var(--dark-gold); }
[data-theme="dark"] .ueber-text p { color: rgba(var(--dark-text-rgb), .7); }

/* ── Termine (dark) — V1-Klassennamen: .termin-card, .termin-highlight ── */
[data-theme="dark"] .termin-card {
  background: rgba(var(--dark-white-rgb), .04);
  border-color: rgba(var(--dark-white-rgb), .12);
}
[data-theme="dark"] .termin-highlight {
  border-color: rgba(var(--dark-gold-rgb), .4) !important;
  background: rgba(var(--dark-gold-rgb), .06) !important;
}
[data-theme="dark"] .termin-date .d { color: var(--dark-gold); }
[data-theme="dark"] .termin-date .m { color: rgba(var(--dark-text-rgb), .55); }
[data-theme="dark"] .termin-card h3 { color: var(--dark-text); }
[data-theme="dark"] .termin-card p  { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .termine-status { color: rgba(var(--dark-text-rgb), .55); }
/* Cal-Button (von script.js dynamisch eingefügt) */
[data-theme="dark"] .cal-trigger {
  background: rgba(var(--dark-white-rgb), .07);
  border: 1px solid rgba(var(--dark-white-rgb), .15);
  color: var(--dark-text);
}
[data-theme="dark"] .cal-trigger:hover { border-color: var(--dark-gold); color: var(--dark-gold); }
[data-theme="dark"] .cal-menu { background: var(--dark-panel); border: 1px solid rgba(var(--dark-white-rgb), .12); }
[data-theme="dark"] .cal-menu a,
[data-theme="dark"] .cal-menu button { color: var(--dark-text); }
[data-theme="dark"] .cal-menu a:hover,
[data-theme="dark"] .cal-menu button:hover { color: var(--dark-gold); }

/* ── Chronik / Timeline (dark) ── */
[data-theme="dark"] .timeline__item:before      { background-color: var(--dark-gold); }
[data-theme="dark"] .timeline__item:after       { background-color: var(--dark-gold); }
[data-theme="dark"] .timeline__item-time        { color: var(--dark-gold); }
[data-theme="dark"] .timeline__item-link        { color: var(--dark-text); }
[data-theme="dark"] .timeline__item-pub         { color: rgba(var(--dark-text-rgb), .6); }

/* ── Musiker (dark) — V1-Klassennamen: .musiker-tab.active, .musiker-register, .carousel ── */
[data-theme="dark"] .mtab-arrow { background: rgba(var(--dark-gold-rgb), .12); border-color: rgba(var(--dark-gold-rgb), .55); color: var(--dark-gold); }
[data-theme="dark"] .mtab-arrow:hover { background: var(--dark-gold); border-color: var(--dark-gold); color: var(--dark-bg); }
[data-theme="dark"] .musiker-tab { color: rgba(var(--dark-text-rgb), .55); border-color: rgba(var(--dark-white-rgb), .15); }
[data-theme="dark"] .musiker-tab:hover { color: var(--dark-text); border-color: rgba(var(--dark-white-rgb), .35); }
[data-theme="dark"] .musiker-tab.active {
  background: var(--dark-gold); color: var(--dark-bg); border-color: var(--dark-gold);
  opacity: 1;
}
[data-theme="dark"] .kapelle-label { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .musician-card { background: rgba(var(--dark-white-rgb), .04); border-radius: .5rem; overflow: hidden; }
[data-theme="dark"] .musician-name { color: rgba(var(--dark-text-rgb), .7); }
[data-theme="dark"] .carousel-arrow { color: var(--dark-gold); background: rgba(var(--dark-gold-rgb), .1); border-color: rgba(var(--dark-gold-rgb), .55); }
[data-theme="dark"] .carousel-arrow:hover { background: var(--dark-gold); color: var(--dark-bg); border-color: var(--dark-gold); }
[data-theme="dark"] .carousel-dot { border-color: rgba(var(--dark-white-rgb), .3); }
[data-theme="dark"] .carousel-dot.active { background: var(--dark-gold); border-color: var(--dark-gold); }


/* ── Verein (dark) ── */
[data-theme="dark"] .verein-card { background: rgba(var(--dark-white-rgb), .04); border-color: rgba(var(--dark-white-rgb), .08); }
[data-theme="dark"] .verein-card h3 { color: var(--dark-gold); }
[data-theme="dark"] .verein-card p  { color: rgba(var(--dark-text-rgb), .65); }

/* ── Kontakt (dark) ── */
[data-theme="dark"] .kontakt-card { background: rgba(var(--dark-white-rgb), .04); border-color: rgba(var(--dark-white-rgb), .08); }
[data-theme="dark"] .kontakt-role { color: var(--dark-gold); opacity: 1; }
[data-theme="dark"] .kontakt-card h3 { color: var(--dark-text); }
[data-theme="dark"] .kontakt-address { color: rgba(var(--dark-text-rgb), .55); }
[data-theme="dark"] .kontakt-link { color: rgba(var(--dark-text-rgb), .7); }
[data-theme="dark"] .kontakt-link:hover { color: var(--dark-gold); }
[data-theme="dark"] .social-row .social-link { color: rgba(var(--dark-text-rgb), .65); border-color: rgba(var(--dark-white-rgb), .15); }
[data-theme="dark"] .social-row .social-link:hover { color: var(--dark-gold); border-color: var(--dark-gold); }

/* ── News-Karusell (dark) ── */
[data-theme="dark"] .nc-card {
  background: rgba(var(--dark-white-rgb), .04);
  border-color: rgba(var(--dark-white-rgb), .1);
}
[data-theme="dark"] .nc-card:hover {
  border-color: var(--dark-gold);
}
[data-theme="dark"] .nc-card.nc-card--active {
  border-color: var(--dark-gold);
  box-shadow: 0 0 0 2px var(--dark-gold);
}
[data-theme="dark"] .nc-card-tag   { color: var(--dark-gold); }
[data-theme="dark"] .nc-card-title { color: var(--dark-text); }
[data-theme="dark"] .nc-card-date  { color: rgba(var(--dark-text-rgb), .55); }
[data-theme="dark"] .nc-panel-inner {
  background: var(--dark-panel-2);
  border-color: rgba(var(--dark-white-rgb), .1);
}
[data-theme="dark"] .nc-panel-hero { background: var(--dark-bg-alt); }
[data-theme="dark"] .nc-panel-close {
  background: rgba(var(--dark-white-rgb), .08);
  border-color: rgba(var(--dark-white-rgb), .15);
  color: rgba(var(--dark-text-rgb), .6);
}
[data-theme="dark"] .nc-panel-close:hover { background: var(--dark-gold); color: var(--dark-bg); border-color: var(--dark-gold); }
[data-theme="dark"] .nc-panel-tag   { color: var(--dark-gold); }
[data-theme="dark"] .nc-panel-title { color: var(--dark-text); }
[data-theme="dark"] .nc-panel-meta  { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .nc-panel-text  { color: rgba(var(--dark-text-rgb), .7); }

/* Like + Teilen Action-Bar (dark) */
[data-theme="dark"] .nc-panel-actions { border-top-color: rgba(var(--dark-white-rgb), .1); }
[data-theme="dark"] .nc-action-btn { background: rgba(var(--dark-white-rgb), .06); border-color: rgba(var(--dark-white-rgb), .12); color: rgba(var(--dark-text-rgb), .65); }
[data-theme="dark"] .nc-action-btn:hover { background: rgba(var(--dark-white-rgb), .1); border-color: var(--dark-gold); color: var(--dark-text); }
[data-theme="dark"] .nc-action-btn.nc-liked { background: rgba(var(--dark-gold-rgb), .15); border-color: var(--dark-gold); color: var(--dark-gold); }
[data-theme="dark"] .nc-share-menu { background: var(--dark-panel-2); border-color: rgba(var(--dark-white-rgb), .12); box-shadow: 0 8px 24px rgba(var(--dark-black-rgb), .4); }
[data-theme="dark"] .nc-share-item { color: var(--dark-text); }
[data-theme="dark"] .nc-share-item:hover { background: rgba(var(--dark-white-rgb), .06); }
[data-theme="dark"] .nc-share-item svg { color: rgba(var(--dark-text-rgb), .45); }

/* Facebook Neuigkeiten-Feed (dark) */
[data-theme="dark"] .fb-post { background: rgba(var(--dark-white-rgb), .04); border-color: rgba(var(--dark-white-rgb), .09); }
[data-theme="dark"] .fb-post:hover { border-color: rgba(var(--dark-white-rgb), .18); box-shadow: 0 4px 16px rgba(var(--dark-black-rgb), .3); }
[data-theme="dark"] .fb-page-name { color: var(--dark-text); }
[data-theme="dark"] .fb-post-date { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .fb-post-text { color: rgba(var(--dark-text-rgb), .8); }
[data-theme="dark"] .fb-expand-btn { color: var(--dark-gold); }
[data-theme="dark"] .fb-post-footer { border-top-color: rgba(var(--dark-white-rgb), .08); }
[data-theme="dark"] .fb-stat { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .fb-post-link { color: var(--dark-gold); }
[data-theme="dark"] .fb-share-btn { background: rgba(var(--dark-white-rgb), .06); border-color: rgba(var(--dark-white-rgb), .1); color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .fb-share-btn:hover { background: rgba(var(--dark-white-rgb), .1); border-color: var(--dark-gold); color: var(--dark-text); }

/* ── Footer (dark) ── */
[data-theme="dark"] .site-footer { background: var(--dark-bg); color: var(--dark-text); border-top-color: rgba(var(--dark-white-rgb), .07); }
[data-theme="dark"] .footer-brand-name { color: var(--dark-text); }
[data-theme="dark"] .footer-desc  { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .footer-copy  { color: rgba(var(--dark-text-rgb), .55); }
[data-theme="dark"] .footer-col h4 { color: rgba(var(--dark-gold-rgb), .7); }
[data-theme="dark"] .footer-col li,
[data-theme="dark"] .footer-col a { color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .footer-col a:hover { color: var(--dark-gold); }

/* ── Sections (dark: alternierende Hintergründe) ── */
[data-theme="dark"] .section-alt { background: rgba(var(--dark-white-rgb), .02); }

/* ── Nachrichten (Berichte) & Facebook-Feed (dark) ── */
[data-theme="dark"] .nc-card {
  background: rgba(var(--dark-white-rgb), .04);
  border-color: rgba(var(--dark-white-rgb), .1);
}
[data-theme="dark"] .nc-card:hover {
  border-color: var(--dark-gold);
}
[data-theme="dark"] .nc-card.nc-card--active {
  border-color: var(--dark-gold);
  box-shadow: 0 0 0 2px var(--dark-gold);
}
[data-theme="dark"] .nc-card-tag   { color: var(--dark-gold); }
[data-theme="dark"] .nc-card-title { color: var(--dark-text); }
[data-theme="dark"] .nc-card-date  { color: rgba(var(--dark-text-rgb), .55); }
[data-theme="dark"] .nc-panel-inner {
  background: var(--dark-panel-2);
  border-color: rgba(var(--dark-white-rgb), .1);
}
[data-theme="dark"] .nc-panel-hero { background: var(--dark-bg-alt); }
[data-theme="dark"] .nc-panel-close {
  background: rgba(var(--dark-white-rgb), .08);
  border-color: rgba(var(--dark-white-rgb), .15);
  color: rgba(var(--dark-text-rgb), .6);
}
[data-theme="dark"] .nc-panel-close:hover { background: var(--dark-gold); color: var(--dark-bg); border-color: var(--dark-gold); }
[data-theme="dark"] .nc-panel-tag   { color: var(--dark-gold); }
[data-theme="dark"] .nc-panel-title { color: var(--dark-text); }
[data-theme="dark"] .nc-panel-meta  { color: rgba(var(--dark-text-rgb), .60); }
[data-theme="dark"] .nc-panel-text  { color: rgba(var(--dark-text-rgb), .7); }

/* Like + Teilen Action-Bar (dark) */
[data-theme="dark"] .nc-panel-actions { border-top-color: rgba(var(--dark-white-rgb), .1); }
[data-theme="dark"] .nc-action-btn { background: rgba(var(--dark-white-rgb), .06); border-color: rgba(var(--dark-white-rgb), .12); color: rgba(var(--dark-text-rgb), .65); }
[data-theme="dark"] .nc-action-btn:hover { background: rgba(var(--dark-white-rgb), .1); border-color: var(--dark-gold); color: var(--dark-text); }
[data-theme="dark"] .nc-action-btn.nc-liked { background: rgba(var(--dark-gold-rgb), .15); border-color: var(--dark-gold); color: var(--dark-gold); }
[data-theme="dark"] .nc-share-menu { background: var(--dark-panel-2); border-color: rgba(var(--dark-white-rgb), .12); box-shadow: 0 8px 24px rgba(var(--dark-black-rgb), .4); }
[data-theme="dark"] .nc-share-item { color: var(--dark-text); }
[data-theme="dark"] .nc-share-item:hover { background: rgba(var(--dark-white-rgb), .06); }
[data-theme="dark"] .nc-share-item svg { color: rgba(var(--dark-text-rgb), .45); }

/* Facebook Neuigkeiten-Feed (dark) */
[data-theme="dark"] .fb-post { background: rgba(var(--dark-white-rgb), .04); border-color: rgba(var(--dark-white-rgb), .09); }
[data-theme="dark"] .fb-post:hover { border-color: rgba(var(--dark-white-rgb), .18); box-shadow: 0 4px 16px rgba(var(--dark-black-rgb), .3); }
[data-theme="dark"] .fb-page-name { color: var(--dark-text); }
[data-theme="dark"] .fb-post-date { color: rgba(var(--dark-text-rgb), .60); }
[data-theme="dark"] .fb-post-text { color: rgba(var(--dark-text-rgb), .8); }
[data-theme="dark"] .fb-expand-btn { color: var(--dark-gold); }
[data-theme="dark"] .fb-post-footer { border-top-color: rgba(var(--dark-white-rgb), .08); }
[data-theme="dark"] .fb-stat { color: rgba(var(--dark-text-rgb), .60); }
[data-theme="dark"] .fb-post-link { color: var(--dark-gold); }
[data-theme="dark"] .fb-share-btn { background: rgba(var(--dark-white-rgb), .06); border-color: rgba(var(--dark-white-rgb), .1); color: rgba(var(--dark-text-rgb), .6); }
[data-theme="dark"] .fb-share-btn:hover { background: rgba(var(--dark-white-rgb), .1); border-color: var(--dark-gold); color: var(--dark-text); }

/* Bericht-Text (Berichte/…/bericht.md) */
[data-theme="dark"] .nc-panel-text h4 { color: var(--dark-text); }
[data-theme="dark"] .nc-panel-text a  { color: var(--dark-gold); }