/* ============================================================================
   MailerLite — overrides para que el form herede la identidad de la marca.
   Heredado del patrón validado en newsletter/news-cat/src/index.css.
   ============================================================================ */

.ml-embedded { width: 100%; }

.ml-embedded .ml-form-embedWrapper,
.ml-embedded .ml-form-embedBody,
.ml-embedded .ml-form-embedContent,
.ml-embedded .ml-form-fieldRow,
.ml-embedded .ml-form-successBody {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
}

.ml-embedded .ml-form-embedContent { display: none !important; }

.ml-embedded .ml-form-fieldRow:has(input[name="fields[origen]"]),
.ml-embedded .ml-form-fieldRow:has(input[name="origen"]),
.ml-embedded .ml-form-fieldRow:has(input[placeholder="origen" i]) {
  display: none !important;
}

.ml-embedded .ml-form-embedBody {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.875rem !important;
}

.ml-embedded .ml-form-embedBody .ml-form-fieldRow {
  margin: 0 !important;
}

.ml-embedded .ml-form-embedBody .ml-form-fieldRow input[type="text"],
.ml-embedded .ml-form-embedBody .ml-form-fieldRow input[type="email"],
.ml-embedded .ml-form-embedBody input:not([type="submit"]):not([type="checkbox"]):not([type="hidden"]) {
  width: 100% !important;
  border: 1.5px solid var(--color-line) !important;
  background: var(--color-white) !important;
  color: var(--color-ink) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-base) !important;
  font-weight: 500 !important;
  padding: 1.05rem 1.25rem !important;
  border-radius: var(--radius-md) !important;
  transition: border-color 180ms var(--ease-out), box-shadow 180ms var(--ease-out) !important;
  box-shadow: none !important;
  height: auto !important;
  min-height: 56px !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
}

.ml-embedded .ml-form-embedBody .ml-form-fieldRow input::placeholder {
  color: var(--color-ink-faint) !important;
  opacity: 1 !important;
  font-weight: 500 !important;
}

.ml-embedded .ml-form-embedBody .ml-form-fieldRow input:focus {
  outline: none !important;
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 4px rgba(189, 0, 15, 0.12) !important;
}

.ml-embedded .ml-form-embedSubmit { margin-top: 0.25rem !important; }

.ml-embedded .ml-form-embedSubmit button,
.ml-embedded .ml-form-embedSubmit input[type="submit"],
.ml-embedded .ml-form-embedSubmit button[type="submit"],
div.ml-embedded .ml-form-embedSubmit button {
  background: var(--color-primary) !important;
  color: var(--color-white) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  font-size: var(--text-base) !important;
  letter-spacing: -0.005em !important;
  padding: 1.05rem 2rem !important;
  min-height: 56px !important;
  width: 100% !important;
  cursor: pointer !important;
  transition: transform 160ms var(--ease-out), background 200ms var(--ease-out), box-shadow 200ms var(--ease-out) !important;
  box-shadow: var(--shadow-cta) !important;
  text-transform: none !important;
  height: auto !important;
  line-height: 1 !important;
}

@media (hover: hover) and (pointer: fine) {
  .ml-embedded .ml-form-embedSubmit button:hover,
  .ml-embedded .ml-form-embedSubmit input[type="submit"]:hover,
  div.ml-embedded .ml-form-embedSubmit button:hover {
    background: var(--color-primary-dark) !important;
    box-shadow: 0 18px 44px -12px rgba(189, 0, 15, 0.5) !important;
    transform: translateY(-1px);
  }
}

.ml-embedded .ml-form-embedSubmit button:active,
.ml-embedded .ml-form-embedSubmit input[type="submit"]:active,
div.ml-embedded .ml-form-embedSubmit button:active {
  transform: scale(0.985) !important;
}

.ml-embedded .ml-form-embedBody .ml-form-checkboxRow {
  font-size: var(--text-xs) !important;
  color: var(--color-ink-muted) !important;
  margin-top: 0.5rem !important;
  line-height: 1.5 !important;
}
.ml-embedded .ml-form-embedBody .ml-form-checkboxRow label {
  color: var(--color-ink-muted) !important;
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
}
.ml-embedded .ml-form-embedBody .ml-form-checkboxRow label a {
  color: var(--color-primary) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

.ml-embedded .ml-form-successBody {
  background: var(--color-primary-soft) !important;
  border: 1px solid rgba(189, 0, 15, 0.25) !important;
  border-radius: var(--radius-md) !important;
  padding: 1.5rem !important;
  text-align: center;
}
.ml-embedded .ml-form-successBody .ml-form-successContent h4 {
  font-family: var(--font-display) !important;
  font-size: var(--text-xl) !important;
  font-weight: 800 !important;
  color: var(--color-primary) !important;
  margin-bottom: 0.5rem !important;
  letter-spacing: -0.02em !important;
}
.ml-embedded .ml-form-successBody .ml-form-successContent p {
  font-family: var(--font-body) !important;
  font-size: var(--text-base) !important;
  color: var(--color-ink) !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}
