/* ==========================================================================
   Vinxey — Astra Overrides
   Sobreescritura de estilos del tema padre Astra con alta especificidad.
   Cargado después de todos los estilos de Astra para garantizar precedencia.
   ========================================================================== */

/* -----------------------------------------------------------------------
   1. HEADER DE ASTRA — Aplicar colores Vinxey
   ----------------------------------------------------------------------- */

/* Ocultar completamente el header de Astra para que no interfiera con el nuestro */
.ast-primary-header-bar,
.main-header-bar,
#masthead,
.ast-mobile-header-wrap,
.ast-main-header-bar-alignment {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* Sticky header scrolled */
.ast-sticky-active .main-header-bar,
.header-main-layout-1 .ast-primary-header-bar {
  background-color: rgba(26, 26, 26, 0.97) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

/* Logo en header */
.site-branding .custom-logo,
.ast-site-branding img {
  max-height: 40px !important;
  width: auto !important;
}

/* Nombre del sitio como texto */
.site-title a,
.ast-site-title a {
  color: #FFFFFF !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  font-size: 1.4rem !important;
}

/* -----------------------------------------------------------------------
   2. MENÚ DE NAVEGACIÓN DE ASTRA
   ----------------------------------------------------------------------- */

/* Links del menú principal */
.ast-builder-menu .menu-item a,
.main-header-bar .main-header-menu > .menu-item > a,
.ast-primary-header-bar .ast-masthead-custom-menu-items a,
#ast-site-header-cart .ast-cart-menu-wrap span,
.main-header-bar_wrap .main-header-menu a.menu-link {
  color: rgba(255, 255, 255, 0.8) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 0.95rem !important;
  transition: color 0.2s ease !important;
}

.main-header-bar .main-header-menu > .menu-item > a:hover,
.main-header-bar .main-header-menu > .current-menu-item > a,
.main-header-bar .main-header-menu > .current_page_item > a {
  color: #FFFFFF !important;
}

/* Subrayado rojo en hover — reemplaza el estilo Astra */
.ast-builder-menu .menu-item a::after,
.main-header-bar .main-header-menu > .menu-item > a::after {
  background-color: #DC0000 !important;
}

/* Menú separador / hamburger */
.ast-mobile-menu-trigger-fill,
.ast-mobile-menu-trigger-minimal,
.menu-toggle {
  color: #FFFFFF !important;
  background: transparent !important;
}

/* -----------------------------------------------------------------------
   3. BOTONES CTA DEL MENÚ (si Astra tiene botón configurado)
   ----------------------------------------------------------------------- */
.ast-header-button-1 .ast-custom-button,
.ast-custom-button-primary-link {
  background-color: #DC0000 !important;
  color: #FFFFFF !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  border: none !important;
  transition: background-color 0.3s ease, transform 0.3s ease !important;
}

.ast-header-button-1 .ast-custom-button:hover,
.ast-custom-button-primary-link:hover {
  background-color: #B30000 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(220, 0, 0, 0.3) !important;
}

/* -----------------------------------------------------------------------
   4. CUERPO / TIPOGRAFÍA GLOBAL
   ----------------------------------------------------------------------- */
body,
.ast-single-post .entry-content,
.entry-content p {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  color: #1A1A1A;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.ast-blog-post-title,
.ast-post-title {
  font-family: 'Inter', sans-serif !important;
  color: #1A1A1A !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

/* -----------------------------------------------------------------------
   5. LINKS
   ----------------------------------------------------------------------- */
a {
  color: #DC0000 !important;
  transition: color 0.2s ease !important;
}

a:hover,
a:focus {
  color: #B30000 !important;
}

/* Excepciones — no aplicar rojo a links de nav en footer dark, etc. */
.vx-footer a,
.vx-footer a:hover,
.vx-mobile-nav__link,
.vx-nav__link {
  color: #FFFFFF !important;
}

.vx-nav__link:hover,
.vx-mobile-nav__link:hover {
  color: #DC0000 !important;
}

/* -----------------------------------------------------------------------
   6. BOTONES GLOBALES DE ASTRA
   ----------------------------------------------------------------------- */
.ast-button,
.ast-custom-button,
.wp-block-button__link,
.button,
input[type="submit"],
button[type="submit"],
.ast-container .ast-button {
  background-color: #DC0000 !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-family: 'Inter', sans-serif !important;
  padding: 14px 32px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  cursor: pointer !important;
  font-size: 1rem !important;
}

.ast-button:hover,
.ast-custom-button:hover,
.wp-block-button__link:hover,
.button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background-color: #B30000 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(220, 0, 0, 0.3) !important;
}

/* -----------------------------------------------------------------------
   7. CONTENIDO PRINCIPAL — eliminar sidebar y forzar ancho completo
   ----------------------------------------------------------------------- */
/* Forzamos que Astra no limite el ancho de los contenedores para que el child theme maneje el layout */
.ast-container,
.site-content .ast-container,
.ast-page-builder-template .site-content,
.ast-full-width-layout .ast-container,
.page-template-default #content .ast-container,
#content,
.site-content {
  display: block !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Quitar padding innecesario que Astra agrega al content */
.ast-page-builder-template .entry-content,
.entry-content {
  padding: 0 !important;
  margin: 0 !important;
}

/* -----------------------------------------------------------------------
   8. FOOTER DE ASTRA — Reemplazar con colores Vinxey
   ----------------------------------------------------------------------- */
.site-footer,
#colophon,
.ast-small-footer {
  background-color: #1A1A1A !important;
  color: rgba(255, 255, 255, 0.6) !important;
  border-top: 1px solid rgba(220, 0, 0, 0.15) !important;
}

.site-footer a,
#colophon a,
.ast-footer-widget-area a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.site-footer a:hover,
#colophon a:hover {
  color: #DC0000 !important;
}

.ast-small-footer-wrap {
  font-family: 'Inter', sans-serif !important;
  color: rgba(255, 255, 255, 0.4) !important;
  font-size: 0.85rem !important;
}

/* -----------------------------------------------------------------------
   9. SIDEBAR (si se usa)
   ----------------------------------------------------------------------- */
.widget-title,
.widgettitle {
  font-family: 'Inter', sans-serif !important;
  color: #1A1A1A !important;
  font-weight: 700 !important;
}

/* -----------------------------------------------------------------------
   10. FORMS DE ASTRA / WORDPRESS
   ----------------------------------------------------------------------- */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
textarea,
select {
  border: 1px solid #E5E7EB !important;
  border-radius: 8px !important;
  font-family: 'Inter', sans-serif !important;
  color: #1A1A1A !important;
  background-color: #FFFFFF !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus {
  border-color: #DC0000 !important;
  box-shadow: 0 0 0 3px rgba(220, 0, 0, 0.1) !important;
  outline: none !important;
}

/* -----------------------------------------------------------------------
   11. BLOQUES GUTENBERG — Asegurar colores correctos
   ----------------------------------------------------------------------- */
.wp-block-cover,
.wp-block-group {
  font-family: 'Inter', sans-serif !important;
}

/* Color preset Vinxey aplicado a bloques */
.has-vx-primary-color { color: #DC0000 !important; }
.has-vx-primary-background-color { background-color: #DC0000 !important; }
.has-vx-dark-color { color: #1A1A1A !important; }
.has-vx-dark-background-color { background-color: #1A1A1A !important; }
.has-vx-white-color { color: #FFFFFF !important; }
.has-vx-white-background-color { background-color: #FFFFFF !important; }
.has-vx-gray-light-color { color: #F3F4F6 !important; }
.has-vx-gray-light-background-color { background-color: #F3F4F6 !important; }

/* -----------------------------------------------------------------------
   12. MOBILE MENU DE ASTRA
   ----------------------------------------------------------------------- */
#ast-mobile-header,
.ast-mobile-header-wrap,
.ast-mobile-header-content {
  background-color: #1A1A1A !important;
  color: #FFFFFF !important;
}

.ast-mobile-menu .menu-item a {
  color: rgba(255, 255, 255, 0.85) !important;
  border-bottom-color: rgba(255, 255, 255, 0.07) !important;
  font-family: 'Inter', sans-serif !important;
}

.ast-mobile-menu .menu-item a:hover,
.ast-mobile-menu .current-menu-item > a {
  color: #DC0000 !important;
}

/* -----------------------------------------------------------------------
   12b. DESKTOP DROPDOWN SUBMENU DE ASTRA
   ----------------------------------------------------------------------- */
.main-header-bar .main-header-menu .sub-menu {
  background-color: #1A1A1A !important;
  border: 1px solid rgba(220, 0, 0, 0.15) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

.main-header-bar .main-header-menu .sub-menu .menu-item > a {
  color: rgba(255, 255, 255, 0.8) !important;
  background-color: transparent !important;
}

.main-header-bar .main-header-menu .sub-menu .menu-item > a:hover {
  color: #FFFFFF !important;
  background-color: rgba(220, 0, 0, 0.1) !important;
}

/* -----------------------------------------------------------------------
   13. BREADCRUMBS
   ----------------------------------------------------------------------- */
.ast-breadcrumbs a {
  color: #DC0000 !important;
}

.ast-breadcrumbs .trail-end {
  color: #6B7280 !important;
}

/* -----------------------------------------------------------------------
   14. SELECTION Y FOCUS GLOBAL
   ----------------------------------------------------------------------- */
::selection {
  background-color: #DC0000;
  color: #FFFFFF;
}

:focus-visible {
  outline: 2px solid #DC0000;
  outline-offset: 2px;
}