/* poteaubois v2 — commandes des collectivités et établissements publics (14/10/2026). Balisage produit par le module
   collectivites de l'extension : case et champs du paiement (.pb-col), message de la page de confirmation
   (.pb-col-merci), bloc « Commande publique (Chorus Pro) » de la confirmation et de Mon compte (.pb-col-bloc).
   Chargée par inc/collectivites.php dans le tunnel seulement. Sans :has(), les champs restent visibles. */

@layer components {
	/* ---------- Paiement : case et champs ---------- */
	.pb-tunnel .pb-col { display: grid; gap: var(--pb-s2); grid-column: 1 / -1; margin-top: var(--pb-s2); padding: var(--pb-s3) var(--pb-s4) var(--pb-s4); border: 1px solid var(--pb-ligne); border-radius: var(--pb-r-m); background: var(--pb-bois-clair); }
	.pb-tunnel .pb-col:has(#pb_col_actif:checked) { border-color: var(--pb-encre); box-shadow: inset 0 0 0 1px var(--pb-encre); background: var(--pb-surface); }
	.pb-tunnel .pb-col__case { margin: 0; }
	.pb-tunnel .pb-col__case label { font-weight: var(--pb-g-fort); }
	.pb-tunnel .pb-col__aide { margin: 0; color: var(--pb-texte-doux); font-size: var(--pb-fs-sm); line-height: var(--pb-lh-donnee); }
	.pb-tunnel .pb-col__champs { display: grid; gap: var(--pb-s3); min-width: 0; margin: var(--pb-s2) 0 0; padding: 0; border: 0; }
	.pb-tunnel .pb-col:not(:has(#pb_col_actif:checked)) .pb-col__champs { display: none; }
	.pb-tunnel .pb-col .description { display: block; color: var(--pb-texte-doux); font-size: var(--pb-fs-sm); }
	.pb-tunnel #pb_col_siret { font-variant-numeric: tabular-nums; letter-spacing: 0.02em; }

	/* ---------- Page de confirmation : prochaine étape ---------- */
	.pb-tunnel .pb-col-merci { display: grid; gap: var(--pb-s2); padding: var(--pb-s4); border-left: 4px solid var(--pb-action); border-radius: var(--pb-r-m); background: var(--pb-bois-clair); }
	.pb-tunnel .pb-col-merci p { margin: 0; }
	.pb-tunnel .pb-col-merci .button { justify-self: start; }

	/* ---------- Bloc « Commande publique (Chorus Pro) » ---------- */
	.pb-tunnel .pb-col-bloc { display: grid; gap: var(--pb-s3); margin-top: var(--pb-s5); padding: var(--pb-s5); border: 1px solid var(--pb-ligne); border-radius: var(--pb-r-l); background: var(--pb-surface); scroll-margin-top: calc(var(--pb-entete-h) + var(--pb-s4)); }
	.pb-tunnel .pb-col-bloc__titre { margin: 0; font-size: var(--pb-fs-h3); }
	.pb-tunnel .pb-col-bloc__sous-titre { margin: var(--pb-s3) 0 0; font-size: var(--pb-fs-h4); }
	.pb-tunnel .pb-col-bloc p { margin: 0; }
	.pb-tunnel .pb-col-bloc__message { padding: var(--pb-s3) var(--pb-s4); border: 1px solid #C3D8CB; border-left: 4px solid var(--pb-foret); border-radius: var(--pb-r-m); background: var(--pb-foret-pale); font-weight: var(--pb-g-ui); }
	.pb-tunnel .pb-col-bloc__message--alert { border-color: #F3C3BE; border-left-color: var(--pb-erreur); background: var(--pb-erreur-pale); color: #7A1A12; }
	.pb-tunnel .pb-col-bloc__infos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: var(--pb-s2) var(--pb-s4); margin: 0; }
	.pb-tunnel .pb-col-bloc__infos div { display: grid; gap: 0.1rem; min-width: 0; }
	.pb-tunnel .pb-col-bloc__infos dt { color: var(--pb-texte-doux); font-size: var(--pb-fs-sm); }
	.pb-tunnel .pb-col-bloc__infos dd { margin: 0; font-weight: var(--pb-g-fort); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
	.pb-tunnel .pb-col-bloc__form { display: grid; gap: var(--pb-s3); padding: var(--pb-s4); border-radius: var(--pb-r-m); background: var(--pb-bois-clair); }
	.pb-tunnel .pb-col-bloc__form input[type="file"] { width: 100%; min-height: var(--pb-tap); padding: var(--pb-s2); border: 1px dashed var(--pb-ligne-forte); border-radius: var(--pb-r-m); background: var(--pb-blanc); font: inherit; font-size: var(--pb-fs-sm); }
	.pb-tunnel .pb-col-bloc__aide { color: var(--pb-texte-doux); font-size: var(--pb-fs-sm); }
	.pb-tunnel .pb-col-bloc__delai, .pb-tunnel .pb-col-bloc__chorus { color: var(--pb-texte-doux); font-size: var(--pb-fs-sm); }

	/* Suivi : étapes faites (vert), en cours (encre), à venir (doux) */
	.pb-tunnel .pb-col-etapes { display: grid; gap: var(--pb-s2); margin: 0; padding: 0; list-style: none; counter-reset: pb-col; }
	.pb-tunnel .pb-col-etapes li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.15rem var(--pb-s2); position: relative; padding-left: 2.25rem; min-height: 1.75rem; color: var(--pb-texte-doux); counter-increment: pb-col; }
	.pb-tunnel .pb-col-etapes li::before { content: counter(pb-col); position: absolute; left: 0; top: 0; display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; border: 2px solid var(--pb-ligne-forte); border-radius: 50%; font-size: var(--pb-fs-xs); font-weight: var(--pb-g-fort); }
	.pb-tunnel .pb-col-etapes .est-faite { color: var(--pb-encre); }
	.pb-tunnel .pb-col-etapes .est-faite::before { content: "✓"; border-color: var(--pb-foret); background: var(--pb-foret); color: var(--pb-blanc); }
	.pb-tunnel .pb-col-etapes .est-courante { color: var(--pb-encre); font-weight: var(--pb-g-fort); }
	.pb-tunnel .pb-col-etapes .est-courante::before { border-color: var(--pb-encre); background: var(--pb-encre); color: var(--pb-blanc); }
	.pb-tunnel .pb-col-etapes__nom { font-weight: var(--pb-g-ui); }
	.pb-tunnel .pb-col-etapes__quand, .pb-tunnel .pb-col-etapes__detail { font-size: var(--pb-fs-sm); }
	.pb-tunnel .pb-col-etapes .est-faite .pb-col-etapes__quand { color: var(--pb-texte-doux); }
}