/* ============================================
   TLS DESIGN SYSTEM - DESIGN TOKENS
   Généré automatiquement depuis l'interface admin
   Ne pas modifier manuellement
   ============================================ */

@import url('https://fonts.googleapis.com/css2?League+Spartan:wght@600;700&Nunito:wght@400;500;600;700&display=swap');

:root {
  /* ========================================
     TYPOGRAPHY
     ======================================== */

  /* Typography Styles (imported) */
  --typography-eadings-isplay-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-isplay-font-weight: 700;
  --typography-eadings-isplay-font-size: 4.5rem;
  --typography-eadings-isplay-line-height: 1.1;
  --typography-eadings-isplay-letter-spacing: -0.02em;
  --typography-eadings-1-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-1-font-weight: 700;
  --typography-eadings-1-font-size: 3rem;
  --typography-eadings-1-line-height: 1.2;
  --typography-eadings-1-letter-spacing: 0em;
  --typography-eadings-2-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-2-font-weight: 700;
  --typography-eadings-2-font-size: 2.25rem;
  --typography-eadings-2-line-height: 1.2;
  --typography-eadings-2-letter-spacing: 0em;
  --typography-eadings-3-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-3-font-weight: 700;
  --typography-eadings-3-font-size: 1.5rem;
  --typography-eadings-3-line-height: 1.3;
  --typography-eadings-3-letter-spacing: 0em;
  --typography-eadings-4-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-4-font-weight: 600;
  --typography-eadings-4-font-size: 1.25rem;
  --typography-eadings-4-line-height: 1.3;
  --typography-eadings-4-letter-spacing: 0em;
  --typography-eadings-5-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-5-font-weight: 600;
  --typography-eadings-5-font-size: 1.125rem;
  --typography-eadings-5-line-height: 1.3;
  --typography-eadings-5-letter-spacing: 0em;
  --typography-eadings-6-font-family: League Spartan, -apple-system, Helvetica Neue, Arial, sans-serif;
  --typography-eadings-6-font-weight: 600;
  --typography-eadings-6-font-size: 1rem;
  --typography-eadings-6-line-height: 1.4;
  --typography-eadings-6-letter-spacing: 0em;
  --typography-ubtitles-arge-emi-old-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-ubtitles-arge-emi-old-font-weight: 600;
  --typography-ubtitles-arge-emi-old-font-size: 1.25rem;
  --typography-ubtitles-arge-emi-old-line-height: 1.4;
  --typography-ubtitles-arge-emi-old-letter-spacing: 0em;
  --typography-ubtitles-arge-edium-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-ubtitles-arge-edium-font-weight: 500;
  --typography-ubtitles-arge-edium-font-size: 1.25rem;
  --typography-ubtitles-arge-edium-line-height: 1.4;
  --typography-ubtitles-arge-edium-letter-spacing: 0em;
  --typography-ubtitles-egular-emi-old-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-ubtitles-egular-emi-old-font-weight: 600;
  --typography-ubtitles-egular-emi-old-font-size: 1.125rem;
  --typography-ubtitles-egular-emi-old-line-height: 1.4;
  --typography-ubtitles-egular-emi-old-letter-spacing: 0em;
  --typography-ubtitles-egular-edium-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-ubtitles-egular-edium-font-weight: 500;
  --typography-ubtitles-egular-edium-font-size: 1.125rem;
  --typography-ubtitles-egular-edium-line-height: 1.4;
  --typography-ubtitles-egular-edium-letter-spacing: 0em;
  --typography-aragraphs-ain-egular-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aragraphs-ain-egular-font-weight: 400;
  --typography-aragraphs-ain-egular-font-size: 1rem;
  --typography-aragraphs-ain-egular-line-height: 1.5;
  --typography-aragraphs-ain-egular-letter-spacing: 0em;
  --typography-aragraphs-ain-edium-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aragraphs-ain-edium-font-weight: 500;
  --typography-aragraphs-ain-edium-font-size: 1rem;
  --typography-aragraphs-ain-edium-line-height: 1.5;
  --typography-aragraphs-ain-edium-letter-spacing: 0em;
  --typography-aragraphs-ain-old-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aragraphs-ain-old-font-weight: 700;
  --typography-aragraphs-ain-old-font-size: 1rem;
  --typography-aragraphs-ain-old-line-height: 1.5;
  --typography-aragraphs-ain-old-letter-spacing: 0em;
  --typography-aragraphs-mall-egular-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aragraphs-mall-egular-font-weight: 400;
  --typography-aragraphs-mall-egular-font-size: 0.875rem;
  --typography-aragraphs-mall-egular-line-height: 1.4;
  --typography-aragraphs-mall-egular-letter-spacing: 0em;
  --typography-aragraphs-mall-edium-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aragraphs-mall-edium-font-weight: 500;
  --typography-aragraphs-mall-edium-font-size: 0.875rem;
  --typography-aragraphs-mall-edium-line-height: 1.4;
  --typography-aragraphs-mall-edium-letter-spacing: 0em;
  --typography-aragraphs-mall-old-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aragraphs-mall-old-font-weight: 700;
  --typography-aragraphs-mall-old-font-size: 0.875rem;
  --typography-aragraphs-mall-old-line-height: 1.4;
  --typography-aragraphs-mall-old-letter-spacing: 0em;
  --typography-aptions-tandard-egular-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aptions-tandard-egular-font-weight: 400;
  --typography-aptions-tandard-egular-font-size: 0.75rem;
  --typography-aptions-tandard-egular-line-height: 1.4;
  --typography-aptions-tandard-egular-letter-spacing: 0em;
  --typography-aptions-tandard-edium-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aptions-tandard-edium-font-weight: 500;
  --typography-aptions-tandard-edium-font-size: 0.75rem;
  --typography-aptions-tandard-edium-line-height: 1.4;
  --typography-aptions-tandard-edium-letter-spacing: 0em;
  --typography-aptions-tandard-old-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aptions-tandard-old-font-weight: 700;
  --typography-aptions-tandard-old-font-size: 0.75rem;
  --typography-aptions-tandard-old-line-height: 1.4;
  --typography-aptions-tandard-old-letter-spacing: 0em;
  --typography-aptions-iny-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-aptions-iny-font-weight: 600;
  --typography-aptions-iny-font-size: 0.625rem;
  --typography-aptions-iny-line-height: 1;
  --typography-aptions-iny-letter-spacing: 0em;
  --typography-utton-abel-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-utton-abel-font-weight: 700;
  --typography-utton-abel-font-size: 1rem;
  --typography-utton-abel-line-height: 1;
  --typography-utton-abel-letter-spacing: 0em;
  --typography-utton-mall-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-utton-mall-font-weight: 700;
  --typography-utton-mall-font-size: 0.875rem;
  --typography-utton-mall-line-height: 1;
  --typography-utton-mall-letter-spacing: 0em;
  --typography-utton-arge-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-utton-arge-font-weight: 700;
  --typography-utton-arge-font-size: 1.125rem;
  --typography-utton-arge-line-height: 1;
  --typography-utton-arge-letter-spacing: 0em;
  --typography-nput-ext-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-nput-ext-font-weight: 500;
  --typography-nput-ext-font-size: 1rem;
  --typography-nput-ext-line-height: 1.2;
  --typography-nput-ext-letter-spacing: 0em;
  --typography-adge-abel-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-adge-abel-font-weight: 700;
  --typography-adge-abel-font-size: 0.75rem;
  --typography-adge-abel-line-height: 1;
  --typography-adge-abel-letter-spacing: 0.02em;
  --typography-ink-efault-font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, system-ui, sans-serif;
  --typography-ink-efault-font-weight: 500;
  --typography-ink-efault-font-size: 1rem;
  --typography-ink-efault-line-height: 1.5;
  --typography-ink-efault-letter-spacing: 0em;

  /* ========================================
     COLORS
     ======================================== */

  /* Colors - Base */
  --background: transparent;
  --foreground: #000000;
  --surface: rgba(255, 255, 255, 0.7);

  /* Colors - Primary */
  --primary-primary: #000000;
  --primary-primary-foreground: #ffffff;

  /* Colors - Secondary */
  --secondary-secondary: #000000;
  --secondary-secondary-foreground: #ffffff;

  /* Colors - Accent */
  --accent-accent: #000000;
  --accent-accent-foreground: #ffffff;

  /* Colors - Marques */
  --color-marques-primary: #55A1B4;
  --color-marques-primary-foreground: #ffffff;
  --color-marques-primary-hover: #4A8FA1;
  --color-marques-primary-light: #7BC4D4;
  --color-marques-primary-lighter: #E8F4F7;
  --color-marques-secondary: #ED843A;
  --color-marques-secondary-foreground: #ffffff;
  --color-marques-secondary-hover: #C06920;
  --color-marques-secondary-light: #F5A868;
  --color-marques-secondary-lighter: #FFF4E6;
  --color-marques-accent: #F8B044;
  --color-marques-accent-foreground: #1a1a1a;
  --color-marques-accent-hover: #D69020;
  --color-marques-accent-light: #FFC977;
  --color-marques-accent-lighter: #FFF9EE;
  --color-marques-neutral-light: #5f8f8f;
  --color-marques-neutral-dark: #252B37;

  /* Colors - Palette */
  --color-palette-primary-50: #E8F4F7;
  --color-palette-primary-100: #DCEBEF;
  --color-palette-primary-200: #B9D7DF;
  --color-palette-primary-300: #96C3CF;
  --color-palette-primary-400: #73AFBF;
  --color-palette-primary-500: #55A1B4;
  --color-palette-primary-600: #4A8FA1;
  --color-palette-primary-700: #3D7786;
  --color-palette-primary-800: #2F5F6A;
  --color-palette-primary-900: #1F3E45;
  --color-palette-secondary-50: #FFF3EB;
  --color-palette-secondary-100: #FDDCC7;
  --color-palette-secondary-200: #FCBB93;
  --color-palette-secondary-300: #F59A5F;
  --color-palette-secondary-400: #F18A4C;
  --color-palette-secondary-500: #ED843A;
  --color-palette-secondary-600: #C06920;
  --color-palette-secondary-700: #8F5017;
  --color-palette-secondary-800: #5E3710;
  --color-palette-secondary-900: #3B2109;
  --color-palette-accent-50: #FFF9EE;
  --color-palette-accent-100: #FFECC8;
  --color-palette-accent-200: #FFD791;
  --color-palette-accent-300: #FFC15A;
  --color-palette-accent-400: #F8B044;
  --color-palette-accent-500: #F8A733;
  --color-palette-accent-600: #D69020;
  --color-palette-accent-700: #9B6818;
  --color-palette-accent-800: #664410;
  --color-palette-accent-900: #3D2909;
  --color-palette-neutral-50: #F5F8F8;
  --color-palette-neutral-100: #EEF6F8;
  --color-palette-neutral-200: #E0E8EA;
  --color-palette-neutral-300: #C8D4D7;
  --color-palette-neutral-400: #9AABB0;
  --color-palette-neutral-500: #6B7D82;
  --color-palette-neutral-600: #5f8f8f;
  --color-palette-neutral-700: #3A474B;
  --color-palette-neutral-800: #2A3538;
  --color-palette-neutral-900: #252B37;
  --color-palette-success-50: #E8F4F7;
  --color-palette-success-100: #DCEBEF;
  --color-palette-success-200: #B9D7DF;
  --color-palette-success-300: #96C3CF;
  --color-palette-success-400: #73AFBF;
  --color-palette-success-500: #55A1B4;
  --color-palette-success-600: #4A8FA1;
  --color-palette-success-700: #3D7786;
  --color-palette-success-800: #2F5F6A;
  --color-palette-success-900: #1F3E45;
  --color-palette-destructive-50: #FFF3EB;
  --color-palette-destructive-100: #FDDCC7;
  --color-palette-destructive-200: #FCBB93;
  --color-palette-destructive-300: #F59A5F;
  --color-palette-destructive-400: #F18A4C;
  --color-palette-destructive-500: #ED843A;
  --color-palette-destructive-600: #C06920;
  --color-palette-destructive-700: #8F5017;
  --color-palette-destructive-800: #5E3710;
  --color-palette-destructive-900: #3B2109;
  --color-palette-warning-50: #FFF9EE;
  --color-palette-warning-100: #FFECC8;
  --color-palette-warning-200: #FFD791;
  --color-palette-warning-300: #FFC15A;
  --color-palette-warning-400: #F8B044;
  --color-palette-warning-500: #F8A733;
  --color-palette-warning-600: #D69020;
  --color-palette-warning-700: #9B6818;
  --color-palette-warning-800: #664410;
  --color-palette-warning-900: #3D2909;
  --color-palette-info-50: #E8F4F7;
  --color-palette-info-100: #DCEBEF;
  --color-palette-info-200: #B9D7DF;
  --color-palette-info-300: #96C3CF;
  --color-palette-info-400: #73AFBF;
  --color-palette-info-500: #55A1B4;
  --color-palette-info-600: #4A8FA1;
  --color-palette-info-700: #3D7786;
  --color-palette-info-800: #2F5F6A;
  --color-palette-info-900: #1F3E45;
  --color-palette-chart-1: #55A1B4;
  --color-palette-chart-2: #F8B044;
  --color-palette-chart-3: #EB7724;
  --color-palette-chart-4: #7BC4D4;
  --color-palette-chart-5: #FFCB77;

  /* Colors - Gradients */
  --color-gradients-brand-primary: linear-gradient(135deg, #55A1B4, #3D7786);
  --color-gradients-brand-primary-radial: radial-gradient(circle at 50% 50%, #55A1B4, #1F3E45);
  --color-gradients-brand-primary-soft: linear-gradient(135deg, #E8F4F7, #DCEBEF);
  --color-gradients-brand-secondary: linear-gradient(135deg, #F18A4C, #C06920);
  --color-gradients-brand-secondary-radial: radial-gradient(circle at 50% 50%, #F18A4C, #5E3710);
  --color-gradients-brand-secondary-soft: linear-gradient(135deg, #FFF3EB, #FDDCC7);
  --color-gradients-brand-accent: linear-gradient(135deg, #F8B044, #D69020);
  --color-gradients-brand-accent-radial: radial-gradient(circle at 50% 50%, #F8B044, #664410);
  --color-gradients-brand-accent-soft: linear-gradient(135deg, #FFF9EE, #FFECC8);
  --color-gradients-signature-default: linear-gradient(135deg, #55A1B4 0%, #ED843A 100%);
  --color-gradients-signature-hover: linear-gradient(135deg, #4A8FA1 0%, #C06920 100%);
  --color-gradients-signature-full: linear-gradient(135deg, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-signature-full-reverse: linear-gradient(135deg, #F8B044 0%, #ED843A 50%, #55A1B4 100%);
  --color-gradients-directional-horizontal: linear-gradient(90deg, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-directional-horizontal-reverse: linear-gradient(90deg, #F8B044 0%, #ED843A 50%, #55A1B4 100%);
  --color-gradients-directional-vertical: linear-gradient(180deg, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-directional-vertical-reverse: linear-gradient(180deg, #F8B044 0%, #ED843A 50%, #55A1B4 100%);
  --color-gradients-directional-diagonal: linear-gradient(45deg, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-directional-diagonal-reverse: linear-gradient(45deg, #F8B044 0%, #ED843A 50%, #55A1B4 100%);
  --color-gradients-directional-radial: radial-gradient(circle, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-directional-radial-reverse: radial-gradient(circle, #F8B044 0%, #ED843A 50%, #55A1B4 100%);
  --color-gradients-themed-warm: linear-gradient(135deg, #F18A4C 0%, #F8B044 100%);
  --color-gradients-themed-cool: linear-gradient(135deg, #73AFBF 0%, #3D7786 100%);
  --color-gradients-themed-sunset: linear-gradient(135deg, #ED843A 0%, #FFC15A 50%, #F59A5F 100%);
  --color-gradients-themed-ocean: linear-gradient(135deg, #55A1B4 0%, #96C3CF 50%, #FFD791 100%);
  --color-gradients-themed-fire: linear-gradient(135deg, #F8A733 0%, #C06920 100%);
  --color-gradients-mixed-primary: linear-gradient(135deg, #55A1B4 0%, #96C3CF 50%, #F18A4C 100%);
  --color-gradients-mixed-secondary: linear-gradient(135deg, #ED843A 0%, #F8B044 50%, #F59A5F 100%);
  --color-gradients-mixed-accent: linear-gradient(135deg, #F8B044 0%, #ED843A 50%, #73AFBF 100%);
  --color-gradients-soft-default: linear-gradient(135deg, rgba(85, 161, 180, 0.8) 0%, rgba(237, 132, 58, 0.8) 100%);
  --color-gradients-soft-light: linear-gradient(135deg, rgba(85, 161, 180, 0.4) 0%, rgba(237, 132, 58, 0.4) 100%);
  --color-gradients-soft-subtle: linear-gradient(135deg, rgba(85, 161, 180, 0.05) 0%, rgba(237, 132, 58, 0.05) 100%);
  --color-gradients-soft-subtle-reverse: linear-gradient(135deg, rgba(237, 132, 58, 0.05) 0%, rgba(248, 176, 68, 0.05) 100%);
  --color-gradients-background-primary-subtle: linear-gradient(180deg, #E8F4F7 0%, transparent 100%);
  --color-gradients-background-secondary-subtle: linear-gradient(180deg, #FFF3EB 0%, transparent 100%);
  --color-gradients-background-accent-subtle: linear-gradient(180deg, #FFF9EE 0%, transparent 100%);
  --color-gradients-background-neutral-subtle: linear-gradient(180deg, #F5F8F8 0%, transparent 100%);
  --color-gradients-glass-default: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%);
  --color-gradients-glass-tls: linear-gradient(135deg, rgba(85, 161, 180, 0.25) 0%, rgba(237, 132, 58, 0.25) 100%);
  --color-gradients-glass-warm: linear-gradient(135deg, rgba(237, 132, 58, 0.25) 0%, rgba(248, 176, 68, 0.25) 100%);
  --color-gradients-overlay-default: linear-gradient(135deg, rgba(85, 161, 180, 0.1) 0%, rgba(237, 132, 58, 0.1) 50%, rgba(248, 176, 68, 0.1) 100%);
  --color-gradients-overlay-strong: linear-gradient(135deg, rgba(85, 161, 180, 0.3) 0%, rgba(237, 132, 58, 0.3) 50%, rgba(248, 176, 68, 0.3) 100%);
  --color-gradients-mesh-primary: radial-gradient(at 0% 0%, #B9D7DF 0px, transparent 50%), radial-gradient(at 100% 0%, #96C3CF 0px, transparent 50%), radial-gradient(at 100% 100%, #DCEBEF 0px, transparent 50%), radial-gradient(at 0% 100%, #E8F4F7 0px, transparent 50%);
  --color-gradients-mesh-warm: radial-gradient(at 0% 0%, #FDDCC7 0px, transparent 50%), radial-gradient(at 100% 0%, #FFECC8 0px, transparent 50%), radial-gradient(at 100% 100%, #FFF3EB 0px, transparent 50%), radial-gradient(at 0% 100%, #FFF9EE 0px, transparent 50%);
  --color-gradients-mesh-tls: radial-gradient(at 40% 20%, rgba(85, 161, 180, 0.4) 0px, transparent 50%), radial-gradient(at 80% 0%, rgba(237, 132, 58, 0.3) 0px, transparent 50%), radial-gradient(at 0% 50%, rgba(248, 176, 68, 0.3) 0px, transparent 50%), radial-gradient(at 80% 50%, rgba(85, 161, 180, 0.2) 0px, transparent 50%), radial-gradient(at 0% 100%, rgba(237, 132, 58, 0.2) 0px, transparent 50%);
  --color-gradients-special-circular: radial-gradient(circle at 0% 0%, #55a1b4, #164267);
  --color-gradients-special-circular-tls: radial-gradient(circle at 0% 0%, #55A1B4, #1F3E45);
  --color-gradients-text-default: linear-gradient(135deg, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-text-warm: linear-gradient(135deg, #ED843A 0%, #F8B044 100%);
  --color-gradients-text-cool: linear-gradient(135deg, #55A1B4 0%, #7BC4D4 100%);
  --color-gradients-button-default: linear-gradient(135deg, #55A1B4 0%, #ED843A 100%);
  --color-gradients-button-hover: linear-gradient(135deg, #4A8FA1 0%, #C06920 100%);
  --color-gradients-button-active: linear-gradient(135deg, #3D7786 0%, #8F5017 100%);
  --color-gradients-border-default: linear-gradient(135deg, #55A1B4 0%, #ED843A 50%, #F8B044 100%);
  --color-gradients-animated-1: linear-gradient(135deg, #55A1B4 0%, #ED843A 100%);
  --color-gradients-animated-2: linear-gradient(135deg, #ED843A 0%, #F8B044 100%);
  --color-gradients-animated-3: linear-gradient(135deg, #F8B044 0%, #55A1B4 100%);

  /* Colors - Sémantiques */
  --color-sémantiques-base-background: transparent;
  --color-sémantiques-base-foreground: #252B37;
  --color-sémantiques-base-surface: rgba(255, 255, 255, 0.7);
  --color-sémantiques-component-card: #ffffff;
  --color-sémantiques-component-card-foreground: #1a1a1a;
  --color-sémantiques-component-popover: #ffffff;
  --color-sémantiques-component-popover-foreground: #1a1a1a;
  --color-sémantiques-component-sidebar: #ffffff;
  --color-sémantiques-component-sidebar-foreground: #1a1a1a;
  --color-sémantiques-component-sidebar-primary: #55A1B4;
  --color-sémantiques-component-sidebar-primary-foreground: #ffffff;
  --color-sémantiques-component-sidebar-accent: #f5f5f5;
  --color-sémantiques-component-sidebar-accent-foreground: #1a1a1a;
  --color-sémantiques-state-muted: #f5f5f5;
  --color-sémantiques-state-muted-foreground: #6b7280;
  --color-sémantiques-state-hover: #f5f5f5;
  --color-sémantiques-state-active: #e5e5e5;
  --color-sémantiques-state-disabled: #d4d4d4;
  --color-sémantiques-interactive-success: #55A1B4;
  --color-sémantiques-interactive-success-foreground: #ffffff;
  --color-sémantiques-interactive-success-bg: #E8F4F7;
  --color-sémantiques-interactive-destructive: #ED843A;
  --color-sémantiques-interactive-destructive-foreground: #ffffff;
  --color-sémantiques-interactive-destructive-bg: #FFF3EB;
  --color-sémantiques-interactive-warning: #F8B044;
  --color-sémantiques-interactive-warning-foreground: #1a1a1a;
  --color-sémantiques-interactive-warning-bg: #FFF9EE;
  --color-sémantiques-interactive-info: #73AFBF;
  --color-sémantiques-interactive-info-foreground: #ffffff;
  --color-sémantiques-interactive-info-bg: #DCEBEF;
  --color-sémantiques-learning-app-achievement: #F8B044;
  --color-sémantiques-learning-app-achievement-foreground: #1a1a1a;
  --color-sémantiques-learning-app-achievement-bg: #FFF9EE;
  --color-sémantiques-learning-app-streak: #ED843A;
  --color-sémantiques-learning-app-streak-foreground: #ffffff;
  --color-sémantiques-learning-app-streak-bg: #FFF3EB;
  --color-sémantiques-learning-app-xp-gained: #55A1B4;
  --color-sémantiques-learning-app-xp-gained-foreground: #ffffff;
  --color-sémantiques-learning-app-xp-gained-bg: #E8F4F7;
  --color-sémantiques-border-default: rgba(0, 0, 0, 0.1);
  --color-sémantiques-border-hover: rgba(0, 0, 0, 0.2);
  --color-sémantiques-input-default: transparent;
  --color-sémantiques-input-background: #f3f3f5;
  --color-sémantiques-input-border: rgba(0, 0, 0, 0.15);
  --color-sémantiques-input-switch-background: #cbced4;
  --color-sémantiques-focus-ring: #55A1B4;
  --color-sémantiques-focus-ring-offset: #ffffff;
  --color-sémantiques-fill-primary: #55A1B4;
  --color-sémantiques-fill-secondary: #ED843A;
  --color-sémantiques-fill-accent: #F8B044;
  --color-sémantiques-dark-mode-background: #1a1a1a;
  --color-sémantiques-dark-mode-foreground: #f5f5f5;
  --color-sémantiques-dark-mode-surface: #262626;
  --color-sémantiques-dark-mode-card: #262626;
  --color-sémantiques-dark-mode-card-foreground: #f5f5f5;
  --color-sémantiques-dark-mode-muted: #404040;
  --color-sémantiques-dark-mode-muted-foreground: #a3a3a3;
  --color-sémantiques-dark-mode-border: rgba(255, 255, 255, 0.1);
  --color-sémantiques-dark-mode-border-hover: rgba(255, 255, 255, 0.2);

  /* ========================================
     SPACING
     ======================================== */

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;
  --space-scale-1: 0.25rem;
  --space-scale-2: 0.5rem;
  --space-scale-3: 0.75rem;
  --space-scale-4: 1rem;
  --space-scale-5: 1.25rem;
  --space-scale-6: 1.5rem;
  --space-scale-8: 2rem;
  --space-scale-10: 2.5rem;
  --space-scale-12: 3rem;
  --space-scale-16: 4rem;
  --space-scale-20: 5rem;
  --space-scale-24: 6rem;
  --space-scale-32: 8rem;
  --space-component-xs: 0.5rem;
  --space-component-sm: 0.75rem;
  --space-component-md: 1rem;
  --space-component-lg: 1.5rem;
  --space-component-xl: 2rem;
  --space-gap-xs: 0.25rem;
  --space-gap-sm: 0.5rem;
  --space-gap-md: 0.75rem;
  --space-gap-lg: 1rem;
  --space-gap-xl: 1.5rem;
  --space-layout-xs: 2rem;
  --space-layout-sm: 3rem;
  --space-layout-md: 4rem;
  --space-layout-lg: 6rem;
  --space-layout-xl: 8rem;
  --space-section-sm: 3rem;
  --space-section-md: 4rem;
  --space-section-lg: 6rem;
  --space-section-xl: 8rem;
  --space-container-mobile: 1rem;
  --space-container-tablet: 1.5rem;
  --space-container-desktop: 2rem;

  /* ========================================
     TRANSITIONS
     ======================================== */

  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 300ms;
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

  /* ========================================
     Z-INDEX
     ======================================== */

  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal: 1050;
  --z-tooltip: 1070;

}

/* Dark Mode */
.dark {
  --background: #1a1a1a;
  --foreground: #f5f5f5;
  --surface: #262626;
  --muted: #404040;
  --muted-foreground: #a3a3a3;
  --border: rgba(255, 255, 255, 0.1);
}