/* Les huit outils gratuits de plus des pages /outils/ : lignes de saisie, feuilles à imprimer (affiche de prix, planning de marchés, check-list
   d'hygiène, registre des températures, devis, étiquettes) et résultats chiffrés. S'ajoute à seo.css, dont il reprend .seo-outil, .seo-resultat
   et .seo-tableau. Tout vient des variables de socle.css : aucune couleur n'est écrite ici. À l'impression, seule la feuille reste (seo.css cache
   déjà l'en-tête, le texte et le formulaire) ; les fonds ne s'impriment pas toujours, donc chaque feuille tient par ses traits et ses lettres. */

@page{margin:10mm}

/* ---------- La saisie : des lignes répétées, une ligne par produit, par jour, par équipement ---------- */
.o2-lignes{display:grid;gap:var(--e3);margin:var(--e5) 0 0;padding:var(--e4);background:var(--comptoir);min-width:0}
.o2-lignes>legend{padding:0 var(--e2);font-weight:800}
.o2-lignes+.seo-outil__champs{margin-top:var(--e5)}
.o2-lignes__aide{margin:0;color:var(--encre-sourde);font-size:var(--t14)}
.o2-ligne,.o2-entetes{display:grid;gap:var(--e3);grid-template-columns:repeat(2,minmax(0,1fr))}
.o2-ligne>.o2-pleine{grid-column:1/-1}
.o2-entetes{display:none}
.o2-ligne .champ::before{content:attr(data-etiq);color:var(--encre-douce);font-size:var(--t14);font-weight:700}
.o2-jour-nom{align-self:center;font-weight:800}
.o2-ligne.o2-col--planning{padding-bottom:var(--e3);border-bottom:1px solid var(--filet-fort)}
.o2-plus{justify-self:start}
@media (min-width:700px){
  .o2-entetes{display:grid;padding:0 var(--e1);color:var(--encre-douce);font-size:var(--t14);font-weight:700}
  .o2-ligne>.o2-pleine{grid-column:auto}
  .o2-ligne .champ::before{display:none}
  .o2-col--affiche{grid-template-columns:minmax(0,3fr) minmax(0,1.2fr) minmax(0,1.6fr)}
  .o2-col--planning{grid-template-columns:5.5rem minmax(0,3fr) minmax(0,1.1fr) minmax(0,1.1fr)}
  .o2-col--planning>.o2-note{grid-column:2/-1}
  .o2-col--planning>.o2-jour-nom{grid-row:1/3;align-self:start;padding-top:var(--e4)}
  .o2-col--equip{grid-template-columns:minmax(0,3fr) minmax(0,1.4fr) minmax(0,1fr)}
  .o2-col--acc{grid-template-columns:minmax(0,3fr) minmax(0,1fr) minmax(0,1.5fr)}
  .o2-col--ing{grid-template-columns:minmax(0,3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.5fr)}
}
.o2-taches{display:grid;gap:0;margin:0}
.o2-tache{align-items:flex-start;padding:var(--e1) 0}
.o2-tache input{flex:none;margin-top:.15rem}
.o2-sous-groupe{grid-column:1/-1;margin:var(--e3) 0 0;font-weight:800}
.o2-message{margin:var(--e4) 0 0;padding:var(--e3) var(--e4);background:var(--jaune-voile);box-shadow:inset 0 -3px 0 var(--encre)}
.o2-sortie{margin-top:var(--e5)}
.o2-vide{margin:0;padding:var(--e4);background:var(--comptoir-2);color:var(--encre)}
.o2-texte{display:grid;gap:var(--e3);margin-top:var(--e5);padding:var(--e4);background:var(--papier);box-shadow:inset 0 -3px 0 var(--encre)}
.o2-texte textarea{min-height:140px}
.o2-confirme{color:var(--vert);font-weight:700}

/* ---------- Les résultats chiffrés (TVA, coût de revient) ---------- */
.o2-sous-titre{margin:var(--e5) 0 var(--e2);font-weight:800}
.seo-resultat .seo-tableau{margin:0}
.seo-resultat .seo-tableau table{min-width:420px}
.o2-num{text-align:right;font-variant-numeric:tabular-nums}
.seo-tableau th.o2-num{text-align:right}
.seo-tableau tbody th[scope=row]{padding:var(--e3) var(--e4);border-top:1px solid var(--filet-fort);background:none;color:var(--encre);font-size:var(--t16);font-weight:800;letter-spacing:normal;text-align:left;text-transform:none;font-variant-numeric:tabular-nums}
.o2-actif th,.o2-actif td{background:var(--jaune-voile)}
.o2-calcul{margin-top:var(--e5);padding:var(--e4) var(--e5);background:var(--jaune-voile);box-shadow:inset 0 -3px 0 var(--encre)}
.o2-calcul__titre{margin:0 0 var(--e2);font:400 var(--t24)/1.1 var(--police-affiche);text-transform:uppercase}
.o2-calcul__detail{margin:0;color:var(--encre-douce);font-size:var(--t14)}

/* ---------- La feuille et son cadre d'aperçu ---------- */
.o2-apercu{margin-top:var(--e5);padding:var(--e4);background:var(--comptoir-2);box-shadow:inset 0 -3px 0 var(--encre)}
.o2-apercu__legende{margin:0 0 var(--e3);color:var(--encre-douce);font-size:var(--t14)}
.o2-feuille{max-width:210mm;margin:0 auto;padding:var(--e5);background:var(--papier);color:var(--encre);border:1px solid var(--filet-fort)}
.o2-feuille p{margin:0}
.o2-defile{overflow-x:auto}
.o2-trait{display:inline-block;min-width:8rem;border-bottom:1px solid var(--encre)}
.o2-trait--long{min-width:14rem}
.o2-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.o2-petit{display:block;font-size:.8em;font-weight:400}
.o2-muet{color:var(--encre-douce)}
.o2-ligne-vide{height:2rem;border-bottom:1px solid var(--encre)}

/* Les tableaux imprimables : des traits d'encre, des cases à remplir à la main. */
.o2-tableau{width:100%;border-collapse:collapse}
.o2-tableau th,.o2-tableau td{padding:var(--e2) var(--e3);border:1px solid var(--encre);text-align:left;vertical-align:top}
.o2-tableau thead th{background:var(--encre);color:var(--papier);font-size:var(--t14);letter-spacing:.04em;text-transform:uppercase}
.o2-tableau tbody th{font-weight:800}
.o2-tableau .o2-num{text-align:right}
.o2-vide-case{min-width:2.6rem;height:2.4rem}
.o2-tableau .o2-jour{text-align:center}

/* ---------- 1. L'affiche de prix ---------- */
.o2-affiche{display:flex;flex-direction:column;gap:var(--e5);padding:var(--e8) var(--e5);border:6px solid var(--encre);text-align:center}
.o2-affiche__enseigne{font:800 var(--t18)/1.2 var(--police);letter-spacing:.14em;text-transform:uppercase}
.o2-affiche__titre{font:400 clamp(2.25rem,1.2rem + 5vw,3.75rem)/1 var(--police-affiche);text-transform:uppercase;overflow-wrap:anywhere}
.o2-affiche__sous{font-size:var(--t20);color:var(--encre-douce)}
.o2-affiche__liste{display:grid;gap:var(--e4);margin:var(--e4) 0;padding:0;list-style:none;text-align:left}
.o2-affiche__ligne{display:flex;align-items:baseline;gap:var(--e3)}
.o2-affiche__nom{flex:0 1 auto;min-width:0;font-weight:800;overflow-wrap:anywhere}
.o2-affiche__prec{font-size:.7em;font-weight:400;color:var(--encre-douce)}
.o2-affiche__points{flex:1 1 1rem;min-width:1rem;border-bottom:3px dotted var(--encre)}
.o2-affiche__prix{flex:none;font-family:var(--police-affiche);white-space:nowrap}
.o2-affiche__pied{font-size:var(--t16);font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.o2-affiche--l .o2-affiche__nom{font-size:var(--t30)}
.o2-affiche--l .o2-affiche__prix{font-size:var(--t38)}
.o2-affiche--m .o2-affiche__nom{font-size:var(--t24)}
.o2-affiche--m .o2-affiche__prix{font-size:var(--t30)}
.o2-affiche--s .o2-affiche__nom{font-size:var(--t18)}
.o2-affiche--s .o2-affiche__prix{font-size:var(--t24)}
.o2-affiche--s .o2-affiche__liste{gap:var(--e3)}

/* ---------- 2. Le planning de marchés ---------- */
.o2-planning{display:grid;gap:var(--e4)}
.o2-planning__enseigne{font:800 var(--t18)/1.2 var(--police);letter-spacing:.14em;text-transform:uppercase}
.o2-planning__titre{font:400 clamp(1.75rem,1.2rem + 2.4vw,2.75rem)/1.05 var(--police-affiche);text-transform:uppercase}
.o2-planning__periode{font-size:var(--t20);font-weight:700}
.o2-planning__tableau td,.o2-planning__tableau tbody th{font-size:var(--t18)}
.o2-planning__lieu{font-weight:800}
.o2-planning__pied{font-weight:700}

/* ---------- 3. La check-list d'hygiène ---------- */
.o2-hygiene{display:grid;gap:var(--e3)}
.o2-hygiene__enseigne{font:800 var(--t16)/1.2 var(--police);letter-spacing:.14em;text-transform:uppercase}
.o2-hygiene__titre{font:400 clamp(1.75rem,1.2rem + 2.4vw,2.5rem)/1.05 var(--police-affiche);text-transform:uppercase}
.o2-hygiene__periode,.o2-hygiene__meta{font-size:var(--t16);font-weight:700}
.o2-feuille .o2-hygiene__groupe{margin-top:var(--e3);padding-bottom:var(--e1);border-bottom:3px solid var(--encre);font:400 var(--t20)/1.1 var(--police-affiche);letter-spacing:.02em;text-transform:uppercase}
.o2-hygiene__liste{display:grid;gap:0;margin:0;padding:0;list-style:none}
.o2-item{display:flex;align-items:flex-start;gap:var(--e3);padding:var(--e2) 0;border-bottom:1px solid var(--filet-fort)}
.o2-item__texte{font-size:var(--t16);line-height:1.35}
.o2-case{flex:none;width:1.15rem;height:1.15rem;margin-top:.1rem;border:2px solid var(--encre)}
.o2-groupe-ligne th{background:var(--comptoir-2);font-family:var(--police-affiche);font-weight:400;letter-spacing:.03em;text-transform:uppercase}
.o2-tableau tbody .o2-tache-texte{font-size:var(--t14);font-weight:400}

/* ---------- 4. Le registre des températures ---------- */
.o2-temp{display:grid;gap:var(--e3)}
.o2-temp__enseigne{font:800 var(--t16)/1.2 var(--police);letter-spacing:.14em;text-transform:uppercase}
.o2-temp__titre{font:400 clamp(1.75rem,1.2rem + 2.4vw,2.5rem)/1.05 var(--police-affiche);text-transform:uppercase}
.o2-temp__periode{font-size:var(--t16);font-weight:700}
.o2-equip__nom{display:block;font-weight:800}
.o2-equip__type,.o2-equip__seuil{display:block;font-size:var(--t14);font-weight:400}
.o2-moment{font-size:var(--t14);white-space:nowrap}
.o2-premiere th,.o2-premiere td{border-top-width:3px}

/* ---------- 6. Le devis ---------- */
.o2-devis{display:grid;gap:var(--e4)}
.o2-devis__tete{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--e4)}
.o2-devis__enseigne{font:400 var(--t24)/1.1 var(--police-affiche);text-transform:uppercase}
.o2-devis__coord{font-size:var(--t14)}
.o2-devis__identite{text-align:right}
.o2-devis__titre{font:400 var(--t38)/1 var(--police-affiche);letter-spacing:.04em;text-transform:uppercase}
.o2-devis__cadres{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--e4)}
.o2-devis__cadre{display:grid;gap:var(--e1);align-content:start;padding:var(--e3);border:2px solid var(--encre)}
.o2-devis__etiq{font-size:var(--t14);font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.o2-devis__totaux{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--e1) var(--e5);justify-self:end;width:min(100%,24rem);margin:0}
.o2-devis__totaux dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.o2-devis__totaux .o2-fort{padding-top:var(--e2);border-top:3px solid var(--encre);font-size:var(--t20);font-weight:800}
.o2-devis__notes{display:grid;gap:var(--e1);font-size:var(--t14)}
.o2-devis__signatures{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--e4)}
.o2-devis__signature{min-height:7rem;padding:var(--e3);border:2px solid var(--encre)}

/* ---------- 7. Les étiquettes ---------- */
.o2-etiquettes{display:grid;gap:var(--e3);grid-template-columns:repeat(2,minmax(0,1fr));padding:var(--e3)}
.o2-etiquettes--n1{grid-template-columns:minmax(0,1fr)}
.o2-etiquettes--n24{grid-template-columns:repeat(3,minmax(0,1fr))}
.o2-etiquette{display:flex;flex-direction:column;justify-content:space-between;gap:var(--e1);min-height:7rem;padding:var(--e3);border:1px dashed var(--encre);overflow:hidden}
.o2-etiquette p{line-height:1.15}
.o2-etiquette__enseigne{font-size:var(--t12);font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.o2-etiquette__produit{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font:800 var(--t18)/1.15 var(--police);overflow-wrap:anywhere}
.o2-etiquettes--n24 .o2-etiquette__produit{-webkit-line-clamp:1;line-clamp:1}
.o2-etiquette__fab{font-size:var(--t14)}
.o2-etiquette__mention{font-size:var(--t14);font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.o2-etiquette__date{font:400 var(--t24)/1.05 var(--police-affiche);letter-spacing:.02em}
.o2-etiquette__info{font-size:var(--t12)}
.o2-etiquette__visa{font-size:var(--t12)}
.o2-etiquettes--n12 .o2-etiquette{gap:0}
.o2-etiquettes--n24 .o2-etiquette{gap:0}
.o2-etiquettes--n24 .o2-etiquette__enseigne,.o2-etiquettes--n24 .o2-etiquette__lot{display:none}
.o2-etiquettes--n1 .o2-etiquette{min-height:12rem}
.o2-etiquettes--n1 .o2-etiquette__produit{font-size:var(--t30)}
.o2-etiquettes--n1 .o2-etiquette__date{font-size:var(--t48)}

/* ---------- À l'impression : la feuille seule, aux mesures du A4 ---------- */
@media print{
  .o2-sortie{margin:0}
  .o2-apercu{margin:0;padding:0;background:none;box-shadow:none}
  .o2-feuille{max-width:none;margin:0;padding:0;background:none;border:0;break-inside:avoid;page-break-inside:avoid}
  .o2-defile{overflow:visible}
  .o2-tableau{font-size:10pt}
  .o2-tableau thead th,.o2-groupe-ligne th{background:none;color:var(--encre);border-bottom-width:3px}
  .o2-vide-case{height:9mm}
  .seo-resultat{padding:0;background:none;box-shadow:none}
  .seo-tableau table{box-shadow:none}

  .o2-affiche{min-height:262mm;justify-content:space-between;padding:14mm 12mm;border:3mm solid var(--encre)}
  .o2-affiche__enseigne{font-size:14pt}
  .o2-affiche__titre{font-size:44pt}
  .o2-affiche__sous{font-size:16pt}
  .o2-affiche__liste{margin:auto 0}
  .o2-affiche--l .o2-affiche__liste{gap:9mm}
  .o2-affiche--l .o2-affiche__nom{font-size:24pt}
  .o2-affiche--l .o2-affiche__prix{font-size:34pt}
  .o2-affiche--m .o2-affiche__liste{gap:6mm}
  .o2-affiche--m .o2-affiche__nom{font-size:19pt}
  .o2-affiche--m .o2-affiche__prix{font-size:26pt}
  .o2-affiche--s .o2-affiche__liste{gap:3.5mm}
  .o2-affiche--s .o2-affiche__nom{font-size:15pt}
  .o2-affiche--s .o2-affiche__prix{font-size:20pt}
  .o2-affiche__pied{font-size:12pt}

  .o2-planning__titre{font-size:32pt}
  .o2-planning__tableau td,.o2-planning__tableau tbody th{font-size:14pt;padding:4mm 3mm}

  .o2-hygiene,.o2-temp{gap:2mm}
  .o2-item{padding:1.3mm 0}
  .o2-item__texte{font-size:10.5pt}
  .o2-ligne-vide{height:7mm}
  .o2-hygiene__tableau th,.o2-hygiene__tableau td{padding:1mm 2mm;line-height:1.2}
  .o2-hygiene__tableau tbody .o2-tache-texte{font-size:9pt}
  .o2-hygiene__tableau .o2-vide-case{height:7.5mm;min-width:9mm}
  .o2-hygiene__tableau .o2-groupe-ligne th{font-size:10pt}
  .o2-temp .o2-vide-case{height:10mm}

  .o2-devis{gap:5mm}
  .o2-devis__tableau td,.o2-devis__tableau th{font-size:10.5pt}

  .o2-etiquettes{gap:3mm;padding:0}
  .o2-etiquette{min-height:0;padding:2.5mm}
  .o2-etiquettes--n1 .o2-etiquette{height:110mm}
  .o2-etiquettes--n4 .o2-etiquette{height:130mm}
  .o2-etiquettes--n8 .o2-etiquette{height:62mm}
  .o2-etiquettes--n12 .o2-etiquette{height:41mm}
  .o2-etiquettes--n24 .o2-etiquette{height:31mm}
  .o2-etiquettes--n4 .o2-etiquette__produit{font-size:22pt}
  .o2-etiquettes--n4 .o2-etiquette__date{font-size:34pt}
  .o2-etiquettes--n4 .o2-etiquette__fab,.o2-etiquettes--n4 .o2-etiquette__mention{font-size:13pt}
  .o2-etiquettes--n8 .o2-etiquette__produit{font-size:15pt}
  .o2-etiquettes--n8 .o2-etiquette__date{font-size:24pt}
  .o2-etiquettes--n8 .o2-etiquette__fab,.o2-etiquettes--n8 .o2-etiquette__mention{font-size:10pt}
  .o2-etiquettes--n12 .o2-etiquette__produit{font-size:12pt}
  .o2-etiquettes--n12 .o2-etiquette__date{font-size:18pt}
  .o2-etiquettes--n12 .o2-etiquette__fab,.o2-etiquettes--n12 .o2-etiquette__mention{font-size:8.5pt}
  .o2-etiquettes--n24 .o2-etiquette__produit{font-size:9.5pt}
  .o2-etiquettes--n24 .o2-etiquette__date{font-size:13pt}
  .o2-etiquettes--n24 .o2-etiquette__fab,.o2-etiquettes--n24 .o2-etiquette__mention{font-size:7pt}
  .o2-etiquettes--n24 .o2-etiquette__info,.o2-etiquettes--n24 .o2-etiquette__visa,.o2-etiquettes--n24 .o2-etiquette__enseigne{font-size:6.5pt}
  .o2-etiquettes--n12 .o2-etiquette__info,.o2-etiquettes--n12 .o2-etiquette__visa{font-size:7.5pt}
}
