/* ==========================================================================
   StudyCare — Design system PARTAGÉ de l'application
   --------------------------------------------------------------------------
   Source de vérité des tokens (couleurs, typo, rayons, ombres, espacements).
   Valeurs extraites du design réel de studycare.fr (export Bubble + styles
   calculés live). Toute brique de l'app (accueil, connexion, …) consomme ce
   fichier. Règle : jamais de couleur/rayon en dur dans un composant → var(--…).

   ⚠️ Le tableau de disponibilité garde SON styles.css (héritage Bubble). À
   terme il pourra converger vers ces tokens.
   ========================================================================== */

/* ---- Poppins, auto-hébergée (RGPD : aucun appel Google Fonts) ---- */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 300; font-display: swap; src: url("./fonts/poppins-300.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 400; font-display: swap; src: url("./fonts/poppins-400.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 500; font-display: swap; src: url("./fonts/poppins-500.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap; src: url("./fonts/poppins-600.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700; font-display: swap; src: url("./fonts/poppins-700.woff2") format("woff2"); }

:root {
  /* =======================================================================
     COULEURS DE MARQUE
     ===================================================================== */
  /* Action principale (consumer) : magenta StudyCare */
  --c-primary:        #DD1F8B;
  --c-primary-hover:  #c40f78;
  --c-primary-soft:   #fdf0f6;   /* fond rosé très clair */
  --c-on-primary:     #ffffff;

  /* Bleus institutionnels (PRO / liens / RDV) */
  --c-blue:           #0A5ACC;   /* bleu moyen : boutons PRO, "Relancer" */
  --c-blue-hover:     #0847a3;
  --c-blue-deep:      #012888;   /* bleu profond : "Je prends rendez-vous" */
  --c-blue-soft:      #eaf0fb;   /* fond bleuté clair (sections) */

  /* =======================================================================
     TEXTE & NEUTRES
     ===================================================================== */
  --c-text:           #091747;   /* navy StudyCare : titres forts */
  --c-heading:        #272626;   /* titres de carte / gros titres */
  --c-body:           #3a4256;   /* corps de texte */
  --c-muted:          #6b7280;   /* sous-titres, libellés secondaires */
  --c-faint:          #9aa1b2;   /* placeholder, hints */

  --c-surface:        #ffffff;
  --c-bg:             #ffffff;
  --c-bg-soft:        #f7f8fb;   /* fond de section alterné */
  --c-border:         #e5e7eb;   /* bordures inputs / cartes */
  --c-border-strong:  #d1d5dc;
  --c-disabled-bg:    #e9eae8;
  --c-disabled-fg:    #cfcfcf;

  /* =======================================================================
     FEEDBACK
     ===================================================================== */
  --c-success:        #17db4e;  --c-success-bg: #e8fbef;
  --c-alert:          #fab515;  --c-alert-bg:   #fff7e6;
  --c-danger:         #ff3b30;  --c-danger-bg:  #fdecea;

  /* =======================================================================
     DÉGRADÉS
     ===================================================================== */
  /* Panneau "Bienvenue" de la connexion : bleu → magenta */
  --grad-brand:       linear-gradient(140deg, #0A5ACC 0%, #6d2fb0 52%, #DD1F8B 100%);

  /* =======================================================================
     TYPO
     ===================================================================== */
  --font: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --fs-hero:   clamp(2rem, 4.5vw, 3.25rem);  /* 32→52px */
  --fs-h1:     2rem;      /* 32px */
  --fs-h2:     1.75rem;   /* 28px */
  --fs-h3:     1.375rem;  /* 22px */
  --fs-lg:     1.125rem;  /* 18px */
  --fs-body:   1rem;      /* 16px */
  --fs-sm:     0.9375rem; /* 15px */
  --fs-xs:     0.875rem;  /* 14px */

  --fw-light:  300;
  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold:   700;

  /* =======================================================================
     RAYONS · OMBRES · ESPACEMENTS
     ===================================================================== */
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;    /* inputs */
  --r-xl:   24px;    /* grandes cartes */
  --r-pill: 999px;

  --shadow-sm:   0 1px 2px rgba(9, 23, 71, .06);
  --shadow-md:   0 4px 16px rgba(9, 23, 71, .08);
  --shadow-card: 0 10px 40px rgba(9, 23, 71, .10);
  --shadow-pop:  0 20px 60px rgba(9, 23, 71, .18);

  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;

  --container: 1200px;
  --header-h: 76px;
}
