/* ============================================================
   Mes Cours — Design system partagé (premium)
   Chargé par le shell + toutes les sections (Amphi, Réviser, IA, EDT).
   Typo pro (Inter) + finitions cohérentes, sans casser les layouts.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..800;1,9..144,300..800&family=Hanken+Grotesk:wght@300..800&family=Noto+Sans+Tifinagh&display=swap');

:root{
  /* Typographie éditoriale : titres serif Fraunces, corps grotesque Hanken */
  --font-sans:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-display:"Fraunces","Iowan Old Style",Georgia,serif;
  /* Surcharge des tokens locaux des pages (chargés avant ce fichier) */
  --sans:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --display:"Fraunces","Iowan Old Style",Georgia,serif;
  --serif:"Fraunces","Iowan Old Style",Georgia,serif;
  --brand:#C1272D; --brand-2:#0A7B3E;
}

/* Typographie : Inter pour tout le corps, rendu net */
body{
  font-family:var(--font-sans) !important;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-feature-settings:"cv02","cv03","cv04","ss01";
  letter-spacing:.002em;
}
input,button,select,textarea{font-family:inherit}

/* Titres de marque en display (Sora) — n'écrase PAS les titres serif des cours (.page-head h1, .fiche h1) */
.brand,.tab{font-family:var(--font-display)}

/* Sélection & focus cohérents */
::selection{background:color-mix(in srgb,var(--brand) 30%,transparent)}
:focus-visible{outline:none !important; box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 38%,transparent) !important}

/* Transitions douces sur les éléments interactifs */
a,button,.tab,.chip,.navbtn,.iconbtn,.recbtn,.histbtn,.verlink,select,summary{
  transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .12s ease,filter .16s ease;
}

/* Barres de défilement fines et discrètes (webkit) */
*::-webkit-scrollbar{width:11px;height:11px}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,gray 42%,transparent);border-radius:10px;border:3px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,gray 60%,transparent)}
*::-webkit-scrollbar-track{background:transparent}

/* Détails premium */
img{ -webkit-user-drag:none; user-select:none }

/* ============================================================
   Design v2 — palette et finitions unifiées sur toutes les pages
   (shell, Enregistrer, Réviser, Amphi IA, Emploi du temps).
   (La landing bleue — html.bleu — est exclue : elle garde sa palette.)
   Sélecteurs html:root… plus spécifiques que les :root des modules
   → ces valeurs l'emportent sans toucher au code des modules.
   ============================================================ */
html:root:not(.bleu){
  --font-tifi:"Noto Sans Tifinagh",sans-serif;
  --accent:#C1272D; --accent-2:#0A7B3E; --accent2:#0A7B3E;
  --grad:linear-gradient(120deg,#C1272D 0%,#0A7B3E 100%);
  --ease:cubic-bezier(.2,.7,.2,1);
}
html:root:not(.bleu):not([data-theme="light"]){
  color-scheme:dark;
  --bg:#0B0B0E; --bar:#0f1014;
  --card:#131419; --card2:#181a20;
  --panel:#131419; --panel-2:#181a20; --panel-3:#1d1f26;
  --surface:#131419; --surface-2:#181a20; --sunken:#101115;
  --line:#23252c; --line2:#2e313a; --line-strong:#2e313a;
  --ink:#f5f6f8; --muted:#a2a6b0; --faint:#6f737d;
  --accent-soft:rgba(193,39,45,.14); --accent2-soft:rgba(10,123,62,.16);
  --gold-tifi:#D4AF6A;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 18px 40px -22px rgba(0,0,0,.8);
}
html:root:not(.bleu)[data-theme="light"]{
  color-scheme:light;
  --bg:#f4f5f8; --bar:#ffffff;
  --card:#ffffff; --card2:#f8f9fb;
  --panel:#ffffff; --panel-2:#f8f9fb; --panel-3:#eef0f4;
  --surface:#ffffff; --surface-2:#f8f9fb; --sunken:#f8f9fb;
  --line:#e3e5ea; --line2:#d5d8df; --line-strong:#d5d8df;
  --ink:#1a1c22; --muted:#6c707b; --faint:#9a9ea8;
  --accent-soft:rgba(193,39,45,.09); --accent2-soft:rgba(10,123,62,.10);
  --gold-tifi:#8A6016;
  --shadow:0 1px 2px rgba(20,22,30,.05),0 14px 34px -20px rgba(20,22,30,.22);
}
html:root:not(.bleu) body{background:var(--bg);color:var(--ink)}
/* Titres en Fraunces, comme la v2 */
html:not(.bleu) :is(h1,h2,h3){font-family:var(--font-display);font-optical-sizing:auto;letter-spacing:-.015em}
html:not(.bleu) ::selection{background:var(--accent-soft)}
html:not(.bleu) :focus-visible{box-shadow:0 0 0 3px var(--accent2-soft),0 0 0 1px var(--accent2) !important}
*{scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.tifi{font-family:var(--font-tifi);color:var(--gold-tifi)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ---------- Finitions v2 par module ---------- */
html:root:not(.bleu){
  --sans:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --serif:"Fraunces","Iowan Old Style",Georgia,serif;
  --display:"Fraunces","Iowan Old Style",Georgia,serif;
}
/* Enregistrer : chrono éditorial comme la v2 */
.rec-timer{font-family:var(--font-display)!important;font-weight:400!important;letter-spacing:-.02em!important;font-size:clamp(46px,6vw,72px)!important}
/* Réviser : la marque est déjà dans la barre du shell ; pill active en dégradé rouge → vert */
.mb-brand{display:none!important}
.mpill.on{background:var(--grad)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 20px -10px rgba(193,39,45,.7)}
.mpill.on .d{background:#fff!important}
.hstat{border-radius:18px}
.hstat .n{font-family:var(--font-display);font-weight:500;letter-spacing:-.02em}
.pcard{transition:transform .25s var(--ease),border-color .25s,box-shadow .25s}
.pcard:hover{transform:translateY(-3px);box-shadow:0 24px 40px -26px rgba(0,0,0,.6)}
