:root {
  --font-system: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  /* Police manuscrite du logo (fichier fourni, voir @font-face dans style.css). Fallbacks
     cursifs si le fichier n'a pas encore été placé dans assets/font/. */
  --font-script: "Segoe Script Idiaa", "Segoe Script", "Bradley Hand", "Comic Sans MS", cursive;

  --radius-sm: 4px;
  --radius-md: 16px;
  --radius-lg: 22px;

  --accent-contrast: #ffffff;

  --danger: #ff453a;
  /* Couleur de survol des icônes SVG interactives (+ ajout recette, etc.) — fixe,
     identique en clair et sombre (valeur exacte de la charte fournie). */
  --svg-hover: rgb(255, 115, 0);
  /* Badge "message non lu" (nav Amis + liste d'amis) — fixe, comme --danger/--svg-hover
     ci-dessus : reste bleu même en mode Îdiää (monochrome), demandé explicitement pour
     rester un indicateur visuellement distinct, pas soumis à --accent. */
  --unread-badge: #007aff;

  --nav-height-mobile: 45px;
  --nav-width-desktop: 240px;
  --topbar-h: 60px;

  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 15px rgba(0, 0, 0, 0.1);

  /* Image de fond du body — "none" par défaut (clair/sombre), remplacée en mode Îdiää
     (voir plus bas). Séparée de --bg (couleur) pour pouvoir composer les deux dans
     style.css sans casser le raccourci `background` des autres thèmes. */
  --bg-image: none;
}

/* Palette claire alignée sur la charte fournie (bleu #007AFF, fonds gris clair). */
:root[data-theme="light"] {
  --accent: #007aff;
  --accent-tint: rgba(0, 122, 255, 0.1);

  --bg: #f7f7f7;
  --surface: #ffffff;
  --surface-alt: #f0f0f2;
  --text: #1d1d1f;
  --text-muted: #86868b;
  --border: #e8e8e8;
  --ombre:#dddddd;

  /* Couleurs du spinner de chargement (voir loading-overlay.php) */
  --spinner-strong: var(--accent);
  --spinner-soft: #bfdeff;
}

/* Palette sombre : #0a84ff est le bleu système "dark mode" d'Apple (le pendant exact
   de #007AFF en light) — mêmes fondations que la charte fournie, déclinées en sombre. */
:root[data-theme="dark"] {
  --accent: #0a84ff;
  --accent-tint: rgba(10, 132, 255, 0.18);

  --bg: #000000;
  --surface: #1c1c1e;
  --surface-alt: #2c2c2e;
  --text: #f2f2f7;
  --text-muted: #98989f;
  --border: rgba(255, 255, 255, 0.12);
  --ombre: rgba(0, 0, 0, 0.4);

  /* Spinner en orange en mode sombre (au lieu du bleu du mode clair) */
  --spinner-strong: var(--svg-hover);
  --spinner-soft: rgb(252, 194, 147);
}

/* Palette "Îdiää" : reprend l'identité visuelle de login.php (photo de fond +
   panneaux vitrés noir/blanc, glassmorphism) étendue à toute l'app. Monochrome
   intégral (décision utilisateur) : --accent n'est PAS le bleu habituel mais
   --login-text (#1d1d1f), donc tout ce qui suit ce token (liens, boutons primaires,
   nav active, switches...) devient noir/blanc au lieu de bleu — aucun changement de
   composant nécessaire, tout passe déjà par les tokens CSS (vérifié : aucune couleur
   bleue codée en dur en JS ; seule exception ombre bleue de la bulle nav mobile, voir
   nav.css). Valeurs dupliquées depuis login.css plutôt que réutilisées (fichier non
   chargé sur les pages qui utilisent ce thème) — même logique que login.css qui
   duplique déjà ces valeurs pour ne jamais dévier du rendu de référence. */
:root[data-theme="idiaa"] {
  --accent: #1d1d1f;
  --accent-tint: rgba(29, 29, 31, 0.1);

  --bg: #f7f7f7;
  /* Valeur par défaut seulement — survolée par un tirage aléatoire parmi
     assets/img/background/*.{jpg,png,webp} (script inline, includes/header.php, avant
     le premier rendu) à chaque chargement de page, pour varier la photo de fond entre
     ce fichier et les autres du même dossier. Reste le repli si ce script échoue
     (JS désactivé...) — d'où le chemin vers un fichier qui existe réellement. */
  --bg-image: url("../img/background/login-background.jpg");
  /* Panneaux vitrés : mêmes valeurs que --login-panel-bg / une version un peu plus
     opaque pour les fonds secondaires (en-têtes de tableau, hover...) qui doivent se
     distinguer d'un --surface adjacent sans pour autant réintroduire de la couleur. */
  --surface: rgba(255, 255, 255, 0.4);
  --surface-alt: rgba(255, 255, 255, 0.55);
  --text: #1d1d1f;
  --text-muted: rgba(29, 29, 31, 0.65);
  --border: rgba(29, 29, 31, 0.7);
  /* --ombre : contrepartie translucide du --ombre solide du mode clair, pour que les
     boutons neumorphiques (.btn--neu) gardent un relief visible sur fond vitré au lieu
     d'un gris plein qui casserait l'effet verre. */
  --ombre: rgba(29, 29, 31, 0.25);

  /* --accent valant déjà --login-text, le spinner reste monochrome sans valeur dédiée. */
  --spinner-strong: var(--accent);
  --spinner-soft: rgba(29, 29, 31, 0.3);
}
