/* Globale stijlvariabelen gedeeld door alle componenten */
:root {
  --bg-primary: #f7f3e9; /* Lichte beige achtergrond */
  --bg-secondary: #f0e6d2; /* Iets donkerdere beige */
  --bg-tertiary: #e6dfd2; /* Nog donkerdere beige */

  --text-primary: #3a3428; /* Donkere tekst voor contrast */
  --text-secondary: #6b5d4f; /* Middelgrijs-beige tekst */

  --accent-primary: #4a90e2; /* Blauw voor Nieuwe Chat */
  --accent-hover: #357abd; /* Donkerdere oranje hover */

  /* Blauwe knoppen zoals "Start Analyse" */
  --accent-secondary: #c4ad87; /* Beige voor AI Markt */
  --accent-secondary-hover: #b5966b; /* Donkerdere blauw hover */
  --accent-gradient-1: #ff758c;
  --accent-gradient-2: #9c4dff;
  --accent-gradient-3: #00dcda;
  /* CHAT ITEMS - zachte beige */
  --chat-accent: #f0e6d2; /* Lichte beige voor chat items */
  --chat-accent-hover: #e6dfd2; /* Iets donkerdere beige voor hover */
  --chat-accent-active: #d4c4a8; /* Donkerdere beige voor actieve chat */

  --border-color: #d4c4a8;
  --error-color: #ef4444;
  --success-color: #10b981;
  --transition-speed: 0.2s;
  --shadow-sm: 0 1px 2px rgba(74, 144, 226, 0.08); /* Blauwe schaduw */
  --shadow-md: 0 4px 8px rgba(74, 144, 226, 0.12); /* Blauwe schaduw */

  --font-family:
    "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  /* Hoogte van de app voor mobiele browsers */
  --app-height: 100vh;

  /* Luxe Beige Palette */
  --luxury-beige: #f7f3e9;
  --luxury-gold: #d4af37;
  --luxury-bronze: #b8860b;

  /* Extra variabelen */
  --accent-primary-dark: #3656a1;
  --accent-primary-light: #2284c7;
  --text-muted: #6b7280;
  --text-dark: #374151;
  --border-light: #e5e7eb;
  --bg-light: #f3f4f6;
  --bg-lighter: #f9fafb;
  --bg-selected: #eff6ff;
  --badge-premium-bg: #fef3c7;
  --badge-premium-text: #d97706;
  --badge-new-bg: #dcfce7;
  --badge-new-text: #16a34a;
  --text-admin: #388e3c;
  --text-disabled: #999999;
  --star-color: #ffd700;
}