/* ==========================================================================
   Espace Gynéco — feuille de style de l'application
   Reprend la charte du Brand Book 2026 : ivoire en base, crème en surface
   secondaire, magenta Champel en signal, charcoal pour la structure.
   « Le magenta n'est pas une couleur de fond — c'est un signal. »
   Ratio visé : 60 % ivoire · 25 % crème · 10 % charcoal · 5 % magenta.
   ========================================================================== */

/* Polices : à déposer dans assets/fonts/ pour un hébergement propre.
   Ne PAS charger depuis Google Fonts : cela enverrait l'adresse IP de chaque
   utilisatrice à un tiers, ce que le cabinet s'est engagé à éviter. */
@font-face{font-family:'Inter';src:url('fonts/Inter-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url('fonts/CormorantGaramond-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url('fonts/CormorantGaramond-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url('fonts/CormorantGaramond-Italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
/* EB Garamond est le second choix déclaré de la charte pour les titres. Il est
   hébergé ici pour que, tant que Cormorant Garamond n'a pas été déposé, les
   titres restent une garalde et ne retombent pas sur Georgia. Les fichiers
   Cormorant, déposés à côté, reprendront le dessus sans rien changer d'autre. */
@font-face{font-family:'EB Garamond';src:url('fonts/EBGaramond-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'EB Garamond';src:url('fonts/EBGaramond-Italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}

:root{
  /* --- couleurs de la marque ------------------------------------------- */
  --ivoire:      #FAF6F1;
  --creme:       #F2EBE0;
  --magenta:     #C8358C;
  --magenta-fonce:#9F2370;
  --rose-poudre: #F4E4EC;
  --mauve:       #6E4555;
  --or:          #C9A961;
  --charcoal:    #2A2024;
  --encre-douce: #5A4F4A;
  --encre-faible:#8B8079;
  --ligne:       #E8DFD2;
  --ligne-forte: #C9B8A6;
  --carte:       #FFFFFF;
  /* couleurs du logo — réservées au logo */
  --logo-rouge:  #CC3340;
  --logo-sarcelle:#2C8A8E;
  /* --- séries de données ------------------------------------------------
     Palette validée sur fond ivoire : bandes de clarté, plancher de chroma,
     séparation daltonienne et contraste. La séparation protan est dans la
     bande 6–8, ce qui impose un encodage secondaire : nos graphiques portent
     toujours une légende et le tableau chiffré à côté. */
  --serie-1:     #C8358C;
  --serie-2:     #356FA8;
  --serie-3:     #B5822A;
  --vert:        #4A7C59;
  --rouge:       #B3261E;

  --rayon:       10px;
  --rayon-pill:  999px;
  --ombre:       0 1px 2px rgba(42,32,36,.04), 0 6px 20px rgba(42,32,36,.05);
  --police:      'Inter','Carlito','Liberation Sans',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --titre:       'Cormorant Garamond','EB Garamond','Lora',Georgia,serif;
  --mono:        'JetBrains Mono',Menlo,Consolas,monospace;
  --nav-l:       238px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--police);font-size:14.5px;line-height:1.6;color:var(--charcoal);background:var(--ivoire);-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}
a{color:var(--magenta);text-decoration:none}
a:hover{color:var(--magenta-fonce);text-decoration:underline}

h1,h2,.kpi,.casc b,.constat h2{font-feature-settings:'lnum' 1}
h1{font-family:var(--titre);font-size:31px;font-weight:400;margin:0 0 2px;color:var(--charcoal);letter-spacing:-.2px;line-height:1.15}
h2{font-family:var(--titre);font-size:20px;font-weight:500;margin:26px 0 10px;color:var(--charcoal)}
h3{font-size:11px;margin:16px 0 6px;color:var(--encre-faible);text-transform:uppercase;letter-spacing:.13em;font-weight:600}
.sous{color:var(--encre-douce);font-size:13.5px;margin:0 0 20px;max-width:78ch}

/* étiquette de section, comme sur le site : un tiret doré puis des capitales */
.oeil{display:inline-flex;align-items:center;gap:9px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-faible);font-weight:600}
.oeil::before{content:'';width:22px;height:1px;background:var(--or)}

/* ------------------------------------------------------------- ossature */
.appli{display:flex;min-height:100vh}
.nav{width:var(--nav-l);flex:0 0 var(--nav-l);background:linear-gradient(175deg,var(--charcoal) 0%,#3A2B32 55%,var(--mauve) 100%);color:#fff;padding:20px 0 90px;position:sticky;top:0;height:100vh;overflow-y:auto}
.nav::-webkit-scrollbar{width:5px}
.nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:3px}
.nav .logo{display:flex;align-items:center;gap:11px;padding:0 20px 18px;border-bottom:1px solid rgba(255,255,255,.13);margin-bottom:12px}
.nav .logo img{flex:0 0 auto}
.nav .logo b{font-family:var(--titre);font-size:19px;font-weight:500;letter-spacing:.2px;line-height:1.1}
.nav .logo span{display:block;font-family:var(--police);font-size:8.5px;color:rgba(255,255,255,.55);font-weight:500;letter-spacing:.16em;text-transform:uppercase;margin-top:3px}
.nav a{display:flex;align-items:center;gap:11px;color:rgba(255,255,255,.78);padding:8px 20px;font-size:13.5px;border-left:2px solid transparent;transition:background .14s ease,color .14s ease}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff;text-decoration:none}
.nav a.on{background:rgba(200,53,140,.16);color:#fff;border-left-color:var(--magenta);font-weight:600}
.nav .grp{padding:16px 20px 6px;font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:rgba(255,255,255,.38);font-weight:600}
.nav .pastille{margin-left:auto;background:var(--magenta);color:#fff;border-radius:var(--rayon-pill);padding:1px 7px;font-size:10px;font-weight:700;min-width:19px;text-align:center}
.corps{flex:1;min-width:0;padding:26px 30px 64px}
.entete{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:4px}
.qui{font-size:11.5px;color:var(--encre-faible);text-align:right;white-space:nowrap}
.qui b{display:block;color:var(--charcoal);font-size:13px;font-weight:600}

/* --------------------------------------------------------------- cartes */
.grille{display:grid;gap:15px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.carte{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--rayon);padding:16px 18px;box-shadow:var(--ombre);transition:box-shadow .16s ease}
a.carte:hover{box-shadow:0 2px 5px rgba(42,32,36,.06),0 10px 26px rgba(42,32,36,.08);text-decoration:none}
.carte h2{margin-top:0}
/* Chiffres alignés, hauteur constante : les garaldes sortent par défaut des
   chiffres elzéviriens, jolis en texte courant, illisibles dans une colonne de
   montants — le 3 et le 9 descendent sous la ligne, le 1 monte moins haut. */
.kpi{font-family:var(--titre);font-size:33px;font-weight:500;color:var(--charcoal);letter-spacing:-.4px;line-height:1.1;
  font-variant-numeric:lining-nums tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1}
.kpi.neg{color:var(--rouge)} .kpi.pos{color:var(--vert)}
.kpi-l{font-size:9.5px;color:var(--encre-faible);text-transform:uppercase;letter-spacing:.14em;font-weight:600}
.kpi-s{font-size:11.5px;color:var(--encre-douce);margin-top:4px}

/* -------------------------------------------------------------- tableau */
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-weight:600;color:var(--encre-faible);font-size:9.5px;text-transform:uppercase;letter-spacing:.11em;padding:8px 8px;border-bottom:1px solid var(--ligne-forte);white-space:nowrap}
td{padding:8px;border-bottom:1px solid var(--ligne);vertical-align:top}
tr:last-child td{border-bottom:none}
td.n,th.n{text-align:right;white-space:nowrap;font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:'lnum' 1,'tnum' 1}
td.c,th.c{text-align:center}
tbody tr:hover{background:var(--ivoire)}
.mini{font-size:11.5px;color:var(--encre-faible)}

/* ------------------------------------------------------------ étiquettes */
.et{display:inline-block;padding:2px 9px;border-radius:var(--rayon-pill);font-size:10.5px;font-weight:600;white-space:nowrap;letter-spacing:.02em}
.et.vert{background:#E8F0E9;color:#33603E}
.et.orange{background:#FBEDD8;color:#8A5B14}
.et.rouge{background:#FAE7E5;color:#8E1E18}
.et.bleu{background:#E7EEF6;color:#28557E}
.et.gris{background:var(--creme);color:var(--encre-douce)}
.et.rose{background:var(--rose-poudre);color:var(--magenta-fonce)}

/* ---------------------------------------------------------------- alertes */
.alerte{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-radius:var(--rayon);font-size:13px;margin-bottom:9px;border-left:3px solid}
.alerte.rouge{background:#FBF0EF;border-color:var(--rouge)}
.alerte.orange{background:#FDF4E7;border-color:var(--or)}
.alerte.bleu{background:#EFF3F8;border-color:var(--serie-2)}
.alerte.vert{background:#EEF4EF;border-color:var(--vert)}
.alerte.rose{background:var(--rose-poudre);border-color:var(--magenta)}

/* --------------------------------------------------------------- formulaire */
label{display:block;font-size:11px;color:var(--encre-douce);margin:11px 0 4px;font-weight:600;text-transform:uppercase;letter-spacing:.07em}
input,select,textarea{width:100%;padding:9px 11px;border:1px solid var(--ligne-forte);border-radius:7px;font:inherit;font-size:13.5px;background:#fff;color:var(--charcoal)}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(200,53,140,.28);border-color:var(--magenta)}
input[type=checkbox]{width:auto}
.bouton{display:inline-block;background:var(--magenta);color:#fff;border:0;border-radius:var(--rayon-pill);padding:9px 20px;font:inherit;font-size:11.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;cursor:pointer;transition:background .14s ease,transform .06s ease}
.bouton:hover{background:var(--magenta-fonce);text-decoration:none;color:#fff}
.bouton:active{transform:translateY(1px)}
.bouton.sec{background:#fff;color:var(--charcoal);border:1px solid var(--ligne-forte)}
.bouton.sec:hover{background:var(--creme);color:var(--charcoal)}
.bouton.acc{background:var(--vert)} .bouton.acc:hover{background:#3B6547}
.bouton.dng{background:var(--rouge)} .bouton.dng:hover{background:#8E1E18}
.bouton.p{padding:5px 13px;font-size:10px}
.rangee{display:flex;gap:11px;flex-wrap:wrap;align-items:flex-end}
.rangee>div{flex:1;min-width:135px}
details>summary{list-style:none;cursor:pointer} details>summary::-webkit-details-marker{display:none}
details>summary::before{content:'▸ ';color:var(--magenta)}
details[open]>summary::before{content:'▾ '}
textarea{min-height:58px;resize:vertical;font-family:inherit}
hr{border:0;border-top:1px solid var(--ligne)}
pre{margin:0}

/* ----------------------------------------------------------------- barres */
.barres{display:flex;align-items:flex-end;gap:3px;height:170px;margin-top:12px}
.barres i{flex:1;background:var(--serie-1);border-radius:2px 2px 0 0;display:block;min-height:2px}
.barres i.b{background:var(--serie-2)}
.axe{display:flex;gap:3px;margin-top:5px}
.axe span{flex:1;text-align:center;font-size:9px;color:var(--encre-faible)}
.leg{display:flex;gap:16px;margin-top:10px;font-size:11px;color:var(--encre-douce);align-items:center}
.leg i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px}

/* --------------------------------------------------------------- calendrier */
.cal{display:grid;grid-template-columns:154px repeat(var(--jours,14),1fr);gap:1px;background:var(--ligne);border:1px solid var(--ligne);border-radius:var(--rayon);overflow:hidden;font-size:11.5px}
.cal>div{background:#fff;padding:5px 6px;min-height:31px}
.cal .tete{background:var(--creme);font-weight:600;text-align:center;color:var(--encre-douce);font-size:9.5px;line-height:1.3;letter-spacing:.03em}
.cal .we{background:#FBF9F6}
.cal .fer{background:var(--rose-poudre)}
.cal .nom{font-weight:600;color:var(--charcoal);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal .abs{border-radius:var(--rayon-pill);color:#fff;text-align:center;font-size:9.5px;padding:2px 0;font-weight:600}

/* ------------------------------------------------------------------ salles */
.salles{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px}
.demi{display:flex;gap:7px;margin-top:5px}
.demi>div{flex:1;border:1px solid var(--ligne);border-radius:7px;padding:6px 8px;font-size:11.5px;min-height:48px;background:#fff}
.demi .libre{background:var(--ivoire);border-style:dashed;color:var(--encre-faible)}

/* ------------------------------------------------------------------- login */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(165deg,var(--charcoal) 0%,#3A2B32 55%,var(--mauve) 100%)}
.login .boite{background:var(--ivoire);border-radius:14px;padding:32px 30px;width:100%;max-width:382px;box-shadow:0 22px 60px rgba(0,0,0,.34)}
.login h1{text-align:center;margin-bottom:2px;font-size:29px}
.login .sous{text-align:center;margin-bottom:18px}

/* --------------------------------------------------------------- mobile */
.mob{display:none}
.marque-mob{display:none}
@media (max-width:900px){
  .g4{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:1fr} .g2{grid-template-columns:1fr}
  .nav{display:none}
  .corps{padding:14px 15px 96px}
  h1{font-size:26px}

  /* La marque, que la barre latérale portait : sur téléphone elle n'existe pas. */
  .marque-mob{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--charcoal)}
  .marque-mob:hover{text-decoration:none}
  .marque-mob b{font-family:var(--titre);font-size:16px;font-weight:500;letter-spacing:.2px}

  .entete{flex-direction:column;align-items:flex-start;gap:2px}
  /* Le nom et la déconnexion vivent dans le menu sur téléphone : les répéter
     en tête de chaque page coûte deux lignes sur un écran qui n'en a pas trop. */
  .qui{display:none}

  /* Barre du bas : quatre raccourcis et le menu. 56 px de haut, ce qui laisse
     au pouce une cible confortable. */
  .mob{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--charcoal);z-index:50;
    padding:0 2px env(safe-area-inset-bottom);justify-content:space-around;
    box-shadow:0 -1px 0 rgba(255,255,255,.08)}
  .mob a{position:relative;color:rgba(255,255,255,.72);font-size:9.5px;text-align:center;
    padding:9px 4px 8px;flex:1;line-height:1.25;letter-spacing:.03em;min-height:56px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
  .mob a.on{color:#fff;font-weight:700}
  .mob a b{display:block;font-size:17px;font-weight:400;color:inherit;line-height:1}
  .mob a.on b{color:var(--magenta)}
  .mob a i{position:absolute;top:5px;left:50%;margin-left:4px;background:var(--magenta);color:#fff;
    border-radius:var(--rayon-pill);font-style:normal;font-size:9px;font-weight:700;
    padding:0 5px;min-width:15px;line-height:15px}

  table{font-size:12.5px}
  .cal{grid-template-columns:98px repeat(var(--jours,14),1fr);font-size:10px}

  /* Cibles tactiles : un lien ou un bouton de 22 px de haut se rate au pouce. */
  .bouton{padding:11px 20px}
  .bouton.p{padding:9px 15px;font-size:11px}
  .matrice td a,td a{display:inline-block;padding:5px 2px}
  details>summary{padding:6px 0}
  .marque-mob{min-height:34px}
  .qui a{display:inline-block;padding:7px 0}
  .fil a,.mini.fil a{display:inline-block;padding:7px 2px}
}

/* Sur iOS, un champ dont le texte fait moins de 16 px déclenche un zoom
   automatique à la mise au point, et la page reste zoomée ensuite. La règle
   passe en !important à dessein : elle doit l'emporter sur les tailles posées
   par les pages, et c'est une contrainte de la plateforme, pas un goût. */
@media (max-width:900px){
  input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px !important}
}
@media print{
  .nav,.mob,.bouton,form{display:none}
  .corps{padding:0} .carte{break-inside:avoid;box-shadow:none;border-color:#bbb}
  body{font-size:10pt;background:#fff}
}

/* ------------------------------------------------------------- graphiques */
.gr{width:100%;height:auto;display:block;margin-top:12px;overflow:visible}
.gr-g{stroke:var(--ligne);stroke-width:1}
.gr-zero{stroke:var(--ligne-forte);stroke-width:1.4}
.gr-seuil{stroke:var(--rouge);stroke-width:1.3;stroke-dasharray:5 4;opacity:.75}
.gr-cut{stroke:var(--ligne-forte);stroke-width:1.2;stroke-dasharray:3 3}
.gr-proj{fill:var(--creme);fill-opacity:.42}
.gr-ax{font-family:var(--police);font-size:10.5px;fill:var(--encre-faible)}
.gr-note{font-family:var(--police);font-size:10px;fill:var(--encre-faible);letter-spacing:.06em;text-transform:uppercase}

.ruban{display:flex;height:19px;border-radius:var(--rayon-pill);overflow:hidden;margin-top:14px;background:var(--creme)}
.ruban i{display:block;height:100%}
.ruban i+i{box-shadow:inset 1px 0 0 rgba(255,255,255,.85)}

/* ------------------------------------------------------- tableau matriciel */
.matrice{overflow-x:auto;margin:0 -18px;padding:0 18px;-webkit-overflow-scrolling:touch}
.matrice table{min-width:100%;font-size:12.5px}
.matrice td,.matrice th{padding:6px 9px;white-space:nowrap}
.matrice td.fixe,.matrice th.fixe{position:sticky;left:0;z-index:2;background:var(--carte);
  text-align:left;white-space:normal;width:262px;min-width:262px;max-width:262px}
.matrice thead th{position:sticky;top:0;background:var(--carte);z-index:3}
.matrice thead th.fixe{z-index:4}
.matrice tbody tr:hover td{background:var(--ivoire)}
.matrice tbody tr:hover td.fixe{background:var(--ivoire)}
.matrice td.vide{color:var(--ligne-forte)}
.matrice td.neg{color:var(--rouge)}
.matrice tr.grp td{background:var(--creme);font-size:9.5px;text-transform:uppercase;letter-spacing:.13em;
  font-weight:700;color:var(--encre-douce);padding:5px 9px}
.matrice tr.grp td.fixe{background:var(--creme)}
.matrice tr.bas td{background:#FDF3F2}
.matrice tr.bas td.fixe{background:#FDF3F2}
tr.tot td{font-weight:600;background:var(--ivoire);border-top:1px solid var(--ligne-forte)}
.matrice tr.tot td.fixe{background:var(--ivoire)}
tr.res td{font-weight:700;background:var(--rose-poudre);border-top:1.5px solid var(--magenta);
  border-bottom:1.5px solid var(--magenta)}
.matrice tr.res td.fixe{background:var(--rose-poudre)}

/* ------------------------------------------------------------- le constat */
.constat{background:linear-gradient(160deg,var(--charcoal) 0%,#3A2B32 58%,var(--mauve) 100%);
  color:#fff;border-radius:var(--rayon);padding:22px 24px;box-shadow:var(--ombre);margin-top:4px}
.constat h2{color:#fff;margin:6px 0 8px;font-size:26px}
.constat p{color:rgba(255,255,255,.84);font-size:14px;margin:0;max-width:88ch}
.constat p b{color:#fff}
.constat p b.ok{color:#9BD8AC} .constat p b.ko{color:#FFB4AC}
.constat .fine{font-size:12px;color:rgba(255,255,255,.6);margin-top:14px}
.casc{display:flex;align-items:stretch;gap:9px;margin-top:16px;flex-wrap:wrap}
.casc>div{flex:1;min-width:132px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
  border-radius:9px;padding:10px 12px}
.casc>div.op{flex:0 0 16px;min-width:16px;background:none;border:0;padding:0;display:flex;
  align-items:center;justify-content:center;font-size:19px;color:rgba(255,255,255,.5)}
.casc>div.fin{background:rgba(200,53,140,.24);border-color:rgba(200,53,140,.55)}
.casc span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.13em;
  color:rgba(255,255,255,.58);font-weight:600}
.casc b{display:block;font-family:var(--titre);font-size:23px;font-weight:500;margin:3px 0 2px;
  letter-spacing:-.3px;color:#fff}
.casc b.ok{color:#9BD8AC} .casc b.ko{color:#FFB4AC}
.casc i{display:block;font-style:normal;font-size:10.5px;color:rgba(255,255,255,.55);line-height:1.35}

@media (max-width:900px){
  .matrice{margin:0 -15px;padding:0 15px}
  .matrice td.fixe,.matrice th.fixe{width:152px;min-width:152px;max-width:152px;white-space:normal}
  .constat{padding:18px 16px} .constat h2{font-size:21px}
  .casc>div.op{flex:1 0 100%;height:14px}
}
@media print{
  .constat{background:#fff;color:var(--charcoal);border:1px solid #bbb}
  .constat h2,.constat p,.constat p b{color:var(--charcoal)}
  .casc>div{background:#fff;border-color:#ccc} .casc b,.casc span,.casc i{color:var(--charcoal)}
  .matrice{overflow:visible}
}
.ruban i{flex:0 0 auto}
.ruban-rep{position:relative;height:19px;margin-top:2px;font-size:10px;color:var(--encre-faible)}
.ruban-rep::before{content:'';position:absolute;left:var(--x);top:-23px;width:2px;height:25px;background:var(--charcoal)}
.ruban-rep span{position:absolute;left:0;max-width:var(--x);text-align:right;width:var(--x);padding-right:6px;
  white-space:nowrap;overflow:hidden}
.ruban-rep b{position:absolute;left:var(--x);padding-left:6px;color:var(--rouge);font-weight:600;white-space:nowrap}
.matrice td.fixe2,.matrice th.fixe2{position:sticky;left:262px;z-index:2;background:var(--carte);
  min-width:98px;box-shadow:1px 0 0 var(--ligne)}
.matrice thead th.fixe2{z-index:4}
.matrice tbody tr:hover td.fixe2{background:var(--ivoire)}
.matrice tr.grp td.fixe2{background:var(--creme)}
.matrice tr.tot td.fixe2{background:var(--ivoire)}
.matrice tr.res td.fixe2{background:var(--rose-poudre)}
@media (max-width:900px){.matrice td.fixe2,.matrice th.fixe2{left:152px;min-width:82px}}
.grbox{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:900px){
  .grbox{margin:0 -15px;padding:0 15px}
  .grbox .gr{min-width:640px}
}
@media print{.grbox{overflow:visible}}

/* ------------------------------------------------------- facture matériel */
.facture .fact-tete{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:14px;
  border-bottom:1px solid var(--ligne);padding-bottom:12px}
.facture h3{margin-top:18px}
.facture .versement{margin-top:16px;background:var(--creme);border:1px solid var(--ligne-forte);
  border-radius:var(--rayon);padding:12px 14px}
.facture .versement table{margin:6px 0 0}
.facture .versement td{border-bottom:1px dashed var(--ligne-forte)}
.facture .versement tr:last-child td{border-bottom:none}
@media print{
  .facture{border:none;box-shadow:none;padding:0}
  .facture .versement{background:#fff;border:1px solid #999}
  .alerte,.oeil::before{display:none}
}
.facture .matrice{margin:0 -18px;padding:0 18px}
.facture .versement td:first-child{white-space:normal}
@media (max-width:900px){
  .facture .matrice{margin:0 -15px;padding:0 15px}
  .facture .versement td{word-break:break-word}
}
@media (max-width:900px){
  .matrice td.fixe.mini,.matrice th.fixe{font-size:11px}
}
