:root {
  /* 🎨 Palet van bestaande kleuren */
  --main-bg: #161e43;
  --main-fg: #fff;
  --gradient-start: #29387d;
  --gradient-end: #1a234f;
  --border-light: #d6d5d5;
  --dark-02: #2d3d88;
  --dark-01: #1a2452;
  --primary: #0d6efd;
  --danger: #dc3545;
  --accent: #797ef6;
  --pink: #ea4279;
  --reverso: #6f42c1;
  --glosbe: #ffc107;
  --you: #797ef6;
  --iask: #fd7e14;
  --clipboard: #20c997;
  --bot: #ff5733;
  --info: #0dcaf0;
  --orange: orangered;
  
  /* 🌈 Extra kleuren gevonden in custom.css */
  --gold: gold;
  --darkorange: darkorange;
  --grey: grey;
  --blue-body: #1d2758;
  --chat-user: #007bff;
  --chat-ai: #2d3d88;
  --telegram: #0088cc;
  --telegram-hover: #007ab8;
  --input-telegram-bg: #2a2a2a;
  --input-telegram-border: #444;
  --placeholder-color: #888;
  --success: #28a745;
  --success-hover: #218838;
  --danger-hover: #c82333;
  --chat-gradient-start: #232946;
  --chat-gradient-end: #2d3d88;
  --recording: #e74c3c;
  --glow: #00fff7;
  --volume-hover: #ffd700;
  --border-gray: #b0b0b0;
  --fab-shadow: rgba(45,61,136,0.25);
  --black-shadow: rgba(0,0,0,0.10);
  
  /* Voeg hier meer kleuren toe indien gewenst! */
  --secondary: #ffb347;
  --light: #f8f9fa;
  --background: #f0f4f8;
  --button-gradient: linear-gradient(90deg, #4f8cff 0%, #a259ff 100%);
  
  /* ✨ Extra variabelen voor custom kleuren uit custom.css ✨ */
  --gold-light: #ffd54f;
  --gold-light-rgba: #ffd54f99;
  --gold-light-hover: #ffe082;
  --gold-light-gradient: linear-gradient(90deg, var(--gold-light-hover) 0%, var(--gold-light) 100%);
  --gold-light-shadow: #ffd54f55;
  --textarea-bg-1: #232526;
  --textarea-bg-2: #414345;
  --textarea-border: #4e5d6c;
  --textarea-focus-border: #6ec1e4;
  --textarea-focus-bg-1: #2c3e50;
  --textarea-focus-bg-2: #4ca1af;
  --textarea-shadow: rgba(30,40,60,0.10);
  --textarea-focus-shadow: #6ec1e455;
  --nav-hover-fg: #222;
  --fab-pulse-shadow-1: #00fff733;
  --fab-pulse-shadow-2: #00fff744;
  --fab-pulse-shadow-3: rgba(45,61,136,0.25);
  --fab-pulse-shadow-4: rgba(45,61,136,0.30);
  --navbar-border: rgba(91, 146, 255, 0.15);
  --scrollbar-track-shadow: inset 0 0 5px var(--grey);
  --scrollbar-thumb: var(--danger);
  --scrollbar-thumb-hover: var(--danger);
  --option-checked-bg: rgb(255, 193, 7);
  --option-checked-fg: #fff;
  --option-checked-font-weight: bold;
  --notification-bg: transparent;
  --notification-shadow: 0 .5rem 1rem rgba(0, 0, 0, 1);
  --information-question-shadow: 0 .5rem 1rem rgba(0, 0, 0, .60);
  --chat-avatar-shadow: 0 2px 8px rgba(0,0,0,0.15);
  --custom-textarea-btn-shadow: 0 2px 8px rgba(13,202,240,0.15);
  --custom-textarea-btn-hover-shadow: 0 4px 16px rgba(13,202,240,0.25);
  --custom-textarea-input-expanded-shadow: 0 4px 32px 0 rgba(13,202,240,0.18), 0 1.5px 8px 0 rgba(35,41,70,0.12);
  --custom-textarea-input-shadow: 0 1px 4px 0 rgba(13,202,240,0.08);
  --menu-fab-fadein-from: 0 0 0 0 rgba(0,0,0,0.10);
  --menu-fab-fadein-to: 0 0 0 0 rgba(0,0,0,0.10);
  --menu-fab-pulse-0: 0 0 0 4px var(--fab-pulse-shadow-1), 0 12px 32px 0 var(--fab-pulse-shadow-3);
  --menu-fab-pulse-100: 0 0 0 12px var(--fab-pulse-shadow-2), 0 16px 40px 0 var(--fab-pulse-shadow-4);
  --nav-link-hover-shadow: 0 2px 12px 0 var(--gold-light-shadow);
  --nav-link-active-shadow: 0 0 8px 2px var(--gold-light-rgba);
  --textarea-category-shadow: 0 2px 8px var(--textarea-shadow);
}
