/* Simulador "demo" (usuarios no logueados) — additivo a simulador-wizard.css,
   reusa sus tokens/paneles y solo agrega lo especifico de esta pantalla: el
   input de porcentaje y el panel de call-to-action de registro. */

.sim-pct-input { text-align: right; }

/* En esta pantalla el bloque de porcentaje viene siempre pegado justo
   despues del <select> de tipo de prestamo (nunca hay un <select> de
   agencia entre medio, a diferencia del wizard real) -- sin este
   margin-top quedaban casi sin separacion. */
#step2Form .sim-amount-block { margin-top: 22px; }

/* La frase de este banner ("¡Tenemos un resultado!") es mucho mas larga que
   las palabras sueltas (APTO/RECHAZADO) para las que simulador-wizard.css
   afina el tamaño de .sim-status-text h3 (54px) -- se achica para que entre
   sin partirse feo, conservando el mismo efecto de sombra apilada. */
#statusBanner .sim-status-text h3 {
  font-size: 30px;
  line-height: 1.2;
  text-transform: none;
}
@media (max-width: 900px) {
  #statusBanner .sim-status-text h3 { font-size: 24px; }
}

.sim-cta-panel {
  margin-top: 8px;
  padding: 28px 26px;
  border-radius: 18px;
  text-align: center;
  background: linear-gradient(135deg, var(--sm-orange-100), #fff);
  border: 1.5px dashed var(--sm-orange-400);
}
.sim-cta-title {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.3px;
  color: var(--sm-orange-800);
}
.sim-cta-sub {
  margin: 0 auto 20px;
  max-width: 46ch;
  font-size: 14px;
  line-height: 1.5;
  color: var(--sm-ink-soft);
}
/* .sm-btn-key ya trae el look "keycap" 3D (sombra solida, press effect) que
   usa #submitFinal en el wizard real -- acá se agranda un poco para que sea
   el CTA principal y se recolorea a teal (mismo par de tokens que
   .sm-btn-simulador en el navbar) en vez del naranja default, incluyendo
   hover/active (que en .sm-btn-key referencian --sm-orange-800 fijo). */
.sim-cta-btn-primary {
  padding: 16px 32px;
  font-size: 15.5px;
  background: var(--sm-teal-600);
  box-shadow: 0 4px 0 var(--sm-teal-800);
}
.sim-cta-btn-primary:hover { box-shadow: 0 6px 0 var(--sm-teal-800); color: #fff; }
.sim-cta-btn-primary:active { box-shadow: 0 0 0 var(--sm-teal-800); }
.sim-cta-login {
  margin: 16px 0 0;
  font-size: 13px;
  color: var(--sm-ink-soft);
}
.sim-cta-login a {
  color: var(--sm-teal-700);
  font-weight: 700;
  text-decoration: none;
}
.sim-cta-login a:hover { text-decoration: underline; }

@media (max-width: 900px) {
  .sim-cta-panel { padding: 22px 18px; }
  .sim-cta-title { font-size: 19px; }
}