/* © 2026 DRAK Infinity (NEQ 2281240509), Montréal (Québec), Canada. Styles communs des formulaires du site (mission 19, lot B). Écrit à la main.
   Règle de site (REGLES-SITE.md, règle 1) : aucune couleur en dur, seulement les jetons du thème courant (--fen-* pour la fenêtre, --texte2 et --fen-err pour les pages). */

/* ── éléments communs à la page et à la fenêtre ── */
form.drkf [hidden]{display:none!important}
form.drkf .piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
form.drkf .drkf-tel-ligne{display:grid;grid-template-columns:minmax(0,13.5rem) minmax(0,1fr);gap:10px}
form.drkf .drkf-pied-champ{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
form.drkf .drkf-pied-champ .note{margin-top:6px;flex:1 1 auto}
form.drkf .drkf-compteur{margin:6px 0 0;flex:none;white-space:nowrap;font-size:14px;font-variant-numeric:tabular-nums;color:var(--fen-texte2)}
form.drkf .drkf-compteur.drkf-alerte{color:var(--fen-err);font-weight:700}
form.drkf .drkf-erreur{margin:6px 0 0;font-size:14px;line-height:1.4;color:var(--fen-err)}
form.drkf [aria-invalid="true"]{border-color:var(--fen-err)}
form.drkf .drkf-case{display:flex;align-items:flex-start;gap:10px;font-weight:400}
form.drkf .drkf-case input{width:auto;flex:none;margin-top:4px}
form.drkf .drkf-statut{margin:12px 0 0;font-size:14px;min-height:1.4em;color:var(--fen-texte2)}
form.drkf .drkf-statut-err{color:var(--fen-err);font-weight:600}
form.drkf .drkf-avis{font-size:13px;line-height:1.5}
.drkf-confirmation{margin:8px 0 4px;padding:14px 16px;border:1px solid var(--fen-trait);border-radius:12px;background:var(--fen-surface);color:var(--fen-texte);font-size:16px;line-height:1.5}

/* ── Mission 31-BIS, lot A (fait 198) : le même <form> affiché en page entière (/devis, /en/quote, #formulaire), hors fenêtre — là où
   aucune règle .drkf-fenetre ne s'applique. Mise en page seulement, aucun champ changé. Bouton : 320 px sur ordinateur, pleine
   largeur sur téléphone, 32 px sous le dernier champ. Mentions (consentement, 2 000 caractères, conditions) : 11 px. ── */
#formulaire .note{font-size:11px}
#formulaire .drkf-envoyer{width:320px;max-width:100%;margin-top:32px}
@media (max-width:640px){#formulaire .drkf-envoyer{width:100%}}

/* ── « Me prévenir » : affiché dans la page, à son emplacement normal dans le flux, avec ou sans JavaScript (mission 31, lot C, fait 179 i : plus de fenêtre surgissante nulle part) ── */
.drkf-inline{margin-top:18px}

/* ── Variante pleine largeur du conteneur de « Me prévenir » (fait 179 a) : remplace la classe .conteneur (site.css, largeur fixe 1080 px) sans toucher au <form> ── */
.drkf-pleine-largeur{width:100%;max-width:none;margin:18px 0 0;padding:0 24px}
@media (max-width:640px){.drkf-pleine-largeur{padding:0 16px}}

/* ── fenêtre ── */
html.drkf-ouvert{overflow:hidden}
html.drkf-ouvert .jmodal{z-index:100001}   /* fenêtre « Conditions, paiement & contrat » ouverte depuis le formulaire */
.drkf-voile{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:12px;overflow:auto;background:var(--fen-voile);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.drkf-fenetre{position:relative;box-sizing:border-box;width:min(640px,100%);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;padding:26px 26px 22px;background:var(--fen-fond);color:var(--fen-texte);border:1px solid var(--fen-trait);border-radius:18px;box-shadow:var(--fen-ombre);font-family:var(--sans,system-ui,sans-serif);font-size:15px;line-height:1.5}
.drkf-fenetre *,.drkf-fenetre *::before,.drkf-fenetre *::after{box-sizing:border-box;text-shadow:none}
.drkf-fenetre:focus{outline:none}
.drkf-fermer{position:absolute;top:12px;right:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--fen-trait);border-radius:50%;background:transparent;color:var(--fen-texte);font-size:24px;line-height:1;cursor:pointer}
.drkf-fermer:hover{border-color:var(--fen-or)}
.drkf-titre{margin:0 48px 4px 0;font-family:var(--serif-titres,Georgia,serif);font-size:28px;font-weight:600;line-height:1.15;color:var(--fen-texte)}
.drkf-sous{margin:0 0 16px;font-size:13.5px;color:var(--fen-or)}
.drkf-fenetre form.drkf{max-width:none;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.drkf-fenetre .champ{margin:0 0 14px}
.drkf-fenetre .deux{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.drkf-fenetre label{display:block;margin:0 0 6px;font-size:14px;font-weight:600;color:var(--fen-texte)}
.drkf-fenetre label .fac{font-weight:400;color:var(--fen-texte2)}
.drkf-fenetre .drkf-case{display:flex;font-size:14px}
.drkf-fenetre input,.drkf-fenetre select,.drkf-fenetre textarea{display:block;width:100%;margin:0;padding:11px 13px;font:inherit;font-size:15px;color:var(--fen-texte);background:var(--fen-surface);border:1px solid var(--fen-trait);border-radius:10px}
.drkf-fenetre input[type="checkbox"]{width:auto;padding:0;accent-color:var(--fen-or)}
.drkf-fenetre textarea{min-height:130px;resize:vertical}
.drkf-fenetre input::placeholder,.drkf-fenetre textarea::placeholder{color:var(--fen-texte2);opacity:1}
.drkf-fenetre select option{background:var(--fen-surface);color:var(--fen-texte)}
.drkf-fenetre input:focus,.drkf-fenetre select:focus,.drkf-fenetre textarea:focus,.drkf-fermer:focus-visible,.drkf-envoyer:focus-visible,.drkf-fenetre a:focus-visible{outline:2px solid var(--fen-or);outline-offset:2px}
.drkf-fenetre .note{margin:6px 0 0;font-size:13px;line-height:1.5;color:var(--fen-texte2)}
.drkf-fenetre a{color:var(--fen-or);text-decoration:underline}
.drkf-fenetre .drkf-envoyer{display:block;width:100%;margin:6px 0 0;padding:13px 22px;border:0;border-radius:999px;background:var(--fen-or);color:var(--fen-fond);font:600 15px var(--sans,system-ui,sans-serif);text-align:center;cursor:pointer;transform:none;box-shadow:none;filter:none}
.drkf-fenetre .drkf-envoyer:hover{filter:brightness(1.06)}
.drkf-fenetre .drkf-envoyer:disabled{opacity:.6;cursor:default}
@media (max-width:640px){
  form.drkf .deux{grid-template-columns:1fr}
  .drkf-fenetre .deux{grid-template-columns:1fr;gap:0}
  .drkf-voile{padding:8px}
  .drkf-fenetre{max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);padding:20px 16px 18px;border-radius:14px}
  .drkf-titre{font-size:24px}
  form.drkf .drkf-tel-ligne{grid-template-columns:minmax(0,10.5rem) minmax(0,1fr)}
  form.drkf .drkf-pied-champ{flex-direction:column;gap:0}
}
@media (prefers-reduced-motion:reduce){.drkf-fenetre,.drkf-voile{animation:none;transition:none}}

form.drkf .drkf-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}