/* colors.css - SINGLE SOURCE OF TRUTH FOR ALL COLORS */

:root {
  /* --- BASE THEME COLORS (Light Mode) - FINALLY, FUN & ENERGY! --- */
  --color-background: #FDE68A; /* VIBRANT YELLOW from the logo as the base! */
  --color-foreground: #1F2937; /* Dark text for high contrast. */
  --color-card-background: #FFFFFF; /* Crisp white cards that pop. */
  --color-card-background-alt: #F0FDF4; /* A very light green for alternative cards. */
  --color-header-background: rgba(255, 255, 255, 0.7); /* Semi-transparent white header. */
  --color-header-text: #1F2937; /* Dark header text. */
  --color-border: rgba(31, 41, 55, 0.1);
  
  /* --- CUSTOM BRAND & ACCENT COLORS - PUNK THEME FROM LOGO --- */
  --color-main-green: #15803d;     /* THE rich football green for key branding. */
  --color-accent-orange: #EC4899;  /* Vibrant Pink from logo. */
  --color-accent-blue: #0891B2;    /* Vibrant Cyan from logo. */
  
  /* --- COMPONENT-SPECIFIC COLORS (Light Mode) --- */
  --color-phone-mockup-bg: #f9fafb; /* gray-50 */
  --color-phone-mockup-border: #1F2937; /* almost-black */
  
  /* --- CHART COLORS (Light Mode) --- */
  --color-chart-font: #4b5563;
  --color-chart-grid: rgba(0, 0, 0, 0.1);
  --chart-accent-1: var(--color-accent-blue);
  --chart-accent-2: var(--color-accent-orange);
  --chart-accent-3: var(--color-main-green);
  --chart-accent-4: #FBBF24;
  --chart-accent-5: #8B5CF6;
  --chart-accent-6: #F59E0B;
  --chart-accent-7: #EF4444; /* NEU: Rote Akzentfarbe für 7. Tool */
}

html.dark {
  /* --- BASE THEME COLORS (Dark Mode) - The proven dark mode remains unchanged. --- */
  --color-background: #111827; /* gray-dark */
  --color-foreground: #d1d5db; /* gray-300 */
  --color-card-background: #374151; /* gray-light */
  --color-card-background-alt: #374151; /* gray-light */
  --color-header-background: rgba(31, 41, 55, 0.7); /* almost-black with alpha */
  --color-header-text: #FFFFFF;
  --color-border: rgba(255, 255, 255, 0.1);
  
  /* --- COMPONENT-SPECIFIC COLORS (Dark Mode) --- */
  --color-phone-mockup-bg: #374151; /* gray-light */
  --color-phone-mockup-border: #111827; /* gray-dark */

  /* --- CHART COLORS (Dark Mode) --- */
  --color-chart-font: #F9FAFB; /* gray-50 - Deutlich heller für besseren Kontrast */
  --color-chart-grid: rgba(255, 255, 255, 0.1);
}