/* ============================================
   FRONT GLOBAL - CORPORATE MODERN
   Applies to all pages using base.html.twig
   (forms, contact, legal, login, etc.)
   ============================================ */

/* ---- Typography ---- */
body.fuente-tipo {
  font-family: 'Inter', -apple-system, system-ui, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  background: #f5f5f5 !important;
}

h1, h2, h3, h4, h5, h6, .fuente-tipo,
.form-label, .form-control, .form-select, .btn,
label, input, select, textarea {
  font-family: 'Inter', -apple-system, system-ui, sans-serif !important;
}

/* ---- Unified Header ---- */
header.lp-header,
.lp-header {
  background: #fff !important;
  border-bottom: 1px solid #e5e5e5 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
}

header.lp-header .lp-header-inner,
.lp-header .lp-header-inner,
.lp-header-inner {
  max-width: 1140px !important;
  margin: 0 auto !important;
  padding: 0 28px !important;
  height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
}

img.lp-logo,
.lp-header img,
.lp-header picture img,
header.lp-header img,
header.lp-header .lp-header-inner img,
header.lp-header .lp-header-inner a img,
header.lp-header .lp-header-inner a picture img {
  height: 38px !important;
  width: auto !important;
  max-width: 200px !important;
  min-width: auto !important;
  object-fit: contain !important;
}

.lp-header .lp-nav,
.lp-nav {
  gap: 24px !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.lp-header .lp-nav a,
.lp-nav a {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #333 !important;
  text-decoration: none !important;
}

.lp-nav a:hover { color: #9b1b1b !important; }

.lp-header .lp-btn-header,
a.lp-btn-header {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #9b1b1b !important;
  border: 1.5px solid #9b1b1b !important;
  padding: 7px 18px !important;
  text-decoration: none !important;
  transition: all .15s !important;
  background: transparent !important;
  border-radius: 0 !important;
}

a.lp-btn-header:hover { background: #9b1b1b !important; color: #fff !important; }

.lp-mobile-toggle {
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  color: #333 !important;
  padding: 4px !important;
}

.lp-mobile-menu {
  flex-direction: column !important;
  padding: 16px 28px !important;
  border-bottom: 1px solid #e5e5e5 !important;
  background: #fff !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.lp-mobile-menu a {
  padding: 12px 0 !important;
  font-size: 0.92rem !important;
  color: #333 !important;
  text-decoration: none !important;
  border-bottom: 1px solid #f0f0f0 !important;
  font-weight: 500 !important;
}

.lp-mobile-menu a:last-child {
  border-bottom: none !important;
}

.lp-mobile-menu a:hover {
  color: #9b1b1b !important;
}

/* Desktop */
@media (min-width: 769px) {
  .lp-nav { display: flex !important; }
  .lp-btn-header { display: inline-flex !important; }
  .lp-mobile-toggle { display: none !important; }
  .lp-mobile-menu { display: none !important; }
  .lp-mobile-menu.open { display: none !important; }
}

/* Mobile */
@media (max-width: 768px) {
  .lp-nav { display: none !important; }
  .lp-btn-header { display: none !important; }
  .lp-mobile-toggle { display: block !important; }
  .lp-mobile-menu { display: none !important; }
  .lp-mobile-menu.open { display: flex !important; }

  .lp-header-inner {
    padding: 0 16px !important;
    height: 56px !important;
  }

  img.lp-logo,
  .lp-header img {
    height: 30px !important;
  }

  .lp-mobile-menu {
    padding: 12px 16px !important;
  }

  .lp-mobile-menu a {
    padding: 12px 0 !important;
    font-size: 0.92rem !important;
  }
}

/* ---- Form container ---- */
.contenido-formulario {
  max-width: 920px !important;
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
  margin-bottom: 0 !important;
}

.bg-responsive-grey {
  background: #fff !important;
}

/* ---- Form subtitle bar ---- */
.formulario-subtitulo {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: #333 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding-top: 16px !important;
}

/* ---- Form inputs ---- */
.form-control {
  border: 1px solid #ddd !important;
  border-radius: 0 !important;
  font-size: 0.88rem !important;
  padding: 10px 14px !important;
  color: #333 !important;
  transition: border-color .15s !important;
}

.form-control:focus {
  border-color: #9b1b1b !important;
  box-shadow: 0 0 0 2px rgba(155,27,27,0.08) !important;
  outline: none !important;
}

.form-control::placeholder {
  color: #bbb !important;
}

.form-select {
  border: 1px solid #ddd !important;
  border-radius: 0 !important;
  font-size: 0.88rem !important;
  padding: 10px 14px !important;
}

.form-select:focus {
  border-color: #9b1b1b !important;
  box-shadow: 0 0 0 2px rgba(155,27,27,0.08) !important;
}

.form-label {
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: #333 !important;
  margin-bottom: 4px !important;
}

.form-check-input:checked {
  background-color: #9b1b1b !important;
  border-color: #9b1b1b !important;
}

.form-check-input:focus {
  box-shadow: 0 0 0 2px rgba(155,27,27,0.12) !important;
}

.form-check-label {
  font-size: 0.84rem !important;
  color: #555 !important;
}

/* ---- Radio buttons ---- */
.form-check-input[type="radio"]:checked {
  background-color: #9b1b1b !important;
  border-color: #9b1b1b !important;
}

/* ---- Buttons ---- */
.button-custom-3,
.btn-grande {
  background: #111 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  padding: 14px 32px !important;
  min-width: 280px !important;
  box-shadow: none !important;
  transition: all .15s !important;
  letter-spacing: 0.01em !important;
}

.button-custom-3:hover,
.btn-grande:hover {
  background: #9b1b1b !important;
  color: #fff !important;
}

.button-custom-1 {
  background: #111 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  padding: 10px 24px !important;
  width: auto !important;
}

.button-custom-1:hover {
  background: #9b1b1b !important;
  color: #fff !important;
  border: none !important;
}

.button-custom-2 {
  color: #111 !important;
  border: 1.5px solid #111 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
}

.button-custom-2:hover {
  background: #111 !important;
  color: #fff !important;
  border-color: #111 !important;
}

/* ---- Info sections in forms ---- */
.info h6 {
  color: #9b1b1b !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}

.linea-separadora {
  border-bottom: 1px solid #e5e5e5 !important;
}

.color-1 {
  color: #9b1b1b !important;
}

/* ---- Price type text ---- */
.price-type-text {
  font-size: 0.88rem !important;
}

.price-type-text label {
  font-weight: 500 !important;
  color: #444 !important;
}

/* ---- Help modals (interrogante) ---- */
.icono-1 {
  color: #9b1b1b !important;
}

/* ---- Flash messages ---- */
.alert {
  border-radius: 0 !important;
  font-size: 0.88rem !important;
}

.alert-success {
  background: #f0faf0 !important;
  border: 1px solid #c8e6c9 !important;
  color: #2e7d32 !important;
}

.alert-warning {
  background: #fff8e1 !important;
  border: 1px solid #ffe082 !important;
  color: #f57f17 !important;
}

.alert-danger {
  background: #fce4ec !important;
  border: 1px solid #ef9a9a !important;
  color: #c62828 !important;
}

/* ---- Terms section in forms ---- */
.terms-block {
  font-size: 0.8rem !important;
  color: #888 !important;
  line-height: 1.5 !important;
}

.forms-terms-link {
  color: #9b1b1b !important;
  font-weight: 500 !important;
}

/* ---- FAQ accordion (on all pages) ---- */
.accordion-item {
  border: none !important;
  border-bottom: 1px solid #e5e5e5 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.accordion-button {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: #111 !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 16px 4px !important;
}

.accordion-button:not(.collapsed) {
  color: #9b1b1b !important;
  background: transparent !important;
  box-shadow: none !important;
}

.accordion-button:focus {
  box-shadow: none !important;
}

.accordion-body {
  font-size: 0.87rem !important;
  color: #666 !important;
  line-height: 1.7 !important;
}

/* ---- Modals ---- */
.modal-content {
  border-radius: 0 !important;
  border: 1px solid #ddd !important;
}

.modal-header {
  border-bottom: 1px solid #eee !important;
  padding: 16px 20px !important;
}

.modal-title {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #111 !important;
}

.modal-body {
  padding: 20px !important;
  font-size: 0.88rem !important;
  color: #555 !important;
}

.modal-footer {
  border-top: 1px solid #eee !important;
  padding: 12px 20px !important;
}

.modal-footer .btn-primary {
  background: #9b1b1b !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
}

.modal-footer .btn-primary:hover {
  background: #7f0000 !important;
}

.modal-footer .btn-secondary {
  background: #f5f5f5 !important;
  border: 1px solid #ddd !important;
  color: #333 !important;
  border-radius: 0 !important;
}

/* ---- Stripe card element ---- */
.MyCardElement {
  border: 1px solid #ddd !important;
  border-radius: 0 !important;
  padding: 14px !important;
}

/* ---- Step 2 form (payment) ---- */
.boton-pagar {
  background: #9b1b1b !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
}

.boton-pagar:hover {
  background: #7f0000 !important;
}

/* ---- Footer ---- */
.footer-basic {
  background: #f5f5f5 !important;
  border-top: 1px solid #e5e5e5 !important;
  padding: 16px 0 !important;
}

.footer-basic .copyright {
  font-size: 0.75rem !important;
  color: #aaa !important;
}

.footer-list-title {
  font-size: 0.73rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #333 !important;
}

.footer-list li a {
  font-size: 0.82rem !important;
  color: #777 !important;
}

.footer-list li a:hover {
  color: #9b1b1b !important;
}

/* ---- Disclaimer ---- */
.aviso-no-oficial {
  font-size: 0.72rem !important;
  color: #aaa !important;
  line-height: 1.5 !important;
  border-top: 1px solid #eee !important;
  padding: 16px 0 !important;
}

/* ---- Background general ---- */
.fondo-contenedor {
  background: #f5f5f5 !important;
}

.fondo-acordeon {
  background: #fff !important;
  border-top: 1px solid #eee !important;
}

/* ---- Contact page ---- */
.bloque-formulario {
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
}

/* Contact form labels — no red background */
.contenido-formulario form .form-label {
  background: none !important;
  color: #111 !important;
  padding: 0 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  display: block !important;
}

.contenido-formulario form .form-control {
  border: 1px solid #ddd !important;
  border-radius: 0 !important;
  background: #fff !important;
}

.contenido-formulario form textarea.form-control {
  min-height: 120px !important;
}

.contenido-formulario form .btn-grande,
.contenido-formulario form .button-custom-3 {
  width: auto !important;
  min-width: 200px !important;
  max-width: 200px !important;
}

/* ---- Login page ---- */
.bloque-4 {
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
}

/* ---- Mobile responsive menu ---- */
.menu-desplegable ul li a {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  color: #333 !important;
}

/* ---- Error text ---- */
.text-danger {
  font-size: 0.8rem !important;
}

/* ---- Form refinements ---- */
.h3-custom {
  color: #333 !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
}

.h3-custom-datos-pago {
  color: #333 !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
}

.iconos-web {
  width: 16px !important;
  height: 16px !important;
  opacity: 0.35 !important;
  margin-right: 6px !important;
  margin-bottom: 0 !important;
}

.form-label {
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  color: #111 !important;
}

.text-grey,
small.text-grey {
  font-size: 0.72rem !important;
  color: #999 !important;
  font-weight: 400 !important;
}

.form-control {
  font-size: 0.85rem !important;
  padding: 10px 12px !important;
}

.form-control::placeholder {
  color: #aaa !important;
  font-size: 0.83rem !important;
}

/* Step bar (SOLICITUD DE NOTA SIMPLE / PASO 1 DE 2) */
/* Step bar only — the row with formulario-subtitulo inside */
.contenido-formulario > .d-sm-flex.flex-sm-row.row:first-child {
  background: #9b1b1b !important;
  margin: 0 !important;
  padding: 0 !important;
}

.contenido-formulario > .d-sm-flex.flex-sm-row.row:first-child .formulario-subtitulo {
  color: #fff !important;
}

.formulario-subtitulo {
  font-size: 0.75rem !important;
  color: #fff !important;
  letter-spacing: 0.06em !important;
  padding: 12px 20px !important;
  margin: 0 !important;
  font-weight: 600 !important;
}

.linea-separador {
  border-bottom: 1px solid #eee !important;
  padding-bottom: 10px !important;
}

.form-group {
  margin-bottom: 2px !important;
}

.form-check-label {
  font-size: 0.78rem !important;
  color: #555 !important;
  font-weight: 400 !important;
}

.forms-terms-link {
  color: #9b1b1b !important;
  font-weight: 500 !important;
  font-size: 0.78rem !important;
}

.lp-terms-info,
.terms-block {
  font-size: 0.78rem !important;
  line-height: 1.5 !important;
  color: #777 !important;
}

.lp-terms-info p,
.terms-block p {
  font-size: 0.78rem !important;
  color: #777 !important;
}

.lp-terms-info b,
.terms-block b {
  font-weight: 600 !important;
  color: #555 !important;
}

.lp-terms-info a,
.terms-block a {
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  color: #9b1b1b !important;
}

.button-custom-3,
.btn-grande {
  font-size: 0.88rem !important;
  padding: 13px 32px !important;
  min-width: 240px !important;
}

.contenido-formulario {
  max-width: 860px !important;
  border: 1px solid #eee !important;
}

.margenes-formulario {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.formulario-parrafo {
  font-size: 0.85rem !important;
  color: #444 !important;
}

.parrafo.enlaces-texto {
  font-size: 0.82rem !important;
}

/* ---- Step 2 - only buttons red, rest original ---- */

/* Submit buttons - red */
.boton-pagar,
.button-custom-3,
.btn-grande {
  background: #9b1b1b !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  padding: 13px 40px !important;
  transition: background .15s !important;
}

.boton-pagar:hover,
.button-custom-3:hover,
.btn-grande:hover {
  background: #7f0000 !important;
  color: #fff !important;
}

/* Color accent */
.color-1 {
  color: #9b1b1b !important;
}

/* Radio accent */
.form-check-input[type="radio"]:checked {
  background-color: #9b1b1b !important;
  border-color: #9b1b1b !important;
}

/* SSL box - hide border/background */
.secure-connection-box {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  font-size: 0.75rem !important;
  color: #999 !important;
}

/* Info text below solicitar */
.contenido-formulario .d-flex.justify-content-center.mt-2 .text-center {
  font-size: 0.72rem !important;
  color: #999 !important;
}

.mostrar-precio-servicio {
  font-size: 0.72rem !important;
}

/* ---- Terms info (compact) ---- */
.lp-terms-info {
  font-size: 0.7rem !important;
  color: #999 !important;
  line-height: 1.5 !important;
  margin-top: 8px;
}

.lp-terms-info p {
  margin: 0 !important;
  font-size: 0.7rem !important;
  color: #999 !important;
}

.lp-terms-info a {
  color: #9b1b1b !important;
  font-weight: 500 !important;
}

.terms-block .text-muted {
  font-size: 0.7rem !important;
  color: #aaa !important;
}

/* ---- Login / Register (Metronic override) ---- */
.kt-login__title {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  color: #111 !important;
}

.kt-login .form-control {
  font-family: 'Inter', sans-serif !important;
  border-radius: 0 !important;
  border: 1px solid #ddd !important;
  font-size: 0.88rem !important;
  padding: 12px 14px !important;
}

.kt-login .form-control:focus {
  border-color: #9b1b1b !important;
  box-shadow: 0 0 0 2px rgba(155,27,27,0.08) !important;
}

.kt-login .btn-brand,
.kt-login .btn-pill {
  font-family: 'Inter', sans-serif !important;
  background: #111 !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  padding: 12px 32px !important;
  color: #fff !important;
  transition: background .15s !important;
}

.kt-login .btn-brand:hover,
.kt-login .btn-pill.btn-primary:hover {
  background: #9b1b1b !important;
}

.kt-login .btn-pill.btn-secondary {
  background: #f5f5f5 !important;
  color: #333 !important;
  border: 1px solid #ddd !important;
}

.kt-login__link,
.kt-link {
  color: #9b1b1b !important;
  font-size: 0.84rem !important;
  font-family: 'Inter', sans-serif !important;
}

.kt-login__logo img {
  max-width: 180px !important;
}

.kt-login__desc {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.88rem !important;
  color: #777 !important;
}

.login-img-color {
  background: rgba(155,27,27,0.85) !important;
}

.kt-login__content .kt-login__title {
  color: #fff !important;
}

/* ---- Register page ---- */
.kt-login .form-check-label,
.kt-login label {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.82rem !important;
  color: #555 !important;
}

.kt-login .form-check-input:checked {
  background-color: #9b1b1b !important;
  border-color: #9b1b1b !important;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
  .contenido-formulario {
    border: none !important;
    margin: 0 !important;
  }

  .button-custom-3,
  .btn-grande {
    min-width: auto !important;
    width: 100% !important;
    padding: 13px 20px !important;
  }
}