/* =========================================================
   Minicoach Quote Form – CSS (SIN DUPLICADOS)
   Archivo: assets/minicoach-quote-form.css

   ✅ Encapsulado en .minicoach-quote-wrapper
   ✅ Sin :root global
   ✅ Prefijo kdq- (no choca con tus otros .kd- / .kd-btn)
   ========================================================= */

/* Wrapper blanco + variables SOLO dentro del quote */
.minicoach-quote-wrapper{
  --kdq-ink:#0b1220;
  --kdq-muted:#5b6476;
  --kdq-line: rgba(15,23,42,.12);
  --kdq-line2: rgba(15,23,42,.18);
  --kdq-card:#ffffff;

  /* Acento (mantengo el dorado de tu wizard actual) */
  --kdq-gold:#d4a24c;
  --kdq-gold2:#f3cf7a;

  --kdq-shadow: 0 22px 60px rgba(2,6,23,.10);
  --kdq-shadow2: 0 28px 85px rgba(2,6,23,.14);

  --kdq-r: 22px;

  background: #ffffff;
  padding: 72px 20px 64px;
  font-family: inherit;
}

/* Contenedor */
.minicoach-quote-inner{
  max-width: 1120px;
  margin: 0 auto;
  background: var(--kdq-card);
  border: 1px solid var(--kdq-line);
  border-radius: var(--kdq-r);
  box-shadow: var(--kdq-shadow);
  overflow: hidden;
}

/* Top */
.minicoach-quote-top{
  padding: 26px 28px 20px;
  background:
    radial-gradient(circle at 12% 0%, rgba(212,162,76,.10), transparent 45%),
    radial-gradient(circle at 88% 0%, rgba(15,23,42,.06), transparent 44%),
    #fff;
  border-bottom: 1px solid var(--kdq-line);
}

.minicoach-quote-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(11,18,32,.62);
  margin-bottom: 10px;
}
.minicoach-quote-kicker::before{
  content:"";
  width: 34px; height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--kdq-gold), var(--kdq-gold2));
}

.minicoach-quote-top h3{
  margin: 0 0 8px 0;
  font-size: 30px;
  line-height: 1.18;
  color: var(--kdq-ink);
  font-weight: 950;
  letter-spacing: -.02em;
}

.minicoach-quote-top p{
  margin: 0;
  color: var(--kdq-muted);
  font-size: 14.5px;
  line-height: 1.75;
  max-width: 860px;
}

/* Success */
.minicoach-quote-success{
  margin: 18px 28px 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(34,197,94,.10);
  border: 1px solid rgba(34,197,94,.26);
  color: #166534;
  font-size: 13px;
}

/* Body */
.minicoach-quote-form{
  padding: 22px 28px 28px;
}

/* ==========================
   Stepper (kdq-)
   ========================== */
.kdq-stepper{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0 18px;
}

.kdq-step{
  flex: 1;
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--kdq-line);
  background: rgba(15,23,42,.02);
}

.kdq-step-dot{
  width: 30px; height: 30px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-weight: 900;
  font-size: 12px;
  color: rgba(11,18,32,.70);
  border: 1px solid var(--kdq-line2);
  background: #fff;
}

.kdq-step-label{
  display:flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.1;
}
.kdq-step-label strong{
  font-size: 12px;
  color: var(--kdq-ink);
  font-weight: 900;
}
.kdq-step-label span{
  font-size: 12px;
  color: rgba(11,18,32,.58);
}

/* Active */
.kdq-step.is-active{
  border-color: rgba(212,162,76,.35);
  background: rgba(212,162,76,.08);
}
.kdq-step.is-active .kdq-step-dot{
  border-color: rgba(212,162,76,.55);
  background: linear-gradient(135deg, rgba(212,162,76,.20), rgba(243,207,122,.12));
  color: var(--kdq-ink);
}

/* Done */
.kdq-step.is-done .kdq-step-dot{
  border-color: rgba(34,197,94,.35);
  background: rgba(34,197,94,.10);
  color: #166534;
}

/* ==========================
   Panels
   ========================== */
.kdq-step-panels{
  border: 1px solid var(--kdq-line);
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 14px 40px rgba(2,6,23,.06);
  overflow: hidden;
}

.kdq-step-panel{
  display:none;
  padding: 18px;
}
.kdq-step-panel.is-active{ display:block; }

/* Grid por step */
.minicoach-quote-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.minicoach-quote-field label{
  display:block;
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(11,18,32,.70);
}

.minicoach-quote-field input,
.minicoach-quote-field textarea{
  width:100%;
  border-radius: 14px;
  border: 1px solid var(--kdq-line2);
  background: rgba(15,23,42,.02);
  padding: 12px 12px;
  font-size: 14px;
  color: var(--kdq-ink);
  outline:none;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

.minicoach-quote-field input::placeholder,
.minicoach-quote-field textarea::placeholder{
  color: rgba(91,100,118,.70);
}

.minicoach-quote-field input:focus,
.minicoach-quote-field textarea:focus{
  border-color: rgba(212,162,76,.70);
  box-shadow: 0 0 0 3px rgba(212,162,76,.18);
  background: #fff;
  transform: translateY(-1px);
}

.minicoach-quote-field textarea{
  min-height: 120px;
  resize: vertical;
}

/* date/time group */
.minicoach-datetime-group{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* error */
.kdq-field-error{
  border-color: rgba(239,68,68,.65) !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.15) !important;
}

/* ==========================
   Actions
   ========================== */
.kdq-step-actions{
  display:flex;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px 18px;
  border-top: 1px solid var(--kdq-line);
  background: rgba(15,23,42,.02);
}

.kdq-actions-right{
  display:flex;
  gap:12px;
  justify-content:flex-end;
  width:100%;
}

.kdq-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 999px;
  border: 1px solid var(--kdq-line2);
  background: #fff;
  color: var(--kdq-ink);
  font-weight: 950;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .14em;
  cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.kdq-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(2,6,23,.10);
  border-color: rgba(15,23,42,.26);
}

/* BOTÓN NEXT (visible siempre) */
.kdq-btn-primary{
  border-color: rgba(212,162,76,.85) !important;
  background: linear-gradient(135deg, var(--kdq-gold), var(--kdq-gold2)) !important;
  color: #0b1220 !important;
  box-shadow: 0 10px 26px rgba(212,162,76,.25) !important;
}

.kdq-btn-primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(212,162,76,.35);
  filter: brightness(1.03);
}

/* Submit */
.kdq-submit{
  border: none;
  background: linear-gradient(135deg, var(--kdq-gold), var(--kdq-gold2));
  color: #0b1220;
}

.kdq-submit:hover{
  filter: brightness(1.02);
}

/* FIX: si algún botón llega a disabled, que no “desaparezca” */
.kdq-btn-primary:disabled,
.kdq-btn-primary[disabled]{
  opacity: 1 !important;
  background: #f7f3ea !important;
  border-color: rgba(212,162,76,.35) !important;
  color: rgba(11,18,32,.35) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}
.kdq-btn-primary:disabled *{
  opacity: 1 !important;
}

/* ==========================
   Responsive
   ========================== */
@media (max-width: 900px){
  .minicoach-quote-top h3{ font-size: 24px; }
  .minicoach-quote-grid{ grid-template-columns: 1fr; }
  .minicoach-datetime-group{ grid-template-columns: 1fr; }
  .kdq-step-label span{ display:none; }
}

@media (max-width: 560px){
  .minicoach-quote-wrapper{ padding: 56px 15px; }
  .minicoach-quote-form{ padding: 18px 18px 22px; }
  .minicoach-quote-top{ padding: 22px 18px 16px; }
  .kdq-stepper{ flex-direction: column; }
  .kdq-step{ width: 100%; }
  .kdq-step-actions{ flex-direction: column; }
  .kdq-actions-right{ width:100%; flex-direction: column; }
  .kdq-btn{ width:100%; }
}
