/* ─── Shared semantic colors ─────────────────────────────────────────────── */
:root {
  --color-meca:          #2B6CB8;
  --color-meca-bg:       #E8F0FB;
  --color-meca-dark-bg:  #1A2F4E;
  --color-meca-dark-fg:  #7EB3F5;

  --color-tolerie:          #B45309;
  --color-tolerie-bg:       #FEF3E2;
  --color-tolerie-dark-bg:  #4A2A06;
  --color-tolerie-dark-fg:  #FBBD5A;

  --color-prep:          #0D7A55;
  --color-prep-bg:       #E5F5EE;
  --color-prep-dark-bg:  #053D2B;
  --color-prep-dark-fg:  #4ADBA0;

  --color-peinture:          #9B22C2;
  --color-peinture-bg:       #F5E8FC;
  --color-peinture-dark-bg:  #3A0D4F;
  --color-peinture-dark-fg:  #D47EF7;

  --color-absent:          #6B7280;
  --color-absent-bg:       #F3F4F6;
  --color-absent-dark-bg:  #1F2330;
  --color-absent-dark-fg:  #9CA3AF;

  --color-success: #0D7A55;
  --color-warning: #B45309;
  --color-danger:  #B91C1C;
  --color-info:    #2B6CB8;

  /* ─── Spacing ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;

  /* ─── Radius ── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-full: 9999px;

  /* ─── Transitions ── */
  --transition-fast:   100ms ease;
  --transition-base:   180ms ease;
  --transition-slow:   300ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ─── Chef UI (light) ───────────────────────────────────────────────────── */
body.theme-chef {
  --bg-base:       #F4F3EF;
  --bg-surface:    #FFFFFF;
  --bg-surface-2:  #FAFAF7;
  --bg-hover:      #F0EFE9;
  --bg-active:     #E8E6DE;

  --border-subtle: #E8E5DC;
  --border-medium: #D4D0C4;
  --border-strong: #B0AC9E;

  --text-primary:   #1A1915;
  --text-secondary: #6B6860;
  --text-tertiary:  #9C9890;
  --text-invert:    #FFFFFF;

  --accent:       #1B3A5C;
  --accent-hover: #142C47;
  --accent-light: #E8EFF7;
  --accent-fg:    #FFFFFF;

  --sidebar-bg:     #1A1915;
  --sidebar-text:   #C8C5BC;
  --sidebar-active: #FFFFFF;
  --sidebar-hover:  rgba(255,255,255,0.08);
  --sidebar-border: rgba(255,255,255,0.06);

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.07);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.10);
  --shadow-xl: 0 16px 48px rgba(0,0,0,0.14);
}

/* ─── Display screen (dark) ─────────────────────────────────────────────── */
body.theme-display {
  --bg-base:      #0C0C0F;
  --bg-surface:   #14141A;
  --bg-surface-2: #1C1C25;
  --bg-hover:     #1E1E28;
  --bg-active:    #25252F;

  --border-subtle: #22222C;
  --border-medium: #2E2E3C;
  --border-strong: #3E3E50;

  --text-primary:   #F0EFEA;
  --text-secondary: #8A8A96;
  --text-tertiary:  #55555F;
  --text-invert:    #0C0C0F;

  --accent:       #4C8EDB;
  --accent-hover: #5C9EEB;
  --accent-light: rgba(76,142,219,0.12);
  --accent-fg:    #FFFFFF;

  --shadow-sm: 0 1px 4px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.5);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.6);
}