/* ---------- Couleurs (maj88) : toutes les couleurs de l'application sont ici, une fois par thème ----------
   Thème choisi par la personne (Mode d'affichage) -> <html data-theme="systeme|clair|sombre">.
   « systeme » = clair ou sombre selon le réglage de l'ordinateur / du téléphone. */
:root{color-scheme:light;
  --bg:#f8f5ef;--surface:#fff;--ink:#2a2119;--muted:#75685a;--line:#e2d5bf;--tint:#f3e9d8;--champ-bord:#c9b79a;
  --pine:#7a4a12;--brass:#e0a82e;--red:#b4402e;--sur-accent:#fff;--sur-ocre:#2a2119;--desactive:#c4bcb0;--erreur-vive:#c0392b;
  --entete-fond:#f0e5d2;--entete-texte:#2a2119;--entete-texte-doux:#cfe0da;--logo-filtre:none;--connexion-degrade:#f6f1e7;--dev-texte:#8a6a1c;
  --ok-fond:#d3ead9;--ok-texte:#1f5a35;--ok-doux:#e3f3e8;--vert:#3a8f5a;--attente-fond:#fdf1d3;--attente-texte:#7a5a12;
  --acompte-fond:#fbdcc4;--acompte-texte:#8a4410;--acompte:#d9772b;--alerte-fond:#f6d9d3;--alerte-texte:#8a2c1d;
  --err-doux:#fbe6e2;--refus-fond:#f3d9d4;--plein-fond:#f3d3cc;--ligne-erreur:#fbeeeb;
  --chien-fond:#d6f2e2;--chien-texte:#11663a;--chat-fond:#d4f1f7;--chat-texte:#0b5f70;--vac-fond:#dbe7fb;--vac-texte:#1d4a8c;--fer-fond:#ecdcf7;--fer-texte:#5b2d8a;
  --gris-fond:#ece7df;--gris-texte:#5c5248;--archive-fond:#ece9e6;--archive-texte:#5a5047;
  --groupe-fond:#efe5d3;--groupe-bord:#d8c7a6;--groupe-fond-fort:#e3d6bd;--groupe-bord-fort:#cdbd9b;
  --ligne-choisie:#f8efdf;--jour-travail:#e4f1e8;--jour-hors:#f5f2ec;--jour-weekend:#fbf8f2;--jour-ferme:#f7f4ee;--aujourdhui-fond:#fdf6e3;
  --donne-fond:#f3faf5;--retard-fond:#fffaf0;--courbe:#2c5a4d;--courbe-point:#e0a82e;--bord-chien:#16a75c;--bord-chat:#14b4d4;--bord-neutre:var(--brass);--courbe-chien:#16a75c;--courbe-chat:#14b4d4;
  --btn-fond:#a8641a;--btn-texte:#fff;--btn-survol:#8f5414;--nav-actif:#8f5410}  /* émeraude du loup, turquoise du chat (logo), ocre = neutre */
:root[data-theme=sombre],:root[data-theme=nuit]{color-scheme:dark;
  --bg:#15120e;--surface:#1f1a14;--ink:#ece5da;--muted:#ad9f8b;--line:#3f3628;--tint:#2d2519;--champ-bord:#5c4f3c;
  --pine:#e0b46a;--brass:#e0a82e;--red:#e57361;--sur-accent:#1c1408;--sur-ocre:#1c2a28;--desactive:#4f473d;--erreur-vive:#e2604c;
  --entete-fond:#221c15;--entete-texte:#ece5da;--entete-texte-doux:#ad9f8b;--logo-filtre:invert(1);--connexion-degrade:#18211f;--dev-texte:#d9b45a;
  --ok-fond:#1f3a2b;--ok-texte:#9fd8b2;--ok-doux:#1c3326;--vert:#4fae73;--attente-fond:#3a3016;--attente-texte:#f0cf7a;
  --acompte-fond:#3d2a18;--acompte-texte:#f2b07a;--acompte:#d9772b;--alerte-fond:#42221d;--alerte-texte:#f0a597;
  --err-doux:#3d2420;--refus-fond:#3d2522;--plein-fond:#452722;--ligne-erreur:#3a2220;
  --chien-fond:#173527;--chien-texte:#8fe0b4;--chat-fond:#163840;--chat-texte:#8fdcec;--vac-fond:#1d2c45;--vac-texte:#a9c6f5;--fer-fond:#33244a;--fer-texte:#d3b3f2;
  --gris-fond:#2e2922;--gris-texte:#c4b9aa;--archive-fond:#2e2c2a;--archive-texte:#b9b3ad;
  --groupe-fond:#2c2a22;--groupe-bord:#4a4433;--groupe-fond-fort:#34301f;--groupe-bord-fort:#5a5238;
  --ligne-choisie:#2e2618;--jour-travail:#1d3329;--jour-hors:#18140f;--jour-weekend:#211c15;--jour-ferme:#1a1611;--aujourdhui-fond:#2e2a1a;
  --donne-fond:#1a2b22;--retard-fond:#2b2618;--courbe:#6cc0a5;--courbe-point:#e0a82e;--bord-chien:#2fc77a;--bord-chat:#3cc9e6;--courbe-chien:#2fc77a;--courbe-chat:#3cc9e6;
  --btn-fond:#e0a82e;--btn-texte:#1c1408;--btn-survol:#efbb48;--nav-actif:#e9b64a}
@media(prefers-color-scheme:dark){:root[data-theme=systeme]{color-scheme:dark;
  --bg:#15120e;--surface:#1f1a14;--ink:#ece5da;--muted:#ad9f8b;--line:#3f3628;--tint:#2d2519;--champ-bord:#5c4f3c;
  --pine:#e0b46a;--brass:#e0a82e;--red:#e57361;--sur-accent:#1c1408;--sur-ocre:#1c2a28;--desactive:#4f473d;--erreur-vive:#e2604c;
  --entete-fond:#221c15;--entete-texte:#ece5da;--entete-texte-doux:#ad9f8b;--logo-filtre:invert(1);--connexion-degrade:#18211f;--dev-texte:#d9b45a;
  --ok-fond:#1f3a2b;--ok-texte:#9fd8b2;--ok-doux:#1c3326;--vert:#4fae73;--attente-fond:#3a3016;--attente-texte:#f0cf7a;
  --acompte-fond:#3d2a18;--acompte-texte:#f2b07a;--acompte:#d9772b;--alerte-fond:#42221d;--alerte-texte:#f0a597;
  --err-doux:#3d2420;--refus-fond:#3d2522;--plein-fond:#452722;--ligne-erreur:#3a2220;
  --chien-fond:#173527;--chien-texte:#8fe0b4;--chat-fond:#163840;--chat-texte:#8fdcec;--vac-fond:#1d2c45;--vac-texte:#a9c6f5;--fer-fond:#33244a;--fer-texte:#d3b3f2;
  --gris-fond:#2e2922;--gris-texte:#c4b9aa;--archive-fond:#2e2c2a;--archive-texte:#b9b3ad;
  --groupe-fond:#2c2a22;--groupe-bord:#4a4433;--groupe-fond-fort:#34301f;--groupe-bord-fort:#5a5238;
  --ligne-choisie:#2e2618;--jour-travail:#1d3329;--jour-hors:#18140f;--jour-weekend:#211c15;--jour-ferme:#1a1611;--aujourdhui-fond:#2e2a1a;
  --donne-fond:#1a2b22;--retard-fond:#2b2618;--courbe:#6cc0a5;--courbe-point:#e0a82e;--bord-chien:#2fc77a;--bord-chat:#3cc9e6;--courbe-chien:#2fc77a;--courbe-chat:#3cc9e6;
  --btn-fond:#e0a82e;--btn-texte:#1c1408;--btn-survol:#efbb48;--nav-actif:#e9b64a}}
*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--pine)}h1{font-size:1.6rem;margin:.2rem 0 1rem}h2{font-size:1.15rem;margin:1.6rem 0 .5rem}
header{display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap;background:var(--pine);padding:.6rem max(2rem,calc((100% - 1400px)/2 + 2rem))}
header a{color:var(--sur-accent);text-decoration:none}.brand{font-weight:700;font-size:1.2rem;color:var(--brass)!important}
nav{display:flex;gap:1rem;flex:1;flex-wrap:wrap}nav a{padding:.2rem .1rem;border-bottom:2px solid transparent}nav a:hover{border-color:var(--brass)}
header form{display:flex;align-items:center;gap:.8rem;margin:0}.who{color:var(--entete-texte-doux);font-size:.9rem}header .link{color:var(--sur-accent)}
main{max-width:1400px;margin:0 auto;padding:1.4rem 2rem 3rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:1.4rem}.narrow{max-width:560px}
label{display:block;margin:.8rem 0;font-weight:600;font-size:.95rem}label.check{font-weight:400;display:flex;gap:.5rem;align-items:center;margin:.4rem 0}
input,select,textarea{display:block;width:100%;font:inherit;padding:.5rem .6rem;border:1px solid var(--champ-bord);border-radius:4px;background:var(--surface);margin-top:.25rem}
input[type=checkbox]{width:auto;margin:0}fieldset{border:1px solid var(--line);border-radius:4px;margin:.8rem 0}
.btn{display:inline-block;background:var(--btn-fond);color:var(--btn-texte);border:0;border-radius:4px;padding:.55rem 1.1rem;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn.alt{background:var(--surface);color:var(--nav-actif);border:1px solid var(--btn-fond)}.btn.stop{background:var(--red)}
.link{background:none;border:0;color:var(--pine);font:inherit;cursor:pointer;padding:0;text-decoration:underline}
.row{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.row>label{flex:1}.row input,.row select{margin-top:0}.between{justify-content:space-between}
table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line)}th,td{padding:.5rem .7rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--tint);font-size:.9rem}.muted{color:var(--muted)}.bad{color:var(--red);font-weight:700}
.flash{padding:.7rem 1rem;border-radius:4px;margin-bottom:1rem;border-left:5px solid}.ok{background:var(--ok-doux);border-color:var(--vert)}.err{background:var(--err-doux);border-color:var(--red)}.warn{background:var(--attente-fond);border-color:var(--brass)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem;margin-bottom:1rem}
.stats div{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--brass);padding:.8rem 1rem;font-size:1.6rem}.stats span{display:block;font-size:.9rem;color:var(--muted)}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}
.tag{padding:.1rem .5rem;border-radius:3px;background:var(--tint);font-size:.85rem}.tag.en-cours{background:var(--ok-fond)}.tag.annulée{background:var(--refus-fond)}.tag.en-attente{background:var(--attente-fond)}
.scroll{overflow-x:auto}.grid th,.grid td{text-align:center;min-width:64px;font-size:.85rem}.grid th:first-child{text-align:left;min-width:110px;position:sticky;left:0}
.grid small{display:block;font-weight:400;color:var(--muted)}.grid .now{background:var(--brass);color:var(--sur-ocre)}.grid td.part{background:var(--attente-fond)}.grid td.full{background:var(--plein-fond)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--brass);outline-offset:1px}

.brand{display:flex;align-items:center;gap:.5rem}.brand svg{display:block}
.stats .wait{border-left-color:var(--red)}
.bars{display:flex;gap:.6rem;align-items:flex-end;background:var(--surface);border:1px solid var(--line);padding:1rem 1rem .6rem}
.bar{flex:1;text-align:center;display:flex;flex-direction:column;align-items:center}.bar .val{font-weight:700}
.bar .col{height:150px;width:100%;max-width:70px;display:flex;align-items:flex-end;background:var(--tint)}
.bar .col i{display:block;width:100%;background:var(--pine);min-height:2px}
.bar .lab{font-size:.85rem;margin-top:.3rem}.bar small{color:var(--muted);font-size:.75rem}

.dd{position:relative}.dd>:is(a,.tete){display:block}
.sub{display:none;position:absolute;left:0;top:100%;min-width:210px;background:var(--surface);border:1px solid var(--line);box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:20}
.dd:hover .sub,.dd:focus-within .sub{display:block}
header .sub a{color:var(--ink);padding:.55rem .9rem;border:0}header .sub a:hover{background:var(--tint)}
/* sous-menus empilés + survol gris transparent */
header nav .dd>:is(a,.tete){padding:.45rem .8rem;border-bottom:0;border-radius:3px}
header nav .dd:hover>:is(a,.tete),header nav .dd:focus-within>:is(a,.tete){background:rgba(128,128,128,.4)}
header .sub a{display:block;padding:.6rem 1rem;white-space:nowrap;border:0}
header .sub a:hover,header .sub a:focus-visible{background:rgba(128,128,128,.25)}

.tabbar{display:flex;gap:.3rem;border-bottom:2px solid var(--line);margin:.6rem 0}
.tabbar button{font:inherit;font-weight:600;background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-2px;padding:.5rem 1rem;cursor:pointer;color:var(--muted)}
.tabbar button.on{color:var(--pine);border-color:var(--brass)}
.thumb{width:42px;height:42px;object-fit:cover;border-radius:50%;display:block;border:1px solid var(--line)}
.thumb.big{width:120px;height:120px;border-radius:6px;margin:.3rem 0}
.tag.alert{background:var(--alerte-fond);color:var(--alerte-texte);font-weight:600}.tag.vip{background:var(--brass);color:var(--sur-ocre);font-weight:600}
.notes{white-space:pre-wrap;background:var(--surface);border:1px solid var(--line);padding:.8rem;border-radius:4px}

.wide{max-width:820px}
.fgrid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:1rem}
.fgrid[hidden]{display:none}
.fgrid>label{grid-column:span var(--w,12);min-width:0}
@media(max-width:700px){.fgrid>label{grid-column:span 12}}

.brand{font-size:1.25rem;letter-spacing:.2px}

/* barre beige du chenil */
header{background:var(--entete-fond);border-bottom:1px solid rgba(0,0,0,.12)}
header a,header .link,.who,header nav .tete{color:var(--entete-texte)}
/* logo de la barre : version claire ou sombre selon le thème */
:root{--logo-clair:block;--logo-sombre:none}
:root[data-theme=sombre],:root[data-theme=nuit]{--logo-clair:none;--logo-sombre:block}
@media(prefers-color-scheme:dark){:root[data-theme=systeme]{--logo-clair:none;--logo-sombre:block}}
.brand img.logo-barre-clair{display:var(--logo-clair)}.brand img.logo-barre-sombre{display:var(--logo-sombre)}
.brand img{height:62px;width:auto}
.who{opacity:.75}
header nav .dd:hover>:is(a,.tete),header nav .dd:focus-within>:is(a,.tete){background:rgba(128,128,128,.25)}
nav a:hover{border-color:var(--pine)}
.loginlogo{display:block;height:70px;width:auto;margin:0 auto 1rem}

label.inline{display:flex;align-items:center;gap:.5rem;margin:0;font-weight:600}label.inline select{width:auto;margin:0}
tr.grp th{background:var(--groupe-fond-fort);font-size:.95rem;border-top:2px solid var(--groupe-bord-fort)}

/* ---------- Réservations et accueil ---------- */
.tag.st-en_attente{background:var(--attente-fond);color:var(--attente-texte);font-weight:600}
.tag.st-confirmee{background:var(--ok-fond);color:var(--ok-texte);font-weight:600}
.tag.st-refusee,.tag.st-annulee{background:var(--archive-fond);color:var(--muted);text-decoration:line-through}
h1 .tag{font-size:.9rem;vertical-align:middle}
form.inline{display:inline;margin:0}
form.inline[hidden]{display:none}
td.actions{white-space:nowrap}td.actions .btn{padding:.35rem .8rem;font-size:.9rem}
.tabbar a{font-weight:600;text-decoration:none;border-bottom:3px solid transparent;margin-bottom:-2px;padding:.5rem 1rem;color:var(--muted)}
.tabbar a.on{color:var(--pine);border-color:var(--brass)}
.count{background:var(--red);color:var(--sur-accent);border-radius:9px;padding:0 .45rem;font-size:.8rem}
fieldset legend{font-weight:600;font-size:.95rem;padding:0 .3rem}
/* graphique des arrivées : barres empilées, confirmées en bas, en attente au-dessus */
a.bar{color:var(--ink);text-decoration:none;border-radius:4px;padding-top:.3rem}
a.bar:hover{background:var(--tint)}
.bar .col{flex-direction:column;justify-content:flex-end;gap:2px;background:none;border-bottom:1px solid var(--line)}
.bar .col i{min-height:0}
.bar .col i:first-child{border-radius:4px 4px 0 0}
.bar .col i.conf{background:var(--pine)}.bar .col i.att{background:var(--brass)}
.legende{display:flex;gap:1.2rem;flex-wrap:wrap;align-items:center;font-size:.9rem;margin-bottom:.5rem}
.carre{display:inline-block;width:12px;height:12px;border-radius:2px;vertical-align:-1px}
.carre.conf{background:var(--pine)}.carre.att{background:var(--brass)}
.bar .col .val{display:block;margin-bottom:.2rem}
/* menu : plus serré pour tenir sur une ligne avec « Accueil » */
header nav{gap:.15rem}
header nav .dd>:is(a,.tete){padding:.45rem .65rem}
input[type=radio]{width:auto;margin:0}
.bar .col{align-items:stretch}.bar .col .val{text-align:center}
.etapes{margin:0 0 .3rem;font-size:.9rem;color:var(--muted)}.etapes b{color:var(--pine)}

/* statut « acompte demandé » et menu de statut */
.tag.st-acompte{background:var(--acompte-fond);color:var(--acompte-texte);font-weight:600}
details.stmenu{position:relative;display:inline-block}
details.stmenu summary{list-style:none;cursor:pointer}
details.stmenu summary::-webkit-details-marker{display:none}
details.stmenu summary .tag{white-space:nowrap}
details.stmenu summary:hover .tag{outline:1px solid currentColor}
details.stmenu .menu{position:absolute;right:0;top:calc(100% + 4px);z-index:30;min-width:220px;background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.15);padding:.3rem 0}
details.stmenu .menu form{margin:0}
details.stmenu .menu button,details.stmenu .menu a{display:block;width:100%;text-align:left;background:none;border:0;font:inherit;padding:.5rem .9rem;color:var(--ink);cursor:pointer;text-decoration:none}
details.stmenu .menu button:hover,details.stmenu .menu a:hover{background:var(--tint)}
details.stmenu .menu button.danger{color:var(--red)}
details.stmenu .menu a{border-top:1px solid var(--line);margin-top:.3rem;color:var(--pine);font-size:.9rem}
/* étiquettes (VIP, alertes, statuts) centrées sur la ligne de texte */
.tag{display:inline-block;vertical-align:baseline;line-height:1.3;padding:.12rem .5rem}
td a + .tag,td .tag{margin-left:.2rem}

/* espèces : chien bleu, chat violet, autre gris */
.tag.esp-chien{background:var(--chien-fond);color:var(--chien-texte);font-weight:600}
.tag.esp-chat{background:var(--chat-fond);color:var(--chat-texte);font-weight:600}
.tag.esp-autre{background:var(--gris-fond);color:var(--gris-texte);font-weight:600}
td.types{white-space:nowrap}td.types .tag{margin:0 .2rem .2rem 0}

/* tableau avec une colonne « Voir » placée hors du cadre, à gauche */
/* 24.10.2026 : la colonne « Voir » fait partie du tableau (1re colonne, bordée comme les autres) */
table.avec-voir .voir{width:1%;white-space:nowrap;padding-right:.2rem;vertical-align:middle;text-align:left}
table.avec-voir td{vertical-align:middle}
.btn.petit{padding:.3rem .8rem;font-size:.9rem}
/* 24.10.2026 : plus de colonne Voir en retrait à gauche : tout s'aligne sur le bord de la page */
tr.archive td{color:var(--muted)}
label.garderie[hidden]{display:none}
label.garderie{margin:.8rem 0 .2rem;color:var(--pine);font-weight:600}
.tag.garderie{background:var(--attente-fond);color:var(--attente-texte);font-weight:600}
/* case Garderie : sa propre ligne, dans la colonne de droite, juste au-dessus d'Espèce */
.fgrid>label.garderie{grid-column:7 / span 6;margin:.8rem 0 -.5rem}
@media(max-width:700px){.fgrid>label.garderie{grid-column:span 12}}
/* menu : un peu plus serré pour tenir sur une ligne avec « Garderie de jour » */
header nav .dd>:is(a,.tete){padding:.45rem .5rem;font-size:.95rem}

/* rubriques du formulaire animal */
fieldset.rubrique{border:1px solid var(--line);border-radius:6px;padding:.4rem 1.1rem 1rem;margin:1.2rem 0}
fieldset.rubrique>legend{font-weight:700;font-size:1.05rem;color:var(--pine);padding:0 .4rem}
.montant{display:flex;align-items:center;gap:.5rem;margin-top:.25rem}
.montant input{margin-top:0;max-width:12rem;text-align:right}
.montant span{font-weight:400;color:var(--muted)}
/* fiche animal (lecture seule) */
.card.fiche{margin:1rem 0;display:flex;gap:1.5rem;flex-wrap:wrap;position:relative}
.card.fiche h2{margin:0 0 .6rem;width:100%;font-size:1.05rem;color:var(--pine)}
dl.infos{display:grid;grid-template-columns:12rem 1fr;gap:.45rem 1rem;margin:0;flex:1;min-width:260px}
dl.infos dt{font-weight:600;color:var(--muted)}dl.infos dd{margin:0}
.notes-texte{white-space:pre-wrap}
.photo-fiche{width:200px;height:200px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
@media(max-width:600px){dl.infos{grid-template-columns:1fr}dl.infos dt{margin-top:.4rem}}
.card.fiche{row-gap:.2rem}
/* liste des animaux : recherche + « Grouper par » sur une ligne */
form.barre-recherche input[name=q]{flex:1;width:auto;min-width:14rem}
label.grouper{font-weight:600;color:var(--pine);white-space:nowrap}
label.grouper select{min-width:10rem}
table.avec-voir tr.grp th{background:var(--groupe-fond);border-top:2px solid var(--groupe-bord);font-size:.95rem}
/* icône ☰ « Grouper par » (liste des animaux) */
details.grpmenu summary{font-size:1.75rem;line-height:1;padding:.15rem .3rem;color:var(--pine);border-radius:4px;user-select:none}
details.grpmenu summary:hover,details.grpmenu[open] summary{background:var(--tint)}
details.grpmenu summary.actif{color:var(--brass)}
details.grpmenu .menu{left:auto;right:0;min-width:200px}
details.grpmenu .menu-titre{font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:.4rem .9rem .2rem}
details.grpmenu .menu a{border-top:0;margin-top:0;font-size:1rem;color:var(--ink)}
details.grpmenu .menu a.choisi{font-weight:700}
details.grpmenu .menu a.choisi::before{content:"✓ ";color:var(--pine)}
details.grpmenu .menu a.aucun{border-top:1px solid var(--line);margin-top:.3rem;font-size:.9rem;color:var(--pine)}
/* accueil : rubrique « Gestion des réservations » et ses 4 blocs */
h2.rubrique-titre{margin-top:.4rem;color:var(--pine)}
.stats.blocs{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.stats.blocs>a{display:block;background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--brass);padding:.8rem 1rem;font-size:1.6rem;color:var(--ink);text-decoration:none}
.stats.blocs>a:hover{background:var(--tint)}
.stats.blocs>a span{display:block;font-size:.9rem;color:var(--muted)}
.stats.blocs>.wait{border-left-color:var(--brass)}  /* maj195 (Yoann) : marge ocre comme les autres blocs */
.stats.blocs>.acompte{border-left-color:var(--acompte)}
h2[id]{scroll-margin-top:1rem}
/* blocs de l'accueil avec bouton « Voir » centré */
.stats.blocs>div{display:flex;flex-direction:column;font-size:1rem}
.stats.blocs>div .nombre{font-size:1.6rem;color:var(--ink)}
.stats.blocs>div>span:not(.nombre){flex:1}
.stats.blocs>div>.btn{align-self:center;margin-top:.7rem;min-width:6rem;text-align:center}
/* maj137 (Yoann) : chiffres et textes centrés dans les blocs de l'accueil */
.stats.blocs>div{align-items:center;text-align:center}
.count.acompte{background:var(--acompte)}
/* sous-menu de 2e niveau (Réservations › Suivi des réservations) */
.dd2{position:relative}
header .sub .dd2>.fleche{display:flex;justify-content:space-between;gap:1.2rem;padding:.6rem 1rem;white-space:nowrap;color:var(--ink);cursor:default}
header .sub .dd2>.fleche::after{content:"›";font-size:1.2rem;line-height:1;color:var(--muted)}
.sub2{display:none;position:absolute;left:100%;top:0;min-width:210px;background:var(--surface);border:1px solid var(--line);box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:21}
.dd2:hover>.sub2,.dd2:focus-within>.sub2{display:block}
header .dd2:hover>.fleche,header .dd2:focus-within>.fleche{background:rgba(128,128,128,.25)}
/* suivi des poids : bloc des animaux à la pension */
.card.bloc-pension{border-left:5px solid var(--bord-neutre);padding-top:.6rem}
.card.bloc-pension h2{margin-top:.4rem;color:var(--pine)}
.tag.pese{background:var(--ok-fond);color:var(--ok-texte);font-weight:600;margin-left:.3rem}
.liste form.row{flex-wrap:nowrap;gap:.5rem}
.liste form.row input[type=date]{width:10rem!important}
.liste form.row input[type=number]{width:5.5rem!important}
.card.bloc-pension td small{white-space:nowrap}
.card.bloc-tous{border-left-color:var(--brass);margin-top:1.4rem}
/* tarifs libres (fiche animal) */
h3.sous-titre{font-size:.95rem;margin:1rem 0 .4rem;color:var(--muted)}
.tarif{display:flex;gap:.6rem;align-items:center;margin-bottom:.5rem}
.tarif>input{flex:1;margin-top:0}
.tarif .montant{margin-top:0}
.tarif .retirer{text-decoration:none;color:var(--red);font-size:1.1rem;padding:0 .3rem}
#ajouter-tarif{margin-top:.2rem}
/* case Castré / Stérilisée : alignée sur le bas du champ Sexe */
.fgrid>label.sterilise{align-self:end;margin:0 0 .9rem}
.aide-puce{display:block;font-weight:400;margin-top:.2rem;min-height:1.2em}
.aide-puce.incomplet{color:var(--red)}
.puce{font-variant-numeric:tabular-nums;letter-spacing:.03em}
.ecart-fort{color:var(--red);font-weight:700}
header nav .dd>.tete{cursor:default;user-select:none}
.fgrid>label[hidden]{display:none}
.flash.ok{background:var(--ok-doux);border-color:var(--vert)}
.jour-nav{align-items:center;gap:.6rem;margin:1rem 0}.jour-nav .jour-titre{font-size:1.1rem;margin-left:.4rem}
table .c{text-align:center}table .n{text-align:right;white-space:nowrap}
table.pointage label.coche{display:inline-flex;align-items:center;gap:.45rem;cursor:pointer;padding:.35rem .6rem;border-radius:4px;border:1px solid var(--line);background:var(--surface);font-weight:400;margin:0}
table.pointage label.coche input{width:1.25rem;height:1.25rem;margin:0}
table.pointage label.coche:has(input:checked){background:var(--ok-fond);border-color:var(--vert);font-weight:600}
table.recap tr.total td{font-weight:700;background:var(--tint)}
details.jours summary{cursor:pointer;color:var(--muted);font-size:.85rem}details.jours ul{margin:.3rem 0 0;padding-left:1.1rem;font-size:.85rem}
table.pointage input.case{display:block;width:1.4rem;height:1.4rem;margin:0 auto;cursor:pointer;accent-color:var(--pine)}
table.pointage td.chien img{vertical-align:middle;margin-right:.5rem}
table.pointage td.c{position:relative}table.pointage .indice{display:block;font-size:.75rem;margin-top:.15rem}
table.pointage tr:has(input.case:checked) td{background:var(--ligne-choisie)}
table.pointage input.case:disabled{opacity:.3;cursor:not-allowed}
table.pointage .indice-veille{display:block;font-size:.75rem;margin-top:.1rem}
table.pointage tr.ligne-err td{background:var(--ligne-erreur)}
.card.bloc-pension+.card.bloc-pension{margin-top:1.4rem}
.bloc-vaccins .vaccin{display:flex;gap:.6rem;align-items:center;margin-bottom:.5rem;flex-wrap:wrap}
.bloc-vaccins .vaccin select{width:15rem}.bloc-vaccins .vaccin input[type=date]{width:11rem}
.bloc-vaccins .retirer{text-decoration:none;color:var(--red);font-size:1.1rem;padding:0 .3rem}
.fiche-ligne{margin:.4rem 0 .8rem}

/* RH : heures des collaborateurs */
.nowrap{white-space:nowrap}
table.releve tr.grp th{background:var(--groupe-fond);border-top:2px solid var(--groupe-bord);font-size:.9rem}
table.releve tr.total td,table.recap tr.total td{font-weight:700;background:var(--tint)}
.link.danger{color:var(--red);margin-left:.5rem}
.card.bloc-rh{margin:1rem 0;padding-top:.6rem}.card.bloc-rh h2{margin:.4rem 0}
.card.bloc-rh table{margin-top:.6rem}
table.avec-voir tr.choisi td{background:var(--ligne-choisie)}
details.ajout-rh summary{cursor:pointer}details.ajout-rh form{margin-top:.6rem}
.duree-calc{margin:.2rem 0 .8rem;min-height:1.5em}.duree-calc.bad{color:var(--red)}
@media(max-width:600px){
  table.releve th,table.releve td{padding:.45rem .35rem;font-size:.85rem}
  table.releve td.nowrap{white-space:normal}
  table.releve td.actions{white-space:normal}
  table.releve td.actions .btn{display:block;margin-bottom:.3rem;text-align:center}
  table.releve td.actions .link.danger{margin-left:0;font-size:.85rem}
  table.releve .tag{font-size:.75rem;padding:.1rem .35rem}
  .stats.mini{grid-template-columns:repeat(3,1fr);gap:.5rem}
  .stats.mini div{font-size:1.15rem;padding:.5rem .6rem}.stats.mini span{font-size:.75rem}
}
/* saisie d'une journée (collaborateur) */
fieldset.rubrique h3.sous-titre{margin:.9rem 0 0;color:var(--pine);font-size:1rem}
fieldset.rubrique h3.sous-titre+.fgrid>label{margin-top:.4rem}
.plage{white-space:nowrap}
@media(max-width:700px){.fgrid.paire>label{grid-column:span 6}}
@media(max-width:600px){table.jours .plage{white-space:normal}table.jours td:first-child{white-space:normal}}
/* temps de repos et planning */
.soldes{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-bottom:1rem}
.card.solde{border-left:5px solid var(--bord-neutre);padding:1rem 1.2rem}
.card.solde h3{margin:0 0 .3rem;font-size:1rem;color:var(--pine)}
.card.solde .reste{font-size:2rem;font-weight:700;line-height:1.2}.card.solde .reste span{font-size:.95rem;font-weight:400;color:var(--muted);margin-left:.4rem}
.card.solde dl{display:grid;grid-template-columns:auto 1fr;gap:.15rem 1rem;margin:.6rem 0 0;font-size:.9rem}
.card.solde dt{color:var(--muted)}.card.solde dd{margin:0;text-align:right}
.card.solde.negatif{border-left-color:var(--red)}.card.solde.negatif .reste{color:var(--red)}
.tag.abs-vacances{background:var(--vac-fond);color:var(--vac-texte);font-weight:600}
.tag.abs-ferie{background:var(--fer-fond);color:var(--fer-texte);font-weight:600}
.tag.abs-maladie{background:var(--alerte-fond);color:var(--alerte-texte);font-weight:600}
.tag.abs-accident{background:var(--acompte-fond);color:var(--acompte-texte);font-weight:600}
.tag.abs-autre{background:var(--gris-fond);color:var(--gris-texte);font-weight:600}
tr.passe td{color:var(--muted)}
.card.droits h2{margin-top:0}.card.droits .row>label{max-width:14rem}
table.planning tr.aujourdhui td{background:var(--aujourdhui-fond)}
table.planning tr.weekend td:first-child b{color:var(--muted)}
table.planning.saisie input[type=time]{margin:0;min-width:7.2rem}
table.planning.saisie tr.sous th{font-size:.8rem;font-weight:600;color:var(--muted);padding-top:.2rem}
table.planning td .tag{margin:.15rem .2rem 0 0}
.etapes a{color:var(--muted)}
.onglets-employe{flex-wrap:wrap}
@media(max-width:600px){.onglets-employe a{padding:.5rem .6rem;font-size:.92rem}}
table.planning tr.total td{font-weight:700;background:var(--tint)}
@media(max-width:600px){
  table.planning:not(.saisie) th,table.planning:not(.saisie) td,table.absences th,table.absences td{padding:.45rem .35rem;font-size:.85rem}
  table.planning:not(.saisie) .tag{font-size:.72rem;padding:.08rem .3rem}
  .jour-nav.compacte{flex-wrap:nowrap;gap:.4rem}.jour-nav.compacte .jour-titre{font-size:.95rem;margin-left:0;text-align:center;flex:1}
}
details.archives-collab{margin-top:1rem}details.archives-collab summary{cursor:pointer;font-weight:600;color:var(--pine);margin-bottom:.5rem}
/* Administration : onglets à l'intérieur d'une rubrique (Gestion des accès) */
.tabbar.sous-onglets{border-bottom-width:1px;margin:.2rem 0 1rem;gap:.1rem}
.tabbar.sous-onglets button{font-size:.92rem;padding:.4rem .8rem;border-bottom-width:2px}
.tabbar.sous-onglets[hidden]{display:none}
/* journal d'activité */

.card.filtres-journal{padding:.6rem 1.2rem .9rem;margin-bottom:1rem}.card.filtres-journal label{margin:.5rem 0}
table.journal td{font-size:.92rem}table.journal tr.grp th{background:var(--groupe-fond);border-top:2px solid var(--groupe-bord)}
table.journal tr.refuse td{background:var(--ligne-erreur)}
/* Mon temps de repos : 4 totaux par ligne (2 sur téléphone), comme les totaux de « Mes heures » */
.stats.mini.quatre{grid-template-columns:repeat(4,1fr);margin-bottom:.4rem}
.stats.mini.quatre .restant{font-weight:700;border-left-color:var(--bord-neutre)}
.stats.mini.quatre .restant.wait{border-left-color:var(--red);color:var(--red)}
fieldset.rubrique .stats.mini{margin-top:.5rem}
@media(max-width:600px){.stats.mini.quatre{grid-template-columns:repeat(2,1fr)}}
fieldset.rubrique table.absences{margin-top:.5rem}
fieldset.rubrique h3.sous-titre+p.muted{margin:.4rem 0}
/* espace collaborateur : rubriques sur toute la largeur, sans grand vide au-dessus du titre de la rubrique */
.card.pleine{max-width:none;padding:.4rem 1.4rem 1.2rem}
.card.pleine fieldset.rubrique:first-of-type{margin-top:.6rem}
.card.pleine fieldset.rubrique .stats.mini{margin:.6rem 0}
@media(max-width:600px){.card.pleine{padding:.2rem .7rem .9rem}.card.pleine fieldset.rubrique{padding:.3rem .7rem .8rem}}
fieldset{min-width:0}
/* Temps de repos (admin) : droit annuel modifiable dans sa case, « + Ajouter » dans la case Prévus */
.stats.mini .modifiable label.droit{margin:0;font-weight:400}
.stats.mini .modifiable .montant{margin:0}
.stats.mini .modifiable input{max-width:6rem;font-size:1.15rem;padding:.2rem .4rem;text-align:right;margin:0}
.stats.mini .modifiable small{font-size:.75rem}
.stats.mini a.ajout-rapide{display:inline-block;font-size:.85rem;font-weight:600;margin-top:.2rem}
.stats.mini .modifiable span.montant{display:flex;align-items:center;gap:.35rem;font-size:1.15rem;color:var(--ink)}
.stats.mini .modifiable span.montant>span{display:inline;font-size:1.1rem;color:var(--ink)}
/* garderie : case « Séjour » sous « Première nuit », et sa fenêtre */
table.pointage td.cellule-premiere label.sejour{display:flex;align-items:center;justify-content:center;gap:.3rem;margin:.35rem 0 0;font-size:.8rem;font-weight:600;color:var(--pine);cursor:pointer}
table.pointage label.sejour input{width:1rem;height:1rem;margin:0;accent-color:var(--pine)}
dialog.fenetre{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:1.2rem 1.4rem;max-width:min(460px,calc(100vw - 2rem));box-shadow:0 12px 40px rgba(0,0,0,.25)}
dialog.fenetre::backdrop{background:rgba(28,42,40,.45)}
dialog.fenetre h2{margin:0 0 .4rem;color:var(--pine)}
dialog.fenetre .resume-sejour{min-height:1.4em;margin:.2rem 0 .8rem}
/* ---------- Page de connexion ---------- */
body.page-connexion{min-height:100vh;background:var(--bg) linear-gradient(180deg,var(--entete-fond) 0,var(--connexion-degrade) 260px,var(--bg) 520px) no-repeat}
body.page-connexion main{max-width:880px;padding-top:2.5rem}
.connexion{text-align:center}
.connexion .loginlogo{height:84px;margin:0 auto .6rem}
.connexion h1{margin:.2rem 0 1.4rem;font-size:1.5rem}
.connexion .flash{text-align:left;max-width:560px;margin:0 auto 1rem}
.connexion-cartes{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;text-align:left;align-items:stretch}
.card.carte-connexion{display:flex;flex-direction:column;padding:1.4rem 1.5rem;border-radius:10px;box-shadow:0 4px 18px rgba(28,42,40,.07)}
.carte-connexion h2{margin:0;font-size:1.2rem;color:var(--pine)}
.carte-connexion .sous-titre-connexion{margin:.15rem 0 .4rem;font-size:.9rem}
.carte-connexion label{margin:.7rem 0}
.btn.large{width:100%;padding:.75rem 1rem;margin-top:.6rem;font-size:1rem}
.btn:disabled{opacity:.55;cursor:not-allowed}
.cle-yubikey{display:flex;justify-content:center;align-items:center;flex:1;min-height:110px;color:var(--pine);opacity:.75}
.carte-connexion .petit-texte{font-size:.85rem;text-align:center;margin:.5rem 0 0}
details.dev-connexion{margin-top:1rem;border-top:1px dashed var(--line);padding-top:.8rem}
details.dev-connexion summary{cursor:pointer;font-size:.85rem;font-weight:600;color:var(--dev-texte)}
details.dev-connexion form{margin-top:.6rem;flex-wrap:nowrap;gap:.5rem}
details.dev-connexion select{flex:1;margin:0}
.pied-connexion{margin-top:1.8rem;font-size:.85rem}
@media(max-width:700px){
  body.page-connexion main{padding-top:1.5rem}
  .connexion .loginlogo{height:64px}
  .connexion-cartes{grid-template-columns:1fr}
  .cle-yubikey{min-height:70px}
}
/* petit bouton « Voir » sous un nom (garderie) */
.btn.mini-voir{display:block;width:max-content;margin-top:.3rem;padding:.12rem .55rem;font-size:.78rem;font-weight:600;border-radius:4px}
table.pointage td.chien .mini-voir{margin-left:0}
/* tableau avec colonne « Voir » à l'intérieur d'une rubrique encadrée : la colonne reste dans le cadre */

/* RH › Vacances & jours fériés */
table.soldes-rh tr.sous th{font-size:.85rem;padding-top:.35rem;padding-bottom:.2rem}
table.soldes-rh th.groupe-vac,table.soldes-rh th.groupe-fer{color:var(--pine);border-bottom:2px solid var(--brass)}  /* maj99 : titres de groupe en ocre */
table.soldes-rh tr>:nth-child(7){border-left:2px solid var(--brass)}

/* 24.10.2026 : pages plus larges (1600 px, marges 2rem ; 1rem sur téléphone) ; un nom suivi de son badge ne se coupe pas,
   pour que les boutons « Voir » d'une même ligne restent à la même hauteur */
.sans-coupure{white-space:nowrap}
@media(max-width:700px){main{padding:1rem 1rem 2.5rem}header{padding:.6rem 1rem}}

/* RH › Récapitulatif : bouton « Modifier » à côté du nom, fenêtre de modification des heures du mois */
table.recap td.nom-collab{white-space:nowrap}
dialog.fenetre.large{max-width:min(1100px,calc(100vw - 2rem));width:100%}
table.modif-heures td{padding:.35rem .4rem;vertical-align:middle}
table.modif-heures input{margin:0;padding:.3rem .4rem;font-size:.95rem}
table.modif-heures input[type=number]{width:5rem;text-align:right}
table.modif-heures input[name$=_remarque]{min-width:12rem}
table.modif-heures td.centre{text-align:center}
table.modif-heures input[type=checkbox]{width:1.1rem;height:1.1rem}
table.modif-heures tr.a-supprimer td:not(:last-child){opacity:.45;text-decoration:line-through}
/* RH › Absences et maladies */
.case-certificat .case{display:flex;align-items:center;gap:.45rem;margin-top:.7rem;font-weight:400}
.case-certificat .case input{width:1.15rem;height:1.15rem;margin:0;accent-color:var(--pine)}
table.recap-abs tr.archive td{color:var(--muted)}

/* Mes heures : tableau du mois en semaines (comme la feuille papier) */
table.calendrier-heures{table-layout:fixed;min-width:760px}
table.calendrier-heures th{text-align:center;font-size:.85rem;padding:.4rem .2rem}
table.calendrier-heures td{border:1px solid var(--line);padding:.35rem .4rem .45rem;vertical-align:top;height:6.2rem}
table.calendrier-heures td.hors{background:var(--jour-hors)}
table.calendrier-heures td.weekend{background:var(--jour-weekend)}
table.calendrier-heures td.aujourdhui{box-shadow:inset 0 0 0 2px var(--brass)}
table.calendrier-heures td.ferme:not(.validee):not(.partielle) .valeur{color:var(--muted)}
table.calendrier-heures td.validee,table.calendrier-heures td.partielle{background:var(--ligne-choisie)}
table.calendrier-heures td.erreur{background:var(--ligne-erreur);box-shadow:inset 0 0 0 2px var(--erreur-vive)}
table.calendrier-heures .tete-case{display:flex;justify-content:space-between;align-items:center;gap:.3rem;margin-bottom:.2rem}
table.calendrier-heures .pastille{font-size:.68rem;font-weight:600;padding:0 .35rem;border-radius:3px;white-space:nowrap}
table.calendrier-heures .pastille.ok{background:var(--ok-fond);color:var(--ok-texte)}
table.calendrier-heures .pastille.attente{background:var(--attente-fond);color:var(--attente-texte)}
table.calendrier-heures .prevu{display:block;color:var(--muted);font-size:.75rem;line-height:1.2}
table.calendrier-heures .tag{font-size:.7rem;padding:0 .3rem;margin:0 0 .15rem}
table.calendrier-heures input{width:100%;margin:.25rem 0 0;padding:.3rem .4rem;text-align:center;font-size:1.05rem;font-weight:600}
table.calendrier-heures .valeur{margin-top:.35rem;text-align:center;font-weight:700;font-size:1.05rem}
table.calendrier-heures small.bad{display:block;font-size:.7rem;line-height:1.2;margin-top:.2rem}
table.calendrier-heures .sem{width:6.5rem;text-align:right;vertical-align:middle;background:var(--tint)}
table.calendrier-heures th.sem{text-align:right}
table.modif-heures td.heures-jour label{display:flex;align-items:center;gap:.6rem;margin:0;font-weight:400;color:var(--muted);font-size:.9rem}
table.modif-heures td.heures-jour input{width:7rem;text-align:center;font-weight:600}
table.modif-heures td.heures-jour label{white-space:nowrap}
table.modif-heures td .tag{white-space:nowrap}
/* Pages larges (Mes heures du collaborateur) : 1600 px au lieu de 1400, en-tête aligné */
body.page-large main{max-width:1600px}
body.page-large header{padding-left:max(2rem,calc((100% - 1600px)/2 + 2rem));padding-right:max(2rem,calc((100% - 1600px)/2 + 2rem))}
@media(max-width:700px){body.page-large header{padding-left:1rem;padding-right:1rem}}
/* RH › Planning : un seul planning de présences (qui travaille quel jour) */
.outils-planning{gap:.5rem;align-items:center;flex-wrap:wrap;margin:.2rem 0 .7rem}
.outils-planning select{width:auto;margin:0;padding:.25rem .4rem}
.outils-planning .sep{flex:0 0 1rem}
.collab{padding:.15rem .55rem;border-radius:12px;font-size:.88rem;font-weight:600}
.c1{--pc:#1d4a8c;--pf:#dbe7fb}.c2{--pc:#8a4410;--pf:#fbdcc4}.c3{--pc:#5b2d8a;--pf:#ecdcf7}
.c4{--pc:#1f5a35;--pf:#d3ead9}.c5{--pc:#8a2c1d;--pf:#f6d9d3}.c6{--pc:#4f5c57;--pf:#e3e7e5}
.c7{--pc:#0f5f63;--pf:#cdeced}.c8{--pc:#7a5a12;--pf:#f8ecc4}.c9{--pc:#8c1d5c;--pf:#f7d5e8}
.c10{--pc:#3d4f9c;--pf:#dfe3f7}.c11{--pc:#5a6b16;--pf:#e6efc8}.c12{--pc:#6b4226;--pf:#ecdccf}
.collab{background:var(--pf);color:var(--pc)}
table.calendrier-presences{table-layout:fixed;min-width:840px}
table.calendrier-presences th{text-align:center;font-size:.85rem;padding:.4rem .2rem}
table.calendrier-presences td{border:1px solid var(--line);padding:.3rem .35rem .4rem;vertical-align:top;height:5.5rem}
table.calendrier-presences td.hors{background:var(--jour-hors)}
table.calendrier-presences td.weekend{background:var(--jour-weekend)}
table.calendrier-presences td.aujourdhui{box-shadow:inset 0 0 0 2px var(--brass)}
table.calendrier-presences .tete-case{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.2rem}
table.calendrier-presences label.presence{display:flex;align-items:center;gap:.35rem;margin:.15rem 0;padding:.1rem .35rem;
  border-radius:4px;font-weight:400;font-size:.88rem;cursor:pointer;border:1px solid transparent}
table.calendrier-presences label.presence input{width:1rem;height:1rem;margin:0;accent-color:var(--pc)}
table.calendrier-presences label.presence:has(input:checked){background:var(--pf);color:var(--pc);font-weight:600}
table.calendrier-presences label.presence:not(:has(input:checked)) span{color:var(--muted)}
table.calendrier-presences label.presence .tag{font-size:.62rem;padding:0 .25rem;margin-left:auto}
table.calendrier-presences.mon-planning td{height:4.6rem}
table.calendrier-presences td.travail{background:var(--jour-travail)}
table.calendrier-presences .jour-travail{display:inline-block;margin-top:.2rem;padding:.1rem .45rem;border-radius:4px;background:var(--pine);color:var(--sur-accent);font-size:.82rem;font-weight:600}
table.calendrier-presences.mon-planning .tag{display:inline-block;margin-top:.25rem;font-size:.72rem}
table.calendrier-heures .prevu.planifie{color:var(--pine);font-weight:600}
table.calendrier-heures td.ferme:not(.validee):not(.partielle){background:var(--jour-ferme)}
/* RH › Planning : menu déroulant par jour */
table.calendrier-presences .choisis{display:flex;flex-wrap:wrap;gap:.2rem;margin:.15rem 0 .25rem;min-height:1.4rem}
table.calendrier-presences .puce{display:inline-flex;align-items:center;gap:.15rem;padding:.05rem .2rem .05rem .45rem;border-radius:10px;
  background:var(--pf);color:var(--pc);font-size:.8rem;font-weight:600;white-space:nowrap}
table.calendrier-presences .puce .retirer{border:0;background:none;color:inherit;cursor:pointer;font-size:.95rem;line-height:1;padding:0 .2rem;opacity:.7}
table.calendrier-presences .puce .retirer:hover{opacity:1}
details.menu-presences{position:relative}
details.menu-presences summary{list-style:none;cursor:pointer;font-size:.8rem;color:var(--pine);font-weight:600;padding:.1rem .35rem;
  border:1px dashed var(--line);border-radius:4px;display:inline-block}
details.menu-presences summary::-webkit-details-marker{display:none}
details.menu-presences[open] summary{background:var(--tint)}
details.menu-presences .liste{position:absolute;z-index:20;top:100%;left:0;margin-top:.2rem;min-width:13rem;max-height:18rem;overflow:auto;
  background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:.3rem}
td:nth-child(n+6) details.menu-presences .liste{left:auto;right:0}
details.menu-presences label.presence{white-space:nowrap}
@media(min-width:900px){.planning-scroll{overflow:visible}}  /* les menus de la dernière ligne ne sont pas coupés */
table.calendrier-presences .absent-jour{display:block;font-size:.72rem;color:var(--muted);margin:.05rem 0 .2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
table.calendrier-presences .absent-jour .tag{font-size:.64rem;padding:0 .25rem;margin:0}
.case-planning .case{display:flex;align-items:center;gap:.45rem;margin-top:.5rem;font-weight:400}
.case-planning .case input{width:1.15rem;height:1.15rem;margin:0;accent-color:var(--pine)}
.case-planning small{display:block;margin-top:.25rem;font-weight:400}
table.calendrier-heures .a-venir{display:block;text-align:center;font-size:.7rem}
#fenetre-signature p:first-of-type{font-size:1.02rem;line-height:1.5}
[hidden]{display:none!important}  /* un élément masqué reste masqué, même un .btn */
#fenetre-signature .valider-signature:disabled{background:var(--desactive);border-color:var(--desactive);color:var(--sur-accent);cursor:not-allowed;min-width:7.5rem}
#fenetre-signature .valider-signature{min-width:7.5rem}
/* Administration › Profils et droits */
table.droits td,table.droits th{vertical-align:middle}
table.droits input[type=checkbox]{width:1.1rem;height:1.1rem;accent-color:var(--pine);margin:0}
table.droits tr.grp th{background:var(--groupe-fond);font-size:.92rem}
table.droits td.adm{color:var(--pine);font-weight:700;background:var(--ligne-choisie)}
table.droits input.nom-profil{width:auto;margin:0;padding:.2rem .4rem;font-size:.85rem;font-weight:600;text-align:center;
  border-radius:12px;border:1px solid transparent;background:var(--pf);color:var(--pc)}
table.droits input.nom-profil:focus{border-color:var(--pc)}
table.droits tr.pied td{background:none;border-bottom:0}
.profils-choix{gap:.4rem;flex-wrap:wrap;align-items:center;margin:0}
.collab-choix{display:inline-flex;align-items:center;gap:.3rem;margin:0;padding:.15rem .55rem;border-radius:12px;font-size:.85rem;
  font-weight:600;background:var(--pf);color:var(--pc);cursor:pointer;opacity:.55}
.collab-choix:has(input:checked){opacity:1}
.collab-choix input{width:1rem;height:1rem;margin:0;accent-color:var(--pc)}
.collab-choix{white-space:nowrap}
/* Profils et droits : cases à cocher centrées sous le nom de chaque profil */
table.droits th.c,table.droits td.c{text-align:center}
table.droits td.c input[type=checkbox]{display:block;margin:0 auto}

/* ---------- Connexion : code du téléphone (Google Authenticator) ---------- */
.carte-code{max-width:520px;margin:0 auto;text-align:left}
.etapes-code{padding-left:1.2rem}
.etapes-code li{margin:.55rem 0}
.qr-code{display:flex;justify-content:center;margin:.8rem 0}
.qr-code svg{border:1px solid var(--line);border-radius:8px;max-width:100%;height:auto}
.cle-totp{display:inline-block;margin-top:.3rem;font-size:1.05rem;letter-spacing:.04em;user-select:all}
.champ-code{font-size:1.6rem;letter-spacing:.25em;text-align:center;font-variant-numeric:tabular-nums}
.codes-secours{columns:2;font-size:1.15rem;padding-left:1.6rem}
.codes-secours li{margin:.3rem 0}
.connexion-collab .tag{white-space:nowrap}
.connexion-collab small{display:block}
@media print{.codes-secours{columns:2}}
.carte-code h2{margin-top:0}
/* ---------- Compte invalide (3 mots de passe faux) ---------- */
.tag.invalide{background:var(--red);color:var(--sur-accent);font-weight:600}
.fgrid>.statut-compte{grid-column:span 12;display:flex;flex-direction:column;gap:.35rem;margin:.6rem 0 .9rem}
.statut-compte .libelle{font-weight:600}
.choix-statut{display:inline-flex;align-items:center;gap:.4rem;margin:0;padding:.35rem .8rem;border-radius:999px;border:2px solid transparent;font-weight:600;cursor:pointer}
.choix-statut.actif{background:var(--ok-fond);color:var(--ok-texte)}
.choix-statut.invalide{background:var(--refus-fond);color:var(--alerte-texte)}
.choix-statut:has(input:checked).actif{border-color:var(--ok-texte)}
.choix-statut:has(input:checked).invalide{border-color:var(--red);background:var(--red);color:var(--sur-accent)}
.statut-compte .row{flex-wrap:wrap}.statut-compte .choix-statut{flex:0 0 auto;width:auto;min-width:8rem}
.tag.archive{background:var(--archive-fond);color:var(--archive-texte);font-weight:600}
.choix-statut.archive{background:var(--archive-fond);color:var(--archive-texte)}
.choix-statut:has(input:checked).archive{border-color:var(--archive-texte);background:var(--muted);color:var(--sur-accent)}
/* ---------- Espace collaborateur › Mode de connexion : trois cartes ---------- */
.modes-connexion{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;align-items:stretch;margin-top:1rem}
.modes-connexion .carte-connexion p{margin:.5rem 0}
.modes-connexion .carte-connexion form:last-child{margin-top:auto}
.modes-connexion .qr-code svg{width:180px;height:180px}
.etat-mode{font-weight:700;font-size:1.1rem;margin:.6rem 0 .2rem}
.etat-mode.actif{color:var(--ok-texte)}
details.option-mode{border-top:1px dashed var(--line);margin-top:.7rem;padding-top:.6rem}
details.option-mode summary{cursor:pointer;font-weight:600;color:var(--pine)}
details.option-mode form{margin-top:.5rem}
.champ-code.petit{font-size:1.15rem;letter-spacing:.15em}
.btn.alt.danger{color:var(--red);border-color:var(--red)}
@media(max-width:900px){.modes-connexion{grid-template-columns:1fr}}
/* Mon temps de repos › Jours de congés */
ul.jours-conge{list-style:none;padding:0;margin:0 0 .6rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.45rem}
ul.jours-conge li{border:1px solid var(--line);border-radius:6px;padding:.45rem .6rem;background:var(--surface);display:flex;flex-direction:column;gap:.2rem}
ul.jours-conge .tag{font-size:.72rem;align-self:flex-start}
/* ---------- Thème d'affichage (25.10.2026) : menu ◐ de la barre du haut ---------- */
html{background:var(--bg)}
details.menu-affichage summary{display:flex;align-items:center;padding:.3rem;border-radius:50%;color:var(--entete-texte)}
details.menu-affichage summary:hover,details.menu-affichage[open] summary{background:rgba(128,128,128,.25)}
header details.menu-affichage form.menu{display:block;min-width:13rem}
details.menu-affichage .menu-titre{font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:.4rem .9rem .2rem}
details.menu-affichage .menu button{display:flex;align-items:center;gap:.6rem;white-space:nowrap}
details.menu-affichage .menu button.choisi{font-weight:700}
details.menu-affichage .menu button.choisi::after{content:"✓";margin-left:auto;color:var(--pine)}
.pastille-theme{width:1.1rem;height:1.1rem;border-radius:50%;border:1px solid rgba(128,128,128,.6);flex:none}
.pastille-theme.t-systeme{background:linear-gradient(135deg,#fbf9f5 50%,#2a2219 50%);box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}  /* maj316 : verre clair / verre sombre */
.pastille-theme.t-clair{background:#f8f5ef}
.pastille-theme.t-sombre{background:#15120e}
/* ---------- Page de connexion Oshimo (25.10.2026) ----------
   Maquettes de Yoann : fond bleu canard + lueur, cercle du logo (loup / chat), « Oshimo » et slogan en texte clair.
   Cartes selon le thème : sable (Clair), sombres (Sombre) ; « Comme l'appareil » = sable ou sombres (thème Oshimo retiré le 25.10.2026).
   Sans compte, le thème choisi ici (menu ◐ en haut à droite) est gardé dans le navigateur (cookie theme_connexion). */
html:has(body.page-connexion){background:#030e12;color-scheme:dark}
body.page-connexion{--carte-fond:#f6ecd8;--carte-bord:#e2cfa9;--carte-titre:#965c1a;--carte-texte:#2a2117;--carte-doux:#7a6650;--champ-fond:#fff;--champ-texte:#2a2117;--champ-ligne:#d6be96;--bouton-fond:#cc842e;--bouton-texte:#fff;--bouton-survol:#b8721f;--bouton-alt:#fff;
  --surface:var(--carte-fond);--ink:var(--carte-texte);--muted:var(--carte-doux);--line:var(--carte-bord);--champ-bord:var(--champ-ligne);
  --pine:var(--carte-titre);--tint:rgba(128,128,128,.15);--bg:#030e12;color:#e8f6f2;min-height:100vh;
  background:radial-gradient(ellipse 560px 420px at 50% 170px,rgba(30,120,110,.45),rgba(14,70,72,.25) 50%,transparent 78%),
             linear-gradient(180deg,#061e22 0,#030e12 100%) no-repeat;background-attachment:fixed;
  font-family:ui-rounded,"SF Pro Rounded","Nunito","Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif}
:root[data-theme=sombre] body.page-connexion,:root[data-theme=nuit] body.page-connexion{--carte-fond:#0f272b;--carte-bord:#1d3f43;--carte-titre:#e3a24f;--carte-texte:#d6e7e3;--carte-doux:#93b1ab;--champ-fond:#081a1d;--champ-texte:#e8f6f2;--champ-ligne:#2f5559;--bouton-fond:#cc842e;--bouton-texte:#fff;--bouton-survol:#b8721f;--bouton-alt:#0f272b}
@media(prefers-color-scheme:dark){:root[data-theme=systeme] body.page-connexion{--carte-fond:#0f272b;--carte-bord:#1d3f43;--carte-titre:#e3a24f;--carte-texte:#d6e7e3;--carte-doux:#93b1ab;--champ-fond:#081a1d;--champ-texte:#e8f6f2;--champ-ligne:#2f5559;--bouton-fond:#cc842e;--bouton-texte:#fff;--bouton-survol:#b8721f;--bouton-alt:#0f272b}}
body.page-connexion main{padding-top:1.6rem}
body.page-connexion .card{background:var(--carte-fond);color:var(--carte-texte);border-color:var(--carte-bord);box-shadow:0 10px 30px rgba(0,0,0,.35)}
body.page-connexion :is(input,select){background:var(--champ-fond);color:var(--champ-texte);border-color:var(--champ-ligne)}
body.page-connexion .btn{background:var(--bouton-fond);color:var(--bouton-texte);font-weight:700}
body.page-connexion .btn:hover:not(:disabled){background:var(--bouton-survol)}
body.page-connexion .btn.alt{background:var(--bouton-alt);color:var(--carte-titre);border:1px solid var(--bouton-fond)}
body.page-connexion :is(.carte-connexion h2,.cle-yubikey,details.dev-connexion summary,.carte-code a){color:var(--carte-titre)}
body.page-connexion dialog.fenetre{background:var(--carte-fond);color:var(--carte-texte)}
body.page-connexion .flash{color:var(--carte-texte)}  /* maj95 : lisible en Clair et en Sombre */
.logo-oshimo{display:block;width:290px;height:auto;margin:0 auto 1.5rem;filter:drop-shadow(0 0 26px rgba(80,210,220,.2))}
.cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pied-connexion{color:#9fc9c4}
.affichage-connexion{position:absolute;top:1rem;right:max(1rem,calc((100% - 880px)/2))}
.affichage-connexion details.menu-affichage summary{color:#e8f6f2}
.affichage-connexion details.menu-affichage form.menu{display:block;min-width:13rem;--surface:#fffbf4;--ink:#16302e;--muted:#6b7a74;--line:#e3d3b5;--pine:#0f7a63}
@media(max-width:700px){.logo-oshimo{width:220px}}
.connexion>.logo-oshimo{margin-bottom:3rem}  /* maj91 : plus d'espace entre le slogan et les cartes (Yoann) */
@media(max-width:700px){.connexion>.logo-oshimo{margin-bottom:2.2rem}}
.logo-petit .logo-oshimo{width:150px}
/* Pictogrammes de la barre du haut (_icones.html) */
header nav .dd>:is(a,.tete){display:flex;align-items:center;gap:.35rem}
header nav .icone{width:1.15rem;height:1.15rem;flex:none;opacity:.85}
/* Couleur par espèce des blocs (thème Oshimo : émeraude = chien, turquoise = chat, comme le logo ; autres thèmes : inchangé) */
.card.bloc-pension.bord-chien{border-left-color:var(--bord-chien)}
.card.bloc-pension.bord-chat{border-left-color:var(--bord-chat)}
.card.fiche.bord-chien{border-left:5px solid var(--bord-chien)}
.card.fiche.bord-chat{border-left:5px solid var(--bord-chat)}
svg.bord-chien{--courbe:var(--courbe-chien)}svg.bord-chat{--courbe:var(--courbe-chat)}
.card.fiche:not(.bord-chien):not(.bord-chat){border-left:5px solid var(--bord-neutre)}  /* fiche collaborateur : ocre */
/* maj91 : marge de couleur à gauche des listes (Yoann) : clients ocre, chiens émeraude, chats turquoise ;
   Garderie de jour : chiens inscrits émeraude, pointage du jour et récapitulatif du mois ocre (doré) */
table tr:is(.bord-neutre,.bord-chien,.bord-chat)>td:first-child{box-shadow:inset 5px 0 0 var(--bord-ligne)}
/* Administration (Yoann) : marge ocre sur tous les tableaux */
table.bord-ocre tr:has(>td)>:first-child{box-shadow:inset 5px 0 0 var(--bord-neutre)}
tr.bord-neutre{--bord-ligne:var(--bord-neutre)}tr.bord-chien{--bord-ligne:var(--bord-chien)}tr.bord-chat{--bord-ligne:var(--bord-chat)}
/* maj92 (Yoann) : boutons ocre (le vert = chien), rouge gardé pour supprimer / annuler ; rubrique en cours de la barre en ocre gras */
.btn:hover:not(:disabled):not(.alt):not(.stop){background:var(--btn-survol)}
header nav .dd.actif>:is(a,.tete){color:var(--nav-actif);font-weight:700}
/* maj93 : ancien collaborateur (archivé…) dans RH › Planning : visible, en lecture seule */
.collab.ancien,table.calendrier-presences .puce.ancien{background:var(--archive-fond);color:var(--archive-texte);border:1px dashed var(--champ-bord)}
.anciens{display:flex;flex-wrap:wrap;gap:.2rem;margin-top:.2rem}
/* maj96 : heures corrigées par le RH, à signer par le collaborateur */
.card.a-signer{border-left:5px solid var(--brass);background:var(--attente-fond);margin-bottom:1rem}
.card.a-signer ul{margin:.3rem 0 .4rem;padding-left:1.2rem}
.tag.a-resigner{background:var(--attente-fond);color:var(--attente-texte);font-weight:600;font-size:.78rem}
/* maj97 : RH › Journal d'activité, choix des collaborateurs à afficher / exporter */
details.choix-collabs summary.btn{display:inline-block}
details.choix-collabs .menu{min-width:260px;max-height:60vh;overflow:auto;padding:.4rem .2rem}
details.choix-collabs .menu label.check{padding:.3rem .8rem;margin:0;cursor:pointer}
details.choix-collabs .menu label.tous{border-bottom:1px solid var(--line);padding-bottom:.5rem;margin-bottom:.2rem}
details.choix-collabs .menu button.appliquer{width:auto;margin:.4rem .8rem .2rem;background:var(--btn-fond);color:var(--btn-texte);text-align:center;border-radius:4px}

/* maj100 : téléphone. Barre du haut plus compacte ; « Mes heures » en liste de jours (le calendrier dépassait de l'écran) */
table.calendrier-heures .jour-nom{display:none}
@media(max-width:600px){
  header{gap:.3rem .8rem;padding:.4rem 1rem}
  .brand img{height:42px}
  header nav{flex-basis:100%;order:3;gap:0 .1rem}
  header nav .dd>:is(a,.tete){padding:.3rem .45rem;font-size:.9rem;white-space:nowrap}
  .scroll:has(>table.liste-tel){overflow:visible}
  table.calendrier-heures.liste-tel{min-width:0;table-layout:auto;border:0;background:none}
  table.liste-tel,table.liste-tel tbody,table.liste-tel tr{display:block}
  table.liste-tel tr:first-child{display:none}
  table.liste-tel tr{border:1px solid var(--line);border-radius:6px;margin-bottom:.7rem;overflow:hidden;background:var(--surface)}
  table.liste-tel td.hors{display:none}
  table.liste-tel td.case{display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .6rem;height:auto;border:0;border-bottom:1px solid var(--line);padding:.45rem .6rem}
  table.liste-tel .tete-case{flex:1 1 8rem;justify-content:flex-start;margin:0}
  table.liste-tel .tete-case b{display:none}
  table.liste-tel .jour-nom{display:inline;font-weight:700;min-width:5.6rem}
  table.liste-tel input{order:2;width:6rem;margin:0}
  table.liste-tel .valeur{order:2;min-width:6rem;margin:0}
  table.liste-tel .prevu,table.liste-tel .tag,table.liste-tel small{order:3}
  table.liste-tel .a-venir{order:2;flex-basis:100%;text-align:left}
  table.liste-tel td.sem{display:block;height:auto;width:auto;text-align:right;padding:.4rem .6rem}
  table.liste-tel td.sem::before{content:"Semaine : ";color:var(--muted);font-size:.9rem}
  table.liste-tel td.sem br{display:none}
  table.liste-tel td.sem small{margin-left:.4rem}
}
/* maj100 : un seul style par action — « Voir » plein, « Modifier » / « Corriger » / « Réactiver » à contour,
   « Supprimer » à contour rouge ; les liens restent pour la navigation dans le texte */
td.actions>*+*,td>.btn+form.inline,td>form.inline+.btn{margin-left:.4rem}
td>.btn.alt.petit{padding:.25rem .7rem;font-size:.85rem}
.card.fiche .notes{border:0;padding:0;background:none;width:100%}
/* maj101 : cases à cocher aux couleurs du thème (ocre) au lieu du bleu du navigateur */
input[type=checkbox],input[type=radio]{accent-color:var(--btn-fond)}
.pastilles-collab{display:flex;flex-wrap:wrap;gap:.4rem .5rem;align-items:center;margin-left:1rem}  /* maj102 */
@media(max-width:600px){.pastilles-collab{margin-left:0;flex-basis:100%}}
/* maj103 (Yoann) : choix du collaborateur plus grand et en ocre, pour qu'on le voie */
.outils-planning select.choix-collab{padding:.45rem 2rem .45rem .8rem;font-size:1rem;font-weight:700;color:var(--nav-actif);border:2px solid var(--btn-fond);background-color:var(--tint);border-radius:5px;cursor:pointer}
/* maj104 : notifications sur le nom (pastille rouge = nombre de tâches) */
details.notifications summary.who{display:inline-flex;align-items:center;gap:.35rem;cursor:pointer;border-radius:4px;padding:.15rem .3rem}
details.notifications summary.who:hover{background:rgba(128,128,128,.2)}
.pastille-notif{display:inline-block;min-width:1.25rem;height:1.25rem;padding:0 .35rem;border-radius:.65rem;background:var(--erreur-vive);color:var(--surface);font-size:.75rem;font-weight:700;line-height:1.25rem;text-align:center}
details.notifications .menu{min-width:280px}
details.notifications .titre-notif{margin:.2rem .9rem .3rem;font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
header details.notifications .menu a{color:var(--ink);border-top:1px solid var(--line)}
details.notifications .menu{z-index:60}
@media(max-width:600px){details.notifications .menu{left:0;right:auto;min-width:min(280px,90vw)}}
/* maj105 (Yoann) : formulaires client / animal / réservation sur toute la largeur de la page ; sur grand écran,
   4 champs par ligne (--wl = largeur sur grand écran, en 12es) ; une seule colonne sur téléphone (inchangé) */
.card.wide{max-width:none}
@media(min-width:1000px){
  .card.wide .fgrid>:is(label,.champ-espece)[style*="--wl"]{grid-column:span var(--wl)}
  .card.wide .fgrid>label.garderie{grid-column:4 / span 3}
}
/* maj106 : fiche animal, photo en haut à droite (hors de « Informations de l'animal »), champs à gauche. */
.fiche-haut{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"titre photo" "infos photo";column-gap:1.6rem;align-items:start}
.fiche-titre{grid-area:titre}.fiche-titre h1{margin-top:0}
.lien-proprietaire{margin:.3rem 0 0}
/* maj108 : case « Animal déjà venu » à droite du bouton Propriétaire (en dessous sur téléphone si pas la place). */
.lien-proprietaire{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.2rem}
.lien-proprietaire label.deja-venu{margin:0;font-weight:600}
.lien-proprietaire label.deja-venu small{font-weight:400}
.tag.deja-venu{background:var(--ok-fond);color:var(--ok-texte);font-weight:600}
/* maj120 (Yoann) : « + Code couleur » puis « + Tag », un par ligne, boutons de même largeur ; les éléments choisis
   s'alignent à droite de leur bouton (place réservée : la fiche ne bouge pas tant qu'ils tiennent sur la ligne). */
.codes-tags{display:grid;grid-template-columns:max-content minmax(0,1fr);align-items:center;gap:.45rem .8rem;margin:.2rem 0 .9rem}
.codes-tags details.choix-menu{display:block}
.codes-tags .choix-menu summary.btn{display:block;text-align:center}
.puces-groupe{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;min-height:1.7rem}
.puces-groupe .puce-tag{max-width:100%;box-sizing:border-box;white-space:nowrap}
.puces-groupe .puce-tag .nom-puce{overflow:hidden;text-overflow:ellipsis}
.choix-menu summary.btn{display:inline-block;margin:0}
details.choix-menu .menu{left:0;right:auto;max-height:18rem;overflow:auto;font-weight:400}
details.choix-menu .menu button{display:flex;align-items:center;gap:.5rem}
details.choix-menu .menu button[hidden]{display:none}
details.choix-menu .menu label.choix-case{margin:0;padding:.45rem .9rem;cursor:pointer;font-weight:400}  /* maj128 : cases à cocher */
details.choix-menu .menu label.choix-case:hover{background:var(--tint)}
.puces-groupe[data-trier] .puce-tag{cursor:grab;touch-action:none;user-select:none}
.puces-groupe .puce-tag.en-deplacement{cursor:grabbing;opacity:.6;outline:2px dashed var(--c)}
details.choix-menu .vide-choix{display:block;padding:.5rem .9rem}
details.choix-menu .vide-choix[hidden]{display:none}
.puce-tag{display:inline-flex;align-items:center;gap:.25rem;padding:.05rem .2rem .05rem .55rem;border-radius:999px;font-size:.85rem;font-weight:600;
  border:1px solid var(--c);background:transparent;color:var(--ink)}  /* maj126 (Yoann) : plus de fond de couleur, la pastille suffit */
.puce-tag::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:var(--c)}
.puce-tag.alerte-cat{color:var(--alerte-texte)}  /* maj125 : catégorie de client avec alerte */
/* maj128 (Yoann) : catégorie avec alerte = ovale plein de sa couleur, texte caché ; lisible au survol (ou au toucher) */
.puce-tag.alerte-cat{background:var(--c);color:transparent;cursor:help;transition:background .15s,color .15s}
.puce-tag.alerte-cat::before{visibility:hidden}
.puce-tag.alerte-cat:hover,.puce-tag.alerte-cat:focus{background:transparent;color:var(--alerte-texte);outline:none}
.puce-tag.alerte-cat:hover::before,.puce-tag.alerte-cat:focus::before{visibility:visible}
/* maj128 (Yoann) : sur téléphone / iPad (pas de souris), les alertes sont ignorées : catégorie comme les autres,
   sans « ⚠ », et pas de bandeau « Attention » en réservation */
@media (hover:none){
  .puce-tag.alerte-cat{background:transparent;color:var(--ink);cursor:default}
  .flash.alerte-client{display:none}
  .puce-tag.alerte-cat::before{visibility:visible}
  .puce-tag.alerte-cat .signe-alerte{display:none}
}
.puce-tag .retirer-tag{border:0;background:none;color:inherit;cursor:pointer;font-size:1rem;line-height:1;padding:0 .2rem}
.fiche-codes{display:inline-flex;flex-wrap:wrap;gap:.3rem;vertical-align:middle}
.fiche-infos{grid-area:infos;min-width:0}
.fiche-infos fieldset.rubrique:last-child{margin-bottom:0}
.photo-animal{grid-area:photo;width:170px;margin:.5rem .5rem 0 0;display:flex;flex-direction:column;align-items:center;gap:.55rem;text-align:center}
.photo-cadre{width:170px;height:170px;border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--tint)}
.photo-cadre img{width:100%;height:100%;object-fit:cover;display:block}
.photo-cadre.vide{border:2px dashed var(--champ-bord);color:var(--muted);font-size:.9rem}
.choix-photo{position:relative;cursor:pointer}
.choix-photo input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.choix-photo:focus-within{outline:3px solid var(--brass);outline-offset:1px}
.photo-animal small{font-size:.78rem;line-height:1.3}
@media(max-width:700px){
  .fiche-haut{grid-template-columns:1fr;grid-template-areas:"titre" "photo" "infos"}
  .photo-animal{margin:1rem auto .4rem}
}
/* maj107 : fiche animal, « Garderie de jour » sous Espèce, place toujours réservée (rien ne bouge quand elle apparaît). */
.fgrid>.champ-espece{grid-column:span var(--w,12);min-width:0}
.champ-espece>label:first-child{margin-bottom:.35rem}
.champ-espece>label.garderie{margin:0 0 .4rem}
@media(max-width:700px){.fgrid>.champ-espece{grid-column:span 12}}

/* maj109 (Yoann) : rubrique Prix de la fiche animal en deux colonnes : prix et autres tarifs à gauche, trait vertical ocre
   discret au centre, suppléments à droite. Sur téléphone, les suppléments passent dessous (trait horizontal). */
.prix-deux{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:2rem}
/* maj110-111 : grille « journée | nuit | nuits suivantes (chien de garderie) » puis le bouton « Ajouter un tarif ». */
.prix-ligne{display:grid;grid-template-columns:auto auto auto;grid-template-areas:"jour nuit suiv" "bouton . .";justify-content:start;column-gap:1.5rem}
.prix-ligne label{margin-bottom:.4rem}
.prix-ligne .montant input{max-width:8rem}
.prix-ligne>label:nth-of-type(1){grid-area:jour}.prix-ligne>label:nth-of-type(2){grid-area:nuit}
#prix-suivantes{grid-area:suiv}
#ajouter-tarif{grid-area:bouton;align-self:start;justify-self:start}
#tarifs>.tarif:first-child{margin-top:.6rem}
.prix-droite{border-left:1px solid var(--bord-neutre);padding-left:2rem}
.prix-droite h3.sous-titre:first-child{margin-top:1.075rem}  /* maj110 : boutons « Ajouter » alignés à gauche et à droite */
.supplement select{flex:1;margin-top:0;min-width:0}
@media(max-width:700px){
  .prix-deux{grid-template-columns:minmax(0,1fr)}
  .prix-droite{border-left:0;border-top:1px solid var(--bord-neutre);padding-left:0;margin-top:1rem}
  .supplement{flex-wrap:wrap}.supplement select,.supplement .supplement-libre{flex-basis:calc(100% - 2rem)}
  .prix-ligne{grid-template-columns:auto;grid-template-areas:"jour" "nuit" "suiv" "bouton"}
}
/* maj111 (Yoann) : formulaires client / animal / réservation, tous les champs d'une ligne à la même hauteur que « Nom »
   (listes déroulantes et dates étaient un peu plus basses ou plus hautes). */
.card.wide :is(input:not([type=checkbox],[type=radio],[type=file]),select){height:2.55rem;box-sizing:border-box}
/* maj112 : petite flèche « ‹ Retour » en haut de la page (lien ocre discret, comme les autres liens). */
a.retour{display:inline-block;margin:0 0 .4rem;font-size:.9rem;font-weight:600;text-decoration:none}
a.retour:hover{text-decoration:underline}
a.retour[hidden]{display:none}
/* maj113 : Administration › Gestion des tags et des codes couleurs : deux colonnes (codes à gauche, tags à droite),
   séparées par un trait ocre discret ; l'une sous l'autre sur téléphone. */
.deux-colonnes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:2rem}
.deux-colonnes>.liste-elements+.liste-elements,.deux-colonnes>.colonne-listes+.colonne-listes{border-left:1px solid var(--bord-neutre);padding-left:2rem}
/* maj123 : plusieurs listes l'une sous l'autre dans une colonne, bien espacées */
.colonne-listes>.liste-elements~.liste-elements{margin-top:2.2rem}  /* maj161 : « ~ » car la fenêtre « Changer l'ordre » (maj160) se glisse entre deux listes */
.liste-elements h3.sous-titre{margin-top:.4rem;color:var(--pine);font-size:1rem}
.choix-element{display:flex;align-items:center;gap:.6rem;max-width:28rem}
.choix-element select{margin-top:0;height:2.55rem;box-sizing:border-box}
.actions-element{margin:.5rem 0;gap:.5rem}
.liste-elements>[data-fenetre]{margin-top:.5rem}
.pastille-code{display:inline-block;flex:none;width:1.1rem;height:1.1rem;border-radius:50%;border:1px solid var(--line)}
fieldset.palette{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.2rem 1rem;padding:.4rem .8rem}
fieldset.palette label.choix-couleur{margin:.25rem 0;gap:.45rem}
.autre-couleur{grid-column:1 / -1;display:flex;align-items:center;gap:.5rem;margin:.4rem 0 .2rem}
.autre-couleur input[type=color]{width:2.6rem;height:2.2rem;padding:.1rem;margin:0;cursor:pointer}
.autre-couleur input.code-couleur{width:7.5rem;margin:0;font-family:ui-monospace,monospace}
@media(max-width:700px){
  .deux-colonnes{grid-template-columns:minmax(0,1fr)}
  .deux-colonnes>.liste-elements+.liste-elements,.deux-colonnes>.colonne-listes+.colonne-listes{border-left:0;border-top:1px solid var(--bord-neutre);padding:1rem 0 0;margin-top:1rem}
  .tabbar{flex-wrap:wrap}.tabbar button,.tabbar a{padding:.45rem .6rem}  /* onglets sur plusieurs lignes au lieu d'être coupés */
}

/* maj124 (Yoann, choix « Fiches empilées ») : sur téléphone, les listes (table.fiches-tel) deviennent des fiches
   empilées : une fiche par ligne, chaque valeur précédée du titre de sa colonne (data-titre, posé par base.html),
   le bouton « Voir » en bas de la fiche. Les autres tableaux (grilles, plannings…) défilent dans leur cadre :
   la page elle-même ne glisse plus jamais de côté. Rien ne change sur ordinateur. */
@media(max-width:700px){
  main table:not(.fiches-tel):not(.liste-tel){display:block;max-width:100%;overflow-x:auto}
  table.fiches-tel,table.fiches-tel>tbody,table.fiches-tel>thead{display:block;border:0;background:none;width:100%}
  table.fiches-tel tr.tete-fiches{display:none}
  table.fiches-tel tr{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);
    border-left:5px solid var(--bord-ligne,var(--bord-neutre));border-radius:6px;margin:0 0 .6rem;padding:.35rem 0}
  table.fiches-tel tr>td{display:block;position:relative;border:0;padding:.22rem .8rem;box-shadow:none!important;min-width:0;overflow-wrap:break-word}
  table.fiches-tel tr>td[data-titre]{padding-left:8.2rem}
  table.fiches-tel tr>td[data-titre]::before{content:attr(data-titre);position:absolute;left:.8rem;top:.3rem;width:7rem;color:var(--muted);font-size:.85rem;line-height:1.3}
  table.fiches-tel tr>td.vide{display:none}
  table.fiches-tel tr>td.voir{order:99;width:auto;padding-top:.45rem}
  table.fiches-tel tr>td.voir .btn{width:100%;text-align:center}
  table.fiches-tel tr>td.c,table.fiches-tel tr>td.n{text-align:left}
  table.fiches-tel tr.grp{background:none;border:0;padding:.6rem 0 .2rem;margin:0}
  table.fiches-tel tr.grp>th{display:block;background:none;border:0;padding:0 .2rem;font-size:1rem}
  table.fiches-tel tr.grp>td.voir{display:none}
  table.fiches-tel .nowrap{white-space:normal}
  table.fiches-tel td .row{flex-wrap:wrap;gap:.4rem}
  table.fiches-tel td .row input:not([type=checkbox]){max-width:100%;min-width:0}
  table.fiches-tel input.case{display:inline-block;margin:0}
  /* recherche à côté du mois (garderie) : passe à la ligne, champ pleine largeur */
  .jour-nav form.row{flex-wrap:wrap!important;margin:0!important;flex-basis:100%}
  .jour-nav form.row input[name=q]{width:auto!important;flex:1 1 10rem}
}
/* maj129 : formulaire client, rubrique « Autres contacts » (un bloc par contact) */
/* maj131 : un contact = une rubrique, champ « Type de contact » en tête */
.contact-tete{margin:.6rem 0 .3rem;align-items:flex-end}
.contact-tete label.contact-type{margin:0;flex:0 1 calc(25% - .75rem);min-width:12rem}
#ajouter-contact{margin:0 0 1rem}

/* maj137 (Yoann) : graphique de l'accueil « Occupation » : par jour, une barre chiens (émeraude) et une barre chats
   (turquoise), empilées : présents (foncé, en bas), arrivent (moyen), partent (clair, en haut) ; bulle au survol */
.bars.occupation{align-items:flex-start}
.bars.occupation .bar{padding-bottom:.3rem}
.bar .paire{display:flex;gap:6px;align-items:flex-end;justify-content:center;height:170px;width:100%;border-bottom:1px solid var(--line)}
.bar .paire .col{position:relative;height:100%;width:22px;max-width:22px;border-bottom:none;display:flex;flex-direction:column;justify-content:flex-end;gap:1px;outline:none}
.bar .paire .col i{display:block;width:100%;min-height:0;border-radius:0}
.bar .paire .col i:first-of-type{border-radius:4px 4px 0 0}
.bar .paire .col i:last-of-type{border-radius:0 0 2px 2px}
.col.chiens{--esp:var(--bord-chien)}.col.chats{--esp:var(--bord-chat)}
.col i.presents{background:var(--esp)}
.col i.arrivent{background:color-mix(in srgb,var(--esp) 55%,#fff)}
.col i.partent{background:color-mix(in srgb,var(--esp) 25%,#fff)}
.bar .paire .col .bulle{display:none;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);z-index:5;
  min-width:9.5rem;text-align:left;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-left:4px solid var(--esp);
  border-radius:6px;padding:.45rem .6rem;font-size:.82rem;line-height:1.45;box-shadow:0 4px 14px rgba(0,0,0,.18);font-weight:400}
.bar .paire .col .bulle b{display:block;margin-bottom:.15rem}
/* maj138 : :focus-visible (clavier) et .ouverte (toucher) au lieu de :focus, sinon la bulle restait après « Retour » */
.bar .paire .col:is(:hover,:focus-visible,.ouverte) .bulle{display:block}
.bar .totaux{display:flex;gap:.6rem;justify-content:center;font-size:.85rem;margin-top:.35rem;font-weight:600}
.t-chiens{color:var(--chien-texte)}.t-chats{color:var(--chat-texte)}
.carre.chiens{background:var(--bord-chien)}.carre.chats{background:var(--bord-chat)}
.carre.niv{--esp:var(--bord-chien)}
.carre.niv.presents{background:var(--esp)}
.carre.niv.arrivent{background:color-mix(in srgb,var(--esp) 55%,#fff)}
.carre.niv.partent{background:color-mix(in srgb,var(--esp) 25%,#fff)}
@media (max-width:700px){.bar .paire{gap:2px}.bar .paire .col{width:12px}.bar .totaux{flex-direction:column;gap:0;font-size:.75rem}}
.bars.occupation .bar:nth-child(-n+2) .col .bulle{left:0;transform:none}
.bars.occupation .bar:nth-last-child(-n+2) .col .bulle{left:auto;right:0;transform:none}

/* maj139 (Yoann) : accueil, deux blocs « Aujourd'hui » côte à côte (chiens à gauche, chats à droite) ; nombre puis libellé */
.bilans{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.5rem}
.card.bilan{border-left:5px solid var(--bord-neutre);margin:0}
.card.bilan.bord-chien{border-left-color:var(--bord-chien)}.card.bilan.bord-chat{border-left-color:var(--bord-chat)}
.card.bilan h3{margin:0 0 .5rem}
.card.bilan ul{list-style:none;margin:0;padding:0}
.card.bilan li{display:flex;align-items:baseline;gap:.7rem;padding:.3rem 0;border-bottom:1px solid var(--line)}
.card.bilan li:last-child{border-bottom:none}
.card.bilan li b{min-width:2.2rem;text-align:right;font-size:1.2rem;color:var(--ink)}
.card.bilan li.total{font-weight:600}
.card.bilan.bord-chien li b{color:var(--chien-texte)}.card.bilan.bord-chat li b{color:var(--chat-texte)}
@media (max-width:700px){.bilans{grid-template-columns:1fr}}

/* maj140 : pictogrammes chien / chat (accueil) */
/* maj141 (Yoann) : plus grands pour qu'on reconnaisse le loup et le chat (rond gardé) */
.picto-espece{width:40px;height:40px;object-fit:contain;vertical-align:middle}
.picto-espece.grand{width:56px;height:56px;margin-right:.6rem}
.bar .totaux{align-items:center}.bar .totaux>span{display:flex;flex-direction:column;align-items:center;line-height:1.1}
@media (max-width:700px){.picto-espece{width:30px;height:30px}.picto-espece.grand{width:44px;height:44px}}
.card.bilan h3{display:flex;align-items:center}
.logo-oshimo{width:330px}@media(max-width:700px){.logo-oshimo{width:250px}}.logo-petit .logo-oshimo{width:170px}  /* maj140 : nouveau logo carré */
/* maj141 (Yoann) : le menu tient sur UNE ligne sur ordinateur (Mac 14 pouces et plus) ; logo plus petit, espaces resserrés */
@media (min-width:1240px){
  header{gap:.8rem;flex-wrap:nowrap}
  header nav{flex-wrap:nowrap;gap:0;min-width:0}
  header nav .dd>:is(a,.tete){padding:.45rem .45rem;white-space:nowrap}
  .brand img{height:46px}
}
@media (min-width:1240px) and (max-width:1450px){
  header{padding-left:1.2rem;padding-right:1.2rem}
  header nav .dd>:is(a,.tete){padding:.45rem .32rem;font-size:.9rem;gap:.3rem}
  header nav .icone{width:1rem;height:1rem}
}
/* maj143 : pictogrammes du graphique plus petits, chacun centré sous sa barre (barres de 22 px, écart de 6 px) */
.bar .totaux{gap:0}
.bar .totaux>span{width:28px}
.bar .totaux .picto-espece{width:28px;height:28px}
@media (max-width:700px){.bar .totaux>span{width:auto}.bar .totaux .picto-espece{width:20px;height:20px}}
/* maj144 (Yoann) : barre du haut plus large (contenu jusqu'à 1600 px), logo un peu plus grand,
   choix du thème ◐ tout à droite, dans la marge */
@media (min-width:1240px){
  header{position:relative;padding-left:max(1.2rem,calc((100% - 1600px)/2 + 1.2rem));padding-right:max(3.2rem,calc((100% - 1600px)/2 + 1.2rem))}
  header>details.menu-affichage{position:absolute;right:.7rem;top:50%;transform:translateY(-50%);z-index:40}  /* maj314 : le menu ◐ passe devant le ☰ des listes */
  .brand img{height:54px}
}
@media (min-width:1240px) and (max-width:1450px){
  header{padding-left:1rem;padding-right:3rem}
  .brand img{height:50px}
}
/* maj145 (Yoann) : Alimentation et Santé / traitements en lignes (comme les vaccins), côte à côte sur grand écran */
.fgrid>.bloc-soins{grid-column:span 12;margin:.4rem 0 .8rem;min-width:0}
@media(min-width:1000px){.card.wide .fgrid>.bloc-soins{grid-column:span 6}}
.bloc-soins .soin{display:flex;gap:.5rem;align-items:center;margin-bottom:.5rem}
.bloc-soins .soin input{margin-top:0;min-width:0}
.bloc-soins .soin-quoi{flex:2}.bloc-soins .soin-qte{flex:1.2}.bloc-soins .soin-heures{flex:1.1}
.bloc-soins .retirer{text-decoration:none;color:var(--red);font-size:1.1rem;padding:0 .3rem}
.bloc-soins .note-soins{display:block;margin-top:.7rem}
@media (max-width:700px){.bloc-soins .soin{flex-wrap:wrap}.bloc-soins .soin-quoi{flex-basis:calc(100% - 2.5rem)}}
/* maj146 (Yoann) : colonnes alignées (aliment / quantité / fréquence), titre « Posologie » au-dessus de la dose et de la
   fréquence d'un traitement ; Fréquence = menu à cocher matin / midi / soir */
.bloc-soins .soin,.bloc-soins .entete-soins{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1.2fr) minmax(0,1.3fr) 1.8rem;gap:.5rem;align-items:center}
.bloc-soins .entete-soins{margin-bottom:.35rem;font-size:.95rem}
.bloc-soins .entete-soins>strong:first-child{grid-column:1 / span 2}
.bloc-soins .entete-soins small{font-weight:400}
.bloc-soins .entete-posologie{grid-column:2 / span 2;grid-row:1}
.bloc-soins .entete-soins:has(.entete-posologie)>strong:first-child{grid-column:1}
.choix-frequence{display:block;min-width:0}
.choix-frequence summary{display:flex;align-items:center;justify-content:space-between;gap:.3rem;height:2.55rem;padding:0 .6rem;
  border:1px solid var(--line);border-radius:4px;background:var(--surface);white-space:nowrap;overflow:hidden;color:var(--ink)}
.choix-frequence summary .resume{overflow:hidden;text-overflow:ellipsis}
.choix-frequence .menu{min-width:10rem}
.choix-frequence .menu label{display:flex;align-items:center;gap:.5rem;padding:.45rem .9rem;margin:0;font-weight:400;cursor:pointer}
.choix-frequence .menu label:hover{background:var(--tint)}
@media (max-width:700px){
  .bloc-soins .soin{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 1.8rem}
  .bloc-soins .soin .soin-quoi{grid-column:1 / span 2;grid-row:1}.bloc-soins .soin .retirer{grid-column:3;grid-row:1}
  .bloc-soins .soin .soin-qte{grid-column:1;grid-row:2}.bloc-soins .soin .choix-frequence{grid-column:2;grid-row:2}
  .bloc-soins .entete-soins{grid-template-columns:1fr}.bloc-soins .entete-posologie{display:none}
}
/* maj149 (Yoann) : Administration › Heures d'opération */
table.horaires{width:auto;min-width:min(34rem,100%)}
table.horaires td,table.horaires th{padding:.35rem 1rem;text-align:left;vertical-align:middle}
table.horaires input[type=time]{margin-top:0;width:8.5rem}
table.horaires tr.ferme input[type=time]{opacity:.45}
.cibles-horaires{display:flex;gap:.6rem 1.2rem;flex-wrap:wrap;align-items:center;margin:.3rem 0 .5rem}
.cibles-horaires>label{margin:0;width:auto;flex:none}
@media (max-width:700px){table.horaires{min-width:0;width:100%}table.horaires td,table.horaires th{padding:.3rem .3rem}
  table.horaires input[type=time]{width:100%;min-width:0;padding-left:.3rem;padding-right:.2rem}table.horaires .etat{display:none}}
@media (max-width:700px){main table.horaires.bord-ocre{table-layout:fixed;display:table}table.horaires th:nth-child(1){width:25%}table.horaires th:nth-child(2){width:15%}table.horaires input[type=time]{font-size:.9rem}
  table.horaires th{font-size:.8rem}table.horaires td:first-child b{font-size:.85rem}}
.seuil-invalide{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-weight:400}
.seuil-invalide input{width:4.5rem;margin-top:0}
/* maj149 (Yoann) : Profils et droits, colonnes déplaçables par la poignée ⠿ */
table.droits th.col-profil{white-space:nowrap}
.poignee-profil{cursor:grab;color:var(--muted);margin-right:.3rem;font-size:1.05rem;user-select:none;touch-action:none}
table.droits th.col-profil.en-deplacement{outline:2px dashed var(--brass);outline-offset:-3px}
/* maj150 (Yoann) : tableau des horaires centré, « À qui ça s'applique » dans la même rubrique */
main table.horaires.bord-ocre{margin-left:auto;margin-right:auto}
.heures-operation h3.sous-titre{margin:1.2rem 0 .4rem;color:var(--pine);font-size:1rem}
/* maj152 (Yoann) : titre d'un cadre dans une bande beige, comme la ligne d'en-tête des tableaux (Heures d'opération) */
.card.cadre-entete{padding-top:0;margin-top:1.2rem;overflow:hidden}
.card.cadre-entete>.entete{margin:0 -1.4rem 1rem;padding:.65rem 1.4rem;background:var(--tint);border-bottom:1px solid var(--line);font-weight:700}
/* maj155 (Yoann) : fiche animal › Suivi de l'animal, boutons alignés à droite et de même largeur */
dl.infos dd.avec-bouton{display:flex;align-items:flex-start;gap:.6rem;flex-wrap:wrap}
dl.infos dd.avec-bouton>span{flex:1 1 12rem;min-width:0}
dl.infos dd.avec-bouton>.btn{margin-left:auto;flex:0 0 auto;min-width:13rem;text-align:center}
@media(max-width:600px){dl.infos dd.avec-bouton>.btn{margin-left:0}}
/* maj156 (Yoann) : sur ordinateur, boutons du suivi en colonne juste après le texte (colonne de texte fixe), plus tout à droite */
@media(min-width:601px){dl.infos dd.avec-bouton{display:grid;grid-template-columns:15rem 13.5rem;align-items:center;gap:.6rem}
dl.infos dd.avec-bouton>.btn{margin-left:0;min-width:0;width:100%;box-sizing:border-box}}
/* maj157 (Yoann) : rubrique Prix, une ligne « Pension » et une ligne « Garderie » (case à cocher puis les prix) */
.offre{display:flex;flex-wrap:nowrap;align-items:flex-end;column-gap:1rem;margin-bottom:.4rem}
.offre>label{margin-bottom:.4rem;min-width:0}
.offre .montant input{width:6.5rem;max-width:6.5rem}
.offre>.offre-case{flex:0 0 6.5rem;padding-bottom:.65rem;font-weight:600}
.offre.eteinte>.prix-col{opacity:.45}
#offre-garderie+#ajouter-tarif,#offre-pension+#ajouter-tarif{margin-top:.1rem}
@media(max-width:700px){.offre{flex-direction:column;align-items:flex-start}.offre>.offre-case{flex-basis:auto;padding-bottom:0;margin-top:.5rem}}
/* maj158 (Yoann) : statuts de réservation de la liste de l'Administration (pastille de leur couleur, comme les tags) */
.puce-tag.statut-resa{padding-right:.55rem;white-space:nowrap}
.puce-tag.statut-resa.st-annulee{color:var(--muted);text-decoration:line-through}
h1 .puce-tag.statut-resa{font-size:.9rem;vertical-align:middle}
h1 details.stmenu .menu{font-size:1rem;font-weight:400;left:0;right:auto}
details.stmenu summary:hover .puce-tag{outline:1px solid var(--c)}
details.stmenu .menu button.choix-statut{padding:.35rem .9rem}
.menu .puce-tag.statut-resa.st-annulee{text-decoration:none}  /* maj158 : pas barré dans le menu des choix */
/* maj160 (Yoann) : Gestion des tags › « Changer l'ordre » d'une liste */
.fenetre-ordre ol.liste-ordre{list-style:none;margin:.5rem 0 1rem;padding:0;max-height:60vh;overflow:auto}
.fenetre-ordre ol.liste-ordre li{display:flex;align-items:center;gap:.5rem;padding:.35rem .4rem;border-bottom:1px solid var(--line);background:var(--surface)}
.fenetre-ordre ol.liste-ordre li.archive .puce-tag{opacity:.6}
.fenetre-ordre ol.liste-ordre li.en-deplacement{outline:2px dashed var(--brass);opacity:.7}
.fenetre-ordre .poignee-ordre{cursor:grab;touch-action:none;user-select:none;color:var(--muted);font-size:1.1rem;padding:0 .2rem}
.fenetre-ordre .fleches{margin-left:auto;display:flex;gap:.25rem}
.fenetre-ordre .fleches .btn{padding:.1rem .5rem}
/* maj162 (Yoann) : fiche réservation › Prix et conditions */
.lignes-prix-fiche{width:100%;margin-bottom:.5rem}
.lignes-prix-fiche .n{text-align:right;white-space:nowrap}
.lignes-prix-fiche tr.total th{border-top:1px solid var(--line)}

/* maj175 : aperçu de l'e-mail de confirmation (Administration › Gestion des e-mails) */
.apercu-courriel{white-space:pre-wrap;font-family:inherit;font-size:.95rem;line-height:1.5;margin:0;padding:.8rem 1rem;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}
/* maj177 : horaires d'accueil (Gestion des e-mails) : début – fin sur une ligne */
.horaires-accueil .plage{display:flex;align-items:center;gap:.4rem;white-space:nowrap}
.horaires-accueil .plage input[type=time]{width:7.2rem;margin:0}
.apercu-courriel-html{display:block;width:100%;height:820px;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
/* maj179 : formulaire de réservation public (page sans barre du haut) */
body.page-publique{background:var(--bg)}
body.page-publique main{max-width:820px;padding-top:2rem}
.publique{text-align:left}
.publique .logo-publique{display:block;margin:0 auto 1.2rem;max-width:70%;height:auto;filter:var(--logo-filtre,none)}
.publique h1{text-align:center}
.publique>p.muted{text-align:center}
.publique .piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.publique .animal-demande{border-bottom:1px dashed var(--line);padding-bottom:.6rem;margin-bottom:.6rem}
.publique .horaires-publics{margin-top:.8rem;line-height:1.6;text-align:center}  /* maj186 (Yoann) : centré */
.publique .question-demande{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.2rem;margin:.6rem 0}
.publique .question-demande>span{font-weight:600;flex-basis:100%}
.questions-formulaire input:not([type=checkbox]),.questions-formulaire select,.questions-formulaire textarea{width:100%;min-width:9rem;margin:0}
.champs-formulaire td,.champs-formulaire th{text-align:center}.champs-formulaire td:first-child,.champs-formulaire th:first-child{text-align:left}
.questions-formulaire td:first-child{width:40%}
/* maj181 : éditeur de formulaire (Administration › Gestion des formulaires) */
.editeur-formulaire{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:1.2rem;align-items:start}
@media (max-width:900px){.editeur-formulaire{grid-template-columns:1fr}}
.rubrique-editeur{border:1px solid var(--line);border-left:4px solid var(--bord-neutre);border-radius:8px;padding:.7rem .8rem;margin-bottom:1rem;background:var(--surface)}
.ligne-rubrique,.ligne-champ{gap:.4rem;flex-wrap:nowrap;align-items:center}
.ligne-rubrique .titre-rubrique{font-weight:700;flex:1;margin:0}
.ligne-champ .libelle{flex:1;margin:0;min-width:6rem}
.champ-editeur{border:1px solid var(--line);border-radius:6px;padding:.45rem .5rem;margin:.45rem 0;background:var(--bg)}
.champ-editeur.verrou{border-style:dashed}
.champ-editeur .aide-champ,.champ-editeur .options-champ{margin:.35rem 0 0;font-size:.9rem;width:100%}
.poignee{cursor:grab;user-select:none;font-size:1.1rem;color:var(--muted);padding:0 .2rem}
.btn.mini{padding:.15rem .45rem;font-size:.85rem;min-width:0}
.type-champ{white-space:nowrap;font-size:.75rem}
.fin-liste{min-height:.6rem;border-radius:6px;color:var(--muted);font-size:.85rem;text-align:center}
.survol{outline:2px dashed var(--brass);outline-offset:2px}
.bloc-animaux{margin:.5rem 0 0 .8rem;padding-left:.6rem;border-left:3px solid var(--bord-chien)}
.ajout-champ{gap:.4rem;margin-top:.4rem}
.ajout-champ select{width:auto;margin:0}
.editeur-apercu{position:sticky;top:1rem;border:1px solid var(--line);border-radius:8px;padding:.6rem .8rem;max-height:80vh;overflow:auto;background:var(--bg)}
.editeur-apercu .entete-apercu{font-weight:700;color:var(--muted);margin-bottom:.3rem}
.editeur-apercu fieldset.rubrique{margin:.6rem 0;padding:.3rem .7rem .6rem}
.editeur-apercu label{display:block;margin:.35rem 0;font-size:.9rem}
.editeur-apercu .apercu-animal{border-left:3px solid var(--bord-chien);padding-left:.6rem;margin:.4rem 0}
.fgrid>.question-demande,.fgrid>p{grid-column:span var(--w,12);min-width:0}
.publique .question-demande{margin:.8rem 0}
.publique .question-demande label.check{margin:0}
.ligne-options{gap:.4rem;flex-wrap:nowrap;align-items:center;margin-top:.35rem}
.ligne-options .aide-champ{flex:1;margin:0}
.ligne-options .largeur-champ{width:auto;margin:0;padding:.2rem .3rem;font-size:.8rem}
/* maj188 : rubriques repliables (Gestion des e-mails) : clic sur le titre */
details.repliable>summary.entete{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
details.repliable>summary.entete::-webkit-details-marker{display:none}
details.repliable>summary.entete::after{content:"▸ Ouvrir";font-weight:400;font-size:.85rem;color:var(--muted)}
details.repliable[open]>summary.entete::after{content:"▾ Fermer"}
details.repliable:not([open]){padding-bottom:0}
details.repliable:not([open])>summary.entete{margin-bottom:0;border-bottom:0}
/* maj194 (Yoann) : icônes animées (_anim.html) : vert = validé, rouge = refusé / erreur, jaune = attention */
.anim{display:inline-block;vertical-align:middle;flex:none}
.anim-trait{fill:none;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.anim-ok .anim-trait{stroke:var(--vert)}
.anim-erreur .anim-trait{stroke:var(--erreur-vive)}
.anim-attention .anim-trait{stroke:var(--brass)}
.anim-attention circle{fill:var(--brass)}
.anim-cercle{stroke-dasharray:240;stroke-dashoffset:240;animation:anim-dessin .6s ease-out forwards}
.anim-vu{stroke-dasharray:60;stroke-dashoffset:60;animation:anim-dessin .4s .55s ease-out forwards}
.anim-x1,.anim-x2{stroke-dasharray:50;stroke-dashoffset:50}
.anim-x1{animation:anim-dessin .3s .55s ease-out forwards}
.anim-x2{animation:anim-dessin .3s .8s ease-out forwards}
.anim-tri{stroke-dasharray:260;stroke-dashoffset:260;animation:anim-dessin .7s ease-out forwards}
.anim-excl{opacity:0;animation:anim-apparait .2s .7s forwards,anim-battre 1.2s 1s ease-in-out infinite}
@keyframes anim-dessin{to{stroke-dashoffset:0}}
@keyframes anim-apparait{to{opacity:1}}
@keyframes anim-battre{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.anim *{animation:none!important;stroke-dashoffset:0!important;opacity:1!important}}
.fenetre .anim-titre{display:flex;align-items:center;gap:.7rem}
.flash .anim{margin-right:.45rem}
.flash.avec-anim{display:flex;align-items:center}
/* maj196 (Yoann) : corriger une pesée (Soins › Suivi des pesées) */
tr.pesee-modif>td{background:var(--tint)}
tr.pesee-modif label{margin:0}
/* maj198 (Yoann) : accueil, « dont N demandes du site web » dans le bloc en attente de validation */
.stats.blocs .lien-demandes{display:block;font-size:.85rem;margin:.2rem 0 .3rem}

/* maj312 (Yoann) : thème d'essai « Oshimo (essai) » retiré (police Baloo 2, têtes de loup / chat de l'accueil).
   Tous les thèmes : emojis 🐶 🐱 sous le graphique et en tête des blocs Aujourd'hui. */
.bar .totaux .t-chiens::before{content:"🐶"}
.bar .totaux .t-chats::before{content:"🐱"}
.bilan.bord-chien h3::before{content:"🐶";margin-right:.45rem}
.bilan.bord-chat h3::before{content:"🐱";margin-right:.45rem}
/* maj206 (Yoann) : nombre de choses à faire aujourd'hui sur les onglets de Soins */
.pastille-onglet{display:inline-block;min-width:1.35rem;margin-left:.45rem;padding:0 .4rem;border-radius:999px;background:var(--btn-fond);color:var(--btn-texte);font-size:.78rem;font-weight:700;line-height:1.35rem;text-align:center;vertical-align:1px}
/* maj207 (Yoann) : accueil, tableaux « en attente d'acompte » (gauche) et « à valider » (droite) sous « Aujourd'hui » */
.bilans.recaps{margin-top:1rem}
.card.recap-resa{margin:0;border-left:5px solid var(--bord-neutre);min-width:0}
.card.recap-resa.acompte{border-left-color:var(--acompte)}
.card.recap-resa h3{margin:0 0 .5rem}
.card.recap-resa table{margin:0}
.card.recap-resa .nowrap{white-space:nowrap}
.card.recap-resa .lien-recap{margin:.6rem 0 0;text-align:right;font-size:.9rem}
.card.recap-resa .statut-resa{font-size:.75rem;margin-top:.2rem}
.bilans.recaps{align-items:start}
/* maj207 (Yoann) : titres de l'accueil uniformes, ocre comme « Gestion des réservations » */
h2.titre-accueil{color:var(--pine)}
/* maj210 (Yoann) : vaccins : « Date de vaccination » (avec « Expire dans x jours » dessous) et « Vacciné par » */
.bloc-vaccins .vaccin{align-items:flex-start}
.bloc-vaccins .vac-champ{display:flex;flex-direction:column;gap:.15rem;margin:0;font-size:.85rem;color:var(--muted)}
.bloc-vaccins .vac-champ input{margin:0;color:var(--ink)}
.bloc-vaccins .vac-champ input[name=vaccin_veto]{width:15rem}
.bloc-vaccins .expire{font-size:.8rem;color:var(--muted);min-height:1em}
.bloc-vaccins .expire.bad{color:var(--red)}
.bloc-vaccins .vaccin select{margin-top:1.15rem}.bloc-vaccins .vaccin .retirer{margin-top:1.3rem}
.historique-vaccins{margin-top:.5rem;font-size:.9rem}
.historique-vaccins summary{cursor:pointer;color:var(--pine);font-weight:600}
.historique-vaccins ul{margin:.3rem 0 0;padding-left:1.2rem;color:var(--muted)}
.historique-vaccins b{color:var(--ink);font-weight:600}
.bloc-vaccins .vaccin.ancien-rappel{opacity:.55}
.bloc-vaccins .vaccin .rappel{margin-top:1.15rem}
.bloc-vaccins .vaccin.ancien-rappel .retirer{visibility:hidden}
/* maj211 (Yoann) : « Vétérinaire référent » entre « Vaccins » et le premier vaccin */
.bloc-vaccins .vet-referent{display:flex;flex-direction:column;gap:.15rem;margin:0 0 .7rem;max-width:32rem;font-size:.85rem;color:var(--muted)}
.bloc-vaccins .vet-referent input{margin:0;color:var(--ink)}
/* maj212 (Yoann) : vaccins à cocher (plusieurs par vaccination) */
/* maj213 : les cases sont dans une liste déroulante (details.choix-vaccins, même style que « Fréquence ») */
.bloc-vaccins .choix-vaccins{width:15rem}
.bloc-vaccins .choix-vaccins summary{border-color:var(--champ-bord)}
.bloc-vaccins .choix-vaccins .menu{min-width:15rem}
.bloc-vaccins .case-vaccin{color:var(--ink)}
.bloc-vaccins .case-vaccin input{margin:0;width:auto}
.bloc-vaccins .vaccin{padding-bottom:.6rem;border-bottom:1px solid var(--line)}
.bloc-vaccins .vaccin .vac-champ,.bloc-vaccins .vaccin .rappel,.bloc-vaccins .vaccin .retirer{margin-top:0}
/* maj214 (Yoann) : Garderie de jour, vaccins à renouveler */
.flash.rappel-vaccins ul{margin:.3rem 0 0;padding-left:1.2rem}
.flash.rappel-vaccins .bad{color:var(--red)}
/* maj215 (Yoann) : boutons des rappels de vaccins (OK / 10 jours / Ne plus afficher) */
.rappel-vaccins ul,.rappel-vaccins-liste ul{list-style:none;padding-left:0}
.ligne-rappel{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.3rem .8rem;padding:.35rem 0;border-bottom:1px solid var(--line)}
.ligne-rappel:last-child{border-bottom:none}
.boutons-rappel{display:flex;gap:.3rem;flex-wrap:wrap}
.rappel-vaccins-liste .bad{color:var(--red)}
.flash.info-rappels{background:var(--tint);color:var(--ink)}
.rappels-masques{margin-top:.3rem}.rappels-masques summary{cursor:pointer;font-size:.9rem;color:var(--muted)}
/* maj216 (Yoann) : rappel de vaccin envoyé au client */
.ligne-rappel .envoi-ok{color:var(--ok-texte)}
.ligne-rappel .bad{color:var(--red)}
/* maj219 : bouton grisé dans la fenêtre Oshimo (action impossible) */
#fenetre-question button:disabled{opacity:.45;cursor:not-allowed}
/* maj220 : fenêtre de question un peu plus large quand elle a un lien en plus (3 boutons sur une ligne) */
dialog.fenetre#fenetre-question{max-width:min(36rem,calc(100vw - 2rem))}
/* maj222 (Yoann) : Administration › Sauvegardes */
.cartes-sauvegarde{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-top:.8rem}
.cartes-sauvegarde .card{margin:0;display:flex;flex-direction:column;gap:.6rem;align-items:flex-start}
.cartes-sauvegarde h3{margin:0;color:var(--pine)}.cartes-sauvegarde p{margin:0;flex:1}
.cartes-sauvegarde form{display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}
/* maj225 : clés YubiKey (Mon compte, Administration › compte) */
.modes-connexion.mon-compte{grid-template-columns:repeat(2,1fr)}
.modes-connexion.mon-compte .carte-cles{grid-column:1/-1}
@media(max-width:900px){.modes-connexion.mon-compte{grid-template-columns:1fr}}
table.liste-cles{width:100%;margin:.6rem 0}
table.liste-cles td{vertical-align:middle}
table.liste-cles .actions-cle{display:flex;gap:.6rem;align-items:flex-start;justify-content:flex-end;flex-wrap:wrap}
table.liste-cles details.renommer-cle{border:0;margin:0;padding:0}
table.liste-cles details.renommer-cle summary{font-weight:normal}
table.liste-cles details.renommer-cle form{margin-top:.4rem;gap:.4rem}
form.ajout-cle{margin-top:.8rem}
form.ajout-cle .row{align-items:flex-end;gap:.8rem}
form.ajout-cle label{margin:0;flex:0 1 18rem}
form.ajout-cle .petit-texte{text-align:left}
.modes-connexion .carte-cles form.ajout-cle{margin-top:.8rem}
a.who{text-decoration:none}a.who:hover{text-decoration:underline}
.notifications .menu a.lien-mon-compte{border-top:1px solid var(--line);margin-top:.3rem;padding-top:.5rem}
/* maj227 : réservation : date + moment (matin / midi / soir) côte à côte */
.date-moment{display:flex;gap:.4rem}
.date-moment input[type=date]{flex:1 1 auto;min-width:0}
.date-moment select{flex:0 0 auto;width:auto}
/* maj228 : rubrique « Soins » de la réservation : un bloc par animal ; « Garder pour les prochaines réservations » sous la ligne */
.soins-resa .soins-animal{border-top:1px solid var(--line);padding-top:.6rem;margin-top:.6rem}
.soins-resa .soins-animal:first-of-type{border-top:0;margin-top:0}
.soins-resa .soins-animal h3{margin:.2rem 0 .4rem;font-size:1.05rem;color:var(--pine)}
.soins-resa .bloc-soins .soin{row-gap:.15rem;margin-bottom:.7rem}
.soins-resa .garder-soin{grid-column:1 / span 3;grid-row:2;display:flex;align-items:center;gap:.4rem;margin:0;font-size:.85rem;font-weight:400;color:var(--muted)}
.soins-resa .garder-soin input{margin:0;width:auto}
/* maj230 : supplément « Autre (libellé libre) » : la case du libellé à côté de la liste */
.supplement .supplement-libre{flex:1;margin-top:0;min-width:0}  /* maj231 : à la place de la liste */
.supplement .retour-liste{text-decoration:none;padding:0 .2rem;margin-left:-.4rem}
/* maj234 : carte Personnel : identifiant et mot de passe en haut (comme Collaborateurs), « ou », puis la clé */
.ou-cle{display:flex;align-items:center;gap:.6rem;margin:1rem 0 .6rem;color:var(--muted);font-size:.85rem}
.ou-cle::before,.ou-cle::after{content:"";flex:1;border-top:1px solid var(--line)}
.carte-connexion form.mdp-personnel{display:flex;flex-direction:column}  /* mêmes espacements que la carte Collaborateurs */
/* maj236 : choix de la couleur d'un collaborateur (pastilles) */
.champ-couleur .titre-champ{display:block;font-weight:600;margin-bottom:.35rem}
.choix-couleur-collab{display:flex;flex-wrap:wrap;gap:.4rem}
.pastille-couleur{display:inline-flex;align-items:center;gap:.3rem;margin:0;padding:.2rem .6rem;border-radius:12px;font-size:.85rem;font-weight:600;cursor:pointer;border:2px solid transparent}
.pastille-couleur.auto{background:var(--tint);color:var(--muted)}
.pastille-couleur input{position:absolute;opacity:0;pointer-events:none}
.pastille-couleur:has(input:checked){border-color:currentColor;box-shadow:0 0 0 2px var(--surface) inset}
.pastille-couleur:has(input:focus-visible){outline:2px solid var(--pine);outline-offset:2px}
.fgrid>.champ-couleur{grid-column:1/-1;margin:.4rem 0}
/* maj237 : planning : journée de cours / formation à l'extérieur (type + note sous le nom, quand la personne est cochée) */
table.calendrier-presences .ligne-presence .infos-jour{display:none;gap:.25rem;margin:0 0 .3rem 1.6rem}
table.calendrier-presences .ligne-presence:has(input[type=checkbox]:checked) .infos-jour:not([hidden]){display:flex;flex-wrap:wrap}
table.calendrier-presences label.presence .type-jour{display:none;flex:0 0 auto;width:auto;margin:0;padding:.05rem .2rem;font-size:.75rem}
table.calendrier-presences label.presence:has(input[type=checkbox]:checked) .type-jour{display:inline-block}  /* maj238 : à gauche du nom */
table.calendrier-presences .infos-jour select,table.calendrier-presences .infos-jour input{margin:0;padding:.15rem .3rem;font-size:.78rem;min-width:0;flex:1 1 7rem}
table.calendrier-presences .puce.hors-chenil{background:transparent;border:1.5px dashed var(--pc)}
.mon-planning .jour-travail.hors-chenil{border-style:dashed;background:transparent}
.note-jour-planning{display:block;font-size:.75rem;color:var(--muted);margin-top:.15rem}
details.menu-presences .liste{min-width:17rem}  /* maj237 : place pour le type de journée et la note */
/* maj239 : apprentis (fiche collaborateur) et vacances scolaires (planning) */
.fgrid>.champ-apprenti{grid-column:1/-1;margin:.4rem 0}
.champ-apprenti .case{display:flex;align-items:center;gap:.45rem;font-weight:600}
.champ-apprenti .case input{width:1.15rem;height:1.15rem;margin:0;accent-color:var(--pine)}
.champ-apprenti .jours-epsic{display:none;margin-top:.5rem}
.champ-apprenti:has(input[name=apprenti]:checked) .jours-epsic{display:block}
.champ-apprenti .jours-epsic .row{gap:.6rem;flex-wrap:wrap}
.champ-apprenti .jours-epsic label{margin:0;font-size:.85rem;flex:1 1 8rem}
table.calendrier-presences td.vacances-scolaires .tete-case b::after{content:" · vac. scol.";font-weight:400;font-size:.7rem;color:var(--muted)}
.champ-apprenti .jours-epsic .titre-champ{display:block;font-weight:600;margin-bottom:.3rem}
/* maj240 : planning : jour férié (Administration › Calendrier) */
table.calendrier-presences td.jour-ferie{background:var(--tint)}
table.calendrier-presences td.jour-ferie .tete-case b::after{content:" · férié";font-weight:400;font-size:.7rem;color:var(--muted)}
.calendrier-admin input{margin:0}
/* maj243 : accueil : période choisie (Du … au …), résumé, graphique qui défile quand il y a beaucoup de jours */
.plage-accueil{gap:.6rem;align-items:flex-end;justify-content:flex-start;margin:.2rem 0 .6rem}
.plage-accueil>*{flex:0 0 auto}
.plage-accueil label{margin:0;font-size:.85rem}
.plage-accueil input{margin-top:.15rem;width:auto}
.resume-periode{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;margin:.4rem 0 .8rem}
.resume-periode .card{padding:.8rem 1rem}
.resume-periode h3{margin:0 0 .3rem;font-size:1rem}
.resume-periode ul{margin:0;padding-left:1.1rem}
.defile-occupation{overflow-x:auto}
.bars.occupation.nombreux{min-width:calc(var(--nb, 30) * 2.6rem);gap:.25rem}
.bars.occupation.nombreux .totaux{font-size:.7rem}
.bars.occupation.nombreux .lab{font-size:.68rem}
form.row.plage-accueil>label,form.row.plage-accueil>button,form.row.plage-accueil>a{flex:0 0 auto;width:auto}
/* maj243 : titre « Occupation » à gauche, choix des dates à droite (aligné avec « Nouvelle réservation ») */
.tete-occupation{align-items:flex-end;gap:.4rem 1rem}
.tete-occupation>h2{margin-bottom:.3rem}
.tete-occupation>form.plage-accueil{margin:0 0 .4rem auto}
/* maj244 (Yoann) : plage de dates : Du / Au sur une seule ligne, centrés sur le titre ; bulle de détail jamais coupée */
.tete-occupation{align-items:center;margin-top:1.4rem}
.tete-occupation>h2{margin:0}
.tete-occupation>form.plage-accueil{margin:0 0 0 auto;align-items:center}
form.row.plage-accueil>label{display:flex;align-items:center;gap:.35rem;font-size:.9rem}
.plage-accueil input{margin-top:0}
.tete-occupation+*{margin-top:.6rem}
.defile-occupation{overflow-x:visible}
.defile-occupation:has(.bars.nombreux){overflow-x:auto}
/* graphique qui défile : bulle à côté de la barre (en haut), pas au-dessus, sinon le cadre qui défile la coupe */
.bars.occupation.nombreux .bar .paire .col .bulle{bottom:auto;top:0;left:calc(100% + 6px);right:auto;transform:none}
.bars.occupation.nombreux .bar:nth-last-child(-n+3) .col .bulle{left:auto;right:calc(100% + 6px)}
/* maj245 (Yoann) : changement de période sur l'accueil sans recharger : léger fondu pendant le chargement */
#bloc-occupation{transition:opacity .15s}
#bloc-occupation.chargement{opacity:.55}
/* maj246 (Yoann) : bulle de l'occupation : une ligne par étage (présents, arrivent, partent). Survol (ou toucher) d'un
   étage : le script note l'étage dans data-voir et sa hauteur dans --haut ; seule sa ligne reste, la bulle se colle
   à droite du haut de l'étage (à gauche pour les derniers jours) et l'étage est en surbrillance. À côté des étages :
   bulle complète au-dessus, comme avant. */
.bar .paire .col .bulle :is(.l-presents,.l-arrivent,.l-partent,.l-valider){display:block}
.bar .paire .col[data-voir="presents"] .bulle :is(.l-arrivent,.l-partent,.l-valider),
.bar .paire .col[data-voir="arrivent"] .bulle :is(.l-presents,.l-partent,.l-valider),
.bar .paire .col[data-voir="partent"] .bulle :is(.l-presents,.l-arrivent,.l-valider){display:none}
.bars.occupation .bar .paire .col[data-voir] .bulle{top:var(--haut,0);bottom:auto;left:calc(100% + 9px);right:auto;transform:none;
  min-width:0;white-space:nowrap;border-left-width:1px}
.bars.occupation .bar .paire .col[data-voir] .bulle::before{content:"";position:absolute;top:7px;left:-7px;
  border:6px solid transparent;border-left:0;border-right-color:var(--line)}
.bars.occupation .bar:nth-last-child(-n+3) .paire .col[data-voir] .bulle{left:auto;right:calc(100% + 9px)}
.bars.occupation .bar:nth-last-child(-n+3) .paire .col[data-voir] .bulle::before{left:auto;right:-7px;border-left:6px solid var(--line);border-right:0}
.bar .paire .col i{transition:filter .1s}
.bar .paire .col[data-voir="presents"] i.presents,
.bar .paire .col[data-voir="arrivent"] i.arrivent,
.bar .paire .col[data-voir="partent"] i.partent{filter:brightness(1.12) saturate(1.25);position:relative;z-index:1;
  box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--esp)}
/* maj248 (Yoann) : Administration › Tags : « · pour les animaux / clients / réservations » à côté du titre de chaque liste */
.sous-titre .pour-qui{font-weight:400;font-size:.85em}
/* maj251 (Yoann) : menu ouvert près du bas de la fenêtre (ex. statut de la dernière réservation) : il s'ouvre vers le haut */
details.stmenu.vers-haut>.menu{top:auto;bottom:calc(100% + 4px)}
/* maj252 (Yoann) : icône d'un tag ou d'un marquage (--ico, posée par style_puce) à la place du rond de couleur ;
   la couleur reste sur le bord de la puce */
.puce-tag[style*="--ico"]::before{width:1.05rem;height:1.05rem;border-radius:3px;background:var(--ico) center/contain no-repeat}
.pastille-code[style*="--ico"]{background:var(--ico) center/contain no-repeat!important;border:0;border-radius:3px}
.choix-icone{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:.6rem 0}
.choix-icone .apercu-icone{width:1.6rem;height:1.6rem}
.choix-icone .btn input[type=file]{display:none}
/* maj253 (Yoann) : historique des soins par séjour (fiche et formulaire de l'animal) */
.historique-soins{display:grid;gap:.4rem}
.sejour-soins{border:1px solid var(--line);border-radius:6px;padding:.35rem .7rem;background:var(--surface)}
.sejour-soins>summary{cursor:pointer;font-weight:600}
.sejour-soins .deux-genres{display:grid;grid-template-columns:1fr 1fr;gap:.4rem 1.2rem;margin:.4rem 0}
.sejour-soins ul{margin:.2rem 0;padding-left:1.1rem}
.sejour-soins p{margin:.2rem 0}
.sejour-soins .lien-sejour{text-align:right;font-size:.9rem}
@media (max-width:700px){.sejour-soins .deux-genres{grid-template-columns:1fr}}
/* maj254 (Yoann) : « Anciens séjours (N) » : les séjours précédents rangés dans un bloc qui se déroule au clic */
.anciens-sejours>summary{cursor:pointer;font-weight:600;padding:.35rem .7rem;border:1px dashed var(--line);border-radius:6px}
.anciens-sejours[open]>summary{margin-bottom:.4rem}
.anciens-sejours>.historique-soins{padding-left:.8rem;border-left:2px solid var(--line)}
/* maj256 (Yoann) : page d'une réservation : rubrique « Soins » (repas, traitements, bilan des prises) par animal */
.soins-resa-fiche .soins-animal{border-top:1px solid var(--line);padding-top:.4rem;margin-top:.4rem}
.soins-resa-fiche .soins-animal:first-of-type{border-top:0;margin-top:0}
.soins-resa-fiche h3{margin:.2rem 0}
.soins-resa-fiche .deux-genres{display:grid;grid-template-columns:1fr 1fr;gap:.4rem 1.2rem}
.soins-resa-fiche ul{margin:.2rem 0;padding-left:1.1rem}
.soins-resa-fiche p{margin:.2rem 0}
@media (max-width:700px){.soins-resa-fiche .deux-genres{grid-template-columns:1fr}}
/* maj270 (Yoann) : traitements permanents (fiche, réservation, Soins) */
.tag-permanent{background:var(--tint);color:var(--ink);font-weight:600;font-size:.75rem}
.moments-permanent{display:flex;gap:.7rem;flex-wrap:wrap}
.moments-permanent label{margin:0}
.liste-permanents{margin:0;padding-left:1.1rem}
.ligne-permanent{margin:.1rem 0 .4rem}
/* maj275 (Yoann) : loupe de la barre du haut : recherche sur tout le programme */
header details.recherche-globale .icone{width:20px;height:20px;margin:0}
details.recherche-globale summary{display:flex;align-items:center;padding:.3rem;border-radius:50%;color:var(--entete-texte)}
details.recherche-globale summary:hover,details.recherche-globale[open] summary{background:rgba(128,128,128,.25)}
header form:has(.recherche-globale){gap:.45rem}
header details.recherche-globale .menu{width:min(30rem,calc(100vw - 2rem));padding:.6rem;max-height:calc(100vh - 6rem);overflow-y:auto}
#rg-champ{width:100%;margin:0}
#rg-resultats .rg-vide{margin:.6rem .3rem .2rem;color:var(--muted);font-size:.9rem}
#rg-resultats .rg-titre{margin:.7rem .3rem .15rem;font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
header details.stmenu #rg-resultats a.rg-ligne{display:block;margin:0;padding:.4rem .5rem;border:0;border-radius:4px;color:var(--ink);font-size:1rem}
#rg-resultats a.rg-ligne small{display:block;color:var(--muted);font-size:.82rem}
header details.stmenu #rg-resultats a.rg-ligne:hover,header details.stmenu #rg-resultats a.rg-ligne.rg-choisi{background:var(--tint)}
@media(max-width:700px){details.recherche-globale{position:static}header details.recherche-globale .menu{left:1rem;right:1rem;top:auto;width:auto}}
/* maj277 (Yoann) : menu « Grouper par » rangé en rubriques */
details.grpmenu .menu-rubrique{font-size:.82rem;font-weight:700;color:var(--pine);padding:.55rem .9rem .1rem;border-top:1px solid var(--line);margin-top:.3rem}
details.grpmenu .menu-titre+.menu-rubrique{border-top:0;margin-top:0;padding-top:.2rem}
details.grpmenu:has(.menu-rubrique) .menu a:not(.aucun){padding:.3rem .9rem .3rem 1.3rem}
/* maj279 (Yoann) : acomptes de la réservation */
.lignes-acomptes .c-jour{width:9.5rem}.lignes-acomptes .c-moyen{width:10rem}
.lignes-acomptes select,.lignes-acomptes input{margin:0}
.lignes-acomptes .retirer-acompte{background:none;border:0;color:var(--red);font-size:1.2rem;cursor:pointer}
.reste-a-payer{text-align:right;margin:.6rem 0 0}
@media(max-width:700px){table.lignes-acomptes{min-width:0}.lignes-acomptes .court{text-align:left}.acomptes-resa{min-width:0}.lignes-acomptes,.lignes-acomptes tbody,.lignes-acomptes tr,.lignes-acomptes td{display:block;width:auto}.lignes-acomptes thead,.lignes-acomptes colgroup{display:none}.lignes-acomptes td{border:0;padding:.2rem 0;text-align:left}.lignes-acomptes tr{padding:.4rem 0;border-bottom:1px solid var(--line)}.lignes-acomptes .court{width:100%}}
/* maj281 (Yoann) : même écart (.5rem) au-dessus de tous les boutons « + Ajouter… » */
.soins-resa .lignes-soins .soin:last-child{margin-bottom:.5rem}
.bloc-soins .lignes-soins:not(:has(.soin))~.ajouter-soin{margin-top:.15rem}
#ajouter-animal{margin-top:-.125rem}
/* maj282 (Yoann) : date limite de paiement de l'acompte */
.limite-acompte{display:grid;grid-template-columns:repeat(2,minmax(0,16rem));gap:1rem;margin-top:.2rem}
@media(max-width:700px){.limite-acompte{grid-template-columns:1fr}}
/* maj288 (Yoann) : barre de défilement toujours réservée : ouvrir une rubrique ne décale plus la page */
html{overflow-y:scroll}
/* maj303 (Yoann) : Soins › Suivi nourriture */
table.suivi-repas td.c,table.suivi-repas th.c{text-align:center;width:4.2rem}
.case-repas{width:3rem;height:2.6rem;border:1px solid var(--line);border-radius:6px;background:var(--surface);font:inherit;font-size:1.25rem;font-weight:700;cursor:pointer;color:var(--ink)}
.case-repas.etat-tout,.etat-tout{color:var(--vert)}.case-repas.etat-tout{background:var(--ok-doux);border-color:var(--vert)}
.case-repas.etat-partie,.etat-partie{color:var(--attente-texte)}.case-repas.etat-partie{background:var(--attente-fond);border-color:var(--brass)}
.case-repas.etat-rien,.etat-rien{color:var(--red)}.case-repas.etat-rien{background:var(--alerte-fond);border-color:var(--red)}
table.suivi-repas .remarque-repas{margin:0;min-width:10rem}
table.suivi-repas tr.alerte-repas>:is(th,td){background:color-mix(in srgb,var(--red) 9%,transparent)} /* maj305 : fond rosé, la marge espèce reste visible */
@media(max-width:700px){table.suivi-repas .remarque-repas{min-width:0}}
/* maj305 (Yoann) : colonnes de même largeur dans les tableaux chiens et chats */
table.suivi-repas{table-layout:fixed;width:100%}
table.suivi-repas col.c-animal{width:26%}table.suivi-repas col.c-case{width:4.6rem}
@media(max-width:700px){table.suivi-repas{table-layout:auto}}

/* maj306 (Yoann) : Sorties des chats, flèches ‹ › , choix Jour / Semaine et vue Semaine */
.navjour .fleche{min-width:2.2rem;text-align:center;font-size:1.05rem;padding-left:.5rem;padding-right:.5rem}
.navjour .fleche.inactif{opacity:.35;pointer-events:none}
.choix-vue{display:inline-flex;border:1px solid var(--champ-bord);border-radius:8px;overflow:hidden;margin-left:.4rem;background:var(--surface)}
.choix-vue a{padding:.28rem .7rem;font-size:.88rem;text-decoration:none;color:var(--ink)}
.choix-vue a+a{border-left:1px solid var(--champ-bord)}
.choix-vue a.actif{background:var(--pine);color:var(--sur-accent);font-weight:600}
table.soins-semaine{table-layout:fixed;width:100%;min-width:640px}
table.soins-semaine col.c-nom{width:20%}
table.soins-semaine th{text-align:center}table.soins-semaine th:first-child{text-align:left}
table.soins-semaine th.aujourdhui{box-shadow:inset 0 -3px 0 var(--pine)}
td.case-semaine{text-align:center;padding:.35rem .25rem}
td.case-semaine a{display:block;text-decoration:none;border-radius:6px;padding:.3rem .2rem;line-height:1.25}
td.case-semaine small{opacity:.8}
td.case-semaine.ok a{background:var(--ok-fond);color:var(--ok-texte)}
td.case-semaine.manque a{background:var(--alerte-fond);color:var(--alerte-texte)}
td.case-semaine.en-cours a{background:var(--attente-fond);color:var(--attente-texte)}
td.case-semaine.vide{color:var(--muted)}
td.case-semaine.neutre a{background:var(--tint);color:var(--ink)}
.pastille-l.neutre{background:var(--tint)}
.legende-semaine{font-size:.85rem;margin-top:.6rem}
.pastille-l{display:inline-block;width:.8rem;height:.8rem;border-radius:3px;vertical-align:-1px}
.pastille-l.ok{background:var(--ok-fond)}.pastille-l.manque{background:var(--alerte-fond)}.pastille-l.en-cours{background:var(--attente-fond)}
.navjour .fleche,.navjour .choix-vue{flex:0 0 auto;width:auto}

/* maj307 (Yoann) : iPad de pesée */
.pesee-ipad .carte-connexion{max-width:26rem;margin:0 auto}
.pesee-ipad h1{font-size:1.4rem;margin:0 0 .3rem}
.code-pesee{font-size:1.4rem;letter-spacing:.15em;text-transform:uppercase;text-align:center}
.code-pesee-affiche{font-size:2rem;letter-spacing:.2em;font-weight:700;font-family:ui-monospace,Menlo,monospace}
.btn-fini{font-weight:600}
/* maj307 : page des pesées sur iPad (debout ou couché) : tout tient dans la largeur, sans glisser sur le côté */
@media (min-width:701px) and (max-width:1180px){
  table.pesees-liste th:nth-child(2),table.pesees-liste td:nth-child(2){display:none}
  table.pesees-liste input[type=date]{width:9.4rem!important}
  table.pesees-liste input[name=poids_kg]{width:5.2rem!important}
  table.pesees-liste form.row{flex-wrap:wrap;gap:.4rem}
}
.champ-masque{-webkit-text-security:disc;text-security:disc;font-family:text-security-disc,inherit} /* maj307 : mot de passe masqué sans champ « password » (pas d'enregistrement) */
.liste-retires .croix-retire{background:none;border:0;color:var(--muted);font-size:1.1rem;line-height:1;padding:0 .3rem;cursor:pointer;vertical-align:-1px} /* maj308 */
.liste-retires .croix-retire:hover{color:var(--red)}

/* maj311 (Yoann) : Profils et droits, « figer les volets » : le tableau défile dans son cadre, la ligne des profils
   reste en haut et la colonne des niveaux d'accès reste à gauche */
.defile-droits{max-height:calc(100vh - 8rem);overflow:auto;border:1px solid var(--line);border-radius:4px}
.defile-droits table.droits{border:0}
table.droits tr.tete-droits>th{position:sticky;top:0;z-index:3;background:var(--tint);box-shadow:inset 0 -2px 0 var(--champ-bord)}
table.droits tr>:first-child{position:sticky;left:0;z-index:2;background:var(--surface)}
table.droits tr.grp>th:first-child{background:var(--groupe-fond)}
table.droits tr.tete-droits>th:first-child{z-index:4;background:var(--tint)}
table.droits tr:not(.grp)>td:first-child{box-shadow:inset -1px 0 0 var(--line)}
table.droits tr:not(.grp)>td:first-child{min-width:18rem}@media(max-width:700px){table.droits tr:not(.grp)>td:first-child{min-width:10rem}}

/* ---------- maj313 (Yoann) : thème « Liquid Glass » (data-theme=verre), variante « Givre chaud » choisie le 07.11.2026.
   4e choix du menu ◐, EN PLUS de Clair et Sombre. Couleurs du thème Clair (ocre, émeraude chiens, turquoise chats),
   fond gris crème avec une légère lueur ocre, cadres en verre flou (barre du haut, cadres, blocs, tableaux, menus,
   fenêtres) ; pas de verre sur chaque ligne de tableau ni sur les champs.
   Page de connexion : inchangée (même aspect qu'en Clair). Toutes les couleurs sont ici, en variables. ---------- */
:root[data-theme=verre],:root[data-theme=systeme]{color-scheme:light;
  --bg:#f3f1ec;--surface:#fdfcfa;--line:#e6dfd3;--tint:#f5efe4;--entete-fond:transparent;
  --verre:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.38));--verre-fort:rgba(255,255,255,.92);--verre-bord:rgba(255,255,255,.95);
  --verre-ombre:0 0 0 1px rgba(120,95,60,.07),0 10px 28px rgba(70,55,35,.09),0 1px 3px rgba(70,55,35,.06);
  --verre-reflet:inset 0 1px 0 rgba(255,255,255,1),inset 0 -10px 20px -12px rgba(255,255,255,.7);
  --verre-actif:linear-gradient(180deg,rgba(255,255,255,.95),rgba(250,238,215,.85));--verre-actif-ombre:0 0 0 1px rgba(170,120,40,.18),0 2px 6px rgba(150,100,30,.12),inset 0 1px 0 #fff;--verre-flou:blur(18px) saturate(200%);
  --verre-fond:radial-gradient(900px 620px at 50% 108%,rgba(224,168,46,.42),transparent 65%),
    radial-gradient(760px 480px at 0% 0%,rgba(22,167,92,.30),transparent 62%),
    radial-gradient(760px 480px at 100% 0%,rgba(20,180,212,.32),transparent 62%),
    radial-gradient(600px 420px at 10% 70%,rgba(224,168,46,.20),transparent 62%),
    linear-gradient(180deg,#f8f4ec,#efe6d6);
  --verre-btn:linear-gradient(180deg,#c07a26,#9a5814);--verre-btn-survol:linear-gradient(180deg,#b06c1c,#8a4e10);
  --verre-th:rgba(245,239,228,.65);--verre-ombre-fort:0 16px 40px rgba(70,55,35,.18);--verre-btn-ombre:0 4px 14px rgba(150,90,20,.25)}
/* maj315 (Yoann) : « Liquid Glass sombre » (data-theme=nuit), variante « Nuit chaude » choisie le 07.11.2026, 5e choix du menu ◐.
   Couleurs du thème Sombre (ligne :root[data-theme=sombre],:root[data-theme=nuit] en haut du fichier) + verre foncé
   sur fond brun très foncé avec une lueur ocre. Mêmes règles de verre que Liquid Glass (clair) ci-dessous. */
:root[data-theme=nuit]{color-scheme:dark;
  --bg:#16120d;--surface:#211b14;--line:rgba(255,240,215,.09);--tint:rgba(255,240,215,.05);--entete-fond:transparent;
  --verre:linear-gradient(180deg,rgba(62,51,37,.55),rgba(32,26,19,.42));--verre-fort:rgba(36,30,22,.94);--verre-bord:rgba(255,240,215,.13);
  --verre-ombre:0 0 0 1px rgba(0,0,0,.35),0 12px 32px rgba(0,0,0,.45);
  --verre-reflet:inset 0 1px 0 rgba(255,240,215,.16),inset 0 -10px 20px -12px rgba(255,240,215,.05);
  --verre-actif:linear-gradient(180deg,rgba(224,168,46,.24),rgba(224,168,46,.12));--verre-actif-ombre:0 0 0 1px rgba(224,168,46,.30),inset 0 1px 0 rgba(255,240,215,.15);--verre-flou:blur(18px) saturate(200%);
  --verre-fond:radial-gradient(900px 620px at 50% 110%,rgba(224,168,46,.34),transparent 65%),
    radial-gradient(760px 480px at 0% 0%,rgba(22,167,92,.22),transparent 62%),
    radial-gradient(760px 480px at 100% 0%,rgba(20,180,212,.24),transparent 62%),
    linear-gradient(180deg,#1b1610,#120f0b);
  --verre-btn:linear-gradient(180deg,#e9b44a,#c98a1e);--verre-btn-survol:linear-gradient(180deg,#f0c060,#d39628);
  --verre-th:rgba(255,240,215,.05);--verre-ombre-fort:0 16px 40px rgba(0,0,0,.55);--verre-btn-ombre:0 4px 16px rgba(224,168,46,.25)}
/* maj316 (Yoann) : « Comme l'appareil » = Liquid Glass (clair) ou Liquid Glass sombre selon l'appareil */
@media(prefers-color-scheme:dark){:root[data-theme=systeme]{color-scheme:dark;
  --bg:#16120d;--surface:#211b14;--line:rgba(255,240,215,.09);--tint:rgba(255,240,215,.05);--entete-fond:transparent;
  --verre:linear-gradient(180deg,rgba(62,51,37,.55),rgba(32,26,19,.42));--verre-fort:rgba(36,30,22,.94);--verre-bord:rgba(255,240,215,.13);
  --verre-ombre:0 0 0 1px rgba(0,0,0,.35),0 12px 32px rgba(0,0,0,.45);
  --verre-reflet:inset 0 1px 0 rgba(255,240,215,.16),inset 0 -10px 20px -12px rgba(255,240,215,.05);
  --verre-actif:linear-gradient(180deg,rgba(224,168,46,.24),rgba(224,168,46,.12));--verre-actif-ombre:0 0 0 1px rgba(224,168,46,.30),inset 0 1px 0 rgba(255,240,215,.15);--verre-flou:blur(18px) saturate(200%);
  --verre-fond:radial-gradient(900px 620px at 50% 110%,rgba(224,168,46,.34),transparent 65%),
    radial-gradient(760px 480px at 0% 0%,rgba(22,167,92,.22),transparent 62%),
    radial-gradient(760px 480px at 100% 0%,rgba(20,180,212,.24),transparent 62%),
    linear-gradient(180deg,#1b1610,#120f0b);
  --verre-btn:linear-gradient(180deg,#e9b44a,#c98a1e);--verre-btn-survol:linear-gradient(180deg,#f0c060,#d39628);
  --verre-th:rgba(255,240,215,.05);--verre-ombre-fort:0 16px 40px rgba(0,0,0,.55);--verre-btn-ombre:0 4px 16px rgba(224,168,46,.25)}}
.pastille-theme.t-nuit{background:linear-gradient(135deg,rgba(60,50,38,.95),#16120d);box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
:root[data-theme=nuit] :is(input,select,textarea){background:rgba(0,0,0,.25)}
@media(prefers-color-scheme:dark){:root[data-theme=systeme] :is(input,select,textarea){background:rgba(0,0,0,.25)}}
.pastille-theme.t-verre{background:linear-gradient(135deg,rgba(255,255,255,.95),#efe6d6);box-shadow:inset 0 1px 0 #fff}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]){background-color:var(--bg);background-image:var(--verre-fond);background-attachment:fixed}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion){background:transparent}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) main .card,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats.blocs>*,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats>div,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .bars,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .notes,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .sejour-soins,
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .rubrique-editeur{
  background:var(--verre);-webkit-backdrop-filter:var(--verre-flou);backdrop-filter:var(--verre-flou);
  border-top-color:var(--verre-bord);border-right-color:var(--verre-bord);border-bottom-color:var(--verre-bord);
  box-shadow:var(--verre-ombre),var(--verre-reflet)}
/* la marge de couleur à gauche des cadres (chiens, chats, acompte…) est gardée telle quelle */
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header{border:1px solid var(--verre-bord)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) main .card,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .bars,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats.blocs>*,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats>div{border-radius:20px}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table{border-collapse:separate;border-spacing:0;border-radius:16px}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table th{background:var(--verre-th)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table tr:last-child>td{border-bottom:0}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table th:first-child{border-top-left-radius:15px}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table th:last-child{border-top-right-radius:15px}
/* une table dans un cadre de verre : pas de 2e couche de verre */
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) main .card table{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-color:var(--line)}
/* barre du haut : tuile flottante, collée en haut en défilant */
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header{margin:10px 10px 0;border-radius:22px;border-bottom:1px solid var(--verre-bord);position:relative;z-index:50}
@media(min-width:1240px){:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header>details.menu-affichage{right:1.1rem}}
@media(min-width:1000px){:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header{position:sticky;top:10px}:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]){scroll-padding-top:90px}}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header nav .dd.actif>:is(a,.tete){background:var(--verre-actif);border-radius:999px;box-shadow:var(--verre-actif-ombre)}
/* blocs de l'accueil : barre de couleur à gauche arrondie */
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats.blocs>*,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats>div{border-left:1px solid var(--verre-bord);position:relative;overflow:hidden}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats.blocs>*::before,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .stats>div::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:4px;border-radius:4px;background:var(--brass)}
/* menus déroulants et fenêtres : verre presque opaque, pour bien lire */
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) details.stmenu .menu,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .sub,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) .sub2,:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) dialog.fenetre{
  background:var(--verre-fort);-webkit-backdrop-filter:var(--verre-flou);backdrop-filter:var(--verre-flou);
  border:1px solid var(--verre-bord);border-radius:16px;box-shadow:var(--verre-ombre-fort),var(--verre-reflet)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) dialog.fenetre{border-radius:20px}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) dialog.fenetre::backdrop{background:rgba(60,50,35,.25);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
/* téléphone : les listes deviennent des cartes ; chaque carte en verre, pas le tableau entier */
@media(max-width:700px){
  :root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table:is(.liste-tel,.fiches-tel){background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border:0}
  :root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) main table:is(.liste-tel,.fiches-tel) tr{background:var(--verre);-webkit-backdrop-filter:var(--verre-flou);backdrop-filter:var(--verre-flou);
    border:1px solid var(--verre-bord);border-left:5px solid var(--bord-ligne,var(--bord-neutre));border-radius:16px;box-shadow:var(--verre-ombre),var(--verre-reflet)}}
/* boutons ocre arrondis, champs arrondis */
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) .btn{border-radius:999px;background:var(--verre-btn);box-shadow:var(--verre-btn-ombre),inset 0 1px 0 rgba(255,255,255,.4)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) .btn:hover{background:var(--verre-btn-survol)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) .btn.alt{background:var(--verre-fort);box-shadow:var(--verre-reflet)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) body:not(.page-connexion) .btn.stop{background:var(--red)}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) :is(input,select,textarea){border-radius:10px}
:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) input[type=checkbox],:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) input[type=radio]{border-radius:revert}
@media print{:root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]){background:none}
  :root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important}
  :root:is([data-theme=verre],[data-theme=nuit],[data-theme=systeme]) header{position:static}}
/* maj319 (Yoann) : pages larges (planning, « Mon temps de travail »…) : sur ordinateur, place réservée à droite pour le ◐
   (il passait sur « Se déconnecter », tous les thèmes ; plus visible en Liquid Glass).
   maj320 (Yoann) : mêmes marges que la barre des autres pages (maj144), pour que le logo et les liens ne bougent pas
   en passant d'une page large à une page normale. */
@media (min-width:1240px){body.page-large header{padding-left:max(1.2rem,calc((100% - 1600px)/2 + 1.2rem));padding-right:max(3.2rem,calc((100% - 1600px)/2 + 1.2rem))}}
@media (min-width:1240px) and (max-width:1450px){body.page-large header{padding-left:1rem;padding-right:3rem}}