/* ============================================================================
   GÉNÉRATEUR DE TITRE MALT — design WPMalter (dark)
   Formulaire + loader + ecran de confirmation. Aucun contenu genere n'est
   injecte dans la page : les titres partent par mail.
   ============================================================================ */
.wpm-tm { position:relative; overflow:hidden; padding:clamp(56px,8vw,110px) 0; }
.wpm-tm-inner { position:relative; z-index:1; max-width:760px; }

/* ---- INTRO + FORM --------------------------------------------------------- */
.wpm-tm-intro { text-align:center; }
.wpm-tm-intro .eyebrow { display:inline-flex; align-items:center; gap:8px; margin-bottom:20px; }
.wpm-tm-intro h1 { font-family:var(--wpm-font-display); font-size:clamp(30px,4.6vw,50px); line-height:1.06; letter-spacing:-0.03em; margin:0 0 16px; }
.wpm-tm-intro .lede { font-size:clamp(16px,2vw,19px); line-height:1.6; color:var(--wpm-text-secondary); max-width:58ch; margin:0 auto 36px; }

.wpm-tm-form { max-width:600px; margin:0 auto; text-align:left; background:var(--wpm-surface-1);
  border:1px solid var(--wpm-border); border-radius:var(--wpm-radius-lg); padding:clamp(22px,3vw,32px); }

.tm-field { display:flex; flex-direction:column; gap:7px; margin-bottom:20px; }
.tm-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tm-field label, .tm-label { font-size:13.5px; font-weight:600; color:var(--wpm-text-primary); }
.tm-help { margin:0; font-size:12.5px; line-height:1.5; color:var(--wpm-text-muted); }

.tm-field input[type="text"], .tm-field input[type="email"], .tm-field select {
  width:100%; padding:13px 15px; font-size:15px; color:var(--wpm-text-primary);
  background:var(--wpm-surface-2); border:1px solid var(--wpm-border);
  border-radius:var(--wpm-radius-md); transition:var(--wpm-transition); }
.tm-field input::placeholder { color:var(--wpm-text-muted); }
.tm-field input:focus, .tm-field select:focus { outline:none; border-color:var(--wpm-brand); box-shadow:0 0 0 3px var(--wpm-brand-surface); }
.tm-field select { appearance:none; -webkit-appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--wpm-text-muted) 50%),linear-gradient(135deg,var(--wpm-text-muted) 50%,transparent 50%);
  background-position:calc(100% - 20px) calc(50% + 2px),calc(100% - 15px) calc(50% + 2px);
  background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:44px; }
.tm-field select option { background:var(--wpm-surface-2); color:var(--wpm-text-primary); }

/* chips outils */
.tm-chips { display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 4px; }
.tm-chip { position:relative; cursor:pointer; }
.tm-chip input { position:absolute; opacity:0; width:1px; height:1px; }
.tm-chip span { display:inline-block; padding:8px 14px; font-size:13.5px; line-height:1.2;
  color:var(--wpm-text-secondary); background:var(--wpm-surface-2); border:1px solid var(--wpm-border);
  border-radius:var(--wpm-radius-pill); transition:var(--wpm-transition); }
.tm-chip:hover span { border-color:var(--wpm-border-strong); color:var(--wpm-text-primary); }
.tm-chip input:checked + span { color:#fff; background:var(--wpm-brand); border-color:var(--wpm-brand); }
.tm-chip input:focus-visible + span { box-shadow:0 0 0 3px var(--wpm-brand-surface); }
.tm-input-inline { width:100%; padding:11px 14px; font-size:14px; color:var(--wpm-text-primary);
  background:var(--wpm-surface-2); border:1px solid var(--wpm-border); border-radius:var(--wpm-radius-md); transition:var(--wpm-transition); }
.tm-input-inline::placeholder { color:var(--wpm-text-muted); }
.tm-input-inline:focus { outline:none; border-color:var(--wpm-brand); box-shadow:0 0 0 3px var(--wpm-brand-surface); }

.tm-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.tm-consent { display:flex; align-items:flex-start; gap:10px; margin:2px 0 18px; font-size:13.5px; line-height:1.5; color:var(--wpm-text-secondary); cursor:pointer; }
.tm-consent input { margin-top:3px; flex-shrink:0; accent-color:var(--wpm-brand); width:16px; height:16px; }
.tm-consent a { color:var(--wpm-link); text-decoration:underline; }

.tm-error { margin:14px 0 0; font-size:14px; color:var(--wpm-accent-warm); text-align:center; }
.tm-limit { display:flex; align-items:center; justify-content:center; gap:7px; flex-wrap:wrap; margin:16px 0 0;
  font-size:12px; line-height:1.5; color:var(--wpm-text-muted); text-align:center; }
.tm-limit svg { width:14px; height:14px; }
.tm-limit a { color:var(--wpm-text-secondary); text-decoration:underline; }

/* bouton submit + spinner */
[data-tm-submit] { position:relative; }
[data-tm-submit] .tm-spinner { display:none; position:absolute; top:50%; left:50%; width:20px; height:20px; margin:-10px 0 0 -10px;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:wpm-tm-spin .7s linear infinite; }
[data-tm-submit].is-loading .tm-btn-label { visibility:hidden; }
[data-tm-submit].is-loading .tm-spinner { display:block; }
@keyframes wpm-tm-spin { to { transform:rotate(360deg); } }

/* ---- LOADER 4 etapes ------------------------------------------------------ */
.wpm-tm-loader { max-width:500px; margin:0 auto; text-align:center;
  background:var(--wpm-surface-1); border:1px solid var(--wpm-border); border-radius:var(--wpm-radius-lg); padding:clamp(30px,4vw,46px); }
.tl-spinner { width:42px; height:42px; margin:0 auto 22px; border:3px solid var(--wpm-surface-2); border-top-color:var(--wpm-brand);
  border-radius:50%; animation:wpm-tm-spin .8s linear infinite; }
.wpm-tm-loader h2 { font-family:var(--wpm-font-display); font-size:22px; letter-spacing:-0.02em; margin:0 0 24px; }
.tl-steps { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; text-align:left; }
.tl-steps li { display:flex; align-items:center; gap:12px; font-size:14.5px; color:var(--wpm-text-muted); transition:color var(--wpm-dur) var(--wpm-ease); }
.tl-steps li .tl-dot { width:18px; height:18px; border-radius:50%; border:2px solid var(--wpm-border-strong); flex-shrink:0; }
.tl-steps li .tl-check { display:none; width:18px; height:18px; border-radius:50%; background:var(--wpm-brand); color:#fff; flex-shrink:0; align-items:center; justify-content:center; }
.tl-steps li .tl-check svg { width:11px; height:11px; }
.tl-steps li.is-active { color:var(--wpm-text-primary); }
.tl-steps li.is-active .tl-dot { border-color:var(--wpm-brand); border-top-color:transparent; animation:wpm-tm-spin .8s linear infinite; }
.tl-steps li.is-done { color:var(--wpm-text-secondary); }
.tl-steps li.is-done .tl-dot { display:none; }
.tl-steps li.is-done .tl-check { display:flex; }

/* ---- CONFIRMATION --------------------------------------------------------- */
.wpm-tm-done { max-width:620px; margin:0 auto; text-align:center; }
.tm-done-mark { display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; margin-bottom:20px;
  border-radius:50%; background:var(--wpm-brand); color:#fff; }
.tm-done-mark svg { width:24px; height:24px; }
.wpm-tm-done h2 { font-family:var(--wpm-font-display); font-size:clamp(24px,3.4vw,34px); letter-spacing:-0.025em; margin:0 0 14px; }
.wpm-tm-done > p { font-size:16px; line-height:1.65; color:var(--wpm-text-secondary); max-width:52ch; margin:0 auto 36px; }
.wpm-tm-done > p strong { color:var(--wpm-text-primary); }

.tm-done-next { background:var(--wpm-surface-1); border:1px solid var(--wpm-border); border-radius:var(--wpm-radius-lg); padding:clamp(24px,3vw,36px); }
.tm-done-next h3 { font-family:var(--wpm-font-display); font-size:22px; letter-spacing:-0.02em; margin:0 0 10px; }
.tm-done-next > p { font-size:15.5px; line-height:1.65; color:var(--wpm-text-secondary); max-width:50ch; margin:0 auto 24px; }
.tm-done-fine { font-size:13px; line-height:1.6; color:var(--wpm-text-muted); max-width:48ch; margin:18px auto 0; }

@media (max-width:640px) {
  .tm-row { grid-template-columns:1fr; }
}
