/* Container — sin !important, no choca con nada */
.lapso-coupon-widget {
  margin: 12px 0;
}

/* Toggle link "¿Tienes un código promocional?" — Elementor reescribe botones agresivamente */
.lapso-coupon-toggle {
  background: none !important;
  border: 0 !important;
  padding: 6px 0 !important;
  cursor: pointer;
  color: var(--primary, #70101c) !important;
  text-decoration: underline !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  box-shadow: none !important;
  width: auto !important;
  line-height: 1.2 !important;
}
.lapso-coupon-toggle:hover,
.lapso-coupon-toggle:focus {
  background: none !important;
  color: var(--primary, #70101c) !important;
  text-decoration: underline !important;
  box-shadow: none !important;
}

/* Box: JS toggle display none/block — sin display en CSS para no bloquear toggle */
.lapso-coupon-box {
  margin-top: 8px;
}

/* Fila de input — JS toggle entre flex y none al aplicar / quitar el cupón.
   display:flex SIN !important para que el inline display:none del JS gane. */
.lapso-coupon-input-row {
  display: flex;
  gap: 8px;
}

.lapso-coupon-input {
  flex: 1 !important;
  padding: 10px 12px !important;
  border: 1px solid #c3c4c7 !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  background: #fff !important;
}
.lapso-coupon-input.is-error {
  border-color: #d63638 !important;
}
.lapso-coupon-input.is-success {
  border-color: #1a7f37 !important;
}

/* Botón "Aplicar" — Elementor pisa todo el styling de botones */
.lapso-coupon-apply {
  padding: 10px 16px !important;
  background: var(--primary, #70101c) !important;
  color: #fff !important;
  border: 1px solid var(--primary, #70101c) !important;
  border-radius: 4px !important;
  cursor: pointer;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  box-shadow: none !important;
  width: auto !important;
  line-height: 1.2 !important;
}
.lapso-coupon-apply:hover,
.lapso-coupon-apply:focus {
  background: var(--primary, #70101c) !important;
  color: #fff !important;
  opacity: 0.92;
  box-shadow: none !important;
}
.lapso-coupon-apply[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Mensaje (success/error) — JS toggle display block/none. Sin display en CSS. */
.lapso-coupon-msg {
  margin-top: 8px;
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 4px;
}
.lapso-coupon-msg.is-error {
  color: #d63638;
  background: #fbeaea;
}
.lapso-coupon-msg.is-success {
  color: #1a7f37;
  background: #e8f5ec;
}

/* Cupón aplicado — JS toggle display block/none. display:flex SIN !important. */
.lapso-coupon-applied {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: #f0f6fc;
  border: 1px solid #c3c4c7;
  border-radius: 4px;
  font-size: 14px;
}

/* Botón × para quitar el cupón — Elementor pisa botones */
.lapso-coupon-remove {
  margin-left: auto;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: 18px !important;
  cursor: pointer;
  color: #50575e !important;
  box-shadow: none !important;
  width: auto !important;
  line-height: 1 !important;
}
.lapso-coupon-remove:hover,
.lapso-coupon-remove:focus {
  background: none !important;
  color: #d63638 !important;
  box-shadow: none !important;
}

/* Fila de descuento en el resumen — JS toggle display ""/none. display:flex SIN !important. */
.coupon-discount-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  color: #1a7f37;
  font-weight: 600;
}
