/* SIGMA ICC – page Chiffrage */
.ch-zone { padding-top: 36px; }
.ch { display: grid; gap: 22px; }
.ch-projet { display: grid; grid-template-columns: 1fr 1fr 1fr 1.6fr; gap: 14px; align-items: end; background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 18px 20px; }
.ch-gamme { border: 0; padding: 0; margin: 0; display: grid; gap: 6px; }
.ch-gamme legend { font-weight: 600; font-size: .95rem; padding: 0; margin-bottom: 6px; }
.seg { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--trait); border-radius: var(--rayon); overflow: hidden; }
.seg label { display: block; font-weight: 600; position: relative; }
.seg input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; pointer-events: none; }
.seg span { display: block; text-align: center; padding: 10px 6px; cursor: pointer; background: var(--papier); border-left: 1px solid var(--trait); font-size: .95rem; }
.seg label:first-child span { border-left: 0; }
.seg input:checked + span { background: var(--encre); color: var(--papier); }
.seg input:focus-visible + span { outline: 3px solid var(--ambre); outline-offset: -3px; }
@media (max-width: 960px) { .ch-projet { grid-template-columns: 1fr 1fr; } .ch-gamme { grid-column: 1 / -1; } }
@media (max-width: 480px) { .ch-projet { grid-template-columns: 1fr; } }

.ch-onglets { display: flex; gap: 0; border-bottom: 2px solid var(--trait); }
.ch-onglets button { font: 600 1.08rem var(--f-titre); background: none; border: 0; color: var(--gris); padding: 12px 18px; cursor: pointer; margin-bottom: -2px; border-bottom: 3px solid transparent; }
.ch-onglets button[aria-selected="true"] { color: var(--encre); border-bottom-color: var(--calque); }
.ch-panneau { display: grid; gap: 18px; }
.ch-panneau[hidden] { display: none; }

.ch-tuiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--trait); background: var(--carte); border-radius: var(--rayon); overflow: hidden; }
.ch-tuiles div { padding: 18px 20px; border-left: 1px solid var(--trait); display: grid; gap: 4px; }
.ch-tuiles div:first-child { border-left: 0; }
.ch-tuiles b { font: 600 .74rem var(--f-titre); letter-spacing: .12em; text-transform: uppercase; color: var(--gris); }
.ch-tuiles strong { font: 700 1.9rem/1.1 var(--f-titre); }
.ch-tuiles span { color: var(--gris); font-size: .9rem; }
.ch-tuiles .fort { background: var(--calque-fond); }
.ch-tuiles .fort strong { color: var(--calque-texte); }
@media (max-width: 860px) { .ch-tuiles { grid-template-columns: 1fr 1fr; } .ch-tuiles div:nth-child(3) { border-left: 0; } .ch-tuiles div:nth-child(n+3) { border-top: 1px solid var(--trait); } }

.ch-carte { background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 20px 22px; display: grid; gap: 14px; }
.ch-carte h2 { font-size: 1.35rem; }
.ch-carte-tete { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; align-items: baseline; }
.ch-note { color: var(--gris); font-size: .9rem; }
.ch-barres { display: grid; gap: 7px; }
.ch-barre { display: grid; grid-template-columns: minmax(150px, 260px) 1fr auto; gap: 12px; align-items: center; font-size: .94rem; }
.ch-barre .piste { height: 12px; background: var(--papier); border-radius: 2px; position: relative; overflow: hidden; }
.ch-barre .piste i { position: absolute; inset: 0 auto 0 0; background: var(--calque); border-radius: 2px; }
.ch-barre .val { text-align: right; min-width: 9.5em; font-variant-numeric: tabular-nums; }
.ch-barre .val small { color: var(--gris); margin-left: 6px; }
.ch-barres.petit .ch-barre { grid-template-columns: 1fr 70px auto; font-size: .86rem; gap: 8px; }
.ch-barres.petit .val { min-width: 0; }
@media (max-width: 600px) { .ch-barre { grid-template-columns: 1fr auto; } .ch-barre .piste { grid-column: 1 / -1; grid-row: 2; } }
.ch-avert { color: var(--gris); font-size: .9rem; max-width: 95ch; }

.ch-detail { display: grid; grid-template-columns: minmax(0, 1fr) 370px; gap: 22px; align-items: start; }
@media (max-width: 1020px) { .ch-detail { grid-template-columns: 1fr; } }
.ch-synthese { position: sticky; top: 92px; }
@media (max-width: 1020px) { .ch-synthese { position: static; order: -1; } }
.ch-outils { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: end; margin-bottom: 14px; }
.ch-recherche { flex: 1 1 280px; }
.ch-case { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.ch-case input { width: 18px; height: 18px; }
.ch-outils-btn { display: flex; flex-wrap: wrap; gap: 8px; }

.ch-lot { background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); margin-bottom: 8px; }
.ch-lot > summary { cursor: pointer; list-style: none; display: grid; grid-template-columns: 52px 1fr auto; gap: 12px; padding: 12px 16px; align-items: center; }
.ch-lot > summary::-webkit-details-marker { display: none; }
.ch-lot > summary .code { font: 600 .82rem var(--f-titre); color: var(--calque-texte); letter-spacing: .08em; }
.ch-lot > summary .lib { font: 600 1.05rem var(--f-titre); }
.ch-lot > summary .tot { font-variant-numeric: tabular-nums; color: var(--gris); }
.ch-lot > summary .tot.plein { color: var(--encre); font-weight: 700; }
.ch-lot[open] > summary { border-bottom: 1px solid var(--trait); }
.ch-table-zone { overflow-x: auto; }
.ch-table { width: 100%; border-collapse: collapse; font-size: .93rem; min-width: 640px; }
.ch-table th { text-align: left; font: 600 .74rem var(--f-titre); letter-spacing: .1em; text-transform: uppercase; color: var(--gris); padding: 8px 10px; border-bottom: 1px solid var(--trait); }
.ch-table td { padding: 6px 10px; border-bottom: 1px solid var(--trait); vertical-align: middle; }
.ch-table tr.bloc td { background: var(--papier); font: 600 .9rem var(--f-titre); letter-spacing: .03em; padding-top: 9px; }
.ch-table tr.bloc td span { color: var(--gris); font-weight: 500; margin-left: 6px; }
.ch-table td.n, .ch-table th.n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ch-table td.u { color: var(--gris); white-space: nowrap; }
.ch-table input { width: 92px; padding: 6px 8px; text-align: right; font-variant-numeric: tabular-nums; }
.ch-table tr.saisi td { background: color-mix(in srgb, var(--calque-fond) 60%, transparent); }
.ch-table tr.saisi td.t { font-weight: 700; }
.ch-vide { color: var(--gris); padding: 16px; }

.ch-totaux { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; margin: 0; }
.ch-totaux dt { color: var(--gris); min-width: 0; }
.ch-totaux dd { margin: 0; text-align: right; white-space: nowrap; }
.ch-totaux .ttc { font: 700 1.45rem/1.1 var(--f-titre); color: var(--calque-texte); }
.ch-totaux dt.ttc { font-size: 1.1rem; color: var(--encre); align-self: end; }
.ch-pastille { display: flex; gap: 10px; align-items: flex-start; font-size: .9rem; padding: 10px 12px; border-radius: var(--rayon); border-left: 4px solid var(--ok); background: var(--papier); }
.ch-pastille.attention { border-left-color: var(--alerte); }
.ch-actions { display: grid; gap: 8px; }
.ch-actions .btn { justify-content: center; }

/* devis détaillé : saisie des prix, lignes ajoutées, blocs personnalisés */
.ch-projet { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ch-projet .ch-gamme { grid-column: 1 / -1; max-width: 560px; }
@media (max-width: 1020px) { .ch-projet { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ch-projet { grid-template-columns: 1fr 1fr; } }
.ch-legende { margin: -4px 0 12px; }
.ch-legende .ico { display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--trait); border-radius: 4px; background: var(--carte); font-size: .8rem; }
.ch-table { min-width: 860px; }
.ch-table td .des { font-weight: 400; display: block; }
.ch-table input.pu { width: 104px; }
.ch-table input.qte { width: 84px; }
.ch-table input.h-in { width: 64px; }
.ch-table input.des-in { width: 100%; min-width: 220px; text-align: left; }
.ch-table input.u-in { width: 56px; text-align: center; }
.ch-table input::placeholder { color: color-mix(in srgb, var(--gris) 75%, transparent); }
.ch-table td.h { color: var(--gris); }
.ch-table td.pv { color: var(--gris); }
.ch-table tr.ajout td { background: color-mix(in srgb, var(--calque-fond) 45%, transparent); }
.ch-table tr.ajout td:first-child { box-shadow: inset 3px 0 0 var(--calque); }
.ch-table td.act { white-space: nowrap; width: 1%; }
.ic { width: 28px; height: 28px; border: 1px solid var(--trait); background: var(--carte); color: var(--encre); border-radius: 4px; cursor: pointer; font-size: .85rem; margin-left: 2px; }
.ic:hover { border-color: var(--calque); background: var(--calque); color: var(--sur-jaune); }
.ch-table tr.ajouter td { padding: 4px 10px 10px; border-bottom: 1px solid var(--trait); }
.lien { background: none; border: 0; padding: 4px 0; color: var(--calque-texte); font: 600 .92rem var(--f-texte); cursor: pointer; }
.lien:hover { text-decoration: underline; }
.ch-nouveau-bloc { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding: 12px 16px 16px; border-top: 1px dashed var(--trait); }
.ch-nouveau-bloc label { flex: 1 1 260px; font-size: .9rem; }
.ch-methodes { display: grid; gap: 6px; }
.ch-methodes .m { display: grid; font-size: .88rem; color: var(--gris); padding: 8px 10px; border: 1px solid var(--trait); border-radius: var(--rayon); }
.ch-methodes .m.actif { border-color: var(--calque); background: var(--calque-fond); color: var(--encre); }
.ch-methodes .m span { font-weight: 700; color: var(--encre); }
.ch-controles { display: grid; gap: 6px; }
.ch-liste, .ch-lot, .ch-panneau, .ch { min-width: 0; }
@media (max-width: 1020px) { .ch-detail { grid-template-columns: minmax(0, 1fr); } }
.ch-synthese .ch-carte { min-width: 0; } .ch-totaux { font-size: .95rem; }

/* ---------------------------------------------------------------- téléphone */
.ch-barre-mobile { display: none; }
@media (max-width: 1020px) {
  body.ch-detail-actif .ch-barre-mobile { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; justify-content: space-between; align-items: center; gap: 12px;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: var(--nuit); color: #fff; box-shadow: 0 -6px 20px rgb(0 0 0 / .2); }
  .ch-barre-mobile div { display: grid; line-height: 1.15; }
  .ch-barre-mobile strong { font: 700 1.25rem var(--f-titre); color: var(--calque); font-variant-numeric: tabular-nums; }
  .ch-barre-mobile span { font-size: .8rem; color: #c9c9c9; }
  body.ch-detail-actif .haut, body.ch-detail-actif .whatsapp { bottom: 76px; }
  body.ch-detail-actif { padding-bottom: 64px; }
}
@media (max-width: 700px) {
  .ch-zone { padding-top: 20px; }
  .ch { gap: 16px; }
  .ch-projet { padding: 14px; gap: 10px; }
  .seg span { padding: 9px 4px; font-size: .86rem; }
  .ch-onglets button { flex: 1; padding: 10px 6px; font-size: .98rem; }
  .ch-tuiles div { padding: 12px 14px; }
  .ch-tuiles strong { font-size: 1.3rem; }
  .ch-tuiles span { font-size: .8rem; }
  .ch-carte { padding: 14px; }
  .ch-barre { grid-template-columns: 1fr auto; gap: 4px 10px; font-size: .9rem; }
  .ch-barre .val { min-width: 0; }
  .ch-outils { gap: 10px; }
  .ch-outils-btn { width: 100%; }
  .ch-outils-btn .btn { flex: 1 1 auto; justify-content: center; }
  .ch-lot > summary { grid-template-columns: 40px 1fr; padding: 10px 12px; gap: 6px 10px; }
  .ch-lot > summary .tot { grid-column: 2; font-size: .9rem; }
  .ch-lot > summary .lib { font-size: 1rem; }

  /* le tableau devient une liste de fiches : désignation en haut, champs en grille en dessous */
  .ch-table-zone { overflow: visible; }
  .ch-table, .ch-table tbody { display: block; min-width: 0; width: 100%; }
  .ch-table thead { display: none; }
  .ch-table tr { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px 10px; padding: 12px; border-bottom: 1px solid var(--trait); }
  .ch-table td { display: block; padding: 0; border: 0; text-align: left !important; }
  .ch-table td:first-child { grid-column: 1 / -1; font-weight: 600; }
  .ch-table td[data-l]::before { content: attr(data-l); display: block; font: 600 .66rem var(--f-titre); letter-spacing: .08em; text-transform: uppercase; color: var(--gris); margin-bottom: 2px; }
  .ch-table td.act { grid-column: 3; grid-row: 1; justify-self: end; align-self: start; display: none; width: auto; }
  .ch-table tr[data-ref] td:first-child, .ch-table tr[data-x] td:first-child { grid-column: 1 / 3; }
  .ch-table tr[data-ref] td.act, .ch-table tr[data-x] td.act { display: flex; gap: 4px; }
  .ch-table td.t { font-weight: 700; color: var(--encre); }
  .ch-table tr.saisi td, .ch-table tr.ajout td { background: transparent; box-shadow: none; }
  .ch-table tr.saisi { background: color-mix(in srgb, var(--calque-fond) 70%, transparent); }
  .ch-table tr.ajout { box-shadow: inset 4px 0 0 var(--calque); }
  .ch-table input.pu, .ch-table input.qte, .ch-table input.h-in, .ch-table input.u-in { width: 100%; text-align: left; font-size: 16px; padding: 8px; }
  .ch-table input.des-in { min-width: 0; font-size: 16px; }
  .ch-table tr.bloc, .ch-table tr.ajouter { display: block; padding: 8px 12px; }
  .ch-table tr.bloc td, .ch-table tr.ajouter td { display: block; }
  .ch-nouveau-bloc { padding: 12px; }
  .ch-nouveau-bloc .btn { width: 100%; justify-content: center; }
  input, select, textarea { font-size: 16px; }
}
@media (max-width: 380px) { .ch-table tr { grid-template-columns: 1fr 1fr; } .ch-table td.act { grid-column: 2; } }
/* honoraires d'études : complexité et résumé */
.ch-projet .ch-complexite { grid-column: span 2; }
@media (min-width: 1021px) { .ch-projet .ch-gamme { grid-column: span 3; } }
@media (max-width: 1020px) { .ch-projet .ch-complexite { grid-column: 1 / -1; } }
.ch-hon-info { grid-column: 1 / -1; margin: 0; font-size: .88rem; color: var(--gris); border-top: 1px dashed var(--trait); padding-top: 10px; }
.ch-hon-info b { color: var(--texte, inherit); }
.ch-tuiles .etudes { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--trait); background: var(--fond, transparent); }
.ch-tuiles .etudes strong { font-size: 1.5rem; }
/* sous-sol, piscine, jardin */
.ch-options { grid-column: 1 / -1; border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ch-options[hidden] { display: none; }
.ch-options legend { font-weight: 600; font-size: .95rem; padding: 0; margin-bottom: 6px; }
.ch-opt { display: grid; gap: 6px; border: 1px solid var(--trait); border-radius: var(--rayon); padding: 10px 12px; }
.ch-coche { display: flex; align-items: center; gap: 8px; font-weight: 600; cursor: pointer; }
.ch-coche input { width: 18px; height: 18px; accent-color: var(--calque); }
.ch-m2 { font-size: .85rem; color: var(--gris); }
.ch-opt:not(.actif) .ch-m2 { opacity: .45; }
@media (max-width: 700px) { .ch-options { grid-template-columns: 1fr; } }
.ch-tuiles .options { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--trait); }
.ch-hon-liste { list-style: none; margin: 6px 0; padding: 0; display: grid; gap: 0; }
.ch-hon-liste li { display: grid; grid-template-columns: 1.4fr 1.4fr auto; gap: 12px; padding: 8px 0; border-top: 1px solid var(--trait); align-items: baseline; }
.ch-hon-liste li span:nth-child(2) { color: var(--gris); font-size: .88rem; }
.ch-hon-liste li b { font: 700 1rem var(--f-titre); letter-spacing: 0; text-transform: none; color: inherit; text-align: right; }
@media (max-width: 700px) { .ch-hon-liste li { grid-template-columns: 1fr auto; } .ch-hon-liste li span:nth-child(2) { grid-column: 1; grid-row: 2; } .ch-hon-liste li b { grid-row: 1 / 3; grid-column: 2; } }
