/* MailerLite embed — dark theme override for the Musselli site.
   Keeps MailerLite's structure/classes (so webforms.min.js works) but restyles
   the light default to match: #141212 bg, gold #C89B6C accents, deep-red submit. */
.ml-dark { max-width: 540px; margin: 0 auto; width: 100%; }
.ml-dark .ml-form-embedWrapper { background: transparent !important; width: 100% !important; max-width: 100% !important; border: 0 !important; display: block !important; }
.ml-dark .ml-form-embedBody { padding: 0 !important; }
.ml-dark .ml-form-formContent { margin: 0 !important; }
.ml-dark .ml-form-fieldRow { margin: 0 0 12px 0 !important; width: 100%; }
.ml-dark .ml-form-fieldRow.ml-last-item { margin-bottom: 0 !important; }
.ml-dark .ml-field-group { text-align: left !important; }
.ml-dark .ml-field-group label { display: block; color: #C89B6C; font-family: 'Jost', sans-serif; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; margin-bottom: 6px; line-height: 1.4; }
.ml-dark input.form-control {
  width: 100% !important; box-sizing: border-box !important;
  background: #141212 !important; color: #FBFBFB !important;
  border: 1px solid rgba(200,155,108,.3) !important; border-radius: 0 !important;
  padding: 15px 16px !important; font-family: 'Jost', sans-serif !important; font-size: 15px !important;
  line-height: 21px !important; outline: none; transition: border-color .2s ease;
}
.ml-dark input.form-control::placeholder { color: #7c7568 !important; }
.ml-dark input.form-control:focus { border-color: #C89B6C !important; }
/* Textarea del formulario de consulta (guitar-tech) — mismo look que los inputs. */
.ml-dark textarea.form-control {
  width: 100% !important; box-sizing: border-box !important;
  background: #141212 !important; color: #FBFBFB !important;
  border: 1px solid rgba(200,155,108,.3) !important; border-radius: 0 !important;
  padding: 15px 16px !important; font-family: 'Jost', sans-serif !important; font-size: 15px !important;
  line-height: 1.55 !important; outline: none; resize: vertical; min-height: 110px;
  transition: border-color .2s ease;
}
.ml-dark textarea.form-control::placeholder { color: #7c7568 !important; }
.ml-dark textarea.form-control:focus { border-color: #C89B6C !important; }
.ml-dark .ml-form-embedSubmit { margin: 16px 0 0 0 !important; float: none !important; width: 100%; }
.ml-dark .ml-form-embedSubmit button.primary {
  width: 100% !important; background: #5D0002 !important; color: #FBFBFB !important;
  border: none !important; border-radius: 0 !important; box-shadow: none !important;
  padding: 16px !important; font-family: 'Jost', sans-serif !important; font-size: 12px !important;
  letter-spacing: .16em !important; text-transform: uppercase; font-weight: 600 !important; cursor: pointer; line-height: 1.4 !important;
}
.ml-dark .ml-form-embedSubmit button.primary:hover { background: #7a0a0c !important; }
.ml-dark .ml-form-embedSubmit button.loading { background: #5D0002 !important; }
.ml-dark .ml-form-successBody { padding: 0 !important; text-align: center; }
.ml-dark .ml-form-successContent h4 { color: #C89B6C !important; font-family: 'Cormorant Garamond', serif !important; font-weight: 500 !important; font-size: 1.7rem !important; margin: 0 0 8px 0 !important; text-align: center !important; }
.ml-dark .ml-form-successContent p { color: #d2ccc1 !important; font-family: 'Jost', sans-serif !important; font-size: 15px !important; margin: 0 !important; text-align: center !important; }
/* Aclaración en letra chica: el mail puede demorar unos minutos. */
.ml-dark .ml-form-successContent p.nota { color: #8a8275 !important; font-size: 12.5px !important; line-height: 1.5 !important; margin: 12px auto 0 !important; max-width: 380px !important; }
.ml-dark .ml-error input.form-control { border-color: #e05555 !important; }
.ml-dark .ml-form-embedSubmitLoad { display: inline-block; width: 20px; height: 20px; }
.ml-dark .ml-form-embedSubmitLoad:after { content: " "; display: block; width: 11px; height: 11px; margin: 1px; border-radius: 50%; border: 4px solid #fff; border-color: #fff #fff #fff transparent; animation: ml-form-embedSubmitLoad 1.2s linear infinite; }
@keyframes ml-form-embedSubmitLoad { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }
.ml-dark .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }