:root{
  --noir:#1a1a1a; --gris:#6b6b6b; --gris-clair:#e7e7e7; --bg:#fafafa;
  --rose:#e7b6c4; --rose-fonce:#c97f95; --blanc:#fff;
  --r:10px; --ombre:0 1px 3px rgba(0,0,0,.08), 0 4px 16px rgba(0,0,0,.04);
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--noir);background:var(--bg);line-height:1.45}
h2{font-weight:600;letter-spacing:.01em}
.muted{color:var(--gris);font-size:.9rem}
.opt{color:var(--gris);font-weight:400;font-size:.8em}

/* Topbar */
.topbar{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding:16px 18px;background:var(--blanc);border-bottom:1px solid var(--gris-clair)}
.brand{font-weight:800;letter-spacing:.06em;font-size:1.15rem}
.brand span{font-weight:300;margin-left:2px}
.tagline{color:var(--gris);font-size:.85rem}

/* Navigation de site (Vestes / Souliers / Autres) */
.sitenav{display:flex;gap:6px;padding:10px 18px;background:var(--noir)}
.sitenav a{color:#cfcfcf;text-decoration:none;font-size:.9rem;font-weight:600;padding:7px 16px;border-radius:20px;letter-spacing:.02em}
.sitenav a:hover{color:#fff;background:rgba(255,255,255,.1)}
.sitenav a.is-active{color:var(--noir);background:#fff}

/* Tabs */
.tabs{display:flex;gap:4px;padding:0 12px;background:var(--blanc);border-bottom:1px solid var(--gris-clair);position:sticky;top:0;z-index:10}
.tab{appearance:none;border:0;background:none;padding:14px 16px;font-size:.95rem;color:var(--gris);cursor:pointer;border-bottom:2px solid transparent}
.tab.is-active{color:var(--noir);border-bottom-color:var(--rose-fonce);font-weight:600}

.tabpanel{display:none}
.tabpanel.is-active{display:block}

/* Layout sélecteur */
.layout{display:grid;grid-template-columns:260px 1fr;gap:20px;padding:18px;max-width:1200px;margin:0 auto}
@media(max-width:760px){.layout{grid-template-columns:1fr;gap:12px}}

.filters{background:var(--blanc);border:1px solid var(--gris-clair);border-radius:var(--r);padding:6px 14px 14px;align-self:start}
.filters-head{display:flex;align-items:center;justify-content:space-between;padding:10px 0 4px;position:sticky;top:49px;background:var(--blanc);z-index:1}
.filters-head span{font-weight:700;letter-spacing:.03em}
.reset-filters{appearance:none;border:1px solid var(--gris-clair);background:var(--blanc);color:var(--rose-fonce);font-size:.8rem;padding:6px 12px;border-radius:20px;cursor:pointer}
.reset-filters:hover{background:#faf3f5;border-color:var(--rose)}
.fgroup{border-bottom:1px solid var(--gris-clair);padding:12px 0}
.fgroup:last-child{border-bottom:0}
.fgroup h3{margin:0 0 8px;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--gris)}
.opt-row{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:.9rem;cursor:pointer}
.opt-row input{accent-color:var(--rose-fonce);width:16px;height:16px}
.opt-row .c{margin-left:auto;color:var(--gris);font-size:.78rem}
.opt-row.zero{opacity:.4;cursor:not-allowed}
.opt-row.zero input{cursor:not-allowed}

/* Filtre prix : deux curseurs superposés sur une piste commune */
.prix-val{font-size:.88rem;margin-bottom:10px}
.prix-val b{font-weight:700}
.prix-sliders{position:relative;height:22px;margin:0 2px}
.prix-sliders::before{content:"";position:absolute;left:0;right:0;top:9px;height:4px;border-radius:2px;background:var(--gris-clair)}
.prix-piste{position:absolute;top:9px;height:4px;border-radius:2px;background:var(--rose-fonce)}
.prix-range{position:absolute;left:0;width:100%;top:0;height:22px;margin:0;background:none;appearance:none;pointer-events:none}
.prix-range::-webkit-slider-thumb{appearance:none;width:18px;height:18px;border-radius:50%;background:var(--blanc);border:2px solid var(--rose-fonce);box-shadow:var(--ombre);cursor:grab;pointer-events:auto}
.prix-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--blanc);border:2px solid var(--rose-fonce);box-shadow:var(--ombre);cursor:grab;pointer-events:auto}
.prix-range:focus{outline:none}
.prix-range:focus::-webkit-slider-thumb{outline:2px solid var(--noir);outline-offset:2px}
.prix-note{color:var(--gris);font-size:.74rem;margin-top:9px;line-height:1.3}

.results-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
#count{font-size:.9rem;color:var(--gris)}
.link-btn{background:none;border:0;color:var(--rose-fonce);cursor:pointer;font-size:.85rem;text-decoration:underline}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.card{background:var(--blanc);border:1px solid var(--gris-clair);border-radius:var(--r);overflow:hidden;box-shadow:var(--ombre);display:flex;flex-direction:column}
.card.fronly{opacity:.55}
.card .ph{aspect-ratio:3/4;background:linear-gradient(135deg,#f2f2f2,#e9e9e9);display:flex;align-items:center;justify-content:center;color:#bbb;font-size:.8rem}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card .body{padding:10px 12px 12px}
.card .nom{font-weight:700;letter-spacing:.03em}
.card .badges{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}
.badge{font-size:.68rem;background:#f3f3f3;color:var(--gris);padding:2px 7px;border-radius:20px;white-space:nowrap}
.badge.g{background:#efe7ea;color:var(--rose-fonce)}
.card .attrs{font-size:.8rem;color:var(--gris);margin:4px 0 0}
.card .attrs b{color:var(--noir);font-weight:600}
.lien-officiel{display:inline-block;margin-top:8px;font-size:.8rem;color:var(--rose-fonce);text-decoration:none;border:1px solid var(--gris-clair);border-radius:20px;padding:5px 12px}
.lien-officiel:hover{background:#faf3f5;border-color:var(--rose)}
.flag{font-size:.7rem;color:#b58900;margin-top:6px}
.dispo-note{display:inline-block;font-size:.72rem;color:#946b00;background:#fdf6e3;border:1px solid #f0e2b6;border-radius:6px;padding:3px 8px;margin:8px 0 2px}
.grille-note{font-size:.72rem;color:var(--rose-fonce);background:#fbf1f4;border:1px solid #f0d6df;border-radius:6px;padding:5px 8px;margin-top:8px;line-height:1.3}

.empty{grid-column:1/-1;text-align:center;color:var(--gris);padding:40px 0}

/* Calculateur */
.calc{max-width:680px;margin:0 auto;padding:22px 18px}
.calc-form{display:grid;gap:14px;margin:18px 0}
.calc-form label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--gris)}
.calc-form select,.calc-form input{font-size:1rem;padding:11px 12px;border:1px solid var(--gris-clair);border-radius:8px;background:var(--blanc);color:var(--noir)}
.calc-result{background:var(--blanc);border:1px solid var(--gris-clair);border-radius:var(--r);padding:18px;box-shadow:var(--ombre)}
.calc-result .big{font-size:2.6rem;font-weight:800;letter-spacing:.02em}
.calc-result .lbl{color:var(--gris);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em}
.calc-result .note{margin-top:10px;font-size:.85rem;color:var(--gris)}
.calc-result .warn{color:#b58900}
.calc-result.alt .big{color:var(--rose-fonce)}

.calc-table-wrap{margin-top:22px}
.calc-table-wrap summary{cursor:pointer;color:var(--rose-fonce);font-size:.9rem}
table.mes{width:100%;border-collapse:collapse;margin-top:12px;font-size:.82rem}
table.mes th,table.mes td{border:1px solid var(--gris-clair);padding:6px 8px;text-align:center}
table.mes th{background:#f5f5f5;font-weight:600}
table.mes tr.hit td{background:#efe7ea;font-weight:700}

/* Bandeau « mis en valeur » (calculateur) — éventail de 3 cartes */
.fit-hero{display:flex;flex-direction:column;align-items:center;max-width:620px;margin:26px auto 6px;padding:0 18px;text-align:center}
.fit-hero-imgs{display:flex;justify-content:center;align-items:flex-end;margin-bottom:18px}
.fit-hero-imgs img{width:118px;height:150px;object-fit:cover;border-radius:14px;border:4px solid var(--blanc);box-shadow:var(--ombre);transition:transform .25s ease}
.fit-hero-imgs img:nth-child(1){transform:rotate(-9deg) translateY(10px)}
.fit-hero-imgs img:nth-child(2){margin:0 -22px;z-index:2;position:relative}
.fit-hero-imgs img:nth-child(3){transform:rotate(9deg) translateY(10px)}
.fit-hero-imgs:hover img:nth-child(1){transform:rotate(-13deg) translate(-6px,6px)}
.fit-hero-imgs:hover img:nth-child(3){transform:rotate(13deg) translate(6px,6px)}
.fit-hero-msg{margin:0;max-width:460px;font-size:1.1rem;font-weight:600;line-height:1.4;color:var(--noir)}
@media(max-width:560px){
  .fit-hero-imgs img{width:92px;height:118px}
  .fit-hero-msg{font-size:.95rem}
}

.foot{text-align:center;color:var(--gris);font-size:.78rem;padding:24px 18px 40px}

/* Page C-YOU (page d'info) */
.cyou{max-width:1100px;margin:0 auto;padding:18px}
.cyou section{margin-bottom:26px}
.cyou h2{margin:.2em 0 .4em}
.cyou h2 em{font-weight:300;font-style:normal;color:var(--rose-fonce)}
.cyou h3{font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gris);margin:0 0 12px}
.cyou p{max-width:70ch;margin:.4em 0}

.cyou-exemples{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.cyou-ex{margin:0;background:var(--blanc);border:1px solid var(--gris-clair);border-radius:var(--r);box-shadow:var(--ombre);overflow:hidden}
.cyou-ex img{display:block;width:100%}
.cyou-ex figcaption{border-top:1px solid var(--gris-clair);padding:8px 12px;font-size:.85rem}
.cyou-ex figcaption b{color:var(--rose-fonce);margin-right:5px}

/* Nuanciers : la couleur est portée en style inline par .ech (visible même si
   cette feuille n'est pas à jour dans le cache du navigateur). */
.nuancier{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px}
.nuancier li{text-align:center}
.nuancier .ech{display:block;width:100%;aspect-ratio:5/4;border-radius:8px;border:1px solid rgba(0,0,0,.16);box-shadow:var(--ombre)}
.nuancier .ech.claire{border-color:rgba(0,0,0,.24)}
.nuancier .lab{display:block;margin-top:5px;font-size:.76rem;line-height:1.25}
.nuancier .lab b{color:var(--rose-fonce);font-weight:600;margin-right:2px}

.cyou-note{background:var(--blanc);border:1px solid var(--gris-clair);border-radius:var(--r);padding:12px 16px;font-size:.85rem;color:var(--gris);margin-top:14px}
.cyou-note b{color:var(--noir)}

/* Mode vocabulaire allemand (survol) */
.trad-toggle{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:.82rem;color:var(--gris);cursor:pointer;user-select:none}
.trad-toggle input{accent-color:var(--rose-fonce);width:15px;height:15px;cursor:pointer}
.px-toggle{margin-left:auto}
.px-toggle ~ .trad-toggle{margin-left:18px}
body.trad-on .gloss{text-decoration:underline dotted var(--rose-fonce);text-underline-offset:2px;cursor:help}
.gloss .de{display:none}
body.trad-on .gloss:hover>.fr{display:none}
body.trad-on .gloss:hover>.de{display:inline;color:var(--rose-fonce);font-weight:600}

/* Origine de l'offre : sélecteur de source, pastilles de fiche, prix des deux pays */
.fsource .src-bar{display:flex;flex-wrap:wrap;gap:5px}
.src-btn{appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  font-size:.8rem;padding:5px 10px;border-radius:20px;
  border:1px solid var(--gris-clair);background:var(--blanc);color:var(--noir)}
.src-btn:hover{border-color:var(--rose)}
.src-btn .n{font-size:.72rem;color:var(--gris)}
.src-btn.is-active{background:var(--noir);border-color:var(--noir);color:#fff;font-weight:600}
.src-btn.is-active .n{color:#bdbdbd}
.src-note{color:var(--gris);font-size:.74rem;margin-top:9px;line-height:1.3}

.card .src-tags{display:flex;gap:3px;margin:6px 0 2px}
.src-tag{font-size:.64rem;letter-spacing:.02em;padding:2px 6px;border-radius:4px;
  border:1px solid transparent;white-space:nowrap}
.src-tag.on{background:var(--noir);color:#fff}
.src-tag.on.bch,.src-tag.on.bfr{background:var(--blanc);color:var(--noir);border-color:var(--noir)}
.src-tag.off{background:#f5f5f5;color:#c4c4c4;border-color:#ededed}

.card .px-ligne{margin:6px 0 0;font-size:.85rem;font-weight:600;letter-spacing:0}
.px.chf{color:var(--rose-fonce)}
.px.eur{color:var(--gris);font-weight:500}
.px-sep{color:var(--gris-clair);margin:0 6px}

.tag-fs{display:block;font-size:.72rem;color:#946b00;background:#fdf6e3;
  border:1px solid #f0e2b6;border-radius:6px;padding:3px 8px;margin:8px 0 2px}
.card .liens{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.card .liens .lien-officiel{margin-top:0}

/* Chapeau de page (Couteaux) */
.page-intro{max-width:1200px;margin:18px auto -4px;padding:0 18px;font-size:.9rem;color:var(--gris);line-height:1.5}
.page-intro b{color:var(--noir);font-weight:600}

/* Recherche par nom */
.rech-input{width:100%;font-size:.92rem;padding:8px 11px;border:1px solid var(--gris-clair);
  border-radius:8px;background:var(--blanc);color:var(--noir)}
.rech-input:focus{outline:none;border-color:var(--rose-fonce)}
.rech-ailleurs{margin-top:9px;font-size:.75rem;color:var(--gris);line-height:1.4}
.rech-ailleurs a{color:var(--rose-fonce)}

/* Sélection d'entretien */
.sel-btn{appearance:none;cursor:pointer;display:block;width:100%;margin-top:8px;
  font-size:.8rem;padding:7px 12px;border-radius:20px;
  border:1px solid var(--gris-clair);background:var(--blanc);color:var(--noir)}
.sel-btn:hover{border-color:var(--rose)}
.sel-btn.is-on{background:var(--noir);border-color:var(--noir);color:#fff;font-weight:600}
.sel-lien{margin-left:18px;font-size:.82rem;font-weight:600;color:var(--rose-fonce);
  text-decoration:none;border:1px solid var(--rose);border-radius:20px;padding:5px 13px}
.sel-lien:hover{background:#faf3f5}
.sel-lien.is-vide{color:var(--gris);border-color:var(--gris-clair);font-weight:400}

/* Page récapitulatif */
.recap{max-width:900px;margin:0 auto;padding:22px 18px 40px}
.recap-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.recap-head h2{margin:0;font-size:1.15rem}
.recap-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.recap-btn{appearance:none;cursor:pointer;font-size:.82rem;padding:7px 14px;border-radius:20px;
  border:1px solid var(--gris-clair);background:var(--blanc);color:var(--noir)}
.recap-btn:hover{border-color:var(--rose);background:#faf3f5}
.recap-entete{display:flex;gap:12px;margin:18px 0;flex-wrap:wrap}
.recap-champ-haut{display:flex;flex-direction:column;gap:6px;flex:1;min-width:210px;
  font-size:.8rem;color:var(--gris)}
.recap-champ-haut.recap-date{flex:0 0 210px}
.recap-champ-haut input,.recap-champ-haut select{font-size:.95rem;padding:10px 12px;
  border:1px solid var(--gris-clair);border-radius:8px;background:var(--blanc);
  color:var(--noir);width:100%}
.recap-champ-haut input:focus,.recap-champ-haut select:focus{outline:none;
  border-color:var(--rose-fonce)}

/* Contact du client : les coordonnées ne servent qu'au message envoyé après la visite,
   d'où le bloc à part et les deux boutons d'envoi juste dessous. */
.contact-bloc{margin-top:26px}
.contact-bloc .recap-entete{margin:12px 0 0}
.contact-civilite{flex:0 0 150px;min-width:150px}
.contact-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}
.contact-note{margin-top:10px}

.recap-ligne{display:grid;grid-template-columns:74px 1fr auto;gap:14px;align-items:start;
  background:var(--blanc);border:1px solid var(--gris-clair);border-radius:var(--r);
  padding:12px;margin-bottom:10px;box-shadow:var(--ombre)}
.recap-ph{width:74px;aspect-ratio:3/4;border-radius:6px;overflow:hidden;background:#f2f2f2}
.recap-ph img{width:100%;height:100%;object-fit:cover}
.recap-nom{font-weight:700;letter-spacing:.03em}
.recap-cat{margin-left:8px;font-weight:400;font-size:.72rem;color:var(--gris);letter-spacing:0}
.recap-dispo{font-size:.78rem;color:var(--gris);margin-top:3px}
.recap-fiche{display:inline-block;margin-top:7px;font-size:.76rem;color:var(--rose-fonce);
  text-decoration:none;border-bottom:1px solid var(--gris-clair)}
.recap-fiche:hover{border-color:var(--rose-fonce)}
/* La ligne de palette ne se saisit plus : elle dit ce que l'article pèse dans la
   commande. Un article que personne n'a pris s'efface en gris — montré, pas commandé. */
.recap-bilan{display:flex;gap:10px;align-items:baseline;margin-top:9px;flex-wrap:wrap}
.recap-pieces{font-size:.78rem;color:var(--gris)}
.recap-bilan.is-vide .recap-pieces{font-style:italic}
.recap-champs{display:flex;gap:10px;margin-top:9px;flex-wrap:wrap}
.recap-champ{display:flex;flex-direction:column;gap:3px;font-size:.7rem;color:var(--gris)}
.recap-champ.large{flex:1;min-width:170px}
.recap-champ input{font-size:.85rem;padding:6px 9px;border:1px solid var(--gris-clair);
  border-radius:6px;background:var(--blanc);color:var(--noir);width:100%}
.recap-champ input[type=number]{width:64px}
/* Même écriture que .recap-prix : le prix de la ligne et le prix à l'unité se lisent
   comme deux montants de même nature. */
.recap-sous-total{font-weight:600;font-size:.9rem;color:var(--rose-fonce);white-space:nowrap}
.recap-champ input:focus{outline:none;border-color:var(--rose-fonce)}
.recap-droite{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.recap-prix{font-weight:600;font-size:.9rem;color:var(--rose-fonce);white-space:nowrap}
.recap-sup{appearance:none;border:0;background:none;cursor:pointer;font-size:.75rem;
  color:var(--gris);text-decoration:underline;padding:0}
.recap-sup:hover{color:var(--noir)}
.recap-remarque{margin:14px 0 0}
.recap-remarque textarea{width:100%;font:inherit;font-size:.95rem;padding:10px 12px;
  border:1px solid var(--gris-clair);border-radius:var(--r);background:var(--blanc);
  color:var(--noir);resize:vertical}
.recap-remarque textarea:focus{outline:none;border-color:var(--rose-fonce)}
.recap-total{display:flex;align-items:baseline;justify-content:flex-end;gap:12px;
  padding:12px 14px;font-size:.95rem}
.recap-total b{font-size:1.3rem}
.recap-total em{font-style:normal;font-size:.72rem;color:var(--gris)}
.recap-note{color:var(--gris);font-size:.75rem;text-align:right;margin:0;line-height:1.4}
.recap .empty{padding:50px 0;line-height:1.7}

.recap-texte{width:100%;min-height:190px;margin-top:14px;font:.82rem/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  padding:12px;border:1px solid var(--gris-clair);border-radius:8px;background:var(--blanc);color:var(--noir);resize:vertical}
.recap-aide{text-align:left;margin-top:6px}

/* Équipe — articles nominatifs du récapitulatif.
   Chaque employé est un <details> : replié il tient sur une ligne, ce qui garde une
   brigade de douze lisible sur un téléphone. Les contrôles descendent en colonne sous
   560px, avec des cibles assez hautes pour le pouce. */
.recap-titre{margin:26px 0 10px;font-size:.95rem;font-weight:600}
.recap-attrib{margin-top:6px;font-size:.75rem;color:var(--rose-fonce)}
.recap-detail{font-style:normal;color:var(--gris);font-size:.8rem;margin-left:8px}

.emp{background:var(--blanc);border-radius:var(--r);box-shadow:var(--ombre);margin-bottom:10px}
.emp>summary{padding:14px 16px;cursor:pointer;font-size:.92rem;font-weight:500;
  list-style:none;display:flex;align-items:center;gap:8px}
.emp>summary::-webkit-details-marker{display:none}
.emp>summary::before{content:"▸";color:var(--rose-fonce);font-size:.8em}
.emp[open]>summary::before{content:"▾"}
.emp-corps{padding:0 16px 14px;border-top:1px solid var(--gris-clair)}

.emp-champ{display:flex;flex-direction:column;gap:3px;font-size:.7rem;color:var(--gris)}
.emp-champ input,.emp-champ select{font-size:.9rem;padding:9px 10px;border:1px solid var(--gris-clair);
  border-radius:8px;color:var(--noir);background:var(--blanc);width:100%}
.emp-champ input:focus,.emp-champ select:focus{outline:none;border-color:var(--rose-fonce)}
.emp-nom{margin:12px 0}

.emp-ligne{display:flex;gap:8px;align-items:flex-end;margin-bottom:10px}
.emp-article{flex:1.4;min-width:0}
.emp-taille{flex:1.6;min-width:0}
.emp-coloris{flex:1;min-width:0}
.emp-qte{flex:0 0 62px}
.emp-coche{flex:0 0 auto;flex-direction:row;align-items:center;gap:6px;padding-bottom:9px;
  align-self:flex-end;cursor:pointer}
.emp-coche input{width:20px;height:20px;accent-color:var(--rose-fonce);margin:0}
.emp-coche span{font-size:.78rem;color:var(--noir)}
.emp-sup{border:0;background:none;color:var(--gris);font-size:1.3rem;line-height:1;
  padding:6px 4px;cursor:pointer}
.emp-sup:hover{color:var(--rose-fonce)}

.emp-actions{display:flex;gap:16px;align-items:center;margin-top:4px}
.emp-retirer{margin-left:auto;color:var(--gris)}

.emp-mesures{margin-top:12px;border-top:1px solid var(--gris-clair);padding-top:10px}
.emp-mesures>summary{cursor:pointer;font-size:.8rem;color:var(--rose-fonce);
  text-decoration:underline;list-style:none}
.emp-mesures>summary::-webkit-details-marker{display:none}
.emp-mesures-grille{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.emp-mesures-grille .emp-champ{flex:1;min-width:120px}
.emp-notes{margin-top:10px;font-size:.75rem;color:var(--gris);line-height:1.5}

.emp-invite{color:var(--gris);font-size:.82rem;line-height:1.5;margin-bottom:12px}
/* L'établissement est un bloc d'attribution comme un autre — même formulaire, même
   lecture. Un simple liseré suffit à dire que celui-là n'est personne. */
.emp-vrac{border-left:3px solid var(--rose-fonce)}
.emp-plus{width:100%;padding:13px;border:1px dashed var(--gris-clair);border-radius:var(--r);
  background:var(--blanc);color:var(--rose-fonce);font-size:.9rem;cursor:pointer}
.emp-plus:hover{border-color:var(--rose-fonce)}

@media(max-width:560px){
  /* iOS zoome dès qu'un champ fait moins de 16px, et ne revient pas en arrière : on
     saisit un employé et la page reste agrandie pour le reste de la visite. */
  .emp-champ input,.emp-champ select,.recap-champ input,.recap-champ-haut input,
  .recap-champ-haut select,.recap-remarque textarea{font-size:16px}
  .emp-ligne{flex-wrap:wrap}
  .emp-article{flex:1 1 100%}
  .emp-taille{flex:1 1 auto}
  /* Le coloris prend sa propre ligne : à l'étroit, il se faisait écraser à quelques
     pixels par ses voisins, et ce qui restait séparait les deux cases à cocher sur deux
     lignes. Elles doivent se lire ensemble — c'est le même geste, broder ou non. */
  .emp-coloris{flex:1 1 100%}
  .emp-sup{align-self:center}
}

/* Logo de l'établissement : photo d'aide-mémoire + état du fichier vectoriel. */
.logo-bloc{margin-top:26px}
.logo-corps{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.logo-prendre{display:flex;flex-direction:column;gap:6px;font-size:.7rem;color:var(--gris);
  flex:0 0 210px}
.logo-prendre input[type=file]{font-size:.78rem;padding:8px;border:1px dashed var(--gris-clair);
  border-radius:8px;background:var(--blanc);width:100%}
.logo-note{flex:1;min-width:210px}
.logo-apercu{flex:0 0 100%;display:flex;align-items:center;gap:12px}
.logo-apercu img{max-height:120px;max-width:200px;border-radius:8px;background:var(--blanc);
  box-shadow:var(--ombre)}
.logo-apercu .logo-poids{font-size:.75rem;color:var(--gris)}

/* Visites archivées, en attente d'export. */
.recap-reprise{flex:0 0 210px}
.recap-reprise input[type=file]{font-size:.78rem;padding:8px;border:1px dashed var(--gris-clair);
  border-radius:8px;background:var(--blanc);width:100%}

.visites{margin-top:34px;padding-top:20px;border-top:1px solid var(--gris-clair)}
.visites-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
.visites-head .recap-titre{margin:0}
.visites-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.visites-age{font-size:.78rem;color:var(--gris);margin-top:6px}
.visites-age.is-vieux{color:var(--rose-fonce);font-weight:500}
.visite{display:flex;align-items:center;gap:12px;padding:11px 14px;background:var(--blanc);
  border-radius:8px;box-shadow:var(--ombre);margin-top:8px;font-size:.88rem}
.visite-nom{flex:1;min-width:0;font-weight:500}
.visite-detail{color:var(--gris);font-size:.78rem}
.visites-note{text-align:left;margin-top:12px}

/* Mode plein écran (app ajoutée à l'écran d'accueil) : le contenu passe sous l'encoche et
   sous la barre d'accueil de l'iPhone. Sans ces marges, le bandeau se glisse derrière
   l'heure et le pied de page derrière le trait du bas. Ces règles doivent rester APRÈS
   les paddings d'origine, qu'elles reprennent en y ajoutant les retraits système ;
   placées avant, elles seraient écrasées. Dans un onglet de navigateur, env() vaut 0 et
   le rendu est identique à avant. */
.topbar{padding:calc(16px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right))
        16px calc(18px + env(safe-area-inset-left))}
.layout{padding:18px calc(18px + env(safe-area-inset-right)) 18px calc(18px + env(safe-area-inset-left))}
.recap{padding:22px calc(18px + env(safe-area-inset-right)) 40px calc(18px + env(safe-area-inset-left))}
.foot{padding:24px calc(18px + env(safe-area-inset-right))
      calc(40px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left))}

@media print{
  .topbar,.sitenav,.foot,.recap-actions,.recap-sup,.sel-lien,.recap-texte,.recap-aide{display:none}
  body{background:#fff}
  .recap{max-width:none;padding:0}
  .recap-ligne{box-shadow:none;break-inside:avoid;page-break-inside:avoid}
  .recap-champ input{border:0;padding:0;font-size:.9rem}
  .emp-corps{display:block!important}
  .emp>summary::before{content:""}
  .emp{box-shadow:none;break-inside:avoid;page-break-inside:avoid}
  .emp-champ input,.emp-champ select{border:0;padding:0;font-size:.9rem;appearance:none}
  .emp-sup,.emp-actions,.emp-plus,.emp-mesures>summary{display:none}
  .visites,.recap-reprise,.logo-prendre,.contact-actions,.contact-note{display:none}
  .recap-champ-haut input,.recap-champ-haut select{border:0;border-bottom:1px solid #ccc;
    padding:2px 0;appearance:none}
}