/* ═══════════════════════════════════════════
   COLOR-NEU.CSS – Zentrales Farbprofil
   ═══════════════════════════════════════════

   Diese Datei enthält ein neues Farbschema
   basierend auf dem extrahierten Bild-Profil.
   Warme, erdige Töne mit Braun, Gold und Creme.
   ═══════════════════════════════════════════ */

:root {
  /* ── Hauptfarben ───────────────────────── */

  /* Primary Accent (Buttons, Titel, Highlights) */
  --color-accent: #b9985a;

  /* Secondary Accent (Hover, Gradient-End) */
  --color-accent-hover: #d4b06a;

  /* Gold (Sterne, dekorative Highlights) */
  --color-gold: #ffd166;

  /* Weiß (Buttons, Icons, Kontrast-Text) */
  --color-white: #fefefe;

  /* Navy (Dunkelblau – Hintergrund, Header, Footer) */
  --color-navy: #0a1628;

  /* ── Hintergrund ──────────────────────── */

  /* Dunkler Basis-Hintergrund (Navy) */
  --bg-color: var(--color-navy);

  /* Radial-Glow im Hintergrund (transparent, Gold) */
  --bg-glow: rgba(185, 152, 90, 0.12);

  /* ── Karten (Cards) ───────────────────── */

  /* Karten-Hintergrund (Glasmorph, dunkel transparent) */
  --card-bg: rgba(10, 22, 40, 0.60);

  /* Karten-Rahmen (leicht Gold-Ton) */
  --card-border: rgba(185, 152, 90, 0.20);

  /* Karten-Schatten (normal, Gold) */
  --card-shadow: rgba(185, 152, 90, 0.08);

  /* Karten-Schatten (hover, stärker Gold) */
  --card-shadow-hover: rgba(185, 152, 90, 0.18);

  /* ── Text ─────────────────────────────── */

  /* Primärer Text (Headlines, wichtige Infos – weiß auf Navy) */
  --text-primary: var(--color-white);

  /* Sekundärer Text (Beschreibungen, Untertitel – leicht transparent) */
  --text-secondary: rgba(254, 254, 254, 0.65);

  /* ── Hero ─────────────────────────────── */

  /* Hero "40" drop-shadow (Gold) */
  --hero-40-shadow: rgba(185, 152, 90, 0.30);

  /* Hero-Titel text-shadow (Gold) */
  --hero-title-shadow: rgba(185, 152, 90, 0.25);

  /* Section-Title Unterstrich start/end */
  --section-underline-start: var(--color-accent);
  --section-underline-end: var(--color-gold);

  /* ── Button Glow-Pulse ────────────────── */

  /* Glow-Start (0%, 100%) – Gold */
  --glow-pulse-start: rgba(185, 152, 90, 0.15);

  /* Glow-Peak (50%) – Gold intensiver */
  --glow-pulse-peak: rgba(185, 152, 90, 0.45);

  /* ── Button-Calendar box-shadow ────────── */

  /* Normal */
  --btn-calendar-shadow: rgba(185, 152, 90, 0.25);

  /* Hover */
  --btn-calendar-shadow-hover: rgba(185, 152, 90, 0.45);

  /* ── Dropzone (Upload) ────────────────── */

  /* Dropzone-Hover Hintergrund (transparent, Gold) */
  --dropzone-bg-hover: rgba(185, 152, 90, 0.10);

  /* Dropzone-Dragover Hintergrund (deutlicher) */
  --dropzone-bg-dragover: rgba(185, 152, 90, 0.20);

  /* Dropzone-Dragover Schatten (Gold) */
  --dropzone-shadow-dragover: rgba(185, 152, 90, 0.35);

  /* ── Upload Progress Track ─────────────── */

  /* Fortschrittsbalken-Hintergrund (leer, dunkel-gold) */
  --progress-track-bg: rgba(185, 152, 90, 0.12);

  /* Fortschrittsbalken-Gradient Start/End */
  --progress-bar-start: var(--color-accent);
  --progress-bar-mid: var(--color-accent-hover);
  --progress-bar-end: var(--color-gold);

  /* ── Canvas (Particles & Confetti) ────── */
  /* Leerzeichen-getrennte Hex-Farben – werden
     in JS via getComputedStyle() gelesen. */

  /* Partikel-Farben */
  --particles: #b9985a #ffd166 #f2ede5 #735339 #fefefe;

  /* Konfetti-Farben */
  --confetti: #b9985a #735339 #ffd166 #f2ede5 #d4b06a #c49a6a;

  /* ── Feedback (Erfolg / Fehler) ───────── */

  /* Erfolg */
  --success-bg: rgba(76, 150, 80, 0.12);
  --success-border: rgba(76, 150, 80, 0.30);
  --success-text: #2e6d32;

  /* Fehler */
  --error-bg: rgba(200, 80, 80, 0.12);
  --error-border: rgba(200, 80, 80, 0.30);
  --error-text: #a63828;

  /* Remove-Button (Vorschau-Item löschen) */
  --remove-bg: rgba(200, 80, 80, 0.90);
  --remove-bg-hover: #c64848;

  /* ── Print ────────────────────────────── */

  /* Druck-Hintergrund (hell/neutral) */
  --print-bg: #fefefe;

  /* ── Decorative Element Opacity Controls ─ */
  /* (Steuern die Sichtbarkeit der Parallax-Elemente) */

  /* Glow Orbs */
  --decor-opacity-orb: 0.12;

  /* Sterne */
  --decor-opacity-star: 0.18;
  --decor-opacity-twinkle: 0.15;
  --decor-opacity-twinkle-peak: 0.6;

  /* Linien */
  --decor-opacity-line: 0.20;
  --decor-opacity-line-h: 0.14;

  /* Ringe */
  --decor-opacity-ring: 0.10;

  /* Punkte */
  --decor-opacity-dots: 0.10;
}
