/* PharmaMind Design System V3 — « Fraîcheur »
 * Fondations : couleurs, typographie, espacement, rayons, ombres, motion.
 *
 * Display : Plus Jakarta Sans   Body : Inter   Mot-clé logo : Poppins 800
 * Polices auto-hébergées (woff2) — aucun appel réseau. Voir fonts.css.
 *
 * RÈGLE : n'utilisez jamais une valeur hex brute dans un kit. Toujours un token --pm-*.
 * Toute valeur présente dans le design V3 figure ici à l'identique — la tokenisation
 * n'a changé aucune couleur, seulement la façon de l'écrire.
 */

@import "fonts.css";

:root {
  /* ============================================================
     MARQUE
     ============================================================ */
  --pm-green: #16805F;            /* vert de marque — pharmacie fraîche */
  --pm-green-700: #0F5E49;        /* hover / press */
  --pm-green-300: #1FA37C;        /* accent vif */
  --pm-green-200: #7FC3A8;        /* graphiques, illustrations */
  --pm-green-100: #E7F3EC;        /* menthe — surfaces teintées */
  --pm-green-50:  #F1F7F2;        /* teinte la plus faible, fonds de hover */

  --pm-navy: #0a1b3d;             /* secondaire — logo, chrome admin */
  --pm-navy-700: #08152f;
  --pm-navy-500: #1f3266;
  --pm-navy-300: #5b6a91;
  --pm-navy-100: #d4d8e3;

  /* Vert du logo — VOLONTAIREMENT différent de --pm-green.
     Le logo n'a pas été retravaillé pour la refonte V3 : il est resté au vert
     olive de V2. Dette de marque documentée, à trancher séparément.
     Ne PAS utiliser ces valeurs comme couleurs d'interface. */
  --pm-logo-green: #38691F;       /* logo bicolore, pharmamind-logo.png */
  --pm-logo-green-flat: #507038;  /* logo-green.png */
  --pm-logo-wordmark: #37671E;    /* mot « Pharma » du mot-clé en sidebar */
  --pm-logo-ring: #15B25F;        /* liseré vert des pastilles de logo */

  /* ============================================================
     NEUTRES
     ============================================================ */
  --pm-bg:        #ffffff;
  --pm-surface:   #F4F7F4;
  --pm-surface-2: #EEF3EF;
  --pm-line:      #E5ECE6;
  --pm-line-2:    #D7E2DA;
  --pm-fg-1:      #15302A;        /* texte principal — encre vert profond */
  --pm-fg-2:      #3D534B;
  --pm-fg-3:      #6C7E76;
  --pm-fg-4:      #9AA9A2;
  --pm-black:     #000000;        /* noir pur — étoile de favori (fill) et nom d'auteur */
  --pm-avatar-rose: #c96b86;      /* teinte d'avatar sans initiales */

  /* Fond applicatif : dégradé vertical du body + surface de la zone principale */
  --pm-app-bg-top:    #EEF3EE;
  --pm-app-bg-bottom: #E6EDE7;
  --pm-app-gradient:  linear-gradient(180deg, #EEF3EE 0%, #E6EDE7 100%);  /* @kind other */
  --pm-main-bg:       #F4FBF6;    /* fond de <main> */
  --pm-pane-bg:       #F4F6F4;    /* panneaux secondaires */
  --pm-doc-bg:        #eceef0;    /* liseuse de document */

  /* Barres de défilement personnalisées */
  --pm-scroll-thumb:        #CCDCD2;
  --pm-scroll-thumb-hover:  #B7CDC0;
  --pm-scroll-thumb-soft:   #D3E2D8;
  --pm-scroll-thumb-soft-hover: #BFD5C6;
  --pm-track-soft:          #EAEFEA;

  /* ============================================================
     SÉMANTIQUE
     ============================================================ */
  --pm-success: #16805F;
  --pm-success-bg: #E7F3EC;
  --pm-warning: #CC7723;
  --pm-warning-bg: #F8EBD8;
  --pm-warning-ink: #7A5214;      /* texte sur --pm-warning-bg */
  --pm-danger:  #ff1f24;
  --pm-danger-bg: #FCE1E1;
  --pm-info:    #2A6E89;
  --pm-info-bg: #E3EEF3;

  --pm-amber:   #9C6C1E; --pm-amber-bg: #F6EDD7;   /* tag « Rupture » */
  --pm-clay:    #B14E37; --pm-clay-bg: #F6E6DF;    /* tag « Rappel de lot » */
  --pm-yellow:  #FFC400; --pm-yellow-ink: #4A3608;

  /* ============================================================
     CRITICITÉ « RING THE BELL »
     Le code d'urgence du produit. Trois niveaux, chacun avec sa teinte
     pleine, son fond doux, son fond d'expiration et son encre lisible.
     ============================================================ */
  --pm-crit-red:        #ff1f24;
  --pm-crit-red-bg:     #FCE1E1;
  --pm-crit-red-bg-2:   #FFE1E0;  /* fond « expiré » */
  --pm-crit-red-bg-3:   #FDE7E7;  /* bandeau de fraîcheur périmé */
  --pm-crit-red-soft:   #FEF5F5;  /* résumé RtB */
  --pm-crit-red-ink:    #B01015;

  --pm-crit-orange:     #ff7900;
  --pm-crit-orange-alt: #FF7A00;  /* badge « amber » — 1 nuance d'écart, conservée telle quelle */
  --pm-crit-orange-bg:  #FFE4CB;
  --pm-crit-orange-bg-2:#FFEAD3;  /* fond « expiré » */
  --pm-crit-orange-ink: #C85E00;

  --pm-crit-yellow:     #FFC400;
  --pm-crit-yellow-bg:  #FFFBEA;
  --pm-crit-yellow-bg-2:#FFF1C2;  /* fond « expiré » */
  --pm-crit-yellow-ink:     #5a4500;
  --pm-crit-yellow-ink-2:   #3A2E00;  /* sur pastille pleine */
  --pm-crit-yellow-ink-3:   #94720a;  /* puce de priorité */
  --pm-crit-yellow-ink-4:   #C79300;
  --pm-crit-yellow-stroke:  #D9A400;

  --pm-crit-none-ink:   #1b3b2f;  /* compteur de cloche, channel actif */
  --pm-crit-late:       #55665E;  /* sollicitation dépassée */
  --pm-crit-ko:         #6C7E76;  /* réponse négative */

  /* ============================================================
     TYPES DE CHANNEL
     Chaque channel porte --ch-color / --ch-light en style inline ;
     ces tokens sont les valeurs de repli et la palette de référence.
     ============================================================ */
  --pm-ch-pha:      var(--pm-green);   /* Officine */
  --pm-ch-grp:      #2E7D9A;           /* Groupement */
  --pm-ch-grp-bg:   #C8E0EA;
  --pm-ch-qua:      #A9824A;           /* Qualité */
  --pm-ch-lab:      #C2703E;           /* Industriel / laboratoire */

  /* Blocs de channels dans la barre latérale */
  --pm-ch-block-bg:     #DFEFE6;
  --pm-ch-block-line:   #C5DFD1;
  --pm-ch-block-bg-2:   #DCEFE3;

  /* ============================================================
     NATURE DES SOURCES  (pastilles d'icône + teintes d'avatar)
     ============================================================ */
  --pm-src-reg-bg:  #E1F0E8; --pm-src-reg-ink:  #15694F;  /* réglementaire */
  --pm-src-int-bg:  #F1ECDC; --pm-src-int-ink:  #8A6526;  /* interne */
  --pm-src-off-bg:  #E0EDF1; --pm-src-off-ink:  #2C6B82;  /* officiel */
  --pm-src-sg-bg:   #E9EFE1; --pm-src-sg-ink:   #516B33;  /* recommandation */
  --pm-src-cl-bg:   #F4E7E1; --pm-src-cl-ink:   #9C5640;  /* laboratoire */
  --pm-src-nat-bg:  #edeff2;                              /* étiquette de nature */
  --pm-src-hl:      #C9EBD6;                              /* surlignage dans le document */

  /* ============================================================
     BADGES & PASTILLES
     ============================================================ */
  --pm-badge-blue-bg:   #dbeafe; --pm-badge-blue-ink:   #1e40af;
  --pm-badge-purple-bg: #ede9fe; --pm-badge-purple-ink: #6d28d9;
  --pm-badge-green-bg:  #CDEBD8; --pm-badge-green-ink:  #0B6B45; --pm-badge-green-line: #A6D9BC;
  --pm-badge-info-bg:   #CFE4F6; --pm-badge-info-ink:   #1B5FA8; --pm-badge-info-line:  #A9CDEE;

  /* États « validé / transformé en Push » */
  --pm-done-bg:   #DEF3EC; --pm-done-ink: #0E7A66; --pm-done-line: #BEE3D6;
  /* Favoris sélectionnés */
  --pm-fav-bg:    #E3F7EC; --pm-fav-line: #9CD9B5;
  /* Like actif */
  --pm-like-bg:   #E7F6EE;

  /* Action destructive (échelle rouge neutre, distincte de la criticité RtB) */
  --pm-destructive-bg:      #FEE2E2;
  --pm-destructive-line:    #FCA5A5;
  --pm-destructive-ink:     #B91C1C;
  --pm-destructive-line-2:  #EF4444;
  --pm-destructive-ink-2:   #7F1D1D;

  /* Interrupteur inactif */
  --pm-switch-off: #cbd5e1;
  /* Anneau de confiance, niveau faible */
  --pm-conf-low:   #C9A44A;
  /* Drapeau français (sélecteur de langue) */
  --pm-fr-blue: #0055A4; --pm-fr-red: #EF4135;

  /* ============================================================
     TYPOGRAPHIE
     ============================================================ */
  --pm-font-display: "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pm-font-body:    "Inter", "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pm-font-alt:     "Inter", "Plus Jakarta Sans", sans-serif;
  --pm-font-brand:   "Poppins", "Plus Jakarta Sans", sans-serif;  /* mot-clé uniquement */
  --pm-font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --pm-fs-display:   56px;
  --pm-fs-h1:        40px;
  --pm-fs-h2:        32px;
  --pm-fs-h3:        24px;
  --pm-fs-h4:        20px;
  --pm-fs-body:      16px;
  --pm-fs-body-sm:   14px;
  --pm-fs-caption:   12px;
  --pm-fs-overline:  11px;

  --pm-lh-tight:  1.15;  /* @kind font */
  --pm-lh-snug:   1.3;   /* @kind font */
  --pm-lh-normal: 1.5;   /* @kind font */
  --pm-lh-relaxed: 1.65; /* @kind font */

  --pm-tracking-tight:  -0.02em;
  --pm-tracking-normal: 0;
  --pm-tracking-wide:   0.04em;
  --pm-tracking-overline: 0.12em;

  /* ============================================================
     ESPACEMENT (base 4 px)
     ============================================================ */
  --pm-sp-1:  4px;
  --pm-sp-2:  8px;
  --pm-sp-3:  12px;
  --pm-sp-4:  16px;
  --pm-sp-5:  20px;
  --pm-sp-6:  24px;
  --pm-sp-8:  32px;
  --pm-sp-10: 40px;
  --pm-sp-12: 48px;
  --pm-sp-16: 64px;
  --pm-sp-20: 80px;
  --pm-sp-24: 96px;

  /* ============================================================
     RAYONS
     ============================================================ */
  --pm-r-xs: 4px;
  --pm-r-sm: 6px;
  --pm-r-md: 10px;
  --pm-r-lg: 16px;
  --pm-r-xl: 24px;
  --pm-r-pill: 999px;

  /* ============================================================
     OMBRES
     ============================================================ */
  --pm-sh-xs: 0 1px 2px rgba(10, 27, 61, 0.06);
  --pm-sh-sm: 0 2px 4px rgba(10, 27, 61, 0.06), 0 1px 2px rgba(10, 27, 61, 0.04);
  --pm-sh-md: 0 6px 16px rgba(10, 27, 61, 0.08), 0 2px 4px rgba(10, 27, 61, 0.04);
  --pm-sh-lg: 0 18px 36px rgba(10, 27, 61, 0.12), 0 4px 8px rgba(10, 27, 61, 0.06);
  --pm-sh-focus: 0 0 0 3px rgba(31, 163, 124, 0.22);

  /* ============================================================
     MOTION
     ============================================================ */
  --pm-ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);   /* @kind other */
  --pm-ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);  /* @kind other */
  --pm-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);  /* @kind other */
  --pm-dur-fast: 120ms;  /* @kind other */
  --pm-dur-base: 200ms;  /* @kind other */
  --pm-dur-slow: 360ms;  /* @kind other */
}

/* === Rôles typographiques === */

html, body { font-family: var(--pm-font-body); color: var(--pm-fg-1); background: var(--pm-bg); -webkit-font-smoothing: antialiased; }

.pm-display {
  font-family: var(--pm-font-display);
  font-weight: 700;
  font-size: var(--pm-fs-display);
  line-height: var(--pm-lh-tight);
  letter-spacing: var(--pm-tracking-tight);
  color: var(--pm-fg-1);
}
.pm-h1 { font-family: var(--pm-font-display); font-weight: 700; font-size: var(--pm-fs-h1); line-height: var(--pm-lh-tight); letter-spacing: var(--pm-tracking-tight); color: var(--pm-fg-1); }
.pm-h2 { font-family: var(--pm-font-display); font-weight: 700; font-size: var(--pm-fs-h2); line-height: var(--pm-lh-snug);  color: var(--pm-fg-1); }
.pm-h3 { font-family: var(--pm-font-display); font-weight: 600; font-size: var(--pm-fs-h3); line-height: var(--pm-lh-snug);  color: var(--pm-fg-1); }
.pm-h4 { font-family: var(--pm-font-display); font-weight: 600; font-size: var(--pm-fs-h4); line-height: var(--pm-lh-snug);  color: var(--pm-fg-1); }
.pm-body  { font-family: var(--pm-font-body); font-weight: 400; font-size: var(--pm-fs-body); line-height: var(--pm-lh-relaxed); color: var(--pm-fg-2); }
.pm-body-strong { font-weight: 600; color: var(--pm-fg-1); }
.pm-body-sm { font-family: var(--pm-font-body); font-weight: 400; font-size: var(--pm-fs-body-sm); line-height: var(--pm-lh-normal); color: var(--pm-fg-2); }
.pm-caption { font-family: var(--pm-font-body); font-weight: 500; font-size: var(--pm-fs-caption); line-height: var(--pm-lh-normal); color: var(--pm-fg-3); }
.pm-overline { font-family: var(--pm-font-body); font-weight: 600; font-size: var(--pm-fs-overline); line-height: 1; letter-spacing: var(--pm-tracking-overline); text-transform: uppercase; color: var(--pm-green); }
.pm-mono { font-family: var(--pm-font-mono); font-size: 13px; }

/* === Primitives === */
.pm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--pm-font-body); font-weight: 600; font-size: 15px;
  padding: 12px 20px; border-radius: var(--pm-r-md); border: 1px solid transparent;
  cursor: pointer; transition: background var(--pm-dur-base) var(--pm-ease-standard),
    transform var(--pm-dur-fast) var(--pm-ease-standard), box-shadow var(--pm-dur-base);
}
.pm-btn-primary { background: var(--pm-green); color: white; }
.pm-btn-primary:hover { background: var(--pm-green-700); }
.pm-btn-primary:active { transform: translateY(1px); }
.pm-btn-secondary { background: var(--pm-navy); color: white; }
.pm-btn-secondary:hover { background: var(--pm-navy-700); }
.pm-btn-ghost { background: transparent; color: var(--pm-fg-1); border-color: var(--pm-line-2); }
.pm-btn-ghost:hover { background: var(--pm-surface-2); }

.pm-card {
  background: var(--pm-bg); border: 1px solid var(--pm-line);
  border-radius: var(--pm-r-lg); box-shadow: var(--pm-sh-sm); padding: var(--pm-sp-6);
}
.pm-input {
  font-family: var(--pm-font-body); font-size: 15px; color: var(--pm-fg-1);
  background: var(--pm-bg); border: 1px solid var(--pm-line-2);
  border-radius: var(--pm-r-md); padding: 10px 14px; width: 100%;
  transition: border-color var(--pm-dur-base), box-shadow var(--pm-dur-base);
}
.pm-input:focus { outline: none; border-color: var(--pm-green); box-shadow: var(--pm-sh-focus); }