/* Elevora CRM — css/audit.css  [V35] 13/10/2026 (document 2 de Célian, §23 « Outil d'audit du prospect »)
   L'écran plein de l'audit : un questionnaire en 9 parties (rail des parties à gauche, une partie à la fois, questions courtes), puis la
   restitution chiffrée, présentable au prospect et imprimable. Script : js/54d-audit.js.

   Parti pris visuel : un document de travail posé sur un fond calme, pas un tableau de bord. Des filets fins plutôt que des cartes,
   des chiffres en grand parce que ce sont eux que le prospect regarde, une seule couleur d'action (le bleu Klein du CRM) et le point
   framboise réservé au centre de l'horloge du chargement. Aucun dégradé décoratif, aucune ombre portée, aucun halo : le seul dégradé
   est le remplissage d'un curseur (il montre la valeur). Couleurs en jetons seulement (contraste mesuré dans les deux thèmes), texte
   jamais sous --fs-min. Le mouvement (GSAP, js/54d) ne touche que transform et opacity ; sans lui, tout est affiché et complet. */

.ov.audit-ov{background:var(--bg);backdrop-filter:none;align-items:stretch;justify-content:stretch;z-index:300}
.audit-fen{display:grid;grid-template-rows:auto auto minmax(0,1fr);width:100%;height:100%;min-width:0;background:var(--bg);color:var(--text)}
.audit-haut{display:flex;align-items:center;gap:var(--s4);padding:12px clamp(16px,3vw,32px);background:var(--bg2);border-bottom:1px solid var(--border)}
.audit-haut-t{min-width:0;flex:1}
.audit-titre{font-family:var(--font-display);font-size:18px;font-weight:700;line-height:1.25;overflow-wrap:anywhere}
.audit-sous{font-size:var(--fs-min);color:var(--text2);margin-top:2px}
.audit-etat{font-size:var(--fs-min);color:var(--text2);white-space:nowrap}
.audit-etat[data-ko="1"]{color:var(--red);font-weight:500}
.audit-progres{height:3px;background:var(--bg3);overflow:hidden}
.audit-progres-barre{display:block;height:100%;width:100%;background:var(--accent-fill);transform-origin:0 50%;transform:scaleX(var(--p,0))}
.audit-corps{display:grid;grid-template-columns:272px minmax(0,1fr);min-height:0}
.audit-corps.audit-sans-rail{grid-template-columns:minmax(0,1fr)}
.audit-rail{background:var(--bg2);border-right:1px solid var(--border);padding:20px 12px 24px;overflow-y:auto;min-height:0}
.audit-rail-t{font-size:var(--fs-min);color:var(--text2);text-transform:uppercase;letter-spacing:.08em;padding:0 10px 10px}
.audit-etapes{list-style:none;display:flex;flex-direction:column;gap:2px}
.audit-etape{display:flex;align-items:center;gap:12px;width:100%;padding:9px 10px;border:0;border-radius:var(--r);background:transparent;color:var(--text2);font:inherit;text-align:left;cursor:pointer;min-height:44px;transition:background-color .14s,color .14s}
.audit-etape:hover{background:var(--bg3);color:var(--text)}
.audit-etape[aria-current="step"]{background:var(--blue-bg);color:var(--text)}
.audit-etape[aria-current="step"] .audit-etape-n{background:var(--accent-fill);border-color:var(--accent-fill);color:var(--on-fill)}
.audit-etape-n{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--border-input);font-size:var(--fs-min);font-weight:700;font-variant-numeric:tabular-nums;color:var(--text2)}
.audit-etape[data-fait="1"] .audit-etape-n{border-color:var(--accent);color:var(--accent)}
.audit-etape-n svg{display:block}
.audit-etape-txt{min-width:0;display:flex;flex-direction:column;line-height:1.3}
.audit-etape-t{font-size:14px;font-weight:500;overflow-wrap:anywhere}
.audit-etape-s{font-size:var(--fs-min);color:var(--text2);display:flex;align-items:center;gap:6px}
.audit-etape-s[data-s="echec"],.audit-etape-s[data-s="perimee"]{color:var(--red)}
.audit-mini{flex:none;width:14px;height:14px;display:inline-block;color:var(--accent)}
.audit-mini svg{display:block;width:100%;height:100%}
.audit-mini .au-aig{transform-origin:12px 12px;animation:au-tour 2.4s linear infinite}
@keyframes au-tour{to{transform:rotate(360deg)}}

.audit-scene{overflow-y:auto;min-height:0;padding:clamp(24px,5vh,56px) clamp(16px,5vw,80px) 0}
.audit-feuille-partie{max-width:760px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}
.audit-part-n{font-family:var(--font-display);font-size:var(--fs-min);font-weight:700;color:var(--text2);letter-spacing:.1em;text-transform:uppercase}
.audit-part-t{font-family:var(--font-display);font-size:clamp(26px,3.6vw,38px);font-weight:700;line-height:1.15;margin:6px 0 8px;letter-spacing:-.01em;overflow-wrap:anywhere}
.audit-part-intro{color:var(--text2);font-size:15px;max-width:60ch;margin-bottom:8px}
.aq{border:0;border-top:1px solid var(--border);padding:22px 0 20px;display:grid;gap:14px;min-width:0}
.aq:first-of-type{margin-top:20px}
.aq-l{font-size:17px;font-weight:600;line-height:1.35;padding:0;float:left;width:100%;margin-bottom:-2px;overflow-wrap:anywhere}
.aq-l+*{clear:both}
.aq-aide{font-size:var(--fs-min);color:var(--text2);margin-top:-6px}
.aq-err{font-size:var(--fs-min);color:var(--red);min-height:0}
.aq-err:empty{display:none}
.aq .fi{width:100%;max-width:100%;font-size:15px}
.aq textarea.fi{min-height:92px;resize:vertical;line-height:1.5}
.aq-champs{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:flex-end}
.aq-champ{display:flex;flex-direction:column;gap:6px;min-width:0}
.aq-champ-l{font-size:var(--fs-min);color:var(--text2)}
.aq-nombre{width:112px !important;font-variant-numeric:tabular-nums;font-size:18px !important;font-weight:600}
.aq-unite{font-size:14px;color:var(--text2);align-self:center;padding-top:20px}
.aq-choix{display:flex;flex-wrap:wrap;gap:8px}
.aq-tuile{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:9px 16px;border:1.5px solid var(--border-input);border-radius:var(--r);background:var(--bg2);color:var(--text);font-size:15px;cursor:pointer;user-select:none;transition:border-color .14s,background-color .14s}
.aq-tuile:hover{border-color:var(--accent)}
.aq-tuile input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.aq-tuile svg{flex:none;width:16px;height:16px;color:var(--accent);opacity:0;transform:scale(.4)}
.aq-tuile:has(input:checked){border-color:var(--accent);background:var(--blue-bg);font-weight:600}
.aq-tuile:has(input:checked) svg{opacity:1;transform:scale(1)}
.aq-tuile:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.aq-curseur{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 16px}
.aq-curseur-l{grid-column:1 / -1;font-size:var(--fs-min);color:var(--text2)}
.aq-valeur{font-variant-numeric:tabular-nums;font-size:22px;font-weight:700;min-width:5.2ch;text-align:right;transform-origin:100% 50%}
.aq-valeur small{font-size:var(--fs-min);font-weight:500;color:var(--text2);margin-left:3px}
.aq-curseur input[type=range]{--pct:0%;-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;margin:0;cursor:pointer}
.aq-curseur input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(to right,var(--accent-fill) var(--pct),var(--bg4) var(--pct))}
.aq-curseur input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:var(--bg4)}
.aq-curseur input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--accent-fill)}
.aq-curseur input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;margin-top:-10px;border-radius:50%;background:var(--bg2);border:2px solid var(--accent-fill)}
.aq-curseur input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--bg2);border:2px solid var(--accent-fill)}
.aq-curseur input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.aq-total{font-size:14px;color:var(--text2);font-variant-numeric:tabular-nums}
.aq-total b{color:var(--text);font-weight:600}
.aq-facultatif{font-size:var(--fs-min);color:var(--text2)}

.audit-nav{position:sticky;bottom:0;margin-top:auto;display:flex;align-items:center;gap:var(--s3);padding:14px 0 16px;background:var(--bg);border-top:1px solid var(--border)}
.audit-nav .audit-nav-espace{flex:1}
.audit-nav .btn{min-height:var(--cmd-h,36px)}
.audit-analyse{margin:6px 0 18px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r);background:var(--bg2);font-size:14px;color:var(--text2)}
.audit-analyse b{display:block;color:var(--text);font-size:var(--fs-min);letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}
.audit-analyse ul{list-style:none;margin-top:6px;display:grid;gap:3px}
.audit-lecture{margin:0 0 18px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--r);background:var(--bg2);font-size:14px;color:var(--text2)}
.audit-bandeau{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 auto 18px;max-width:1040px;padding:12px 16px;border:1px solid var(--amber);border-radius:var(--r);background:var(--amber-bg);font-size:14px;color:var(--text)}
.audit-bandeau .audit-bandeau-t{flex:1;min-width:220px}

/* ── Les parties : lecture d'un prospect devenu client, et message d'attente ── */
.audit-vide{max-width:560px;margin:12vh auto 0;text-align:center;color:var(--text2);font-size:15px}
.audit-vide h2{font-family:var(--font-display);font-size:22px;color:var(--text);margin-bottom:8px}

/* ── La restitution ── */
.ar{max-width:1040px;margin:0 auto;padding-bottom:48px}
.ar-barre-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:18px}
.ar-barre-actions .audit-nav-espace{flex:1}
.ar-feuille{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rl);padding:clamp(20px,4vw,44px)}
.ar-entete{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.ar-marque{font-family:var(--font-display);font-size:var(--fs-min);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.ar-titre{font-family:var(--font-display);font-size:clamp(24px,3.2vw,34px);font-weight:700;line-height:1.15;margin-top:6px;letter-spacing:-.01em;overflow-wrap:anywhere}
.ar-meta{font-size:14px;color:var(--text2);text-align:right}
.ar-total{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:8px 32px;align-items:end;padding:28px 0 24px;border-bottom:1px solid var(--border)}
.ar-total-n{font-family:var(--font-display);font-size:clamp(52px,9vw,96px);font-weight:900;line-height:.95;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--accent)}
.ar-total-n small{font-size:.38em;font-weight:700;letter-spacing:0;margin-left:.2em}
.ar-total-l{font-size:17px;font-weight:600;max-width:34ch}
.ar-total-s{font-size:14px;color:var(--text2);margin-top:4px;font-variant-numeric:tabular-nums}
.ar-total-regle{display:block;height:2px;margin-top:10px;background:var(--accent-fill);transform-origin:0 50%;max-width:220px}
.ar-euros{margin-top:6px;font-size:15px}
.ar-euros b{font-size:22px;font-variant-numeric:tabular-nums}
.ar-euros-note{font-size:var(--fs-min);color:var(--text2)}
.ar-cout{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 10px;margin-top:14px}
.ar-cout .fi{width:132px}
.ar-sec{padding:26px 0 0}
.ar-sec h3{font-family:var(--font-display);font-size:18px;font-weight:700;margin-bottom:10px}
.ar-synthese{font-size:16px;line-height:1.6;max-width:70ch}
.ar-prio{list-style:none;margin-top:12px;display:grid;gap:8px;max-width:70ch}
.ar-prio li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:15px}
.ar-prio-n{font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}
.ar-attente{display:flex;align-items:center;gap:14px;color:var(--text2);font-size:15px;min-height:64px}
.ar-horloge{flex:none;width:52px;height:52px;color:var(--accent)}
.ar-horloge svg{display:block;width:100%;height:100%;overflow:visible}
.ar-horloge .au-tic{stroke:var(--text3);opacity:.45}
.ar-horloge .au-cadran{stroke:var(--border-input);fill:none}
.ar-horloge .au-aig{stroke:var(--accent);transform-origin:26px 26px}
/* Sans GSAP (ou en « sobre »), l'aiguille tourne par CSS ; avec GSAP elle avance cran par cran (data-gs) ; animations coupées ou mouvement réduit : immobile. */
.ar-horloge:not([data-gs]) .au-aig{animation:au-tour 2.4s linear infinite}
.audit-fixe .au-aig{animation:none !important}
.ar-horloge .au-pt{fill:var(--rose)}
.ar-table-cadre{overflow-x:auto;margin-top:6px}
.ar-table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.ar-table caption{text-align:left;font-family:var(--font-display);font-size:18px;font-weight:700;padding-bottom:10px}
.ar-table th{font-size:var(--fs-min);font-weight:600;color:var(--text2);text-align:right;padding:8px 12px 8px 0;border-bottom:1px solid var(--border2);white-space:nowrap}
.ar-table th:first-child,.ar-table th:last-child,.ar-table td:first-child,.ar-table td:last-child{text-align:left}
.ar-table td{padding:14px 12px 14px 0;border-bottom:1px solid var(--border);vertical-align:top;text-align:right}
.ar-table td:last-child{padding-right:0;min-width:210px}
.ar-table tfoot td{font-weight:700;border-bottom:0;border-top:1px solid var(--border2);padding-top:16px}
.ar-besoin{font-weight:600;font-size:15px}
.ar-fonction-nom{font-weight:600;color:var(--text)}
.ar-fonction-ph{font-size:var(--fs-min);color:var(--text2);line-height:1.4;margin-top:2px}
.ar-fois{display:block;font-size:var(--fs-min);color:var(--text2);font-weight:400;margin-top:2px}
.ar-duree{white-space:nowrap}
.ar-barre{display:block;height:6px;border-radius:3px;background:var(--bg3);margin-top:8px;overflow:hidden;min-width:70px}
.ar-barre i{display:block;height:100%;width:100%;border-radius:3px;background:var(--text3);transform-origin:0 50%;transform:scaleX(var(--r,0))}
.ar-barre-crm i{background:var(--accent-fill)}
.ar-gain{font-weight:700;white-space:nowrap}
.ar-liste{list-style:none;display:grid;gap:6px;font-size:15px}
.ar-liste li{display:flex;gap:10px}
.ar-liste li::before{content:"";flex:none;width:6px;height:6px;margin-top:.62em;border-radius:50%;background:var(--accent-fill)}
.ar-note{margin-top:28px;padding-top:16px;border-top:1px solid var(--border);font-size:var(--fs-min);color:var(--text2);max-width:80ch;line-height:1.55}

/* Fenêtre « Temps avec le CRM » (administrateurs) : une ligne par tâche, la valeur à droite. */
.au-reglages{display:grid;gap:2px;margin-top:10px}
.au-reg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);gap:6px 16px;align-items:center;padding:9px 0;border-bottom:1px solid var(--border)}
.au-reg label{display:flex;flex-direction:column;min-width:0}
.au-reg-f{font-size:var(--fs-min);color:var(--text2)}
.au-reg-c{display:flex;align-items:center;gap:8px}
.au-reg-c .fi{width:96px}
.au-reg-u{font-size:var(--fs-min);color:var(--text2);max-width:20ch}
.aq-champ .elv-sel,.aq-champ select.fi{min-width:152px}

@media (max-width:900px){
  .audit-corps{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .audit-rail{border-right:0;border-bottom:1px solid var(--border);padding:8px 12px;overflow:visible}
  .audit-rail-t{display:none}
  .audit-etapes{flex-direction:row;overflow-x:auto;gap:4px;padding-bottom:2px}
  .audit-etape{flex:none;width:auto;min-width:44px;padding:6px;justify-content:center}
  .audit-etape-txt{display:none}
  .ar-total{grid-template-columns:minmax(0,1fr)}
  .ar-meta{text-align:left}
}
@media (max-width:760px){
  .ar-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ar-table,.ar-table tbody,.ar-table tr,.ar-table td,.ar-table tfoot{display:block}
  .ar-table tr{padding:14px 0;border-bottom:1px solid var(--border)}
  .ar-table td{border:0;padding:3px 0;text-align:left;display:flex;justify-content:space-between;gap:12px}
  .ar-table td::before{content:attr(data-l);color:var(--text2);font-size:var(--fs-min);flex:none}
  .ar-table td:first-child{display:block}
  .ar-table td:first-child::before,.ar-table td:last-child::before{display:none}
  .ar-table td:last-child{display:block;min-width:0}
  .ar-table tfoot td{border:0}
  .ar-barre{display:none}
}
@media (max-width:420px){.aq-nombre{width:96px !important}.audit-haut{gap:8px}.audit-etat{display:none}}

@media (prefers-reduced-motion:reduce){
  .audit-mini .au-aig,.ar-horloge .au-aig{animation:none !important}
  .audit-etape,.aq-tuile{transition:none}
}

/* ── Impression : la feuille de restitution, seule, sans l'interface du CRM ── */
@media print{
  body.audit-impression > *:not(#audit-ov){display:none !important}
  body.audit-impression #audit-ov{position:static !important;display:block !important;background:white !important;color:black !important}
  body.audit-impression .audit-fen,body.audit-impression .audit-corps,body.audit-impression .audit-scene{display:block !important;overflow:visible !important;height:auto !important;padding:0 !important}
  body.audit-impression .audit-haut,body.audit-impression .audit-progres,body.audit-impression .audit-rail,body.audit-impression .ar-barre-actions,
  body.audit-impression .ar-cout,body.audit-impression .audit-bandeau,body.audit-impression .no-print{display:none !important}
  body.audit-impression .ar{max-width:none;padding:0}
  body.audit-impression .ar-feuille{border:0;padding:0;background:white !important}
  body.audit-impression .ar-table tr,body.audit-impression .ar-sec{break-inside:avoid}
  body.audit-impression .ar-barre{display:block !important}
  body.audit-impression *{color:black !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.audit-impression .ar-total-n,body.audit-impression .ar-marque,body.audit-impression .ar-prio-n{color:var(--accent-fill) !important}
}