:root {
  /* Couleurs principales – mode clair */
  --bg-light: #ffffff;
  --text-light: rgb(13, 6, 18);
  --color-purple-deep-light: #150c36;
  --color-purple-light: #5F36F5;
  --color-lime-light: #DBFE75;
  --color-black-light: rgb(13, 6, 18);
  --color-white-light: #ffffff;
  --color-gray-light: #e1e1e1;
  
  /* Couleurs étendues – clair */
  --color-purple-main-light: #5F36F5;
  --color-purple-secondary-light: #4d28d2;
  --color-green-light: #10b981;
  --color-orange-light: #f59e0b;
  --color-red-light: #ef4444;
  --color-gray-dark: #1f2937;
  --color-gray-darker: #677281;
  --color-gray-medium: #6b7280;
  --color-gray-very-light: #f3f4f6;
  --color-gray-super-light: #e5e7eb;
  --color-gray-border: #d1d5db;
  
  /* Aliases sémantiques (clair) */
  --primary-color: var(--color-purple-main-light);
  --secondary-color: var(--color-purple-secondary-light);
  --success-color: var(--color-green-light);
  --warning-color: var(--color-orange-light);
  --danger-color: var(--color-red-light);
  
  --text-primary: var(--color-black-light);
  --text-secondary: var(--color-gray-darker);
  --text-muted: var(--color-gray-medium);
  
  --bg-primary: var(--color-gray-very-light);
  --bg-secondary: var(--color-gray-super-light);
  --border-color: var(--color-gray-border);
  
  /* Effets – clair */
  --overlay-dark: rgba(13, 6, 18, 0.5);
  --shadow-light: rgba(13, 6, 18, 0.1);
  
  /* Variables « base » pour le mode sombre */
  --bg-dark: rgb(13, 6, 18);
  --text-dark: #ffffff;
  --color-purple-deep-dark: #f4eeff;
  --color-purple-dark: #7c5df8;           /* un peu plus clair pour le contraste */
  --color-lime-dark: #DBFE75;
  --color-black-dark: #ffffff;
  --color-white-dark: #1e1e1e;
  --color-gray-dark-base: #0d003e;
  --color-gray-darker-dark: #2a2a2a;
  --color-gray-medium-dark: #444444;
  --color-gray-very-dark: #2a2a2a;
  --color-gray-super-dark: #616161;
  --color-gray-border-dark: #1e1e1e;
  
  /* Effets – sombre (déclarés ici pour pouvoir les réutiliser) */
  --overlay-light: rgba(254, 255, 248, 0.45);
  --shadow-dark: rgba(0, 0, 0, 0.6);
  
  /* Espacements */
  --space-1: 4px;
  --space-2: 8px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-11: 44px;
  
  /* Rayons de bordure */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-3xl: 24px;
  
  /* Breakpoints */
  --bp-sm: 550px;
  --bp-md: 1050px;
  }