/* Brief 18 v2 : calculateur de volume, poids et sol (bloc [aqua_calcul_volume]). Mobile d'abord : champs à 16 px,
   cibles de 44 px, aucune largeur fixe (rien ne déborde à 360 px). */
.cv { margin: 1.5rem 0 2rem; padding: 1.1rem; border: 1px solid #d4e8d0; border-radius: 14px; background: #f8fbf8; }
.cv-form { margin: 0; }
.cv-bloc { border: 0; margin: 0 0 1.1rem; padding: 0; min-width: 0; }
.cv-titre { font-weight: 700; font-size: 1.05rem; margin: 0 0 0.6rem; padding: 0; color: #1f3d2b; }
.cv-formes { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.cv-forme { flex: 1 1 6.5rem; display: flex; align-items: center; justify-content: center; gap: 0.4rem; min-height: 44px; padding: 0 0.75rem; border: 1px solid #b9d8bd; border-radius: 10px; background: #fff; font-weight: 600; cursor: pointer; }
.cv-forme.is-actif { border-color: #2a7542; background: #e8f4ec; color: #1f3d2b; }
.cv-forme input { width: 20px; height: 20px; margin: 0; accent-color: #2a7542; }
.cv-grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 0.75rem; margin-bottom: 0.75rem; }
.cv-champ { min-width: 0; }
.cv-champ[hidden] { display: none; }
.cv-champ label { display: block; font-size: 0.875rem; font-weight: 600; margin: 0 0 0.3rem; color: #1f3d2b; }
.cv-saisie { display: flex; align-items: center; border: 1px solid #b9d8bd; border-radius: 10px; background: #fff; min-height: 44px; }
.cv-saisie:focus-within { border-color: #2a7542; box-shadow: 0 0 0 3px rgba(42, 117, 66, 0.15); }
.cv-saisie input { flex: 1 1 auto; min-width: 0; width: 100%; height: 44px; border: 0; background: transparent; padding: 0 0.6rem; font-size: 16px; font-weight: 600; color: #1a1a1a; }
.cv-saisie input:focus { outline: none; }
.cv-unite { padding: 0 0.7rem 0 0.2rem; color: #56675b; font-size: 0.9rem; }
.cv-aide { margin: 0.25rem 0 0; font-size: 0.8125rem; line-height: 1.4; color: #56675b; }
.cv-case { display: flex; align-items: center; gap: 0.6rem; min-height: 44px; margin: 0 0 0.5rem; font-weight: 600; cursor: pointer; }
.cv-case input { width: 24px; height: 24px; margin: 0; flex: 0 0 auto; accent-color: #2a7542; }

.cv-resultats { margin-top: 0.5rem; padding-top: 1rem; border-top: 1px solid #d4e8d0; }
.cv-erreur { margin: 0 0 0.75rem; padding: 0.6rem 0.8rem; border-radius: 8px; background: #fdf3f2; color: #8a2a1f; font-weight: 600; }
.cv-chiffres { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; }
.cv-chiffres.is-inactif { opacity: 0.4; }
.cv-chiffre { padding: 0.7rem 0.75rem; border-radius: 10px; background: #fff; border: 1px solid #d4e8d0; min-width: 0; }
.cv-chiffre--principal { background: #e8f4ec; }
.cv-libelle { display: block; font-size: 0.8125rem; color: #3d4f43; line-height: 1.3; }
.cv-chiffre strong { display: block; font-size: 1.35rem; color: #1a1a1a; margin-top: 0.15rem; overflow-wrap: anywhere; }
/* 1.8.19.13 : aide sous « 1 cm de niveau = » (à quoi sert ce chiffre). */
.cv-chiffre__aide { display: block; margin-top: 0.2rem; font-size: 0.8125rem; color: #3d4f43; line-height: 1.3; }
.cv-note { margin: 0.6rem 0 0; font-size: 0.875rem; line-height: 1.45; color: #3d4f43; }
.cv-alerte { margin: 0.6rem 0 0; padding: 0.6rem 0.8rem; border-left: 4px solid #c27a00; background: #fff8ec; font-size: 0.9rem; color: #5c3b00; }
/* Brief 18 v3 : choix du sol, l'un sous l'autre sur mobile (libellés longs). */
.cv-question { font-weight: 600; font-size: 0.95rem; margin: 0 0 0.4rem; color: #1f3d2b; }
.cv-sols { flex-direction: column; margin-bottom: 0.75rem; }
.cv-sols .cv-forme { flex: 0 0 auto; justify-content: flex-start; text-align: left; }
.cv-grille[hidden], .cv [data-sol-notes][hidden], .cv-sol__liste li[hidden], .cv-comparaison[hidden] { display: none; }
.cv-comparaison { margin: 0.75rem 0 0; padding: 0.6rem 0.8rem; border-radius: 10px; background: #fff; border: 1px solid #d4e8d0; font-size: 0.9rem; line-height: 1.45; color: #3d4f43; }
.cv-lien { display: flex; align-items: center; min-height: 44px; padding: 0; margin: 0.15rem 0 -0.4rem; border: 0; background: none; color: #1f5c38; font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
/* Brief 18 v4 : « Vérifie tes mesures », sous les dimensions. */
.cv-alerte--mesures, .article-body .cv p.cv-alerte--mesures { margin: 0 0 0.75rem; }
.cv-alerte[hidden] { display: none; }
.cv-sol { margin-top: 1rem; }
.cv-sol__titre { font-weight: 700; font-size: 1.1rem; margin: 0 0 0.5rem; color: #1f3d2b; }
.cv-sol__liste { list-style: none; margin: 0; padding: 0; }
.cv-sol__liste li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; padding: 0.55rem 0; border-bottom: 1px solid #e4efe4; }
.cv-sol__liste strong { text-align: right; }
.cv-actions { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 1.1rem; }
.cv-bouton { display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 0.6rem 1rem; border-radius: 50px; font-weight: 700; text-align: center; text-decoration: none; }
.cv-bouton--principal { background: #b85a0e; color: #fff; }
.cv-bouton--principal:hover, .cv-bouton--principal:focus-visible { background: #9a4a0b; color: #fff; }
.cv-bouton--secondaire { border: 2px solid #2a7542; color: #1f5c38; background: #fff; }
/* Le calculateur vit dans .article-body : les styles des articles (liens verts soulignés, listes en retrait, titres
   h3 en grand) ne doivent pas s'y appliquer. */
.article-body .cv a.cv-bouton { text-decoration: none; }
.article-body .cv a.cv-bouton--principal, .article-body .cv a.cv-bouton--principal:hover { color: #fff; }
.article-body .cv a.cv-bouton--secondaire { color: #1f5c38; }
.article-body .cv .cv-sol__liste { margin: 0; padding: 0; }
.article-body .cv .cv-sol__liste li { margin: 0; padding-left: 0; list-style: none; }
.article-body .cv .cv-sol__liste li::before, .article-body .cv .cv-sol__liste li::marker { content: none; display: none; }
.article-body .cv p { margin-bottom: 0; }
.article-body .cv p.cv-question { margin-bottom: 0.4rem; }
.article-body .cv p.cv-sol__titre { margin-bottom: 0.5rem; }
@media (min-width: 640px) {
	.cv { padding: 1.5rem; }
	.cv-sols { flex-direction: row; }
	.cv-sols .cv-forme { flex: 1 1 0; }
	.cv-chiffres { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.cv-actions { flex-direction: row; }
	.cv-bouton { flex: 1 1 0; }
}
