/* ==========================================================================
   RadioManager 2.0 — Design tokens
   Toutes les couleurs, rayons, ombres et typographies passent par ces
   variables. Les thèmes sont activés via <html data-theme="dark|light">.
   ========================================================================== */

@font-face {
  font-family: "Inter Variable";
  src: url("../fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter Variable";
  src: url("../fonts/inter-latin-ext-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "JetBrains Mono Variable";
  src: url("../fonts/jetbrains-mono-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 800;
  font-display: swap;
}

:root {
  /* Typographie */
  --font-sans: "Inter Variable", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono Variable", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-2xs: 10.5px;
  --fs-xs: 11.5px;
  --fs-sm: 12.5px;
  --fs-base: 13.5px;
  --fs-md: 14.5px;
  --fs-lg: 16px;
  --fs-xl: 19px;
  --fs-2xl: 24px;
  --fs-3xl: 32px;
  --fs-4xl: 42px;
  --lh-tight: 1.15;
  --lh: 1.5;

  /* Espacements (base 4px) */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px;

  /* Rayons */
  --r-xs: 5px; --r-sm: 7px; --r: 10px; --r-lg: 14px; --r-xl: 18px; --r-full: 999px;

  /* Layout */
  --sidebar-w: 252px;
  --sidebar-w-collapsed: 72px;
  --header-h: 64px;
  --content-pad: 24px;

  /* Mouvement */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur-fast: 120ms;
  --dur: 200ms;
  --dur-slow: 360ms;

  /* Couleurs de catégories de contenu (communes aux deux thèmes) */
  --cat-music: #7B83FF;
  --cat-jingle: #F2A93B;
  --cat-ad: #F0577E;
  --cat-top: #1FC2B0;
  --cat-show: #3DA5F5;
  --cat-event: #B27CFF;
  --cat-request: #7FCB55;
  --cat-other: #8E94A3;

  --z-sidebar: 30; --z-header: 40; --z-drawer: 60; --z-modal: 70; --z-popover: 80; --z-toast: 90; --z-tooltip: 100;
}

/* --------------------------------------------------------------------------
   Thème sombre (par défaut) — pensé pour les studios
   -------------------------------------------------------------------------- */
:root,
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0D0E11;
  --bg-sidebar: #111216;
  --surface: #16181D;
  --surface-2: #1C1F25;
  --surface-3: #24272F;
  --surface-hover: #1F2229;
  --surface-sunken: #121318;
  --overlay: rgba(6, 7, 10, .62);

  --border: rgba(255, 255, 255, .055);
  --border-strong: rgba(255, 255, 255, .1);
  --border-focus: rgba(124, 136, 255, .55);

  --text: #ECEDF2;
  --text-2: #A2A6B3;
  --text-3: #6C7181;
  --text-inv: #0D0E11;

  --accent: #7380FF;
  --accent-hover: #8590FF;
  --accent-press: #616EF5;
  --accent-soft: rgba(115, 128, 255, .14);
  --accent-softer: rgba(115, 128, 255, .08);
  --accent-text: #A9B1FF;
  --on-accent: #FFFFFF;

  --success: #3DD68C; --success-soft: rgba(61, 214, 140, .13);
  --warning: #F5B544; --warning-soft: rgba(245, 181, 68, .14);
  --danger:  #F7666E; --danger-soft:  rgba(247, 102, 110, .14);
  --info:    #4CB5F5; --info-soft:    rgba(76, 181, 245, .14);
  --live:    #FF4757; --live-soft:    rgba(255, 71, 87, .14);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
  --shadow: 0 4px 16px rgba(0, 0, 0, .28), 0 1px 3px rgba(0, 0, 0, .25);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, .5), 0 4px 16px rgba(0, 0, 0, .3);
  --ring: 0 0 0 3px rgba(115, 128, 255, .28);

  --chart-grid: rgba(255, 255, 255, .06);
  --skeleton-a: #1C1F25; --skeleton-b: #262A32;
  --cover-sat: 52%; --cover-light: 46%;
}

/* --------------------------------------------------------------------------
   Thème clair — blanc cassé, aéré
   -------------------------------------------------------------------------- */
[data-theme="light"] {
  color-scheme: light;
  --bg: #F5F5F2;
  --bg-sidebar: #FAFAF8;
  --surface: #FFFFFF;
  --surface-2: #F6F6F3;
  --surface-3: #ECECE8;
  --surface-hover: #F8F8F6;
  --surface-sunken: #F0F0EC;
  --overlay: rgba(28, 30, 38, .38);

  --border: rgba(20, 22, 30, .075);
  --border-strong: rgba(20, 22, 30, .13);
  --border-focus: rgba(79, 91, 240, .5);

  --text: #15171D;
  --text-2: #565B69;
  --text-3: #8D92A0;
  --text-inv: #FFFFFF;

  --accent: #4F5BF0;
  --accent-hover: #4350E6;
  --accent-press: #3944D6;
  --accent-soft: rgba(79, 91, 240, .1);
  --accent-softer: rgba(79, 91, 240, .055);
  --accent-text: #3E49D9;
  --on-accent: #FFFFFF;

  --success: #13A866; --success-soft: rgba(19, 168, 102, .1);
  --warning: #C98100; --warning-soft: rgba(225, 150, 20, .13);
  --danger:  #DC3A45; --danger-soft:  rgba(220, 58, 69, .09);
  --info:    #1E88D0; --info-soft:    rgba(30, 136, 208, .1);
  --live:    #E5303F; --live-soft:    rgba(229, 48, 63, .09);

  --cat-music: #5E67F2;
  --cat-jingle: #D98B12;
  --cat-ad: #DE3F69;
  --cat-top: #0FA595;
  --cat-show: #1F8BDB;
  --cat-event: #9558F0;
  --cat-request: #5AAE2E;

  --shadow-sm: 0 1px 2px rgba(20, 22, 30, .05);
  --shadow: 0 4px 14px rgba(20, 22, 30, .06), 0 1px 3px rgba(20, 22, 30, .05);
  --shadow-lg: 0 24px 60px rgba(20, 22, 30, .16), 0 4px 14px rgba(20, 22, 30, .06);
  --ring: 0 0 0 3px rgba(79, 91, 240, .2);

  --chart-grid: rgba(20, 22, 30, .07);
  --skeleton-a: #EEEEEA; --skeleton-b: #F7F7F4;
  --cover-sat: 58%; --cover-light: 58%;
}