/*
Theme Name: Astra Child
Template: astra
*/

/* =============================================
   ESTRUCTURA HEADER + MENÚ SEPARADOS
   ============================================= */

/* Header blanco superior con logo */
#masthead .ast-primary-header-bar,
.ast-primary-header-bar {
  background: #ffffff !important;
  padding: 15px 0 !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Menú azul separado DEBAJO del header */
#masthead .ast-below-header-bar,
.ast-below-header-bar,
.ast-below-header-navigation {
  background: #1a6fc4 !important;
  padding: 0 !important;
}
.ast-below-header-bar .main-header-menu a,
.ast-below-header-bar a {
  color: #ffffff !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  font-size: 13px !important;
  padding: 15px 20px !important;
}
.ast-below-header-bar a:hover {
  background: rgba(0,0,0,0.15) !important;
  color: #fff !important;
}

/* Si Astra no soporta below-header, forzamos con JS */
/* Logo y título del sitio */
.ast-site-title-wrap .site-title a,
.site-title a {
  color: #222222 !important;
  font-weight: 800 !important;
  font-size: 1.6em !important;
}

/* =============================================
   QUITAR COSAS FEA
   ============================================= */
.entry-header, h1.entry-title, .page-title { display:none!important; }
.ast-breadcrumbs-wrapper { margin-top: 0 !important; }

/* =============================================
   TARJETAS PRODUCTO - estilo natturamty
   ============================================= */
.woocommerce ul.products li.product {
  background: #fff !important;
  border: 1px solid #ececec !important;
  border-radius: 6px !important;
  box-shadow: 0 1px 6px rgba(0,0,0,0.07) !important;
  transition: box-shadow 0.25s !important;
  overflow: hidden !important;
}
.woocommerce ul.products li.product:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,0.13) !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: #1a6fc4 !important;
  font-size: 0.82em !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
}
.woocommerce ul.products li.product .price {
  color: #222 !important;
  font-size: 1.05em !important;
  font-weight: 700 !important;
}

/* =============================================
   BOTONES AZULES
   ============================================= */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .single_add_to_cart_button,
.woocommerce ul.products li.product .button {
  background: #1a6fc4 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  font-size: 12px !important;
  padding: 11px 18px !important;
  transition: background 0.2s !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: #155aa0 !important;
  color: #fff !important;
}

/* =============================================
   SALE BADGE
   ============================================= */
.woocommerce span.onsale {
  background: #f96d8a !important;
  border-radius: 3px !important;
  font-weight: 700 !important;
  font-size: 11px !important;
}

/* =============================================
   FOOTER ROSA
   ============================================= */
#colophon, .site-footer,
.footer-widget-area, .ast-small-footer,
.ast-footer-overlay {
  background: #f96d8a !important;
  color: #ffffff !important;
}
.site-footer *, .footer-widget-area *,
.ast-small-footer * {
  color: #ffffff !important;
}
.site-footer a:hover { text-decoration: underline !important; }

/* =============================================
   FONDO Y GENERAL
   ============================================= */
body { background: #f8f8f8 !important; }
.woocommerce ul.products { gap: 16px !important; }
.ast-container { max-width: 1200px !important; }

/* =============================================
   HERO / PÁGINA INICIO
   ============================================= */
.wp-block-cover__inner-container h1,
.wp-block-cover__inner-container h2 {
  font-size: clamp(2em, 5vw, 3.5em) !important;
  font-weight: 800 !important;
}

/* DROPDOWN MENÚ VISIBLE */
.main-navigation .sub-menu,
.ast-builder-menu .sub-menu {
  background: #1a6fc4 !important;
  border: none !important;
  border-top: 3px solid #f96d8a !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2) !important;
  min-width: 180px !important;
}
.main-navigation .sub-menu a,
.ast-builder-menu .sub-menu a {
  color: #ffffff !important;
  padding: 12px 20px !important;
  border-bottom: 1px solid rgba(255,255,255,0.15) !important;
  font-size: 13px !important;
}
.main-navigation .sub-menu a:hover {
  background: rgba(255,255,255,0.2) !important;
}

/* HEADER - Logo centrado como natturamty */
.ast-primary-header-bar .ast-container {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}
.ast-site-title-wrap {
  text-align: left !important;
}
/* Carrito visible en header */
.ast-header-woo-cart {
  display: flex !important;
  align-items: center !important;
}
.ast-cart-menu-wrap .count {
  background: #f96d8a !important;
  color: #fff !important;
}

/* FOOTER ROSA - mejorado */
#colophon, .site-footer {
  background: #f96d8a !important;
}
.site-footer .ast-container,
.footer-widget-area .ast-container {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 40px !important;
  padding: 40px 20px !important;
}
.site-footer *, .footer-widget-area * {
  color: #fff !important;
}
.ast-small-footer {
  background: rgba(0,0,0,0.15) !important;
  border-top: 1px solid rgba(255,255,255,0.3) !important;
  text-align: center !important;
  padding: 15px !important;
}
.ast-small-footer * { color: #fff !important; }

/* HERO - fondo rosa como natturamty en lugar de imagen oscura */
.wp-block-cover {
  background-color: #f96d8a !important;
}
.wp-block-cover .wp-block-cover__image-background {
  opacity: 0.15 !important;
}