/*
 * THEME – Farb-Palette der Seite (Default / Fallback)
 * --------------------------------------------------------------------
 * Diese Datei definiert die globale Farbpalette. Änderungen hier
 * wirken auf Header, Body, Cards, Footer, Legal-Panels etc.
 *
 * Lade-Reihenfolge (siehe includes/header.php):
 *   1. css/style.css   – Struktur + Fallback-Defaults für alle Variablen
 *   2. css/theme.css   – diese Datei: Basis-Palette
 *   3. site/theme.css  – optional pro Domain; überschreibt einzelne Werte
 *
 * Nur das überschreiben, was vom Default abweichen soll. Alles Übrige
 * fällt auf den Default in css/style.css :root zurück.
 */
:root {
  /* ============================================================
     1. MARKENFARBEN
     Werden für Buttons, Highlights, Badges, Akzent-Elemente
     überall auf der Seite verwendet.
     ============================================================ */
  /* Primär: Haupt-Markenfarbe (wird u.a. für --accent übernommen). */
  --primary: #6c0a19;
  /* Sekundär: zweite Markenfarbe, z.B. "NEU"-Badge, Gold-Akzente. */
  --secondary: #D4AF37;

  /* Akzentfarbe – Unterstreichungen, Focus, Hover-Kanten. */
  --accent: #6c0a19;
  /* Halbtransparent, für zarte Hover-Flächen und Chips. */
  --accent-soft: rgba(139, 0, 0, 0.18);

  /* ============================================================
     2. SEITE ALLGEMEIN (zwischen Header und Footer)
     ============================================================ */
  /* Seiten-Hintergrund (Grundfläche außerhalb von Cards). */
  --body-bg: #ffffff;
  /* Hintergrund von Profilkarten, Modals, Content-Boxen. */
  --card-bg: #ffffff;
  /* Standard-Schriftfarbe im Body & in Content-Boxen. */
  --text-main: #333333;
  /* Gedämpfte Schrift für Sub-Texte (z.B. Ort unter dem Namen). */
  --text-muted: #666666;
  /* Trennlinien & Kartenränder im Content-Bereich. */
  --border-color: #e0e0e0;

  /* ============================================================
     3. HEADER (sticky Topbar)
     ============================================================ */
  /* Hintergrund der Header-Leiste (Farbe ODER Gradient erlaubt). */
  --header-bg: linear-gradient(180deg, rgba(20, 30, 34, 0.92), rgba(18, 26, 31, 0.88));
  /* Basis-Textfarbe im Header (aktuell nur als "Hook" vorhanden). */
  --header-fg: #ffffff;
  /* Farbe der Nav-Links (Startseite / Städte / Magazin / Livecam). */
  --header-link: #f5f7fa;
  /* Hover- und Aktiv-Farbe der Nav-Links. */
  --header-link-hover: #d2dde5;
  /* 1px-Trennlinie unterhalb des Headers. */
  --header-border: rgba(109, 154, 173, 0.28);

  /* ============================================================
     4. LOGO (wird im Header UND Footer verwendet)
     ============================================================ */
  /* Hauptwort des Logos (z.B. "Analpunkt"). */
  --logo-main: #f2eee7;
  /* Akzent-Part des Logos (z.B. "XXX"). */
  --logo-accent: #6fb6ab;

  /* ============================================================
     5. FOOTER
     ============================================================ */
  /* Hintergrund des Footers (Farbe ODER Gradient erlaubt). */
  --footer-bg: #182a30;
  /* Basis-Schriftfarbe im Footer (Haupt-Fließtext, Panel-Titel). */
  --footer-fg: #f2f7fa;
  /* Abgedämpfte Texte (Meta, Domain, Copyright-Zeile, Headlines). */
  --footer-fg-muted: rgba(229, 238, 244, 0.65);
  /* Farbe der Navigationslinks im Footer. */
  --footer-link: rgba(229, 238, 244, 0.78);
  /* Hover-Farbe der Navigationslinks im Footer. */
  --footer-link-hover: #ffffff;
  /* Obere Trennlinie des Footers + interner Haupt-Divider. */
  --footer-border: rgba(128, 181, 195, 0.24);
  /* Hintergrund der Mini-Panels im Footer
     (Age-Badge, Legal-Panel, Kategorie-Chips). */
  --footer-surface: rgba(255, 255, 255, 0.05);
  /* Rand/Divider dieser Mini-Panels. */
  --footer-surface-border: rgba(255, 255, 255, 0.09);
  /* Akzentfarbe im Footer ("UNSER TIPP"-Eyebrow, Links in Legal-Panels). */
  --footer-accent: #7dc2b6;
}