/* ============================================================
   Charte Lyla Signes — LE fichier de design.
   Toute évolution de marque (couleur, police, arrondi, ombre)
   se fait ici et s'applique aux quatre écrans :
   index.html, backoffice.html, configuration.html, regie.html.
   Relevée sur lyla-signes.fr et le tunnel de vente.
   ============================================================ */

:root {
  /* --- Couleurs de marque --- */
  --fond: #fffcfa;            /* crème du site */
  --carte: #ffffff;
  --texte: #3d3d3d;
  --texte-doux: #85796f;
  --accent: #039b9e;          /* turquoise principal */
  --accent-fonce: #027e81;    /* survol */
  --accent-pale: #d1e8e7;     /* turquoise pâle des sections du site */
  --accent-voile: #ecf5f4;    /* fonds très légers (messages animateur) */
  --accent-texte: #ffffff;
  --dore: #f6b154;            /* doré des CTA de conversion */
  --dore-pale: #fdf1dd;
  --dore-bord: #f0d3a2;
  --brun: #955d33;
  --bordure: #ede3d8;
  --succes: #4d9e6f;
  --erreur: #c9503c;

  /* --- Sémantique des outils internes --- */
  --vert: #3e9b63;
  --rouge: #c9503c;
  --or: #b97f33;

  /* --- Formes --- */
  --rayon: 12px;              /* cartes */
  --rayon-petit: 8px;         /* champs */
  --pilule: 999px;            /* boutons */

  /* --- Typographies (chargées via Google Fonts dans chaque page) --- */
  --titres: 'Belleza', 'Trebuchet MS', sans-serif;
  --corps: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  --petites: 'Assistant', 'Segoe UI', sans-serif;

  /* --- Design plat : la structure vient des bordures, pas des ombres --- */
  --ombre: 0 1px 2px rgba(61, 61, 61, .05);
}

/* Outils internes (backoffice, configuration) : fond légèrement plus
   soutenu pour que les cartes blanches se détachent sans ombre. */
body.interne {
  --fond: #faf5ef;
  --bordure: #e9ddd0;
}

/* Régie présentateur : fond sombre conservé pour le confort de lecture
   pendant le direct, mais aux teintes de la marque. */
body.regie {
  --fond: #0d1a19;
  --carte: #152623;
  --texte: #f6f2ec;
  --texte-doux: #a3b4af;
  --accent: #4cc4c7;
  --bordure: #274039;
  --or: #f6b154;
  --taille: 20px;
}