:root{
  --bg:#E7E2D9;          /* fond beige */
  --panel:#FBFAF7;       /* zone interne crème */
  --bleu:#1F3B57;        /* nuit */
  --bleu2:#3A4655;
  --orange:#E8843C;
  --coral:#EA6A6A;
  --grad:linear-gradient(135deg,#E8843C,#EA6A6A);
  --vert:#4E9E6A;
  --bord:#ECE7DF;
  --bord2:#DED7CC;
  --gris:#6A7585;
  --gris2:#8A8273;
  --shadow:0 16px 38px -24px rgba(21,41,61,.22);
  --radius:18px;
  --radius-sm:13px;
  --serif:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{height:100%}
body{font-family:Arial,Helvetica,sans-serif;color:#1f2430;margin:0;background:var(--bg);line-height:1.55;min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--orange);color:#fff}
main{flex:1 0 auto}

/* ---------- Bandeau / pied ---------- */
.bandeau{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#fff;border-bottom:3px solid var(--orange);padding:12px 26px;padding-left:max(26px,env(safe-area-inset-left));padding-right:max(26px,env(safe-area-inset-right))}
.bandeau.pied{flex-shrink:0;background:transparent;border-bottom:none;border-top:1px solid var(--bord2);margin-top:34px;font-size:13px;color:var(--gris);justify-content:center;padding:18px}
.logo-zone{flex:0 0 auto;min-width:150px;min-height:44px;display:flex;align-items:center}
.logo-zone.gauche{justify-content:flex-start}
.logo-zone.droite{justify-content:flex-end}
.logo-zone img{max-height:46px;max-width:210px}
.bandeau-titre{flex:1 1 auto;text-align:center;color:var(--bleu);font-weight:700;font-family:var(--serif)}
main{width:100%;max-width:680px;margin:30px auto;padding:0 16px}

/* En-tête sur petits écrans : les zones logo ne réservent plus 150px, titre tronqué proprement */
@media (max-width:600px){
  .bandeau{gap:8px;padding-top:10px;padding-bottom:10px;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
  .logo-zone{min-width:0}
  .logo-zone img{max-height:34px;max-width:120px}
  .bandeau-titre{font-size:15px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ---------- Cartes & typo ---------- */
.carte{background:#fff;border:1px solid var(--bord);border-radius:var(--radius);padding:28px;margin-bottom:18px;box-shadow:var(--shadow)}
h1{color:var(--bleu);font-family:var(--serif);font-weight:800;font-size:30px;letter-spacing:-.02em;margin:0 0 14px}
h2{color:var(--bleu);font-family:var(--serif);font-weight:700;font-size:20px;margin:4px 0 16px}
label{display:block;font-weight:700;margin:14px 0 5px;color:var(--bleu)}
input[type=text],input[type=password],input[type=number],input[type=date],select,textarea{width:100%;padding:12px;border:1.5px solid #E3DDD3;border-radius:var(--radius-sm);font-size:16px;background:#FBF9F5;font-family:inherit;color:var(--bleu)}
input:focus,select:focus,textarea:focus{border-color:var(--orange);background:#fff;outline:none}

/* ---------- Boutons ---------- */
button,.btn{display:inline-block;margin-top:18px;background:var(--grad);color:#fff;border:none;border-radius:var(--radius-sm);padding:14px 24px;font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;text-decoration:none;box-shadow:0 12px 24px -12px rgba(232,116,70,.6);transition:transform .08s ease}
button:hover,.btn:hover{transform:translateY(-1px)}
.btn-export{display:inline-block;background:var(--vert);color:#fff;padding:9px 16px;border-radius:var(--radius-sm);text-decoration:none;font-size:14px;font-weight:700;margin-bottom:14px;box-shadow:none}
.btn-export:hover{background:#3f8657}
/* Bouton secondaire (ex. « Rester connecté ») */
.btn-secondaire{display:inline-block;background:#fff;color:var(--bleu);border:1px solid var(--bord2);padding:11px 16px;border-radius:var(--radius-sm);text-decoration:none;font-weight:700;font-size:15px}
.btn-secondaire:hover{border-color:var(--bleu)}
/* Lien Déconnexion dans l'en-tête participant (bandeau blanc) */
.deco-lien{color:var(--bleu);text-decoration:none;font-size:14px;font-weight:600;border:1px solid var(--bord2);padding:6px 13px;border-radius:999px;white-space:nowrap;margin-right:6px}
.deco-lien:hover{border-color:var(--bleu);background:var(--bg)}
/* Filtre périmètre : menu déroulant arborescent à cases à cocher */
.dash-filters .hint{font-weight:400;color:var(--gris);font-size:11px;text-transform:none;letter-spacing:0}
.scope-dd{position:relative}
/* Selects + bouton périmètre : même boîte exactement (rendu non natif unifié) */
.dash-filters select,.dash-filters .scope-dd > summary{box-sizing:border-box;line-height:1.2;padding:12px 34px 12px 12px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8"><path d="M1 1l5 5 5-5" fill="none" stroke="%231F3B57" stroke-width="1.6"/></svg>');background-repeat:no-repeat;background-position:right 13px center}
.dash-filters select{-webkit-appearance:none;-moz-appearance:none;appearance:none}
.scope-dd > summary{list-style:none;cursor:pointer;width:100%;display:block;border:1.5px solid #E3DDD3;border-radius:var(--radius-sm);background-color:#FBF9F5;font-size:16px;color:var(--bleu);font-family:inherit;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scope-dd > summary::-webkit-details-marker{display:none}
.scope-dd[open] > summary{border-color:var(--orange);background-color:#fff}
.scope-pop{position:absolute;z-index:60;top:calc(100% + 5px);left:0;min-width:330px;background:#fff;border:1px solid var(--bord2);border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.20);padding:13px}
.scope-tree{display:flex;flex-direction:column;gap:1px}
.scope-item{display:flex;align-items:center;gap:9px;font-size:14px;cursor:pointer;padding:3px 4px;border-radius:5px;white-space:nowrap}
.scope-item:hover{background:var(--bg)}
.scope-item input{margin:0;width:16px;height:16px;flex:0 0 auto;cursor:pointer}
.scope-item.niv1{font-weight:700;color:var(--bleu)}
.scope-actions{margin-top:10px;border-top:1px solid var(--bord);padding-top:10px}

/* ---------- Choix (réponses) ---------- */
.choix{display:flex;align-items:flex-start;gap:10px;background:var(--panel);border:1px solid var(--bord);border-radius:var(--radius-sm);padding:13px 14px;margin:9px 0;font-weight:normal;color:#1f2430;cursor:pointer;transition:border-color .12s,background .12s}
.choix:hover{border-color:var(--orange);background:#fff}
.choix input{margin-top:3px}
.choix-jnsp{font-style:italic;color:var(--gris);background:#F2EDE5}
/* Correction colorisée SUR PLACE (révélation après Valider) */
.choix{transition:background .75s ease,border-color .75s ease,box-shadow .5s ease}
.choix .lib{flex:1}
.choix .mk{font-weight:700;font-size:17px;opacity:0;transition:opacity .6s ease}
.choix .moi{margin-left:8px;opacity:0;transition:opacity .6s ease .15s}
.choix.bonne{background:#E2F2E6;border-color:#BFE2C5}
.choix.mauvaise{background:#FBE4DE;border-color:#EFC6BC}
.choix.jnsp{background:#EFEAE2}
.choix.bonne .mk{color:var(--vert);opacity:1}
.choix.mauvaise .mk{color:#C7402F;opacity:1}
.choix.jnsp .mk{color:var(--gris);opacity:1}
.choix.choisi{box-shadow:inset -4px 0 0 0 var(--bleu)}
.choix.choisi .moi{opacity:1}
.corr-in{animation:fbIn .6s ease both}

.consigne{color:var(--gris);font-size:14px;margin:4px 0 10px}
.info{background:#FFF4EC;border:1px solid #F3D6BE;border-radius:var(--radius-sm);padding:11px 14px;font-size:14px;color:#6E4F35}
.err{background:#FDECEC;border:1px solid #E9B0B0;color:#9B2C2C;border-radius:var(--radius-sm);padding:11px 14px}
.progress{float:right;color:var(--gris);font-size:14px;font-weight:700}

/* ---------- Correction ---------- */
.correction{list-style:none;padding:0;margin:0 0 14px}
.correction li{display:flex;align-items:center;gap:8px;padding:11px 13px;border-radius:var(--radius-sm);margin:7px 0;border:1px solid var(--bord)}
.correction li .lib{flex:1}
.correction .bonne{background:#EDF7EF;border-color:#BFE2C5}
.correction .mauvaise{background:#FBEDEA;border-color:#EFC6BC}
.correction .jnsp{background:#F2EDE5}
.correction li.choisi{border-right:5px solid var(--bleu)}
.correction .mk{font-weight:700}
.moi{color:var(--bleu);font-weight:700;font-size:13px;white-space:nowrap}
.feedback{background:#EEF4F9;border:1px solid #CFE0EE;border-radius:var(--radius-sm);padding:13px 15px;margin:10px 0;font-size:15px}
.feedback.etab{background:#FFF8F2;border-color:#F3D6BE}

/* ---------- Page d'accueil (repères) ---------- */
.accueil-theme{color:var(--orange);font-weight:700;font-size:18px;margin:-4px 0 10px}
.accueil-intro{color:var(--gris)}
.acc-list{display:flex;flex-direction:column;gap:16px;margin:18px 0 8px}
.acc-row{display:flex;gap:14px;align-items:flex-start}
.acc-ico{flex:0 0 42px;height:42px;border-radius:50%;background:#F3D6BE;display:flex;align-items:center;justify-content:center}
.acc-t{font-weight:700;color:var(--bleu)}
.acc-d{color:var(--gris);line-height:1.5}

.score-bloc{text-align:center;margin:24px 0}
.score-val{font-family:var(--serif);font-size:48px;font-weight:800;color:var(--orange)}
.score-lbl{color:var(--gris)}

/* ---------- Parcours chapitré ---------- */
body.parcours main{max-width:1000px}
.parcours-wrap{display:flex;gap:20px;align-items:flex-start}
.parcours-wrap .carte{flex:1 1 auto;min-width:0}
.sommaire{flex:0 0 240px;background:#fff;border:1px solid var(--bord);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
.sommaire h3{margin:0 0 10px;font-size:13px;color:var(--gris2);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.sommaire ol{list-style:none;padding:0;margin:0}
.sommaire li{display:flex;align-items:baseline;gap:8px;padding:9px 0;border-top:1px solid var(--bord);font-size:14px;color:var(--gris)}
.sommaire li:first-child{border-top:none}
.sommaire li .lib{flex:1}
.sommaire li .bul{width:14px;color:var(--orange)}
.sommaire li .cpt{font-size:12px;color:#9a9a9a}
.sommaire li.cur{color:var(--bleu);font-weight:700}
.sommaire li.done{color:var(--vert)}
.sommaire li.done .bul{color:var(--vert)}
.chapitre{color:var(--orange);font-weight:700;font-size:14px;margin-bottom:6px}
.slide{max-width:100%;height:auto;border:1px solid var(--bord);border-radius:var(--radius-sm)}
/* Animations du parcours : barre de progression + entrée question + correction */
body.parcours .parcours-wrap > .carte{position:relative;overflow:hidden}
.q-prog{position:absolute;top:0;left:0;height:4px;width:0;background:var(--grad);border-radius:0 3px 3px 0;transition:width .7s cubic-bezier(.4,.8,.3,1)}
@keyframes qIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes fbIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
body.parcours .carte.enter .chapitre{animation:qIn .4s ease both}
body.parcours .carte.enter h2{animation:qIn .45s ease .05s both}
body.parcours .carte.enter .consigne{animation:qIn .4s ease .12s both}
body.parcours .carte.enter .choix:nth-of-type(1){animation:qIn .4s ease .14s both}
body.parcours .carte.enter .choix:nth-of-type(2){animation:qIn .4s ease .20s both}
body.parcours .carte.enter .choix:nth-of-type(3){animation:qIn .4s ease .26s both}
body.parcours .carte.enter .choix:nth-of-type(4){animation:qIn .4s ease .32s both}
body.parcours .carte.enter .choix:nth-of-type(5){animation:qIn .4s ease .38s both}
body.parcours .carte.enter .choix:nth-of-type(6){animation:qIn .4s ease .44s both}
body.parcours .carte.enter .choix:nth-of-type(7){animation:qIn .4s ease .50s both}
body.parcours .carte.enter form>button,body.parcours .carte.enter > .btn{animation:qIn .4s ease .52s both}
body.parcours .carte.enter .correction li{animation:qIn .4s ease both}
body.parcours .carte.enter .correction li:nth-child(1){animation-delay:.08s}
body.parcours .carte.enter .correction li:nth-child(2){animation-delay:.15s}
body.parcours .carte.enter .correction li:nth-child(3){animation-delay:.22s}
body.parcours .carte.enter .correction li:nth-child(4){animation-delay:.29s}
body.parcours .carte.enter .correction li:nth-child(5){animation-delay:.36s}
body.parcours .carte.enter .correction li:nth-child(6){animation-delay:.43s}
body.parcours .carte.enter .correction li:nth-child(7){animation-delay:.50s}
body.parcours .carte.enter .correction li .mk{display:inline-block;animation:pop .45s cubic-bezier(.2,1.5,.4,1) both;animation-delay:inherit}
body.parcours .carte.enter .feedback{animation:fbIn .5s ease .55s both}
@media (max-width:760px){
  .parcours-wrap{flex-direction:column}
  /* « Votre parcours » compact en portrait : on ne montre que la thématique en cours
     (la liste complète réapparaît en paysage / sur écran large). */
  .sommaire{flex-basis:auto;width:100%;order:0;padding:10px 14px}
  .sommaire h3{margin:0 0 4px}
  .sommaire li{display:none;border-top:none;padding:4px 0}
  .sommaire li.cur{display:flex}
}

/* ---------- Zones décideur / admin ---------- */
body.decideur main{max-width:1060px}
body.admin main{max-width:1240px}
/* Admin : bandeau nuit pour différencier */
body.admin .bandeau{background:#15293D;border-bottom-color:var(--orange)}
body.admin .bandeau-titre{color:#fff}
body.admin .logo-zone.gauche img{display:none}
body.admin .logo-zone.gauche::after{content:"FO\2019QUAL \00b7 Administration";color:#fff;font-weight:700;letter-spacing:.5px;font-family:var(--serif)}
body.admin .logo-zone.droite{justify-content:flex-end}
.bandeau .adminmenu summary{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.28)}
.bandeau .adminmenu[open] summary{background:rgba(255,255,255,.22)}
/* Espace decideur : bandeau bleu (distinct de l'espace participant) */
body.decideur .bandeau{background:#15293D;border-bottom-color:var(--orange)}
body.decideur .bandeau-titre{color:#fff}
body.decideur .logo-zone.gauche img{background:#fff;padding:6px 12px;border-radius:10px;max-height:48px}

/* Admin deux colonnes */
.admin-split{display:flex;gap:20px;align-items:flex-start}
.admin-side{flex:0 0 250px;background:#fff;border:1px solid var(--bord);border-radius:var(--radius);padding:13px;position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto;box-shadow:var(--shadow)}
.admin-side .side-new{display:block;background:var(--grad);color:#fff;text-align:center;border-radius:var(--radius-sm);padding:11px;font-weight:700;text-decoration:none;margin:0 0 12px;box-shadow:0 10px 20px -12px rgba(232,116,70,.6)}
.admin-side .side-new.actif{background:var(--bleu);box-shadow:none}
.admin-side .side-title{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--gris2);margin:6px 4px}
.admin-side a.side-item{display:block;padding:9px 11px;border-radius:10px;color:var(--bleu);text-decoration:none;font-size:14px;font-weight:700;margin:2px 0}
.admin-side a.side-item:hover{background:var(--panel)}
.admin-side a.side-item.actif{background:var(--bleu);color:#fff}
.admin-side a.side-item small{display:block;font-weight:normal;color:inherit;opacity:.75;font-size:12px;margin-top:2px}
.admin-side .side-sep{height:1px;background:var(--bord);margin:14px 4px}
.admin-side a.side-res{display:block;padding:9px 11px;border-radius:10px;color:var(--bleu);text-decoration:none;font-size:14px;font-weight:700;margin:3px 0;background:#F2EDE5;border:1px solid var(--bord)}
.admin-side a.side-res:hover{background:#fff}
.admin-side a.side-res.actif{background:var(--bleu);color:#fff;border-color:var(--bleu)}
.admin-main{flex:1;min-width:0}
.cur-logo{display:flex;align-items:center;gap:10px;margin-top:8px}
.cur-logo img{max-height:40px;max-width:140px;border:1px solid var(--bord);border-radius:8px;padding:3px;background:#fff}
.cur-logo span{font-size:12px;color:var(--gris);font-weight:normal}
.locked-field{padding:12px;border:1.5px dashed #cdbfae;border-radius:var(--radius-sm);background:#F2EDE5;color:var(--bleu2);font-size:16px}
.locked-field span{float:right;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--gris2);background:#fff;border:1px solid var(--bord2);border-radius:6px;padding:1px 7px}
.err-list{margin:6px 0 0;padding-left:20px;color:#9b2c2c;font-size:14px}
.err-list li{margin:3px 0}
.format-doc{white-space:pre-wrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.55;background:var(--panel);border:1px solid var(--bord);border-radius:var(--radius-sm);padding:14px;color:#444;overflow:auto}
@media(max-width:760px){.admin-split{flex-direction:column}.admin-side{flex:1 1 auto;width:100%;position:static;max-height:none}}

/* Arbre arborescence */
ul.arbo{list-style:none;margin:6px 0;padding-left:20px;border-left:2px solid var(--bord)}
ul.arbo.racine{padding-left:0;border-left:none}
ul.arbo li{padding:4px 0}
.arbo-type{display:inline-block;font-size:11px;color:var(--gris);background:var(--panel);border:1px solid var(--bord);border-radius:6px;padding:1px 7px;margin-right:7px}

/* ---------- Navigation onglets (décideur/admin) ---------- */
.dash-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:14px;color:var(--gris);border-bottom:1px solid var(--bord2);padding-bottom:0}
.dash-nav .onglets{display:flex;gap:6px;flex:1 1 auto;flex-wrap:nowrap;overflow-x:auto;min-width:0}
.dash-nav .onglets a{flex:0 0 auto}
.dash-nav .onglets a{padding:10px 16px;text-decoration:none;color:var(--bleu);background:#F2EDE5;border-radius:10px 10px 0 0;margin-bottom:-1px;font-weight:600}
.dash-nav .onglets a.actif{background:var(--grad);color:#fff;font-weight:700}
.dash-nav > a{color:var(--gris);text-decoration:none}
.dash-nav > a:hover{color:var(--orange)}
.dash-util{display:flex;gap:14px;font-size:13px;flex-wrap:wrap}
.dash-util a{color:var(--gris);text-decoration:none}
.dash-util a:hover{color:var(--orange)}
.dash-nav{position:relative}
.adminmenu{position:relative;flex:0 0 auto}
.adminmenu summary{list-style:none;cursor:pointer;font-size:13px;font-weight:700;color:var(--bleu);padding:7px 13px;border:1px solid var(--bord2);border-radius:10px;background:#fff;white-space:nowrap}
.adminmenu summary::-webkit-details-marker{display:none}
.adminmenu[open] summary{background:var(--panel)}
.adminmenu-pop{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--bord);border-radius:12px;box-shadow:var(--shadow);padding:6px;min-width:210px;z-index:30;display:flex;flex-direction:column}
.adminmenu-pop a{padding:9px 12px;border-radius:8px;color:var(--bleu);text-decoration:none;font-size:14px;font-weight:600}
.adminmenu-pop a:hover{background:var(--panel)}
/* Assistant nouveau programme : stepper vertical */
.wiz-wrap{display:flex;gap:24px;align-items:flex-start}
.wiz-stepper{flex:0 0 210px}
.wiz-content{flex:1;min-width:0}
.wiz-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--orange);margin:0 0 12px}
.wiz-step{display:flex;align-items:flex-start;gap:12px;padding:8px 0;position:relative;text-decoration:none}
.wiz-step .wiz-num{flex:0 0 30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;background:#EDE7DD;color:#9a9384;border:2px solid #E2DBCF}
.wiz-step .wiz-lbl{font-size:13.5px;color:#9a9384;padding-top:5px;font-weight:700}
.wiz-step:not(:last-child)::after{content:"";position:absolute;left:14px;top:38px;height:14px;width:2px;background:#E2DBCF}
.wiz-step.done .wiz-num{background:var(--vert);border-color:var(--vert);color:#fff}
.wiz-step.done .wiz-lbl{color:var(--bleu)}
.wiz-step.done:not(:last-child)::after{background:var(--vert)}
.wiz-step.cur .wiz-num{background:var(--grad);border-color:transparent;color:#fff}
.wiz-step.cur .wiz-lbl{color:var(--bleu)}
.wiz-step.click{cursor:pointer}
.wiz-step.click:hover .wiz-lbl{text-decoration:underline}
.wiz-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;border-top:1px solid var(--bord);padding-top:16px}
.wiz-hint{color:var(--gris);font-size:14px}
.btn.ghost{background:#F2EDE5;color:var(--bleu);box-shadow:none}
@media(max-width:760px){.wiz-wrap{flex-direction:column}.wiz-stepper{flex:1 1 auto;width:100%}}
.dash-filters{display:flex;flex-wrap:wrap;gap:14px;background:#fff;border:1px solid var(--bord);border-radius:var(--radius);padding:16px;margin-bottom:16px;box-shadow:var(--shadow)}
.dash-filters > div{flex:1 1 180px}
.dash-filters label{margin:0 0 4px;font-size:12px;text-transform:uppercase;letter-spacing:.5px}
.cards{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.card{flex:1 1 150px;background:#fff;border:1px solid var(--bord);border-radius:var(--radius);padding:18px;text-align:center;box-shadow:var(--shadow)}
.card-val{font-family:var(--serif);font-size:32px;font-weight:800;color:var(--bleu)}
.card-lbl{color:var(--gris);font-size:13px}
.dash-two{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.dash-two .carte{flex:1 1 320px;margin:0}
.dash-table{width:100%;border-collapse:collapse;font-size:14px}
.dash-table th{text-align:left;background:#F7F3EC;color:var(--bleu);padding:9px 10px;border-bottom:2px solid var(--bord2);font-family:var(--serif);font-weight:700}
.dash-table td{padding:9px 10px;border-bottom:1px solid var(--bord)}
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:600}
.badge.ok{background:#EDF7EF;color:#2f7d4f}
.badge.wip{background:#FFF4EC;color:#B4661F}
.badge.imp{background:#EDEBFA;color:#5B3FBF}
.cpt{color:var(--gris);font-size:13px;font-weight:normal}

/* ---------- Graphiques résultats ---------- */
.chk{display:flex;align-items:center;gap:6px;font-weight:normal;font-size:14px;max-width:320px}
.chk-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1 1 auto}
.chk input{width:auto}
.bar-row{display:flex;align-items:center;gap:10px;margin:7px 0}
.bar-lab{flex:0 0 260px;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{flex:1;background:#EFEAE2;border-radius:6px;height:20px;overflow:hidden}
.bar-fill{height:100%;border-radius:6px;transform-origin:left center;animation:barGrow .55s ease-out}
@keyframes barGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.bar-mask{font-size:11px;color:#9a9a9a;padding:3px 8px}
.bar-val{flex:0 0 56px;text-align:right;font-weight:700;font-size:13px}
.bar-val .n{color:#9a9a9a;font-weight:normal;font-size:11px}
.heat-wrap{overflow-x:auto}
.heat{border-collapse:collapse;font-size:12px;margin-top:6px}
.heat th,.heat td{border:1px solid var(--bord);padding:6px;text-align:center;min-width:34px}
.heat td{animation:cellFade .5s ease-out}
@keyframes cellFade{from{opacity:0}to{opacity:1}}
.heat th.cat{text-align:left;white-space:nowrap;background:#F7F3EC;color:var(--bleu);max-width:220px;overflow:hidden;text-overflow:ellipsis}
.heat th.rot{height:130px;vertical-align:bottom;background:#fff}
.heat th.rot span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;font-weight:normal;color:var(--gris);font-size:11px}
.heat td.empty{color:#ccc;background:var(--panel)}
.legend{font-size:12px;color:var(--gris);margin-top:8px}
.legend span{display:inline-block;width:14px;height:12px;border-radius:3px;vertical-align:middle;margin:0 3px}
.mini{font-size:13px;color:var(--bleu);margin:12px 0 4px}
.dash-table td.sc{text-align:right;font-weight:700;white-space:nowrap}
.membres{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:4px;background:#F7F3EC;border:1px solid var(--bord);border-radius:var(--radius-sm);padding:11px 13px}
.membres .chk{flex:0 0 auto;font-size:13px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.grid2 label{margin-top:6px}
@media(max-width:600px){.grid2{grid-template-columns:1fr}}
.admin-steps{line-height:2}
.admin-steps a{color:var(--orange)}
.qrow{cursor:pointer}
.qrow:hover{background:var(--panel)}

/* ---------- Overlay ---------- */
.overlay{display:none;position:fixed;inset:0;background:rgba(21,41,61,.45);z-index:1000;align-items:flex-start;justify-content:center;padding:40px 16px;overflow:auto}
.overlay-box{background:#fff;border-radius:var(--radius);max-width:680px;width:100%;padding:28px 30px;position:relative;animation:zoomIn .35s ease-out;box-shadow:0 30px 70px -30px rgba(21,41,61,.6)}
@keyframes zoomIn{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
.overlay-close{position:absolute;top:8px;right:14px;background:none;border:none;font-size:28px;line-height:1;color:#999;cursor:pointer;margin:0;padding:0;z-index:2;box-shadow:none}
.overlay-close:hover{transform:none}
.overlay-box.slide-box{max-width:940px;text-align:center;padding:20px}
.overlay-box.slide-box .slide{max-height:78vh;width:auto;max-width:100%;margin:0}
.lien-revoir{background:none;border:none;color:var(--orange);text-decoration:underline;cursor:pointer;padding:0;margin:0;font:inherit;box-shadow:none}
.lien-revoir:hover{transform:none}
.slide-thumbs{display:flex;flex-wrap:wrap;gap:12px;margin:10px 0 4px}
.slide-thumb{max-height:220px;max-width:100%;border:1px solid var(--bord);border-radius:var(--radius-sm);cursor:pointer;transition:box-shadow .15s}
.slide-thumb:hover{box-shadow:0 0 0 3px #F3D6BE}
/* Fin de thématique : carte « Dans votre structure » dépliée depuis la thématique */
@keyframes foqpulse{0%{box-shadow:0 0 0 0 rgba(232,132,60,.5)}100%{box-shadow:0 0 0 12px rgba(232,132,60,0)}}
.sommaire li.cur.hl{animation:foqpulse 1s ease-out 1;border-radius:6px}
.sommaire li.has-mk{align-items:center}
.sommaire li.cur .mk-svg{display:block}
.etab-backdrop{position:fixed;inset:0;background:rgba(21,41,61,.45);opacity:0;transition:opacity .45s ease;z-index:1000;pointer-events:none}
.etab-backdrop.on{opacity:1}
.etab-panel{position:fixed;z-index:1001;width:min(75vw,calc(100vw - 32px));max-height:calc(100vh - 120px);overflow:hidden;display:flex;flex-direction:column;background:#fff;border-radius:12px;border:1px solid var(--bord2);border-left:3px solid var(--orange);box-shadow:0 26px 60px rgba(21,41,61,.34);padding:20px 24px;opacity:0;will-change:transform}
#etabContent{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;transition:opacity .3s ease}
.etab-scroll{flex:1 1 auto;min-height:0;overflow:auto}
.etab-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--orange);font-weight:700}
.etab-titre{margin:4px 0 14px;color:var(--bleu)}
.etab-els .etab-el{opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}
.etab-els.on .etab-el{opacity:1;transform:none}
.etab-els.on .etab-el:nth-child(2){transition-delay:.1s}
.etab-els.on .etab-el:nth-child(3){transition-delay:.2s}
.etab-els.on .etab-el:nth-child(n+4){transition-delay:.28s}
/* Sortie : inverse de l'entrée (le dernier part en premier) */
.etab-els.out .etab-el{opacity:0;transform:translateY(8px)}
.etab-els.out .etab-el:nth-last-child(1){transition-delay:0s}
.etab-els.out .etab-el:nth-last-child(2){transition-delay:.06s}
.etab-els.out .etab-el:nth-last-child(3){transition-delay:.12s}
.etab-els.out .etab-el:nth-last-child(n+4){transition-delay:.18s}
.etab-img{max-width:100%;height:auto;border:1px solid var(--bord);border-radius:var(--radius-sm);display:block;margin:0 auto}
.etab-carousel .etab-img{max-height:52vh;width:auto}
/* Carrousel d'images */
.etab-carousel{overflow:hidden;border-radius:var(--radius-sm)}
.etab-track{display:flex;transition:transform .4s ease}
.etab-slide{flex:0 0 100%;min-width:0;display:flex;justify-content:center;align-items:flex-start}
/* Pied : compteur + navigation + bouton continuer */
.etab-foot{display:flex;align-items:center;gap:12px;flex:0 0 auto;margin-top:12px;padding-top:12px;border-top:1px solid var(--bord);background:#fff;opacity:0;transition:opacity .35s ease}
.etab-foot .btn,.etab-foot .btn-secondaire{margin:0}
#etabCount{font-size:13px;color:var(--gris);margin-right:auto}

/* ---------- Grille évaluation ---------- */
.eval-q{border:1px solid var(--bord);border-radius:var(--radius-sm);padding:13px 15px;margin:10px 0}
.eval-q.manque{border-color:#d9534f;box-shadow:0 0 0 2px rgba(217,83,79,.18)}
/* Sélecteur d'étiquettes de ciblage (éléments spécifiques admin) */
.cib-grid{display:flex;flex-wrap:wrap;gap:12px;margin:6px 0 4px}
.cib-axe{border:1px solid var(--bord2);border-radius:8px;padding:8px 12px;min-width:180px}
.cib-axe legend{font-size:12px;font-weight:700;color:var(--gris);text-transform:uppercase;letter-spacing:.4px;padding:0 4px}
.cib-opt{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--bleu);padding:3px 0;cursor:pointer}
.cib-opt input{margin:0;accent-color:var(--orange)}
/* Éléments spécifiques regroupés par thématique */
.fb-grp{margin:0 0 14px}
.fb-head{display:flex;align-items:center;gap:10px;background:#FBF3EC;border-left:3px solid var(--orange);border-radius:0 8px 8px 0;padding:9px 14px}
.fb-num{background:var(--bleu);color:#fff;font-size:12px;font-weight:700;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.fb-gt{color:var(--bleu);font-weight:700}
.fb-gc{margin-left:auto;color:#9a531e;font-size:12px;font-weight:600}
.fb-el{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 26px;border-bottom:1px solid #F1ECE4}
.fb-typ{flex:0 0 auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;border-radius:5px;padding:3px 8px;width:52px;text-align:center}
.fb-typ.txt{background:#E9F0F7;color:var(--bleu)}
.fb-typ.img{background:#EAF3EE;color:#2F6B46}
.fb-body{flex:1;min-width:0;color:var(--bleu);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fb-thumb{max-height:34px;border:1px solid var(--bord2);border-radius:5px;vertical-align:middle}
.fb-cibs{flex:0 0 auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:280px}
.fb-cib{font-size:12px;font-weight:600;border-radius:999px;padding:4px 12px;white-space:nowrap}
.fb-cib.all{background:#F1EFEA;color:#7a7266}
.fb-cib.on{background:#FCEFE2;color:#9a531e}
/* Échelle d'évaluation (sondage / positionnement, parcours participant) :
   Liste verticale (au lieu d'une grille de cartes qui s'etirait bizarrement des
   qu'une reponse restait seule sur la derniere ligne) : une reponse par ligne,
   pleine largeur, meme style quel que soit le nombre de propositions (3 comme 8) --
   coherent avec le style des choix QCM (.choix) plus lisible pour les reponses
   a texte long (ex. "Je connais plusieurs actions... et je pourrais en parler"). */
.eval-scale{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.eval-seg{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--bord);background:var(--panel);border-radius:var(--radius-sm);padding:13px 14px;cursor:pointer;color:#1f2430;font-size:15px;text-align:left;transition:border-color .12s,background .12s}
.eval-seg:hover{border-color:var(--orange);background:#fff}
.eval-seg input{margin-top:3px;accent-color:var(--orange)}
.eval-seg span{flex:1}
.eval-seg.sel{border-color:var(--orange);background:#FCEFE2}
.eval-enonce{font-weight:700;color:var(--bleu);margin:0 0 8px}
.eval-opts{display:flex;flex-wrap:wrap;gap:8px 16px}
.eval-opt{font-weight:normal;background:var(--panel);border:1px solid var(--bord);border-radius:10px;padding:8px 12px;margin:0;cursor:pointer}
.eval-opt input{width:auto;margin-right:6px}
.eval-stat{margin:14px 0}
.eval-stat .eval-enonce{margin-bottom:5px}
.evbar{display:flex;height:24px;border-radius:8px;overflow:hidden;border:1px solid var(--bord)}
.evseg{container-type:inline-size;color:#fff;font-size:11px;line-height:24px;text-align:center;min-width:0;overflow:hidden}
/* Le pourcentage s'affiche des que le segment est physiquement assez large.
   Seuil en PIXELS (largeur reelle du segment), pas en pourcentage : un meme
   pourcentage ne fait pas la meme largeur sur un ecran de 1060px et sur un
   telephone. Sous ~23px le chiffre ne rentre pas, on le masque. */
@container (max-width:23px){ .evseg span{display:none} }
.evleg{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:5px;font-size:12px;color:var(--gris)}
.evleg i{display:inline-block;width:11px;height:11px;border-radius:2px;vertical-align:middle;margin-right:4px}
.evleg b{color:var(--bleu);font-weight:700}
.evn{font-size:12px;color:#9a9a9a;margin-top:2px}

/* ---------- Synthèse décideur ---------- */
.card-unit{font-size:15px;font-weight:normal;color:var(--gris)}
.card-val.card-txt{font-family:var(--sans,inherit);font-size:17px;font-weight:700;line-height:1.25}
.bar-track{position:relative}
.bar-ref{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--bleu);z-index:2}
.disp-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:0 0 auto;margin-left:2px}
.legend .disp-dot{margin:0 3px 0 8px}
.delta{font-size:12px;font-weight:700;margin-left:6px}
.delta.pos{color:var(--vert,#5c9e5c)}
.delta.neg{color:#d9534f}
.delta.neu{color:#9a9a9a}
.tree-row{display:flex;align-items:center;gap:8px;padding:6px 4px;border-top:1px solid var(--bord);font-size:13px}
.tree-row:first-child{border-top:none}
.tree-lab{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tree-lab.racine{font-weight:700;color:var(--bleu)}
.tree-sc{font-weight:700}
.tree-mask{font-size:11px;color:#9a9a9a}
.div-row{display:flex;align-items:center;gap:10px;margin:7px 0}
.div-lab{flex:0 0 130px;font-size:13px}
.div-track{position:relative;flex:1;height:18px;background:#F7F3EC;border-radius:6px}
.div-axis{position:absolute;left:50%;top:-2px;bottom:-2px;width:1px;background:#c9c0b2}
.div-bar{position:absolute;top:3px;bottom:3px;border-radius:3px}
.div-val{flex:0 0 46px;text-align:right;font-weight:700;font-size:13px}
/* ---------- Leviers de progrès ---------- */
.seg{height:20px;border-radius:6px;overflow:hidden;display:flex;flex:1}
.tag{font-size:12px;padding:3px 10px;border-radius:20px;font-weight:700;white-space:nowrap}
.lmeta{flex:0 0 190px;text-align:right;font-size:12px;color:var(--gris)}
.callout{flex:1 1 300px;font-size:13px;padding:9px 13px;border-radius:11px}
.callout strong{font-weight:700}
.callout-c{background:#FBE4DE;color:#993c1d}
.callout-o{background:#E6F1FB;color:#185fa5}
/* Bouton stylé en lien (actions sensibles rendues en POST tokenisé) */
.linklike{background:none;border:0;padding:0;margin:0;font:inherit;color:var(--bleu);text-decoration:underline;cursor:pointer}
.linklike:hover{color:var(--orange)}

/* ---------- Décideur : distinction évaluation du parcours / questions de sondage ---------- */
.groupe-decideur{margin:26px 0 10px}
.groupe-decideur:first-of-type{margin-top:0}
.groupe-titre{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-family:var(--serif);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.6px;color:var(--gris)}
.groupe-titre i{width:9px;height:9px;border-radius:50%;flex:none}
.groupe-titre.groupe-parcours i{background:var(--bleu)}
.groupe-titre.groupe-sondage i{background:var(--vert)}
.groupe-titre::after{content:"";flex:1 1 auto;height:1px;background:var(--bord)}

/* --- Térega : question ouverte (texte libre) --- ajouté, absent de FOQUAL V2 --- */
.ouverte-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ouverte-actions .btn-secondaire{margin-top:18px}
.ouverte-q{border-top:1px solid var(--bord);padding:14px 0}
.ouverte-q:first-child{border-top:none;padding-top:0}
.ouverte-liste{list-style:none;margin:8px 0 0;padding:0}
.ouverte-liste li{background:var(--panel);border:1px solid var(--bord);border-radius:var(--radius-sm);padding:11px 13px;margin:7px 0;font-size:14px;line-height:1.5}
