/* =====================================================================
   CHARTE 3S ACADEMY · le seul fichier à modifier pour changer le style
   ---------------------------------------------------------------------
   1. POLICES      → changer la ligne @import ET les deux variables
                      --police-titre / --police-texte (deux polices différentes).
   2. PALETTE      → les 5 couleurs --defaut-… : c'est la palette par défaut,
                      celle que voit tout le monde tant qu'il n'a rien choisi.
   3. PROGRESSION  → rouge / orange / vert des graphiques et jauges (fixes pour tous).
   4. RÉGLAGES     → arrondis, ombres, couleurs d’état.
   Tout le reste (ambiances Blanc / Chaud / Sombre / Noir, couleurs choisies
   par l'élève, contrastes) est calculé par charte.js à partir d'ici.
   ===================================================================== */

/* ---------- 1. POLICES ---------- */
@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,300;12..96,500;12..96,600;12..96,700&family=Unbounded:wght@500;600&family=Inter:wght@400;500;600;700&family=Roboto+Mono:wght@400;500&display=swap");
@import url("defilement.css");

:root{
  --police-titre:"Bricolage Grotesque";          /* titres */
  --police-logo:"Unbounded";            /* logo « Academy » seulement */
  --police-texte:"Inter";                /* texte courant, boutons, formulaires */
  --police-code:"Roboto Mono";           /* codes, prompts */
  --graisse-grand-titre:300;             /* grands titres (accueil, en-têtes de page) */
  --graisse-titre:600;                   /* titres de cartes, de sections */

  /* ---------- 2. PALETTE PAR DÉFAUT ---------- */
  --defaut-principale:#000000;           /* boutons, liens actifs, progression */
  --defaut-secondaire:#914655;           /* icônes, étiquettes, fonds doux */
  --defaut-accent:#C38322;               /* étincelles : nouveau, jour même, notifications */
  --defaut-foncee:#2E161B;               /* blocs sombres (reprendre, exercice) */
  --defaut-claire:#F6F6F6;               /* fond de l'ambiance Chaud */

  /* ---------- 3. COULEURS DE PROGRESSION (fixes, pour tous les profils) ----------
     Graphiques, jauges, barres : elles expriment la progression, elles ne suivent pas la palette. */
  --progression-bas:#F4A3A3;             /* rouge : début, à relancer */
  --progression-milieu:#F8C77E;          /* orange : en cours */
  --progression-haut:#86D4AE;            /* vert : bien avancé, atteint */

  /* ---------- 4. RÉGLAGES ---------- */
  --rayon:16px;
  --rayon-petit:10px;
  --ombre:0 24px 60px -24px rgba(0,0,0,.22);
  --ombre-legere:0 6px 20px -10px rgba(0,0,0,.16);
  --ok:#157A45;        --ok-fond:#E5F4EC;
  --attention:#8A5A00; --attention-fond:#FFF6E0;
  --danger:#B42318;    --danger-fond:#FDECEA;

  /* ---------- Valeurs de départ, recalculées par charte.js ---------- */
  --fond:#FFFFFF; --surface:#FFFFFF; --surface-2:#F6F6F6; --ligne:#E7E7E7;
  --texte:#111111; --texte-doux:#626262;
  --c-principale:var(--defaut-principale); --c-sur-principale:#FFFFFF;
  --c-principale-texte:var(--defaut-principale); --c-principale-voile:#EDEDED;
  --c-secondaire:var(--defaut-secondaire); --c-secondaire-texte:#914655; --c-secondaire-voile:#F3E9EB;
  --c-accent:var(--defaut-accent); --c-sur-accent:#111111; --c-accent-texte:#8C5C16; --c-accent-voile:#F8EFE2;
  --c-foncee:var(--defaut-foncee); --c-foncee-2:#43232A; --c-claire:var(--defaut-claire);
}
:root[data-ambiance="sombre"],:root[data-ambiance="noir"]{
  --ok:#4CC282;        --ok-fond:rgba(76,194,130,.14);
  --attention:#F2C879; --attention-fond:rgba(242,200,121,.14);
  --danger:#FF8A80;    --danger-fond:rgba(255,138,128,.14);
  --ombre:0 24px 60px -24px rgba(0,0,0,.6);
  --ombre-legere:0 6px 20px -10px rgba(0,0,0,.5);
}

/* =====================================================================
   Correspondances pour les pages existantes (anciens noms de variables).
   Ne pas modifier : elles suivent automatiquement la charte ci-dessus.
   ===================================================================== */
:root{
  --bg:var(--fond); --bg-glass:color-mix(in srgb,var(--fond) 90%,transparent);
  --panel:var(--surface); --panel-2:var(--surface-2);
  --line:var(--ligne); --line-2:color-mix(in srgb,var(--ligne) 60%,var(--surface));
  --ink:var(--texte); --ink-soft:color-mix(in srgb,var(--texte) 78%,var(--surface)); --ink-mute:var(--texte-doux);
  --accent:var(--c-principale); --accent-texte:var(--c-principale-texte); --accent-bg:var(--c-principale-voile);
  --accent-doux:var(--c-secondaire); --sur-accent:var(--c-sur-principale);
  --ok-bg:var(--ok-fond); --ok-vif:var(--ok); --amber:var(--attention); --amber-bg:var(--attention-fond);
  --brique:var(--c-secondaire-texte); --peche:var(--c-secondaire-voile); --creme:var(--c-accent-voile); --brun:var(--c-accent-texte);
  --s1:var(--c-accent); --s2:var(--c-secondaire); --s3:var(--c-principale-texte);
  --shadow:var(--ombre); --shadow-s:var(--ombre-legere);
  --sans:var(--police-texte),-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:var(--police-code),ui-monospace,Menlo,Consolas,monospace;
  --heading:var(--police-titre),var(--sans); --brand:var(--heading); --logo:var(--police-logo),var(--heading);
}

/* =====================================================================
   Panneau « Préférences » (couleur, ambiance, palette), commun à toutes les pages.
   Construit par Charte.panneau(). Classes préfixées ch- pour ne rien casser.
   ===================================================================== */
.ch-perso{position:relative}
.ch-perso > summary{list-style:none;display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:12px;background:transparent;cursor:pointer}
.ch-perso > summary:hover{background:var(--surface-2)}
.ch-perso > summary::-webkit-details-marker{display:none}
.ch-perso > summary i{width:18px;height:18px;border-radius:50%;background:var(--c-principale);box-shadow:0 0 0 1px var(--ligne)}
.ch-panneau{position:absolute;right:0;top:50px;z-index:40;background:var(--surface);color:var(--texte);border:1px solid var(--ligne);border-radius:16px;padding:16px;box-shadow:var(--ombre);width:max-content;font-family:var(--sans);font-size:13px;text-align:left}
.ch-panneau .ch-titre{font-weight:600;font-size:14px;margin-bottom:12px}
.ch-panneau .ch-famille{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--texte-doux);font-weight:600;margin:10px 0 6px}
.ch-ligne{display:flex;align-items:center;gap:10px}
.ch-ligne input[type=color]{width:26px;height:26px;border:1px solid var(--ligne);border-radius:50%;padding:2px;background:var(--surface);cursor:pointer}
.ch-ligne input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.ch-ligne input[type=color]::-webkit-color-swatch{border:0;border-radius:50%}
.ch-ligne input[type=color]::-moz-color-swatch{border:0;border-radius:50%}
.ch-ligne input[type=text]{width:88px;height:28px;border:1px solid var(--ligne);border-radius:9px;padding:0 10px;font:500 13px var(--mono);background:var(--surface);color:var(--texte);text-transform:uppercase}
.ch-rond{display:inline-grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--texte);cursor:pointer}
.ch-rond:hover{background:var(--c-principale-voile);color:var(--c-principale-texte)}
.ch-rond.ch-tourne svg{animation:ch-tour .5s ease}
@keyframes ch-tour{to{transform:rotate(360deg)}}
.ch-grille{display:grid;grid-template-columns:repeat(7,26px);gap:10px}
.ch-grille button{width:26px;height:26px;border-radius:50%;border:0;cursor:pointer;padding:0;position:relative}
.ch-grille button[aria-pressed="true"]{outline:2px solid var(--texte);outline-offset:2px}
.ch-grille button[aria-pressed="true"]::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;font-weight:700;font-size:12px;color:var(--ch-coche)}
.ch-ambiances{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:var(--surface-2);border:0;border-radius:10px;padding:3px}
.ch-ambiances button{border:0;background:none;border-radius:7px;height:30px;display:grid;place-items:center;cursor:pointer;color:var(--texte-doux)}
.ch-ambiances button[aria-pressed="true"]{background:var(--surface);color:var(--texte);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.ch-palette{display:flex;gap:6px;margin-top:14px;align-items:center}
.ch-palette i{width:18px;height:18px;border:1px solid var(--ligne)}
.ch-palette span{font-size:12px;color:var(--texte-doux);margin-left:4px}
.ch-palette .ch-rond{margin-left:auto;border-radius:50%;width:30px;height:30px}

/* =====================================================================
   Graphiques de la charte (construits par Charte.graphes dans charte.js)
   Couleurs fixes de progression : rouge → orange → vert (--progression-… en haut du fichier).
   ===================================================================== */
/* Barre de progression en traits, dégradé sur 3 couleurs */
.ch-jauge{display:flex;gap:2px;height:22px;align-items:stretch;width:100%}
.ch-jauge i{flex:1;border-radius:2px;background:var(--ligne);min-width:2px}
.ch-jauge.ch-fine{height:8px;gap:3px}
.ch-jauge.ch-fine i{border-radius:2px}
/* Évolution (+12 % / -3 %) */
.ch-evo{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:600;border-radius:999px;padding:2px 8px;white-space:nowrap;font-family:var(--sans)}
.ch-evo.hausse{background:var(--ok-fond);color:var(--ok)}
.ch-evo.baisse{background:var(--danger-fond);color:var(--danger)}
.ch-evo.stable{background:var(--surface-2);color:var(--texte-doux)}
/* Mini-courbe (dans une carte chiffre) */
.ch-mini{display:block;width:100%;height:36px;overflow:visible}
/* Courbe avec survol */
.ch-courbe{position:relative;font-family:var(--sans)}
.ch-courbe svg{display:block;width:100%;height:220px;overflow:visible}
.ch-courbe .ch-axe-y{position:absolute;left:0;font-size:11px;color:var(--texte-doux);transform:translateY(-50%)}
.ch-courbe .ch-axe-x{display:flex;justify-content:space-between;font-size:11px;color:var(--texte-doux);margin-top:8px;padding-left:34px}
.ch-courbe .ch-zone{position:absolute;inset:0 0 0 34px}
.ch-courbe .ch-repere{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed var(--texte-doux);pointer-events:none;opacity:0}
.ch-courbe .ch-point{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--progression-haut);box-shadow:0 0 0 2px var(--surface);transform:translate(-50%,-50%);pointer-events:none;opacity:0}
.ch-courbe .ch-bulle{position:absolute;top:0;transform:translate(-50%,-110%);background:var(--c-foncee);color:#fff;font-size:12px;border-radius:8px;padding:5px 9px;white-space:nowrap;pointer-events:none;opacity:0}
.ch-courbe .ch-bulle b{font-weight:600}
.ch-courbe.survol .ch-repere,.ch-courbe.survol .ch-point,.ch-courbe.survol .ch-bulle{opacity:1}
/* Demi-jauge en 3 parts */
.ch-demi{position:relative;text-align:center;font-family:var(--sans)}
.ch-demi svg{display:block;width:100%;max-width:280px;margin:0 auto}
.ch-demi .ch-demi-centre{position:absolute;left:0;right:0;bottom:4px}
.ch-demi .ch-demi-centre small{display:block;font-size:12px;color:var(--texte-doux)}
.ch-demi .ch-demi-centre b{font-family:var(--heading);font-weight:var(--graisse-grand-titre);font-size:30px;line-height:1.1}
.ch-legende{list-style:none;margin:16px 0 0;padding:0}
.ch-legende li{display:flex;align-items:center;gap:10px;padding:9px 0 9px 12px;border-left:3px solid var(--ch-l,var(--ligne));margin-bottom:6px}
.ch-legende li span{color:var(--texte-doux);font-size:13px}
.ch-legende li b{margin-left:auto;font-weight:600}
.ch-anneaux .ch-legende{margin-top:10px}
.ch-anneaux .ch-legende li{padding:5px 0 5px 10px;margin-bottom:3px}
.ch-anneaux .ch-legende li span{font-size:12.5px}

/* =====================================================================
   Espace perso en haut à droite (Charte.compte) : nom, statut, avatar, menu
   ===================================================================== */
.ch-compte{position:relative;font-family:var(--sans)}
.ch-compte > summary{list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;padding:4px 6px 4px 10px;border-radius:14px}
.ch-compte > summary::-webkit-details-marker{display:none}
.ch-compte > summary:hover{background:var(--surface-2)}
.ch-compte .ch-qui{text-align:right;line-height:1.25}
.ch-compte .ch-qui b{display:block;font-weight:600;font-size:14px;color:var(--texte);white-space:nowrap}
.ch-compte .ch-qui small{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--texte-doux)}
.ch-compte .ch-qui small::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok)}
.ch-avatar{width:38px;height:38px;border-radius:50%;background:var(--c-principale);color:var(--c-sur-principale);display:grid;place-items:center;font-weight:600;font-size:14px;overflow:hidden;flex:none}
.ch-avatar img{width:100%;height:100%;object-fit:cover}
.ch-chevron{width:24px;height:24px;border-radius:50%;border:1px solid var(--ligne);display:grid;place-items:center;color:var(--texte-doux);transition:transform .2s}
.ch-compte[open] .ch-chevron{transform:rotate(180deg)}
.ch-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:40;min-width:230px;background:var(--surface);border:1px solid var(--ligne);border-radius:14px;box-shadow:var(--ombre);padding:6px}
.ch-menu .ch-entete{padding:10px 12px 12px;border-bottom:1px solid var(--ligne);margin-bottom:6px}
.ch-menu .ch-entete b{display:block;font-size:14px;font-weight:600;color:var(--texte)}
.ch-menu .ch-entete span{font-size:12.5px;color:var(--texte-doux);word-break:break-all}
.ch-menu a,.ch-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;background:none;border-radius:9px;color:var(--texte);font:500 13.5px var(--sans);text-decoration:none;cursor:pointer;text-align:left}
.ch-menu a:hover,.ch-menu button:hover{background:var(--surface-2)}
.ch-menu svg{color:var(--texte-doux);flex:none}
.ch-menu .ch-sep{height:1px;background:var(--ligne);margin:6px 4px}
.ch-menu .ch-danger{color:var(--c-principale-texte)}
.ch-menu .ch-danger svg{color:var(--c-principale-texte)}
.ch-menu .ch-plan{margin-left:auto;font-size:11px;font-weight:600;border-radius:999px;padding:2px 8px;background:var(--c-accent-voile);color:var(--c-accent-texte)}
@media(max-width:700px){.ch-compte .ch-qui{display:none}}
/* Anneaux des 3 piliers, « 3S » au centre */
.ch-anneaux{font-family:var(--sans)}
.ch-anneaux-rond{position:relative;max-width:168px;margin:0 auto}
.ch-anneaux-rond svg{display:block;width:100%}
.ch-anneaux-centre{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.ch-anneaux-centre small{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--texte-doux)}
.ch-anneaux-centre b{font-family:var(--heading);font-weight:var(--graisse-titre);font-size:24px;line-height:1}
/* Fond pointillé sous les courbes */
.ch-courbe svg{background-image:radial-gradient(color-mix(in srgb,var(--texte-doux) 35%,transparent) 1px,transparent 1.2px);background-size:14px 14px}
/* Entonnoir */
.ch-entonnoir svg{display:block;width:100%;height:150px}
.ch-etapes{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px 18px;font-family:var(--sans)}
.ch-etapes li{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--texte-doux)}
.ch-etapes i{width:8px;height:8px;border-radius:50%}
.ch-etapes b{color:var(--texte);font-weight:600}
.ch-etapes small{font-size:11px}
/* Grille de points avec objectif */
.ch-points{font-family:var(--sans)}
.ch-grille-points{position:relative;display:flex;gap:3px;align-items:flex-end;height:170px}
.ch-col{flex:1;display:flex;flex-direction:column;gap:3px;align-items:center;justify-content:flex-end;height:100%}
.ch-col i{width:100%;max-width:9px;aspect-ratio:1;border-radius:50%;background:var(--ligne)}
.ch-col i.on{background:var(--progression-haut)}
.ch-col:hover i.on{background:color-mix(in srgb,var(--progression-haut) 70%,var(--texte))}
.ch-cible{position:absolute;left:0;right:0;border-top:2px dashed var(--progression-milieu);pointer-events:none}
.ch-cible span{position:absolute;left:0;top:-12px;background:var(--progression-milieu);color:#1b1b1b;font-size:11px;font-weight:600;border-radius:999px;padding:2px 9px}

/* =====================================================================
   Fenêtres de dialogue (Charte.dialogue) : remplacent les fenêtres du navigateur
   ===================================================================== */
.ch-dialogue-fond{position:fixed;inset:0;z-index:100;background:color-mix(in srgb,var(--c-foncee) 45%,transparent);backdrop-filter:blur(3px);display:grid;place-items:center;padding:20px;animation:ch-apparait .15s ease}
.ch-dialogue{display:flex;flex-direction:column;max-height:calc(100dvh - 40px);width:min(440px,100%);background:var(--surface);color:var(--texte);border:1px solid var(--ligne);border-radius:18px;box-shadow:var(--ombre);padding:22px 24px 20px;font-family:var(--sans)}
/* Long texte (ex. règles) : seul le corps défile, la barre reste à l'intérieur des coins arrondis, titre et boutons restent visibles */
.ch-dialogue-corps{flex:1 1 auto;min-height:0;overflow-y:auto;margin-right:-14px;padding-right:14px;overscroll-behavior:contain}
.ch-dialogue h2{flex:none;font-family:var(--heading);font-weight:var(--graisse-titre);font-size:19px;margin:0 0 8px;letter-spacing:-.01em}
.ch-dialogue-texte{margin:0 0 4px;color:var(--texte-doux);font-size:14px;line-height:1.55}
.ch-dialogue-champ{width:100%;margin-top:12px;height:42px;border:1px solid var(--ligne);border-radius:10px;padding:0 12px;font:inherit;font-size:14px;background:var(--surface);color:var(--texte);outline:none}
.ch-dialogue-champs{margin-top:6px}
.ch-dialogue-label{display:block;margin-top:14px}
.ch-dialogue-label span{display:block;font-size:13px;font-weight:600;color:var(--texte)}
.ch-dialogue-label small{display:block;margin-top:5px;font-size:12px;line-height:1.45;color:var(--texte-doux)}
.ch-dialogue-label .ch-dialogue-champ{margin-top:6px}
.ch-dialogue-champ:focus{border-color:var(--c-principale);box-shadow:0 0 0 3px var(--c-principale-voile)}
@media (max-width:760px){.ch-dialogue-champ{font-size:16px}}   /* 16 px : l'iPhone ne zoome pas sur le champ */
.ch-dialogue-actions{flex:none;display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
.ch-bouton{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 18px;border-radius:10px;border:0;background:var(--c-principale);color:var(--c-sur-principale);font:600 14px var(--sans);cursor:pointer}
.ch-bouton:hover{filter:brightness(.94)}
.ch-bouton.neutre{background:var(--surface);color:var(--texte);border:1px solid var(--ligne)}
.ch-bouton.neutre:hover{background:var(--surface-2);filter:none}
.ch-bouton.danger{background:var(--c-principale);color:var(--c-sur-principale)}   /* même les actions définitives suivent le thème */
@keyframes ch-apparait{from{opacity:0}to{opacity:1}}

/* =====================================================================
   Menus déroulants (Charte.menus) : bouton + liste aux couleurs du thème
   ===================================================================== */
.ch-select{position:relative;display:inline-block;font-family:var(--sans)}
.ch-select > button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border:1px solid var(--ligne);border-radius:12px;background:var(--surface);color:var(--texte);font:500 13.5px var(--sans);white-space:nowrap;cursor:pointer}
.ch-select > button:hover{border-color:var(--texte-doux)}
.ch-select.ouvert > button{border-color:var(--c-principale);box-shadow:0 0 0 3px var(--c-principale-voile)}
.ch-select > button.actif{background:var(--c-principale-voile);border-color:transparent;color:var(--c-principale-texte)}
.ch-select > button svg{flex:none}
.ch-select > button span{overflow:hidden;text-overflow:ellipsis}
.ch-select > button:disabled{opacity:.55;cursor:default}
.ch-liste{position:absolute;left:0;top:calc(100% + 6px);z-index:80;min-width:100%;width:max-content;max-width:min(360px,90vw);overflow:hidden;background:var(--surface);border:1px solid var(--ligne);border-radius:12px;box-shadow:var(--ombre);padding:6px 0}
.ch-liste-in{max-height:308px;overflow-y:auto;padding:0 6px;margin-right:4px}
.ch-liste button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;border:0;background:none;border-radius:8px;padding:8px 10px;font:400 13.5px var(--sans);text-align:left;color:var(--texte);cursor:pointer}
.ch-liste button:hover{background:var(--surface-2)}
.ch-liste button[aria-selected="true"]{background:var(--c-principale-voile);color:var(--c-principale-texte);font-weight:600}
.ch-liste button[aria-selected="true"]::after{content:"✓"}
.ch-liste button:disabled{opacity:.45}
/* Dans un formulaire : pleine largeur, même allure que les champs */
.ch-select.champ{display:block;width:100%;border:0;padding:0;background:none;box-shadow:none;height:auto;min-height:0}
.ch-select.champ > button{width:100%;justify-content:space-between;height:42px;border-radius:10px;font-weight:400;font-size:14px}

/* Calendrier (Charte.dates) : champ date / date + heure aux couleurs du thème */
.ch-date{position:relative}
.ch-date > button.champ{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:left;cursor:pointer;color:var(--texte)}
.ch-date > button.champ .ch-vide{color:var(--texte-doux)}
.ch-date.ouvert > button.champ{border-color:var(--c-principale);box-shadow:0 0 0 3px var(--c-principale-voile)}
.ch-cal{position:absolute;left:0;top:calc(100% + 6px);z-index:90;width:min(300px,92vw);background:var(--surface);border:1px solid var(--ligne);border-radius:14px;box-shadow:var(--ombre);padding:12px;font:400 13.5px var(--sans);color:var(--texte)}
.ch-cal button{font:inherit;color:inherit;cursor:pointer}
.cal-tete{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cal-tete b{font-weight:600;text-transform:capitalize}
.cal-tete button{border:0;background:none;width:32px;height:32px;border-radius:8px;font-size:20px;line-height:1}
.cal-tete button:hover{background:var(--surface-2)}
.cal-sem,.cal-jours{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.cal-sem span{font-size:11.5px;color:var(--texte-doux);padding:4px 0}
.cal-jours button{border:0;background:none;height:34px;border-radius:9px}
.cal-jours button:hover{background:var(--surface-2)}
.cal-jours button.auj{color:var(--c-principale-texte);font-weight:600}
.cal-jours button.on{background:var(--c-principale);color:var(--c-sur-principale,#fff);font-weight:600}
.cal-heure{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--ligne)}
.cal-heure span{flex:1;color:var(--texte-doux)}
.cal-heure input{width:56px;height:34px;border:1px solid var(--ligne);border-radius:9px;background:var(--surface);color:inherit;text-align:center;font:inherit}
.cal-pied{display:flex;justify-content:space-between;margin-top:10px}
.cal-pied button{border:0;background:none;padding:6px 8px;border-radius:8px;color:var(--c-principale-texte);font-weight:600}
.cal-pied button:hover{background:var(--c-principale-voile)}

/* Mot de passe : on garde uniquement l’œil de l’Academy (Edge ajoute le sien) */
input[type="password"]::-ms-reveal,input[type="password"]::-ms-clear{display:none}

/* Champs de saisie : un seul cadre au focus (bordure + halo doux), jamais le contour du navigateur en plus */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):focus-visible,
textarea:focus-visible,select:focus-visible{outline:none;border-color:var(--c-principale);box-shadow:0 0 0 3px var(--c-principale-voile)}

/* ---------------------------------------------------------------------
   Arrondi commun (CRM, Academy, Cockpit, administration), demandé par Lynda le 05/10/2026 après ORBIT : champs et boutons
   en pastille ; zones de texte, cartes, fenêtres et menus très arrondis. « html body » : ces règles passent devant les
   arrondis écrits dans chaque page, sans avoir à modifier les pages.
   --------------------------------------------------------------------- */
html body .btn{border-radius:999px!important}   /* certains boutons ont un arrondi plus précis dans leur page (en-tête) */
html body .champ,html body select.champ,html body .recherche,html body .rdv-date{border-radius:22px}
html body textarea,html body textarea.champ{border-radius:18px}
html body .icone-btn,html body .bouton-icone,html body .icone-tete,html body .rond-btn,html body .fen-fermer,html body .fermer,html body .ferme-f{border-radius:50%}
html body .seg,html body .tb-seg,html body .bascule-vue,html body .onglets{border-radius:999px}
html body .seg > button,html body .tb-seg > button,html body .bascule-vue > button{border-radius:999px}
html body .carte,html body .carte-lead,html body .carte-chiffre,html body .carte-param,html body .carte-integ,html body .carte-info,html body .carte-offre,html body .carte-compte,
html body .kpi,html body .bloc,html body .bloc-liste,html body .bloc-taches,html body .bloc-fiche,html body .colonne,html body .colonne-k,html body .tb-c,html body .form-carte,
html body .client,html body .offre,html body .opp,html body .liste,html body .liste-taches,html body .bandeau,html body .acquisition,html body .mailerlite,html body .temps,
html body .calendrier,html body .col-planner,html body .fiche-cote,html body .vide,html body .depot,html body .media,html body .inspi,html body .annonce,html body .liste-cours,
html body .contenu-cours,html body .of-carte,html body .outils{border-radius:20px}
html body .fenetre,html body .modal,html body .boite,html body .palette{border-radius:26px}
html body .feuille{border-radius:26px 26px 0 0}   /* feuille qui monte du bas de l’écran : seuls les coins du haut */
html body .pop,html body .menu-nouveau,html body .menu-modif,html body .choix-liste,html body .rech-liste,html body .filtres-panneau,html body .toast,html body .pop-annonce{border-radius:18px}
html body .pop-item{border-radius:12px}

/* Bascules (« Chat | Work ») : une piste grise en pastille, le choix actif en pastille blanche avec une ombre légère.
   Demande de Lynda du 05/10/2026 ; vaut pour le CRM, l'Academy, le Cockpit et l'administration. */
html body .seg,html body .tb-seg,html body .bascule-vue{background:var(--surface-2,var(--panel-2));border:0;border-radius:999px;padding:3px;gap:2px}
html body .seg > button,html body .tb-seg > button,html body .bascule-vue > button{border:0;background:none;border-radius:999px;color:var(--texte-doux,var(--ink-mute));font-weight:500;box-shadow:none}
html body .seg > button[aria-pressed="true"],html body .tb-seg > button[aria-pressed="true"],html body .bascule-vue > button[aria-pressed="true"],
html body .seg > button.actif,html body .tb-seg > button.actif,html body .bascule-vue > button.actif{background:var(--surface,var(--panel));color:var(--texte,var(--ink));font-weight:600;box-shadow:0 1px 4px rgba(0,0,0,.14),0 0 0 1px rgba(0,0,0,.04)}