/* Regles de phase du parcours (choix / brief / envoi).
   Extrait de demarrer.html le 07/09 pour que closer.html les partage :
   deux copies auraient diverge des la premiere retouche. */
/* phase 1 : on choisit, on n'envoie pas encore */
  #partie-devis[data-phase="choix"] #form-devis { display:none !important; }
  #partie-devis[data-phase="envoi"] #apres-choix,
  #partie-devis[data-phase="envoi"] #catalogue,
  #partie-devis[data-phase="envoi"] #recap { display:none; }
  #partie-devis[data-phase="choix"] #retour-choix { display:none; }
  #partie-devis[data-phase="choix"] #retour-brief { display:none; }
  #partie-devis[data-phase="choix"] .doc-contrat,
  #partie-devis[data-phase="choix"] .doc-devis,
  #partie-devis[data-phase="choix"] .signature-bloc { display:none; }
  /* Le devis, tel que le client le lit avant de signer */
  .doc-devis { border:1px solid var(--trait,#2a2a2a); border-radius:14px; padding:14px; margin:26px 0; background:rgba(255,255,255,.02); }
  .apercu-tete { display:flex; align-items:baseline; gap:12px; padding:2px 6px 10px; }
  .apercu-etat { font-size:.78rem; opacity:.55; }
  #apercu-onglet { margin-left:auto; font-size:.84rem; }
  .apercu-pages { display:flex; flex-direction:column; gap:12px; max-height:70vh; overflow-y:auto; padding:2px; }
  .apercu-pages img { width:100%; height:auto; display:block; border-radius:8px; background:#fff;
    box-shadow:0 2px 12px rgba(0,0,0,.35); }
  .apercu-pages:empty::after { content:'préparation du document…'; display:block; padding:40px 0;
    text-align:center; opacity:.5; font-size:.9rem; }
  .apercu-note { margin:6px 6px 2px; }
  .apercu-repli { margin:10px 6px 0; font-size:.86rem; }
  #apercu-maj { margin-left:auto; }
  #apercu-onglet { margin-left:14px; }

  .doc-tete { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; }
  .doc-tete h3 { margin:0 0 6px; font-size:1.5rem; }
  .doc-emetteur, .doc-meta { font-size:.86rem; line-height:1.55; opacity:.75; margin:0; }
  .doc-meta { text-align:right; }
  .doc-client { margin:18px 0 10px; font-size:.94rem; }
  .doc-lignes { width:100%; border-collapse:collapse; font-size:.95rem; }
  .doc-lignes td { padding:8px 0; border-bottom:1px solid rgba(255,255,255,.08); }
  .doc-lignes td.r { text-align:right; white-space:nowrap; font-weight:600; }
  .doc-totaux { margin-top:14px; display:flex; flex-direction:column; gap:6px; align-items:flex-end; }
  .doc-totaux div { display:flex; gap:18px; align-items:baseline; }
  .doc-totaux b { font-size:1.2rem; color:var(--accent,#e2622a); }
  .doc-mentions { margin:18px 0 0; padding-left:18px; font-size:.82rem; line-height:1.5; opacity:.72; }
  .doc-mentions li { margin-bottom:5px; }

  /* Le contrat, depliable sous le devis */
  .doc-contrat { border:1px solid var(--trait,#2a2a2a); border-radius:14px; padding:0 20px; margin:0 0 26px; }
  .doc-contrat summary { cursor:pointer; padding:16px 0; font-weight:600; }
  .doc-contrat summary span { display:block; font-weight:400; font-size:.84rem; opacity:.65; margin-top:3px; }
  .contrat-corps { padding:4px 4px 14px; }

  .contrat-corps h2 { font-size:.76rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent,#e2622a); margin:18px 0 6px; }
  .contrat-corps p, .contrat-corps li { opacity:.8; margin:0 0 6px; }
  .contrat-corps ul { padding-left:18px; }
  .contrat-corps .encadre { border-left:2px solid var(--accent,#e2622a); padding-left:12px; }
  .contrat-parties { border-bottom:1px solid rgba(255,255,255,.08); padding-bottom:12px; }
  /* La signature : deux cadres cote a cote, le mien apparait quand le sien existe */
  .signature-bloc { margin:24px 0 8px; }
  .signature-consigne { margin:0 0 12px; font-size:.95rem; }
  .signature-cadres { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
  .signature-cadre { border:1px dashed var(--trait,#3a3a3a); border-radius:12px; padding:12px 14px; min-height:180px; display:flex; flex-direction:column; }
  .signature-titre { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; opacity:.6; }
  #toile { width:100%; height:150px; touch-action:none; cursor:crosshair; background:#fff; border-radius:8px; margin-top:8px; }
  .lien-effacer { background:none; border:none; color:inherit; opacity:.6; font-size:.8rem; text-decoration:underline; cursor:pointer; padding:6px 0 0; align-self:flex-start; }
  .signature-moi { margin-top:8px; background:#fff; border-radius:8px; opacity:0; transition:opacity .7s ease; display:flex; align-items:center; justify-content:center; height:150px; }
  .signature-moi.visible { opacity:1; }
  .signature-moi img { max-width:88%; max-height:140px; object-fit:contain; }
  .signature-attente { font-size:.82rem; opacity:.55; margin:auto 0 0; }
  .signature-date { font-size:.82rem; opacity:.7; margin:10px 0 0; }
  @media (max-width:620px) { .signature-cadres { grid-template-columns:1fr; } .doc-meta { text-align:left; } }

  /* le bloc d'engagement : il doit se lire, pas se survoler */
  .engagement { border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:20px 22px; margin:26px 0 20px; }
  .engagement-titre { font-weight:600; font-size:.95rem; opacity:.82; margin:0 0 10px; }
  .engage { display:flex; gap:12px; align-items:flex-start; margin-top:14px; line-height:1.6; cursor:pointer; }
  .engage input { margin-top:3px; flex:none; width:18px; height:18px; accent-color:var(--accent, #e2622a); }
  #form-devis button[type=submit]:disabled { opacity:.45; cursor:not-allowed; }

  /* la reprise de session est confortable, mais il faut pouvoir en sortir */
  #reprise-barre { font-size:.86rem; opacity:.7; margin:18px 0 0; }
  #reprise-barre button { background:none; border:none; color:inherit; font:inherit; text-decoration:underline; cursor:pointer; padding:0 0 0 6px; }