/* =========================================================================
   MEEPadel — tokens de la charte graphique

   Source unique des couleurs, typographies, rayons et ombres.
   Le site vitrine l'importe tel quel ; la webapp (copie de MEETennis)
   reprendra les mêmes valeurs dans app/assets.

   Les couleurs viennent des trois visuels fondateurs :
   le logo (anneau bleu électrique), la piste bleue et la balle néon.
   ========================================================================= */

:root {
  /* --- Couleurs de marque ------------------------------------------- */
  --mp-bleu:        #1f5fd6;  /* bleu électrique : anneau du logo, boutons */
  --mp-bleu-fonce:  #0b47a8;  /* survol des boutons, liens visités */
  --mp-piste:       #0a52b5;  /* bleu de la piste, grands aplats */
  --mp-nuit:        #0a1a3a;  /* bleu nuit : titres, fonds sombres, grillage */
  --mp-neon:        #d6f52a;  /* jaune néon de la balle : accent, jamais en texte sur blanc */
  --mp-neon-fonce:  #b8d400;  /* survol de l'accent néon */
  --mp-vitre:       #d4e9f0;  /* bleu verre des vitres : fonds de sections claires */
  --mp-ligne:       #ffffff;  /* blanc des lignes */

  /* --- Neutres ------------------------------------------------------ */
  --mp-texte:       #16202e;
  --mp-texte-doux:  #4f5b6b;
  --mp-bord:        #d9e2ee;
  --mp-fond:        #ffffff;
  --mp-fond-doux:   #f3f7fc;

  /* --- États -------------------------------------------------------- */
  --mp-succes:      #1f9d55;
  --mp-alerte:      #d97706;
  --mp-erreur:      #c62828;

  /* --- Typographies -------------------------------------------------- */
  --mp-font-titre:  'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mp-font-texte:  'Lato', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* --- Formes ------------------------------------------------------- */
  --mp-rayon-s:     8px;
  --mp-rayon:       14px;   /* boutons, champs */
  --mp-rayon-l:     24px;   /* cartes */
  --mp-ombre:       0 10px 30px rgba(10, 26, 58, .10);
  --mp-ombre-forte: 0 24px 60px rgba(10, 82, 181, .20);

  /* --- Mise en page ------------------------------------------------- */
  --mp-largeur:     1160px;
  --mp-gouttiere:   20px;
}