/* MOVEO COACH — Intake forms · v6.32
   Estilos compartidos entre alumno (booking form) y coach (ficha + Mensajes) */

/* ═════════════════════════════════════════════════════════════
   Botón cuestionario adaptado en booking form (alumno)
   ═════════════════════════════════════════════════════════════ */
details.pre-q[data-coach-type="alto_rendimiento"]{
  background:#FFFBF0 !important;
  border-color:#E8C879 !important;
}
details.pre-q[data-coach-type="creators"]{
  background:#F8F5FF !important;
  border-color:#C8BFEE !important;
}

/* ═════════════════════════════════════════════════════════════
   Bloque ficha alumno (lado coach, read-only)
   ═════════════════════════════════════════════════════════════ */
.intake-form-block{
  background:#fff;
  border:1px solid var(--line, #E9DFCB);
  border-radius:14px;
  padding:12px;
  margin:14px 0 12px;
}
.intake-form-block__head{
  display:flex;
  align-items:center;
  gap:8px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line, #E9DFCB);
  margin-bottom:10px;
}
/* [v7.15] Cuestionario desplegable: cabecera clicable + chevron + plegar cuerpo */
.intake-form-block.is-collapsible .intake-form-block__head{ cursor:pointer; }
.intake-form-block__chev{ margin-left:6px; font-size:16px; line-height:1; color:var(--taupe,#8A7E68); transition:transform .2s ease; flex:none; }
.intake-form-block.is-collapsed .intake-form-block__chev{ transform:rotate(-90deg); }
.intake-form-block.is-collapsed .intake-form-block__head{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
.intake-form-block.is-collapsed .intake-form-block__body{ display:none; }
/* [v7.24] El bloque es SIEMPRE blanco; en oscuro los var(--ink…) se vuelven claros →
   título/respuestas ilegibles. Redefinimos los tokens dentro del bloque a sus valores
   CLAROS para que el texto sea oscuro y legible sobre el fondo blanco. */
html[data-theme="dark"] .intake-form-block{
  --ink:#241F18; --line:#E9DFCB; --taupe:#8A7E68; --espresso:#3B332A; --rule:#E9DFCB;
  --sand:#F2EBDE; --sand-50:#F2EBDE; --sand2:#E8DFCC; --paper:#ffffff;
}
.intake-form-block__icon{
  width:30px;
  height:30px;
  border-radius:8px;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
}
.intake-form-block__title{
  flex:1;
  font-family:'DM Sans', sans-serif;
  font-weight:700;
  font-size:12.5px;
  color:var(--ink, #241F18);
}
.intake-form-block__count{
  font-family:'IBM Plex Mono', monospace;
  font-size:9px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#3D4F3C;
  background:#E6EDE5;
  padding:3px 8px;
  border-radius:6px;
}

.intake-qsection-title{
  font-family:'IBM Plex Mono', monospace;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent-2, #4B5D4A);
  margin:14px 0 8px;
}
.intake-qsection-title:first-child{ margin-top:0; }

.ans{
  margin-bottom:9px;
  padding-bottom:9px;
  border-bottom:1px solid var(--sand-50, #F2EBDE);
}
.ans:last-child{
  margin-bottom:0;
  padding-bottom:0;
  border-bottom:0;
}
.ans__label{
  font-family:'IBM Plex Mono', monospace;
  font-size:9px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--mute, #8A7E68);
  margin-bottom:3px;
}
.ans__val{
  font-family:'DM Sans', sans-serif;
  font-size:12.5px;
  color:var(--ink, #241F18);
  line-height:1.3;
}
.ans__text{
  margin-top:2px;
  white-space:pre-wrap;
}
.ans__detail{
  margin-top:6px;
  padding:8px 10px;
  background:var(--sand-50, #F2EBDE);
  border-radius:8px;
  font-family:'DM Sans', sans-serif;
  font-size:13px;
  color:var(--ink, #241F18);
  line-height:1.4;
  white-space:pre-wrap;
}

.pill{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  font-family:'IBM Plex Mono', monospace;
  font-size:9px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pill--yes{ background:#E6EDE5; color:#3D4F3C; }
.pill--no { background:#F4E0DD; color:#7A3328; }
.pill--chip{
  background:var(--sand-50, #F2EBDE);
  color:var(--ink, #241F18);
  border:1px solid var(--line, #E9DFCB);
  text-transform:none;
  letter-spacing:.06em;
}

/* Pregunta crítica (lesiones / limitación / operación) con respuesta SÍ */
.ans--critical{
  background:linear-gradient(135deg,#FFF7E0,#FBF7EF);
  border:1px solid #E8C879;
  border-radius:10px;
  padding:10px;
  margin:6px 0;
  border-bottom:1px solid #E8C879;
}
.ans--critical .ans__label{ color:#806100; }
.ans--critical .ans__detail{
  background:#fff;
  border:1px solid #E8C879;
  font-size:14px;
  font-weight:500;
}

/* Pregunta clave (Creators Q5 "¿Por qué quieres entrenar conmigo?") */
.ans--highlight-key{
  background:linear-gradient(135deg,#FFFAF0,#FBF7EF);
  border:1.5px solid var(--gold, #B8956A);
  border-radius:12px;
  padding:12px 14px;
  margin:6px 0;
  border-bottom:1.5px solid var(--gold, #B8956A);
}
.ans--highlight-key .ans__label{
  color:var(--gold, #B8956A);
  font-weight:700;
}
.ans--highlight-key .ans__val{
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-weight:500;
  font-size:15px;
  line-height:1.4;
  color:var(--ink, #241F18);
  margin-top:4px;
}

/* ═════════════════════════════════════════════════════════════
   Alerta inbox — sobre "Ver ficha alumno" en Mensajes
   ═════════════════════════════════════════════════════════════ */
.intake-inbox-alert{
  /* estilos inline aplicados en el renderer para que herede colores
     según coach_type; solo aquí el dot pulsante */
}
.intake-inbox-alert__dot{
  position:absolute;
  top:-4px;
  right:-4px;
  width:14px;
  height:14px;
  border-radius:50%;
  background:#B85544;
  border:2px solid var(--paper, #FBF7EF);
  animation:intakeBlink 1.5s ease-in-out infinite;
}
@keyframes intakeBlink{
  0%  { box-shadow:0 0 0 0 rgba(184,84,68,.7); }
  70% { box-shadow:0 0 0 8px rgba(184,84,68,0); }
  100%{ box-shadow:0 0 0 0 rgba(184,84,68,0); }
}

/* ═════════════════════════════════════════════════════════════
   Mobile — ajustar paddings para que respire en sheet
   ═════════════════════════════════════════════════════════════ */
@media (max-width:640px){
  .intake-form-block{ padding:11px; }
  .intake-form-block__head{ padding-bottom:9px; margin-bottom:9px; }
  .intake-form-block__title{ font-size:12px; }
  .intake-form-block__count{ font-size:8.5px; padding:2px 7px; }
  .ans__label{ font-size:8.5px; }
  .ans__val{ font-size:12px; }
  .ans--highlight-key .ans__val{ font-size:14.5px; }

  /* [v6.32d] FIX SCROLL — override AGRESIVO de .m-body cuando hay intake activo.
     En index.html L3603+L3657, .m-body es overflow:hidden flex column en mobile.
     Override directo del PADRE para que él mismo scrolee. Más bulletproof que
     intentar scroll en el #bookForm hijo. */
  body[data-intake-active="1"] #bookModal .m-body{
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
    padding-bottom:calc(40px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body[data-intake-active="1"] #bookModal #bookForm{
    min-height:auto !important;
    height:auto !important;
    overflow:visible !important;
  }
  body[data-intake-active="1"] #bookModal details.pre-q{
    overflow:visible !important;
  }
  /* Modo extra defensivo: si modal con max-height:92dvh es demasiado restrictivo
     cuando hay 16 preguntas expandidas, subir a 95dvh */
  body[data-intake-active="1"] #bookModal.modal{
    max-height:95dvh !important;
    height:95dvh !important;
  }

  /* [v6.32f] BOTÓN "Enviar solicitud" ANCLADO AL FINAL del formulario, NO sticky.
     Por defecto .m-foot tiene position:sticky; bottom:0 — eso lo hace flotar
     encima del contenido del cuestionario. Cuando hay intake activo lo
     forzamos a flujo normal para que aparezca DESPUÉS de la última pregunta. */
  body[data-intake-active="1"] #bookForm .m-foot,
  body[data-intake-active="1"] #bookModal form .m-foot{
    position:static !important;
    bottom:auto !important;
    box-shadow:none !important;
    margin-top:18px !important;
    padding-top:10px !important;
    padding-bottom:18px !important;
    background:transparent !important;
  }
}

/* ═════════════════════════════════════════════════════════════
   [v6.32h] OCULTAR sección PAGO en booking de AR/Creators
   Razón: el precio lo fija el coach DESPUÉS de aceptar la sesión.
   El pago se hace por adelantado tras la aceptación, no al solicitar.
   Solo se envía la solicitud + cuestionario; pago llega después.
   Se aplica en todos los breakpoints (no solo mobile).
   ═════════════════════════════════════════════════════════════ */
body[data-intake-active="1"] #bookForm .pay-block,
body[data-intake-active="1"] #bookForm .pay-microcopy,
body[data-intake-active="1"] #bookForm .pay-block + p,
body[data-intake-active="1"] #bookModal .pay-block,
body[data-intake-active="1"] #bookModal .pay-microcopy{
  display:none !important;
}

/* ═════════════════════════════════════════════════════════════
   [v6.34] FIX SCROLL — wizards de alta entrenador
   En index.html L3657 .m-body{overflow:hidden} y solo
   #joinForm/.elite-wizard-body/.vip-wizard-body/.join-wizard-body
   heredan scroll. Los IDs #vipWizardBody/#eliteWizardBody/#coachWizardBody
   NO están en esa lista → form de alta no scrollea en móvil cuando
   hay muchos campos (email + 2 passwords + Google sign-in + etc).
   ═════════════════════════════════════════════════════════════ */
@media (max-width:640px){
  /* [v6.44 FIX REGRESIÓN] :not([hidden]) — antes display:flex !important
     sobreescribía el [hidden] del HTML y los 3 wizards (VIP+Elite+Coach) se
     mostraban a la vez al abrir el modal de alta. setTier en app.js hace
     setAttribute('hidden') pero el !important del display ganaba. */
  #vipWizardBody:not([hidden]),
  #eliteWizardBody:not([hidden]),
  #coachWizardBody:not([hidden]){
    flex:1 1 auto !important;
    display:flex !important;
    flex-direction:column !important;
    min-height:0 !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    padding-bottom:calc(30px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Nota informativa que reemplaza al PAGO oculto */
body[data-intake-active="1"] #bookForm .intake-no-pay-note{
  display:block !important;
  margin:18px 0 4px;
  padding:13px 14px;
  background:linear-gradient(135deg,#FFF7E0,#FBF7EF);
  border:1px solid #E8C879;
  border-radius:12px;
  font-family:'DM Sans', sans-serif;
  font-size:12.5px;
  color:#806100;
  line-height:1.4;
  text-align:center;
}
body[data-intake-active="1"] #bookForm .intake-no-pay-note strong{
  font-weight:700;
}
