/* Compléments pour l’application réelle (défilement, formulaires, composants interactifs) */
@font-face{font-family:'PlexMono';font-weight:400;src:url('../fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2')}
a{color:inherit;text-decoration:none}
a.lien,.lien{color:#0A7C76;font-weight:500}
a.lien:hover{text-decoration:underline}
button{font-family:inherit;cursor:pointer}
.app{height:100vh}
.side{overflow:hidden}
.nav{overflow-y:auto;flex:1;margin:0 -4px;padding:0 4px;scrollbar-width:thin;scrollbar-color:#2A4170 transparent}
.nav a:hover{background:rgba(255,255,255,.05);color:#fff}
.content{overflow-y:auto;overflow-x:hidden}
.content.etroit{max-width:1180px}
.etab select{background:transparent;border:none;color:#E6ECF5;font:inherit;flex:1;outline:none;cursor:pointer}
.etab select option{color:#18212F}
.gsearch input{border:none;background:transparent;outline:none;font:inherit;color:#18212F;flex:1;min-width:0}
.gsearch:focus-within{border-color:#0A7C76;background:#fff;box-shadow:0 0 0 3px #E2F1EF}
.ibtn:hover{background:#F2F4F7}
.btn{cursor:pointer;line-height:1.2;text-decoration:none}
.btn:hover{border-color:#B8C3D1}
.btn.p:hover{background:#086862;border-color:#086862}
.btn.n:hover{background:#1C2F55}
.btn:disabled,.btn.dis{opacity:.55;cursor:not-allowed}
.btn.lune{background:#E9B949;border-color:#E9B949;color:#13223F}
.ico-btn{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:7px;color:#5D6878;border:1px solid transparent;background:transparent}
.ico-btn:hover{background:#F2F4F7;border-color:#DDE3EA}

/* ----- champs réels ----- */
.inp{height:40px;border:1px solid #CBD3DD;border-radius:10px;background:#fff;padding:0 12px;color:#18212F;font:inherit;font-size:13.5px;width:100%;outline:none;transition:border-color .12s,box-shadow .12s}
textarea.inp{height:auto;padding:10px 12px;line-height:1.45;resize:vertical}
select.inp{padding-right:28px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235D6878' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center}
select[multiple].inp{height:auto;min-height:90px;background-image:none;padding:6px}
.inp:focus{border-color:#0A7C76;box-shadow:0 0 0 3px #E2F1EF}
.inp[readonly],.inp:disabled{background:#F2F4F7;color:#5D6878}
.f.err .inp,.inp.err{border-color:#C03A2B;box-shadow:0 0 0 3px #FBE5E2}
.f.ok .inp{border-color:#9FD0BA}
.f .e{font-size:11.5px;color:#C03A2B}
.f .unite{position:relative}
.f .unite .inp{padding-right:52px}
.f .unite span{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:#5D6878;font-size:12px;pointer-events:none}
input[type=checkbox],input[type=radio]{accent-color:#0A7C76;width:16px;height:16px;flex:none}
.case{display:flex;align-items:center;gap:8px;font-size:12.5px;cursor:pointer}
.choix{display:flex;flex-wrap:wrap;gap:8px 18px}
.choix label{display:flex;align-items:center;gap:7px;font-size:12.5px;cursor:pointer}
.seg-radio{display:inline-flex;border:1px solid #CBD3DD;border-radius:8px;overflow:hidden;background:#fff}
.seg-radio label{padding:7px 12px;font-size:12.5px;border-right:1px solid #DDE3EA;cursor:pointer;display:flex;align-items:center;gap:6px}
.seg-radio label:last-child{border-right:none}
.seg-radio input{display:none}
.seg-radio label:has(input:checked){background:#13223F;color:#fff;font-weight:500}
.form-grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
.span2{grid-column:span 2}.span3{grid-column:span 3}.spanall{grid-column:1/-1}
.errorlist{list-style:none;color:#C03A2B;font-size:12px}
.form-erreurs{background:#FBE5E2;border:1px solid #F0C3BD;color:#7D2219;border-radius:9px;padding:10px 12px;font-size:12.5px}

/* ----- bloc de date de l’acte ----- */
.date-acte{border:1.5px solid #BFE0DB;background:#F3FAF9;border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.date-acte .opt{display:flex;gap:10px;align-items:flex-start;border:1.5px solid #DDE3EA;background:#fff;border-radius:11px;padding:10px 12px;cursor:pointer}
.date-acte .opt:has(input:checked){border-color:#0A7C76;box-shadow:0 0 0 3px #E2F1EF}
.date-acte .opt b{display:block;font-weight:600;color:#13223F}
.date-acte .opt small{color:#5D6878}
.date-acte .conf{display:flex;align-items:center;gap:8px;font-weight:500;font-size:12.5px;color:#13223F}

/* ----- tableaux ----- */
table.t tbody tr:hover td{background:#FAFBFC}
table.t tbody tr.cliquable{cursor:pointer}
table.t.compact th{padding:7px 10px}
table.t.compact td{padding:6px 10px}
.table-wrap{overflow-x:auto}
.vide{padding:28px;text-align:center;color:#8A94A3;font-size:13px}
.vide .ic{width:30px!important;height:30px!important;margin-bottom:6px;color:#AEB8C5}
.pagination{display:flex;align-items:center;gap:12px;justify-content:flex-end;padding:12px 16px;font-size:12.5px;color:#5D6878;border-top:1px solid #EEF1F5;background:#FAFBFC;border-radius:0 0 14px 14px;flex-wrap:wrap}
.pagination .pg-info{margin-right:auto}.pagination .pg-info b{color:#13223F;font-weight:600}
.pagination .pg-taille .inp{height:32px;font-size:12px;width:auto;padding:0 26px 0 8px}
.pg-nav{display:flex;gap:3px;align-items:center}
.pg{min-width:32px;height:32px;padding:0 9px;border-radius:9px;border:1px solid #DDE3EA;background:#fff;color:#18212F;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:500;text-decoration:none}
a.pg:hover{border-color:#0A7C76;color:#0A7C76}
.pg.on{background:#0A7C76;border-color:#0A7C76;color:#fff;font-weight:600}
.pg.dis{opacity:.4}.pg.gap{border:0;background:none;min-width:16px;padding:0}
.barre-filtres{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.barre-filtres .inp{width:auto;min-width:150px}
.recherche{position:relative;min-width:240px}
.recherche .ic{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:#8A94A3}
.recherche .inp{padding-left:32px}

/* ----- messages ----- */
.messages{position:fixed;top:76px;right:24px;z-index:60;display:flex;flex-direction:column;gap:8px;max-width:420px}
.messages .al{box-shadow:0 8px 24px rgba(19,34,63,.15);animation:glisse .25s ease-out}
@keyframes glisse{from{transform:translateY(-6px);opacity:0}to{transform:none;opacity:1}}

/* ----- fenêtres, menus ----- */
.modal-fond{position:fixed;inset:0;background:rgba(15,25,45,.45);z-index:70;display:grid;place-items:center;padding:20px}
.modal{background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.3);width:min(560px,100%);max-height:90vh;overflow:auto}
.modal .hd{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid #EDF0F4}
.modal .hd h3{font-size:15px;font-weight:600;color:#13223F}
.modal .bd{padding:16px 18px}
.modal .ft{display:flex;gap:8px;justify-content:flex-end;padding:12px 18px;border-top:1px solid #EDF0F4}
.menu{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid #E4E8EE;border-radius:12px;box-shadow:0 12px 30px rgba(19,34,63,.15);min-width:220px;z-index:50;padding:6px}
.menu a,.menu button{display:flex;gap:8px;align-items:center;padding:7px 10px;border-radius:7px;font-size:12.5px;width:100%;background:none;border:none;text-align:left;color:#18212F}
.menu a:hover,.menu button:hover{background:#F2F4F7}
[x-cloak]{display:none!important}

/* ----- bandeau patient : la nuit, et le parcours qui la traverse ----- */
.bandeau{background:linear-gradient(135deg,#13223F 0%,#1C2F55 100%);color:#fff;border:none;border-radius:16px;padding:20px 24px;position:relative;overflow:hidden;box-shadow:0 12px 30px -16px rgba(19,34,63,.5)}
.bandeau::after{content:'';position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(233,185,73,.16),transparent 65%);pointer-events:none}
.bandeau .av{width:50px;height:50px;font-size:17px;background:rgba(255,255,255,.08);color:#E9B949}
.bandeau b,.bandeau h1,.bandeau h2{color:#fff}
.bandeau .muted,.bandeau small,.bandeau .pale{color:#B8C4D9}
.bandeau .chip.neu{background:rgba(255,255,255,.1);color:#D8E0EE}
.bandeau .btn:not(.p):not(.n):not(.lune){background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff}
.bandeau .lien,.bandeau a.lien{color:#7FD6CE}
.frise{display:flex;align-items:flex-start;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.frise .et{flex:1;text-align:center;position:relative;font-size:11.5px;color:#8C9BB5}
.frise .et::before{content:'';position:absolute;top:7px;left:-50%;right:50%;height:2px;background:#0A7C76}
.frise .et:first-child::before{display:none}
.frise .et.fut::before{background:#2A3E66}
.frise .et i{display:block;width:16px;height:16px;border-radius:50%;background:#0A7C76;margin:0 auto 6px;position:relative;z-index:1}
.frise .et.fut i{background:transparent;border:2px solid #2A3E66}
.frise .et.cur i{background:#E9B949;box-shadow:0 0 0 5px rgba(233,185,73,.2)}
.frise .et b{display:block;color:#D8E0EE;font-weight:500}
.frise .et.cur b{color:#E9B949;font-weight:600}
.frise .et.fut b{color:#6F82A5}

/* ----- onglets cliquables ----- */
.tabs a{white-space:nowrap;padding:10px 14px;color:#5D6878;font-weight:500;border-bottom:2.5px solid transparent;margin-bottom:-1px;display:flex;gap:6px;align-items:center}
.tabs a:hover{color:#13223F}
.tabs a.on{color:#13223F;font-weight:600;border-color:#0A7C76}
.tabs{flex-wrap:wrap;row-gap:0;overflow:visible}

/* ----- tuiles d’indicateurs ----- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}
.kpi .v{white-space:nowrap}
.kpi a{display:block}
.graph{width:100%;height:220px}
.graph.h160{height:160px}.graph.h260{height:260px}.graph.h300{height:300px}.graph.h340{height:340px}
.grille{display:grid;gap:16px}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-12{grid-template-columns:1.2fr 1fr}.g-21{grid-template-columns:2fr 1fr}.g-31{grid-template-columns:minmax(0,1fr) 340px}
.carte-lien{display:block;transition:box-shadow .15s,border-color .15s}
.carte-lien:hover{border-color:#B8C3D1;box-shadow:0 8px 22px -8px rgba(19,34,63,.18)}
.barre{height:8px;border-radius:5px;background:#EDF0F4;overflow:hidden}
.barre i{display:block;height:100%;border-radius:5px;background:#0A7C76}
.lt{display:inline-grid;place-items:center;min-width:26px;height:22px;padding:0 6px;border-radius:6px;font-weight:600;font-size:12px}
.lt.M{background:#FBE5E2;color:#C03A2B}.lt.B{background:#E3F3EA;color:#1F8A5B}.lt.E{background:#E2F1EF;color:#0A7C76}.lt.A{background:#E3F3EA;color:#1F8A5B}.lt.NA{background:#FCEFD9;color:#B86E00}
.code{font-family:'PlexMono',ui-monospace,Menlo,Consolas,monospace}
textarea.sql{font-family:'PlexMono',ui-monospace,Menlo,Consolas,monospace;background:#0F1B33;color:#D8E1F0;border-radius:10px;border:1px solid #0F1B33;padding:12px 14px;font-size:13px;line-height:1.6;width:100%;min-height:220px;outline:none}
.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:10px;font-size:12px;font-weight:500;border:1px solid #DDE3EA;background:#fff;white-space:nowrap}
.sev{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600}
.sev i{width:8px;height:8px;border-radius:2px;display:inline-block}
.sev.bloquante{color:#C03A2B}.sev.bloquante i{background:#C03A2B}
.sev.majeure{color:#B86E00}.sev.majeure i{background:#B86E00}
.sev.mineure{color:#3D4FA3}.sev.mineure i{background:#3D4FA3}

/* ----- connexion et pages publiques ----- */
.login{display:grid;grid-template-columns:1fr 520px;min-height:100vh}
.login .gauche{background:linear-gradient(180deg,#0D1830 0%,#13223F 50%,#1C2F55 100%);color:#fff;padding:48px 56px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.login .droite{background:#fff;display:flex;flex-direction:column;justify-content:center;padding:48px 64px}
.public{min-height:100vh;background:#F2F4F7;display:flex;flex-direction:column;align-items:center;padding:24px 16px}
.public .boite{width:min(640px,100%);background:#fff;border:1px solid #E4E8EE;border-radius:20px;box-shadow:0 20px 50px -24px rgba(19,34,63,.3);overflow:hidden}
.public .entete{background:linear-gradient(135deg,#13223F,#1C2F55);color:#fff;padding:18px 22px;display:flex;align-items:center;gap:12px}

/* ----- visite guidée ----- */
.tour-fond{position:fixed;inset:0;background:rgba(10,18,35,.55);z-index:80}
.tour-bulle{position:fixed;z-index:81;background:#fff;border-radius:16px;padding:16px 18px;width:320px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.tour-cible{position:relative;z-index:81;box-shadow:0 0 0 3px #E9B949,0 0 0 9999px rgba(10,18,35,.55);border-radius:8px}

/* ----- impression ----- */
@media print{
  .side,.top,.actbar,.no-print,.messages{display:none!important}
  .app{display:block;height:auto}
  .main{overflow:visible}
  .content{overflow:visible;padding:0}
  body{background:#fff}
  .feuille{box-shadow:none!important;margin:0!important;width:auto!important}
}
.feuille{background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.18);padding:28px 32px;color:#222;font-size:12px;line-height:1.5}
.zone-apercu{background:#5B6577;border-radius:12px;padding:22px;display:flex;justify-content:center}
@media (max-width:1100px){.g-31,.g-21,.g-12,.g-3{grid-template-columns:1fr}.g4{grid-template-columns:repeat(2,1fr)}.login{grid-template-columns:1fr}.login .gauche{display:none}}
.yn{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:20px;font-size:12px;font-weight:500;border:1px solid #DDE3EA;color:#5D6878;background:#fff}
.yn.on{background:#13223F!important;border-color:#13223F!important;color:#fff!important}
@media print{.zone-apercu{background:none!important;padding:0!important}}

/* ===================== Défilement et mise en page adaptative ===================== */
/* Les blocs d’une page ne se compriment jamais : c’est la zone de contenu qui défile. */
.content>*{flex-shrink:0}
.content{scroll-behavior:smooth;overscroll-behavior:contain}
/* Les colonnes de grilles peuvent rétrécir : un tableau large défile dans son panneau au lieu d’élargir la page. */
.grille>*,.grid>*,.kpis>*,.g4>*{min-width:0}
/* Panneaux contenant un tableau : défilement horizontal interne, coins arrondis conservés. */
.pan-t{overflow-x:auto;overflow-y:hidden}
.pan-t>table.t,.table-wrap>table.t{min-width:640px}
.pan-t>table.t th,.table-wrap>table.t th{white-space:nowrap}
/* En-tête de page et barres d’actions : retour à la ligne plutôt que débordement. */
.ph{flex-wrap:wrap;row-gap:10px}.ph .acts{flex-wrap:wrap;justify-content:flex-end}
.barre-filtres{flex-wrap:wrap}
.actbar{flex-wrap:wrap}
/* Barres de défilement visibles et discrètes, identiques partout */
.content,.pan-t,.table-wrap,.st-res,.ag-corps,.nav,pre,textarea,.menu{scrollbar-width:thin;scrollbar-color:#B8C3D1 transparent}
.content::-webkit-scrollbar,.pan-t::-webkit-scrollbar,.table-wrap::-webkit-scrollbar,.st-res::-webkit-scrollbar,.ag-corps::-webkit-scrollbar,pre::-webkit-scrollbar,textarea::-webkit-scrollbar{width:10px;height:10px}
.content::-webkit-scrollbar-thumb,.pan-t::-webkit-scrollbar-thumb,.table-wrap::-webkit-scrollbar-thumb,.st-res::-webkit-scrollbar-thumb,.ag-corps::-webkit-scrollbar-thumb,pre::-webkit-scrollbar-thumb,textarea::-webkit-scrollbar-thumb{background:#C3CCD8;border-radius:8px;border:2px solid #F2F4F7}
.content::-webkit-scrollbar-thumb:hover,.pan-t::-webkit-scrollbar-thumb:hover,.table-wrap::-webkit-scrollbar-thumb:hover,.st-res::-webkit-scrollbar-thumb:hover,.ag-corps::-webkit-scrollbar-thumb:hover{background:#9AA6B6}
.content::-webkit-scrollbar-track,.pan-t::-webkit-scrollbar-track,.table-wrap::-webkit-scrollbar-track{background:transparent}
.nav::-webkit-scrollbar{width:6px}.nav::-webkit-scrollbar-thumb{background:#2A4170;border-radius:6px}
/* Écrans moyens (portable, fenêtre réduite) */
@media (max-width:1280px){
  .content{padding:16px 18px}
  .content .kpis{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))!important}
  .g-31{grid-template-columns:minmax(0,1fr) 300px}
}
table.t td.code{white-space:nowrap}
@media (max-width:1100px){
  .content .grille{grid-template-columns:minmax(0,1fr)!important}
  .content>div[style*="grid-template-columns"]:not(.ag):not(.kpis),.content>form[style*="grid-template-columns"]{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important}
  .content>div[style*="grid-template-columns"]>*{min-width:0}
  .content .grille>*{position:static!important}
  .gsearch kbd,.top .net{display:none}
}
/* Petits écrans : menu latéral réduit aux icônes */
@media (max-width:900px){
  .app{grid-template-columns:64px minmax(0,1fr)}
  .side{padding:12px 8px}
  .side .brand div,.side .etab,.navg,.nav a span,.side .foot div:not(.av){display:none}
  .nav a{justify-content:center;padding:8px 0}.nav a.on::before{left:-8px}
  .nav a .cnt{position:absolute;top:2px;right:4px;margin:0;font-size:9px;padding:0 4px}
  .top{padding:0 12px;gap:8px}.top .crumb{display:none}.gsearch{flex:1}
  .content{padding:12px}
  .content .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
/* questionnaires : états de réponse, logique et scores en direct */
.q-bloc{padding:12px 0;border-bottom:1px solid #EDF0F4}
.q-bloc[hidden]{display:none}
.q-lib{font-size:13px;font-weight:500;line-height:1.4}
.q-etats{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.q-etat{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:#5D6878;border:1px dashed #CBD3DD;border-radius:999px;padding:3px 10px;cursor:pointer;align-self:flex-start;font-weight:500}
.q-etat input{accent-color:#B86E00;margin:0}
.q-etat:has(input:checked){border-style:solid;border-color:#E9B949;background:#FFF7E0;color:#7A4B00}
.q-nsp{color:#5D6878;font-style:italic}
.q-inconnue .q-champ{opacity:.4;pointer-events:none}
.q-echelle{flex-wrap:wrap}
.score-live{display:flex;align-items:center;gap:12px;margin-top:12px;padding:10px 14px;border-radius:12px;background:#EEF6F5;border:1px solid #CFE6E3;font-size:12.5px;color:#13223F}
.score-live b{font-size:16px;font-family:'PlexMono',ui-monospace,monospace;color:#0A7C76}
.score-live span{color:#5D6878}
@media (max-width:640px){
  .q-echelle{display:flex;flex-direction:column;width:100%}
  .q-echelle label{border-right:none;border-bottom:1px solid #E4E8EE;padding:9px 12px}
  .q-echelle label:last-child{border-bottom:none}
}