/* ==========================================================================
   Tomek Training — Formulaire « Séance d'essai » (ERA STUDIO)
   S'appuie sur components.css (.tk-form, .tk-progress, .tk-input, .tk-chip,
   .tk-choice-card, .tk-consent, .tk-note, .tk-field-error) et la maquette.
   ========================================================================== */

.e-con.tk-form{width:100%;max-width:620px;justify-self:end}
.tk-essai{position:relative;display:flex;flex-direction:column;gap:26px;color:var(--tk-text);font-family:var(--tk-font-body)}
.tk-essai [hidden]{display:none!important}
.tk-essai fieldset{margin:0;padding:0;border:0;min-width:0;display:flex;flex-direction:column;gap:12px}
.tk-essai legend{float:left;width:100%;padding:0;margin:0 0 6px}
.tk-essai legend+*{clear:both}

/* En-tête : étape + barre de progression */
.tk-essai__head{display:flex;flex-direction:column;gap:12px}
.tk-essai__meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.tk-essai__count{font:600 12px/1 var(--tk-font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--tk-cta)}
.tk-essai__count b{font-weight:inherit}
.tk-essai__hint{font:500 13px/1 var(--tk-font-body);color:var(--tk-text-muted)}
.tk-essai .tk-progress i{display:block;transition:background .3s}

/* Questions */
.tk-essai__step{display:flex;flex-direction:column;gap:26px}
.tk-essai__step--3{gap:18px}
.tk-essai__q{margin:0;font:800 clamp(22px,2.4vw,26px)/1.1 var(--tk-font-display);color:var(--tk-text-strong);outline:none}
.tk-essai__q--s{font:700 19px/1.2 var(--tk-font-display)}
.tk-essai__help{margin-top:-6px;font:400 14px/1.4 var(--tk-font-body);color:var(--tk-text-muted)}

/* Choix : vraie case à cocher / bouton radio, visuellement masqué */
.tk-essai__chips{display:flex;flex-wrap:wrap;gap:10px}
.tk-essai__cards{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.tk-essai__cards--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
@media (min-width:768px){.tk-essai__cards:not(.tk-essai__cards--2){grid-template-columns:repeat(3,minmax(0,1fr))}}
.tk-opt{position:relative;display:block;margin:0;cursor:pointer;line-height:1}
.tk-opt input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.tk-essai .tk-chip{transition:background .15s,border-color .15s,color .15s;-webkit-user-select:none;user-select:none}
.tk-essai__cards .tk-chip{width:100%;height:100%}
.tk-chip--plain::before{content:none!important}
.tk-opt input:focus-visible+.tk-chip{outline:3px solid var(--tk-focus);outline-offset:3px}
.tk-opt input:checked+.tk-chip{background:var(--tk-petrol-700);border-color:var(--tk-petrol-700);color:var(--tk-creme-100)}
.tk-choice-card::before{content:none!important}
.tk-choice-card b{font:700 15px/1 var(--tk-font-body)}
.tk-choice-card small{font:400 12px/1.25 var(--tk-font-body);opacity:.85}
.tk-choice-card--center{min-height:68px;padding:10px;align-items:center;text-align:center;gap:5px}
.tk-choice-card--left{align-items:flex-start;text-align:left}
.tk-choice-card--left b{font-size:16px}
.tk-choice-card--left small{font:500 14px/1 var(--tk-font-body)}
.tk-essai .has-error .tk-chip,.tk-essai .has-error .tk-consent{border-color:var(--tk-error)}
.tk-essai .tk-field-error{font-size:13px}
.tk-essai .tk-essai__group>.tk-field-error{font-size:14px}

/* Note « places limitées » */
.tk-essai__note{margin:0;align-items:flex-start}
.tk-essai__note::before{content:"";width:7px;height:7px;margin-top:7px;border-radius:50%;flex:none;background:var(--tk-accent)}

/* Coordonnées (sélecteurs renforcés : le reset de Hello stylise les inputs) */
.tk-essai__row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:16px}
.tk-essai__field{display:flex;flex-direction:column;gap:8px}
.tk-essai .tk-label{display:block;line-height:1.2}
.tk-essai .tk-input{height:52px;padding:0 16px;border-radius:var(--tk-radius-md);border:1.5px solid var(--tk-border-input);background:#fff;font:400 16px var(--tk-font-body);color:var(--tk-text-strong);width:100%;box-shadow:none;transition:border-color .15s,box-shadow .15s}
.tk-essai .tk-input::placeholder{color:var(--tk-ardoise-400);opacity:1}
.tk-essai .tk-input:focus{outline:none;border-color:var(--tk-petrol-700);box-shadow:0 0 0 4px rgba(0,136,148,.22)}
.tk-essai .tk-input[aria-invalid="true"]{border-color:var(--tk-error);background:#FFF8F7}
.tk-essai .tk-consent{min-height:44px;cursor:pointer;color:var(--tk-text);line-height:1.5}
.tk-essai .tk-consent input{margin:1px 0 0;cursor:pointer}
.tk-essai .tk-consent a{color:var(--tk-cta);font-weight:600}

/* Navigation */
.tk-essai__nav{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.tk-essai .tk-essai__next{min-height:56px;margin-left:auto}
.tk-essai .tk-essai__back{min-height:52px;padding:0 20px;font-size:14px}
.tk-essai__reassure{font:400 13px/1.4 var(--tk-font-body);color:var(--tk-text-muted)}
.tk-essai .tk-btn.is-loading{opacity:.75;cursor:progress;transform:none;box-shadow:none}
.tk-essai__global{margin:0;padding:12px 14px;border-radius:12px;background:var(--tk-error-bg);color:var(--tk-error);font:500 14px/1.4 var(--tk-font-body)}
@media (max-width:480px){
  .tk-essai .tk-essai__next{width:100%;margin-left:0;order:3}
  .tk-essai__reassure{width:100%;text-align:center;order:4}
}

/* Champ piège anti-robot */
.tk-essai__hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;opacity:0;pointer-events:none}

/* Sans JavaScript : toutes les étapes visibles, pas de barre d'étapes */
.tk-essai:not(.is-enhanced) .tk-essai__head,.tk-essai:not(.is-enhanced) .tk-essai__back{display:none}

/* Le formulaire est une carte blanche posée sur la section sombre */
.tk-on-dark .tk-form :focus-visible{outline-color:var(--tk-focus)}
.tk-on-dark .tk-form .tk-btn--ghost{color:var(--tk-petrol-700);box-shadow:inset 0 0 0 2px var(--tk-petrol-700)}
.tk-on-dark .tk-form .tk-btn--ghost:hover{background:var(--tk-petrol-50);color:var(--tk-petrol-700)}

/* Écran de succès */
.tk-essai__done{display:flex;flex-direction:column;gap:22px;align-items:flex-start;outline:none}
.tk-essai__badge{width:84px;height:96px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:18px;background:var(--tk-cta);color:#fff;font:700 40px/1 var(--tk-font-body);border-radius:50% 50% 16px 16px / 45% 45% 16px 16px}
.tk-essai__done-txt{display:flex;flex-direction:column;gap:12px}
.tk-essai__done h3{margin:0;font:900 clamp(28px,3.6vw,40px)/1 var(--tk-font-display);text-transform:uppercase;color:var(--tk-text-strong)}
.tk-essai__done p{margin:0;font:400 17px/1.6 var(--tk-font-body);color:var(--tk-text);text-wrap:pretty}
.tk-essai__done strong{color:var(--tk-text-strong);overflow-wrap:anywhere}
.tk-essai__recap{width:100%;background:var(--tk-creme-100);border:1px solid var(--tk-border);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:12px}
.tk-essai__recap-t{font:600 12px/1 var(--tk-font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--tk-cta)}
.tk-essai__recap dl{margin:0;display:grid;grid-template-columns:100px minmax(0,1fr);gap:8px 12px;font:400 15px/1.4 var(--tk-font-body)}
.tk-essai__recap dt{color:var(--tk-text-muted)}
.tk-essai__recap dd{margin:0;font-weight:700;color:var(--tk-text-strong)}
.tk-essai__bring{display:flex;flex-direction:column;gap:10px}
.tk-essai__bring-t{font:700 17px/1.2 var(--tk-font-display);color:var(--tk-text-strong)}
.tk-essai__bring ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.tk-essai__bring li{display:flex;gap:10px;align-items:center;font:400 15px/1.4 var(--tk-font-body);color:var(--tk-text)}
.tk-essai__bring li::before{content:"";width:14px;height:18px;flex:none;background:var(--tk-accent);-webkit-mask:url(../brand/kettlebell.svg) center/contain no-repeat;mask:url(../brand/kettlebell.svg) center/contain no-repeat}
.tk-essai .tk-essai__again{height:48px;padding:0 4px;border:0;border-radius:0;background:transparent;color:var(--tk-cta);font:600 15px/1 var(--tk-font-body);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;cursor:pointer}
.tk-essai .tk-essai__again:hover{background:transparent;color:var(--tk-cta-hover)}

/* Accompagnant : champ révélé si « À deux » (toujours visible sans JavaScript) */
.tk-essai__companion{margin-top:-10px;padding:16px;border-radius:16px;background:var(--tk-creme-100);border:1px solid var(--tk-border)}
.tk-essai__companion .tk-essai__help{margin-top:0;font-size:13px}
.tk-essai.is-enhanced .tk-essai__companion:not(.is-open){display:none}
@media (prefers-reduced-motion:no-preference){.tk-essai__companion.is-open{animation:tk-reveal-in .25s var(--tk-ease)}}
@keyframes tk-reveal-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
/* Formulaire allégé : mention d'information sous le bouton, champ facultatif */
.tk-essai__legal{margin:-10px 0 0;font:400 12px/1.5 var(--tk-font-body);color:var(--tk-text-muted)}
.tk-essai__legal a{color:var(--tk-cta);font-weight:600}
.tk-essai.is-done .tk-essai__legal{display:none}
.tk-essai__opt{font-weight:400;color:var(--tk-text-muted)}
