/**
 * Formulario de valoracion.
 *
 * Solo consume los tokens del tema hijo. Sin colores nuevos, sin degradados,
 * sin sombras y sin esquinas redondas. Error y exito se marcan con borde y
 * peso tipografico, nunca con rojo ni verde.
 */

.mk-valoracion {
  max-width: var(--mk-medida);
  border-top: 1px solid var(--mk-filete-dorado);
  padding-top: var(--mk-esp-3);
}

/* Progreso ---------------------------------------------------------------- */
.mk-valoracion__progreso {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mk-esp-3);
  list-style: none;
  padding: 0;
  margin: 0 0 var(--mk-esp-4);
  font-size: var(--mk-t-label);
  letter-spacing: var(--mk-track-label);
  text-transform: uppercase;
}
.mk-valoracion__progreso li {
  padding-bottom: var(--mk-esp-1);
  border-bottom: 1px solid transparent;
  color: var(--mk-gris);
}
.mk-valoracion__progreso li[aria-current="step"] {
  border-bottom-color: var(--mk-dorado);
  font-weight: var(--mk-peso-fuerte);
  color: var(--mk-blanco);
}

/* Pasos ------------------------------------------------------------------- */
.mk-valoracion__paso {
  border: 1px solid var(--mk-gris);
  padding: var(--mk-esp-3);
  margin: 0;
}
.mk-valoracion__paso[hidden] { display: none; }
.mk-valoracion__paso legend {
  padding-inline: var(--mk-esp-1);
  font-size: var(--mk-t-h3);
  font-weight: var(--mk-peso-fino);
}
.mk-valoracion__nota,
.mk-valoracion__finalidad {
  font-size: var(--mk-t-caption);
  font-weight: var(--mk-peso-libro);
  color: var(--mk-gris);
  max-width: var(--mk-medida);
}
.mk-valoracion__finalidad {
  border-left: 1px solid var(--mk-filete-dorado);
  padding-left: var(--mk-esp-2);
  margin: var(--mk-esp-3) 0;
}

/* Campos ------------------------------------------------------------------ */
.mk-valoracion .mk-campo { margin-bottom: var(--mk-esp-3); }
.mk-valoracion .mk-campo > span {
  display: block;
  font-size: var(--mk-t-caption);
  font-weight: var(--mk-peso-medio);
  letter-spacing: 0.04em;
  margin-bottom: var(--mk-esp-1);
}
.mk-valoracion .mk-campo__marca {
  font-weight: var(--mk-peso-libro);
  text-transform: lowercase;
  letter-spacing: 0;
  color: var(--mk-gris);
}
.mk-valoracion .mk-campo--par {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mk-esp-2);
}
.mk-valoracion .mk-detalle { margin-top: var(--mk-esp-2); }
.mk-valoracion .mk-detalle[hidden] { display: none; }

/* Opciones binarias y listas de casillas ---------------------------------- */
.mk-valoracion .mk-opciones {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mk-esp-3);
}
.mk-valoracion .mk-opciones--lista {
  flex-direction: column;
  gap: var(--mk-esp-1);
}
.mk-valoracion .mk-opciones label,
.mk-valoracion .mk-campo--consentimiento label {
  display: flex;
  align-items: flex-start;
  gap: var(--mk-esp-1);
  font-size: var(--mk-t-body);
  font-weight: var(--mk-peso-libro);
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 0;
  cursor: pointer;
}
/* Fase 12: area tactil de 44 px. Las etiquetas de Si, No y de cada casilla
   median 17 a 28 px de alto. */
.mk-valoracion .mk-opciones label,
.mk-valoracion .mk-campo--consentimiento label {
  min-height: 44px;
  padding-block: 0.5rem;
  box-sizing: border-box;
}
.mk-valoracion .mk-opciones--lista { gap: 0; }
/* La hoja base estira todo input al ancho completo: los controles binarios no. */
.mk-valoracion input[type="radio"],
.mk-valoracion input[type="checkbox"] {
  width: auto;
  min-height: 0;
  min-width: 0;
  flex: 0 0 auto;
  margin-top: 0.25em;
  padding: 0;
  accent-color: var(--mk-dorado);
}
.mk-valoracion .mk-campo--consentimiento a,
.mk-valoracion .mk-campo--consentimiento a:hover,
.mk-valoracion .mk-campo--consentimiento a:focus-visible { color: var(--mk-blanco); }

/* Estado ------------------------------------------------------------------ */
.mk-valoracion__estado {
  min-height: 1.5em;
  font-weight: var(--mk-peso-medio);
}
.mk-valoracion__estado:empty { display: none; }
.mk-valoracion__estado[data-servidor="1"] {
  border: 1px solid var(--mk-blanco);
  padding: var(--mk-esp-2);
  margin-bottom: var(--mk-esp-3);
}

/* Trampa antispam: fuera de pantalla, nunca oculta con display none para que
   los rastreadores automaticos la sigan rellenando. */
.mk-trampa {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Acciones ---------------------------------------------------------------- */
.mk-valoracion .mk-acciones {
  display: flex;
  gap: var(--mk-esp-2);
  flex-wrap: wrap;
  margin-top: var(--mk-esp-3);
}
.mk-valoracion button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mk-fuente);
  font-size: var(--mk-t-small);
  font-weight: var(--mk-peso-medio);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  padding: var(--mk-esp-2) var(--mk-esp-4);
  min-height: 48px;
  border-radius: var(--mk-radio-boton, 999px);
  border: 1px solid var(--mk-blanco);
  background-color: var(--mk-blanco);
  color: var(--mk-negro);
  cursor: pointer;
  transition: background-color var(--mk-dur-corta, 200ms) var(--mk-ease, ease), color var(--mk-dur-corta, 200ms) var(--mk-ease, ease), border-color var(--mk-dur-corta, 200ms) var(--mk-ease, ease);
}
.mk-valoracion button[data-prev] {
  background-color: transparent;
  color: var(--mk-blanco);
  border-color: var(--mk-dorado);
}
.mk-valoracion button:hover,
.mk-valoracion button:focus-visible {
  background-color: transparent;
  color: var(--mk-blanco);
  border-color: var(--mk-blanco);
}
.mk-valoracion button[data-prev]:hover,
.mk-valoracion button[data-prev]:focus-visible {
  background-color: var(--mk-blanco);
  color: var(--mk-negro);
  border-color: var(--mk-blanco);
}

@media (min-width: 768px) {
  .mk-valoracion__paso { padding: var(--mk-esp-4); }
  .mk-valoracion .mk-campo--par { grid-template-columns: 1fr 1fr; }
  .mk-valoracion .mk-campo--par:has(#mv_indicativo) { grid-template-columns: 8rem 1fr; }
  .mk-valoracion .mk-opciones--lista {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mk-esp-2);
  }
}