/* dark.css – wird als LETZTES geladen und überschreibt nur im Darkmode */

:root { color-scheme: light dark; }

@media (prefers-color-scheme: dark) {
  :root{
    --lkp-bg: #0b1220;
    --lkp-surface: #0f172a;
    --lkp-surface-soft: #111c33;
    --lkp-border: rgba(255,255,255,.10);
    --lkp-border-soft: rgba(255,255,255,.12);

    --lkp-text: #e5e7eb;
    --lkp-text-muted: rgba(229,231,235,.72);

    /* Brandfarben im Dark etwas heller, damit sie “leben” */
    --lkp-primary: #4aa3ff;
    --lkp-primary-hover: #2f8cf3;
    --lkp-primary-soft: rgba(74,163,255,.16);

    --lkp-accent: #f0b429;

    --lkp-green: #2f7a46;
    --lkp-green-hover: #25683c;

    --lkp-shadow-soft: 0 18px 40px rgba(0,0,0,.45);
  }

  body{
    background: var(--lkp-bg);
    color: var(--lkp-text);
  }

  /* Links */
  a{ color: var(--lkp-primary); }
  a:hover{ color: var(--lkp-primary-hover); }

  /* Navbar */
  .lkp-navbar{
    background: rgba(15,23,42,.78);
    border-bottom: 1px solid var(--lkp-border-soft);
  }
  .lkp-nav-links a{ color: var(--lkp-text-muted); }
  .lkp-nav-links a:hover{ color: var(--lkp-text); }
  .lkp-logo{ color: var(--lkp-text); }
  .lkp-nav-cta{ color: #111827; } /* bleibt gut lesbar auf Accent */

  /* Footer */
  footer{
    background: rgba(15,23,42,.65);
    border-top: 1px solid var(--lkp-border-soft);
  }
  .lkp-footer-inner,
  .lkp-footer-links a{ color: var(--lkp-text-muted); }
  .lkp-footer-links a:hover{ color: var(--lkp-primary); }

  /* Hero (filter.css hat helle Radials -> im Dark ersetzen) */
  .lkp-hero-inner{
    background:
      radial-gradient(circle at top left, rgba(74,163,255,.18) 0, transparent 55%),
      radial-gradient(circle at top right, rgba(240,180,41,.12) 0, transparent 55%),
      var(--lkp-surface);
  }
  .lkp-hero-text h1{ color: var(--lkp-text); }

  /* Filter-Flächen */
  .lkp-filter-location,
  .lkp-date-picker{
    background: var(--lkp-surface-soft);
    border: 1px solid var(--lkp-border-soft);
  }

  /* Chips */
  .lkp-chip{
    background: rgba(74,163,255,.12);
    color: var(--lkp-text);
  }
  .lkp-chip:hover{ background: rgba(74,163,255,.18); }

  .lkp-chip-group{
    background: rgba(74,163,255,.10);
    border: 1px solid rgba(74,163,255,.18);
  }
  .lkp-chip-group .lkp-chip{
    border-right: 1px solid rgba(74,163,255,.18);
  }

  /* Kategorie-Chips */
  .lkp-cat-chip{
    background: var(--lkp-surface);
    color: var(--lkp-text);
    border-color: var(--lkp-border-soft);
  }
  .lkp-cat-chip:hover{ border-color: var(--lkp-primary); }
  .lkp-cat-chip.is-active{
    background: rgba(240,180,41,.14);
    border-color: rgba(240,180,41,.45);
    color: #ffd58a;
  }

  /* Inputs (Android date/select etc.) */
  input, select, textarea{
    background: var(--lkp-surface);
    color: var(--lkp-text);
    border-color: var(--lkp-border-soft);
  }

  /* Cards / Buttons, die aktuell hart weiß sind */
  .event-card,
  .lkp-share-btn,
  .lkp-event-card{
    background: var(--lkp-surface);
    color: var(--lkp-text);
    border-color: var(--lkp-border-soft);
    box-shadow: var(--lkp-shadow-soft);
  }

  /* Share Button Textfarbe */
  .lkp-share-btn{ color: var(--lkp-text); }

  /* Buttons: Secondary “grün” bleibt grün */
  .lkp-btn-secondary{
    background: var(--lkp-green);
    color: #fff;
  }
  .lkp-btn-secondary:hover{
    background: var(--lkp-green-hover);
  }

  /* Top-Events Badges (damit sie im Dark nicht “knallen”) */
  .lkp-badge-kultur{ background: rgba(74,163,255,.16); color: #9ccfff; }
  .lkp-badge-party{  background: rgba(239,68,68,.16); color: #ffb4b4; }
  .lkp-badge-familie{background: rgba(34,197,94,.16); color: #b6f3c8; }
  .lkp-badge-markt{  background: rgba(240,180,41,.16); color: #ffd58a; }
  .lkp-badge-sport{  background: rgba(236,72,153,.16); color: #ffb2d9; }
}