/* ==========================================================================
   BosArts — tokens de design
   Source unique de vérité. Aucune valeur codée en dur ailleurs.
   ========================================================================== */

:root {

  /* --- Bleus : l'identité, extraits du logo ---------------------------- */
  --bos-azur:         #1FA3D8;
  --bos-azur-clair:   #E7F4FB;
  --bos-azur-fonce:   #1789BA;
  --bos-turquoise:    #3BAFC0;
  --bos-outremer:     #1D4FA8;
  --bos-nuit:         #123A6B;

  /* --- Bois et toile : la chaleur d'atelier ---------------------------- */
  --bos-bois:         #C99A5B;
  --bos-bois-clair:   #E5C79A;
  --bos-toile:        #F4EADB;
  --bos-papier:       #FBF8F3;
  --bos-blanc:        #FFFFFF;

  /* --- Encres ----------------------------------------------------------- */
  --bos-fusain:       #1C1B1A;
  --bos-gris:         #6B6257;
  --bos-gris-clair:   #A89C88;
  --bos-trait:        #E8E0D2;
  --bos-trait-fort:   #D8CDB9;

  /* --- Palette du peintre : accents et signaux -------------------------- */
  --bos-vermillon:    #D6342A;
  --bos-vermillon-f:  #B72A21;
  --bos-jaune:        #F2C21F;
  --bos-vert:         #3E9B4F;
  --bos-violet:       #8E4FA8;
  --bos-orange:       #E8821E;

  /* --- Rôles sémantiques ------------------------------------------------ */
  --bos-action:       var(--bos-vermillon);
  --bos-action-hover: var(--bos-vermillon-f);
  --bos-pro:          var(--bos-outremer);
  --bos-pro-bg:       var(--bos-azur-clair);
  --bos-stock:        var(--bos-vert);
  --bos-attente:      #A8700F;
  --bos-rupture:      #B4232A;

  /* --- Typographie ------------------------------------------------------ */
  --bos-font-titre:   "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --bos-font-texte:   "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --bos-font-mono:    ui-monospace, SFMono-Regular, "Cascadia Code", monospace;

  --bos-taille-xs:    0.6875rem;
  --bos-taille-sm:    0.75rem;
  --bos-taille-md:    0.875rem;
  --bos-taille-base:  1rem;
  --bos-taille-lg:    1.125rem;
  --bos-taille-xl:    1.375rem;
  --bos-taille-2xl:   2rem;
  --bos-taille-3xl:   2.75rem;

  --bos-interligne-serre: 1.15;
  --bos-interligne:       1.6;

  /* --- Espacements : base 4px ------------------------------------------- */
  --bos-esp-1: 0.25rem;
  --bos-esp-2: 0.5rem;
  --bos-esp-3: 0.75rem;
  --bos-esp-4: 1rem;
  --bos-esp-5: 1.5rem;
  --bos-esp-6: 2rem;
  --bos-esp-7: 3rem;
  --bos-esp-8: 4rem;

  /* --- Formes ------------------------------------------------------------ */
  --bos-rayon-sm:     6px;
  --bos-rayon:        12px;
  --bos-rayon-lg:     16px;
  --bos-rayon-pilule: 999px;

  --bos-bordure:      0.5px solid var(--bos-trait);
  --bos-bordure-fort: 1px solid var(--bos-trait-fort);

  /* --- Ombres : discrètes, jamais décoratives ---------------------------- */
  --bos-ombre-sm: 0 1px 2px rgba(28, 27, 26, 0.05);
  --bos-ombre:    0 2px 8px rgba(28, 27, 26, 0.07);
  --bos-ombre-lg: 0 8px 28px rgba(28, 27, 26, 0.10);

  /* --- Mouvement ---------------------------------------------------------- */
  --bos-duree:  160ms;
  --bos-courbe: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* --- Grille catalogue --------------------------------------------------- */
  --bos-largeur-max: 1440px;
  --bos-colonnes:    5;
  --bos-gouttiere:   var(--bos-esp-4);

  /* --- Couleurs de rayon : pilotables depuis l'administration ------------ */
  --bos-rayon-peinture:  var(--bos-azur);
  --bos-rayon-toiles:    var(--bos-bois);
  --bos-rayon-dessin:    var(--bos-vert);
  --bos-rayon-chevalets: var(--bos-violet);
  --bos-rayon-supports:  var(--bos-turquoise);
  --bos-rayon-loisirs:   var(--bos-orange);
}

@media (max-width: 1200px) { :root { --bos-colonnes: 4; } }
@media (max-width: 900px)  { :root { --bos-colonnes: 3; } }
@media (max-width: 600px)  { :root { --bos-colonnes: 2; --bos-gouttiere: var(--bos-esp-2); } }

@media (prefers-reduced-motion: reduce) {
  :root { --bos-duree: 1ms; }
}
