/* ==========================================================================
     Aquaclean77 — l'estimation jointe au formulaire de rappel (A3).

     Chargée UNIQUEMENT par joindre-estimation.php (/devis?estimation=…,
     /?estimation=…), après style.css : elle ne redéfinit aucune règle du
     site, elle ajoute l'encart placé en tête du formulaire. Mêmes variables,
     mêmes rayons, mêmes zones tactiles (40 px) que le reste du formulaire.
     Aucun style en ligne sur ce site (CSP style-src 'self') : tout est ici.
     ========================================================================== */

  /* Lu par les lecteurs d'écran, jamais affiché (annonce du retrait). */
  .jest-sr{
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
  }

  /* ---------- l'encart ---------- */
  .jest{
    margin:0 0 22px; padding:16px 18px;
    background:var(--foam); border:1.5px solid rgba(31,90,168,0.28); border-radius:12px;
  }
  .jest-titre{
    margin:0 0 10px; font-family:var(--display); font-weight:600; font-size:17px; line-height:1.3;
    color:var(--ink);
  }
  .jest-ref{
    display:inline-block; margin-left:4px; padding:2px 10px; vertical-align:1px;
    font-family:var(--body); font-weight:800; font-size:13px; letter-spacing:0.02em;
    color:var(--rust-dark); background:#fff; border:1px solid var(--line); border-radius:999px;
  }
  .jest-lignes{list-style:none; margin:0; padding:0;}
  .jest-ligne{
    display:flex; justify-content:space-between; align-items:baseline; gap:12px;
    padding:6px 0; border-bottom:1px dashed rgba(14,39,66,0.18); font-size:14.5px;
  }
  .jest-nom{min-width:0; overflow-wrap:break-word;}
  .jest-montant{flex:none; font-weight:700; white-space:nowrap;}
  /* Prestation à capacités (chantier 03) : ses bacs, sous son nom. */
  .jest-ligne{flex-wrap:wrap;}
  .jest-bacs{flex:1 0 100%; order:3; font-size:13px; color:var(--ink-soft); overflow-wrap:break-word;}
  .jest-total{
    display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:4px 12px;
    margin:8px 0 0; font-size:15px;
  }
  .jest-total strong{font-weight:800; color:var(--water-dark);}
  .jest-note{margin:8px 0 0; font-size:13px; color:var(--ink-soft);}

  .jest-actions{display:flex; flex-wrap:wrap; gap:8px 18px; margin:10px 0 0;}
  .jest-pdf, .jest-retirer, .jest-rejoindre{
    display:inline-flex; align-items:center; min-height:40px; padding:0 2px;
    font-family:var(--body); font-size:14.5px; font-weight:700; color:var(--water-dark);
    text-decoration:underline; text-underline-offset:3px;
    background:none; border:0; cursor:pointer;
  }
  .jest-retirer{color:var(--rust-dark);}
  .jest-pdf:hover, .jest-retirer:hover, .jest-rejoindre:hover{text-decoration-thickness:2px;}

  /* ---------- après « Retirer » (avec JavaScript) ---------- */
  .jest-retiree{
    display:flex; flex-wrap:wrap; align-items:center; gap:4px 16px;
    margin:0 0 22px; padding:10px 16px;
    background:var(--paper); border:1px dashed var(--line); border-radius:12px; font-size:14.5px;
  }
  .jest-retiree p{margin:0;}

  /* ---------- estimation impossible à joindre ---------- */
  .jest-message{
    margin:0 0 22px; padding:12px 16px;
    background:#FFF7E0; border:1.5px solid rgba(184,147,10,0.45); border-radius:12px;
    font-size:14.5px; line-height:1.5;
  }

  @media (max-width:520px){
    .jest{padding:14px 14px;}
    .jest-ligne{font-size:14px;}
  }

/* Une estimation est déjà jointe : le lien « faire mon pré-devis » du
   formulaire n'a plus lieu d'être (une demande = une estimation). */
.jest ~ .form-predevis{ display:none !important; }
/* Même chose pour l'encart bleu « Faites d'abord votre pré-devis », posé
   dans l'autre colonne (pas un voisin du formulaire : d'où :has). */
body:has(.jest) .devis-predevis{ display:none !important; }

/* ---------- plusieurs types de prestation : cases à cocher ----------
   Posées par joindre-estimation.php à la place du <select id="type"> quand
   l'estimation couvre au moins deux types. Elles vivent dans un .field : on
   y défait le rembourrage et la bordure que style.css donne aux champs
   (.field input) et le gras des étiquettes (.field label). */
  .jest-types{margin:0; padding:0; border:0; min-width:0;}
  .jest-types-titre{
    padding:0; margin:0 0 4px;
    font-size:13px; font-weight:700; letter-spacing:0.02em; color:var(--ink);
  }
  .jest-types-aide{margin:0 0 8px; font-size:13px; color:var(--ink-soft);}
  .jest-types-liste{
    list-style:none; margin:0; padding:0;
    display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:6px 14px;
  }
  .jest-types-item{display:flex; align-items:center; gap:10px; min-height:40px; min-width:0;}
  .field .jest-types-item input[type="checkbox"]{
    flex:none; width:20px; height:20px; margin:0; padding:0;
    border:0; border-radius:4px; accent-color:var(--water); cursor:pointer;
  }
  .field .jest-types-item label{
    font-size:15px; font-weight:400; letter-spacing:0; color:var(--ink);
    line-height:1.35; min-width:0; overflow-wrap:break-word; cursor:pointer;
  }
  .field .jest-types-item input[type="checkbox"]:checked + label{font-weight:700;}
  @media (max-width:520px){
    .jest-types-liste{grid-template-columns:1fr; gap:2px;}
  }