/* ============================================================================
   GAMBETA PREMIUM v4 — Estilo Nike/Adidas (fondo claro, tipografía bold)
   ============================================================================ */
:root {
  --gb-accent: #e02b2b;
  --gb-accent-hover: #c41e1e;
  --gb-dark: #111;
  --gb-radius: 2px;
}

/* ============================================================================
   TIPOGRAFÍA — Oswald para títulos, Inter para body
   ============================================================================ */
h1, h2, h3, h4, h5, h6,
.woocommerce-loop-product__title,
.entry-title, .page-title, .ast-archive-title,
.woocommerce-tabs .tabs li a {
  font-family: 'Oswald', 'Impact', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em;
}
body { font-family: 'Inter', -apple-system, sans-serif !important; }
::selection { background: var(--gb-accent); color: #fff; }

/* ============================================================================
   HEADER — Oscuro premium con acento rojo
   ============================================================================ */
.ast-primary-header-bar, #masthead, .site-header,
.ast-main-header-bar-alignment {
  background: var(--gb-dark) !important;
  border-bottom: 2px solid var(--gb-accent) !important;
}
.site-title a, .ast-site-identity .site-title a {
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.6rem !important;
  letter-spacing: 0.15em;
}
.main-navigation a, .ast-nav-menu a, .main-header-menu a {
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.85rem !important;
  transition: color 0.2s;
}
.main-navigation a:hover, .ast-nav-menu a:hover { color: var(--gb-accent) !important; }
.ast-header-search .astra-search-icon,
.ast-header-woo-cart .ast-cart-menu-wrap,
.ast-header-woo-cart .ast-cart-menu-wrap .count,
.ast-header-account-wrap { color: #fff !important; }

/* ============================================================================
   MOBILE MENU — Oscuro legible
   ============================================================================ */
.ast-mobile-popup-drawer, .ast-mobile-popup-drawer .ast-mobile-popup-inner,
.ast-mobile-popup-drawer .ast-mobile-popup-content, #ast-mobile-popup,
.ast-builder-menu-mobile .main-navigation, .ast-builder-menu-mobile .main-navigation ul,
.ast-mobile-popup-content .main-header-menu, .ast-header-break-point .main-header-menu,
.ast-mobile-header-content, .toggle-on {
  background: var(--gb-dark) !important;
}
.ast-mobile-popup-drawer a, .ast-mobile-popup-content a,
.ast-header-break-point .main-header-menu a, .ast-builder-menu-mobile a {
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-color: rgba(255,255,255,0.08) !important;
}
.ast-mobile-popup-drawer a:hover { color: var(--gb-accent) !important; }
.ast-mobile-popup-drawer .menu-toggle-close, .ast-mobile-popup-close,
.menu-toggle-close, .ast-mobile-popup-drawer button {
  color: #fff !important; background: transparent !important;
}
.ast-mobile-popup-drawer .ast-menu-toggle,
.ast-header-break-point .ast-menu-toggle {
  color: #fff !important; border-color: rgba(255,255,255,0.1) !important;
}

/* ============================================================================
   PRODUCT CARDS — Efecto hover premium
   ============================================================================ */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
ul.products li.product {
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  padding: 0 !important;
  margin-bottom: 0 !important;
  position: relative;
  background: #111 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.25);
}
/* Image container — fondo oscuro, sin espacio sobrante */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .woocommerce-loop-product__link {
  background: #111 !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 0 !important;
}
.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
  width: 100% !important;
  aspect-ratio: 1 !important;
  object-fit: contain !important;
  background: #1a1a1a !important;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
  display: block !important;
  padding: 10px !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
}
.woocommerce ul.products li.product:hover img { transform: scale(1.08); }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 0.8rem !important;
  padding: 0.7rem 0.8rem 0.2rem !important;
  margin: 0 !important;
  line-height: 1.3;
  color: #fff !important;
}
.woocommerce ul.products li.product .price {
  color: var(--gb-accent) !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 600;
  padding: 0 0.8rem 0.6rem !important;
}
.woocommerce ul.products li.product .price del {
  color: #666 !important; font-size: 0.8rem; opacity: 0.8;
}
.woocommerce ul.products li.product .price ins {
  color: var(--gb-accent) !important; text-decoration: none !important; font-weight: 700;
}
.astra-shop-summary-wrap, .ast-woo-shop-product-description {
  background: #111 !important; padding: 0 !important;
}
.ast-woo-product-category {
  color: #666 !important; font-size: 0.6rem !important;
  text-transform: uppercase; letter-spacing: 0.12em;
  padding: 0.4rem 0.8rem 0 !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
}
/* Variation swatches en cards */
.woocommerce ul.products li.product .cfvsw-swatches-container .cfvsw-swatches-option,
.woocommerce ul.products li.product .variable-items-wrapper li {
  background: #222 !important;
  color: #fff !important;
  border-color: #333 !important;
  font-size: 0.7rem !important;
}

/* Badges */
.woocommerce span.onsale, span.onsale {
  background: var(--gb-accent) !important;
  color: #fff !important;
  border-radius: 0 !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.7rem !important;
  padding: 4px 12px !important;
  min-height: auto !important; min-width: auto !important;
  line-height: 1.5 !important;
  top: 10px !important; left: 10px !important; right: auto !important;
  letter-spacing: 0.1em;
}
.outofstock .ast-shop-product-out-of-stock, .ast-shop-product-out-of-stock {
  background: rgba(0,0,0,0.75) !important;
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
  font-size: 0.7rem !important;
  letter-spacing: 0.1em;
}

/* Add to cart / select options button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button,
.woocommerce ul.products li.product a.button {
  background: var(--gb-accent) !important;
  color: #fff !important;
  border: none !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.1em;
  font-size: 0.75rem !important;
  border-radius: 0 !important;
  padding: 0.6rem 1rem !important;
  width: 100%;
  transition: all 0.3s;
  text-align: center;
  display: block;
  margin: 0 !important;
}
.woocommerce ul.products li.product .button:hover { background: var(--gb-accent-hover) !important; }

/* Hide "Click Here" or generic links */
.wp-element-button:not(.single_add_to_cart_button):not(.add_to_cart_button) {
  background: var(--gb-accent) !important;
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
  border-radius: 0 !important;
  letter-spacing: 0.1em;
}

/* Product card grid — work WITH Astra's CSS Grid, not against it */
.woocommerce ul.products,
.woocommerce-page ul.products,
.ast-container .woocommerce ul.products:not(.elementor-grid),
.woocommerce-page ul.products:not(.elementor-grid) {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  width: 100% !important;
  margin: 0 !important;
}
@media (max-width: 992px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .ast-container .woocommerce ul.products:not(.elementor-grid),
  .woocommerce-page ul.products:not(.elementor-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 544px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .ast-container .woocommerce ul.products:not(.elementor-grid),
  .woocommerce-page ul.products:not(.elementor-grid) {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================================
   SINGLE PRODUCT PAGE
   ============================================================================ */
.single-product .product_title { font-size: 2rem !important; color: var(--gb-dark) !important; }
.single-product .entry-summary .price {
  color: var(--gb-accent) !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.8rem !important;
}
.single-product .price del { color: #999 !important; font-size: 1.2rem; }
.single-product .single_add_to_cart_button {
  background: var(--gb-dark) !important;
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em;
  padding: 1rem 2.5rem !important;
  border-radius: 0 !important;
  border: none !important;
  transition: background 0.3s;
}
.single-product .single_add_to_cart_button:hover { background: var(--gb-accent) !important; }
.woocommerce-tabs .tabs li a { font-family: 'Oswald', sans-serif !important; text-transform: uppercase; letter-spacing: 0.05em; }
.woocommerce-tabs .tabs li.active a { color: var(--gb-accent) !important; border-bottom-color: var(--gb-accent) !important; }
.star-rating span::before, .star-rating::before { color: var(--gb-accent) !important; }

/* Pagination */
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--gb-dark) !important;
  color: #fff !important;
  border-color: var(--gb-dark) !important;
}

/* ============================================================================
   FOOTER — Oscuro premium
   ============================================================================ */
.site-footer, .ast-footer-overlay {
  background: var(--gb-dark) !important;
  border-top: 2px solid var(--gb-accent) !important;
  color: #aaa !important;
}
.site-footer a { color: #fff !important; }
.site-footer a:hover { color: var(--gb-accent) !important; }

/* ============================================================================
   SCROLLBAR
   ============================================================================ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f0f0f0; }
::-webkit-scrollbar-thumb { background: var(--gb-accent); border-radius: 3px; }

/* ============================================================================
   BREADCRUMBS
   ============================================================================ */
.woocommerce-breadcrumb { font-size: 0.75rem !important; text-transform: uppercase; letter-spacing: 0.08em; }
.woocommerce-breadcrumb a:hover { color: var(--gb-accent) !important; }

/* WC notices */
.woocommerce-message, .woocommerce-info { border-top-color: var(--gb-accent) !important; }

/* ============================================================================
   HOMEPAGE — Mejorar los bloques Spectra/UAG existentes
   ============================================================================ */
/* Botones en la homepage estilo premium */
body.home .wp-block-button__link,
body.home .uagb-button__link,
body.home .wp-element-button {
  background: var(--gb-accent) !important;
  color: #fff !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-weight: 600 !important;
  border-radius: 0 !important;
  padding: 0.8rem 2rem !important;
  border: none !important;
  transition: all 0.3s !important;
  font-size: 0.9rem !important;
}
body.home .wp-block-button__link:hover,
body.home .uagb-button__link:hover {
  background: var(--gb-accent-hover) !important;
  transform: translateY(-2px);
}

/* WooCommerce product blocks en homepage — cards oscuras */
body.home .wc-block-grid__product,
body.home .wp-block-woocommerce-product-template .wc-block-grid__product {
  background: #111 !important;
  border: none !important;
  overflow: hidden;
}
body.home .wc-block-grid__product-title { color: #fff !important; }
body.home .wc-block-grid__product-price { color: var(--gb-accent) !important; font-family: 'Oswald', sans-serif !important; }

/* ============================================================================
   SEARCH RESULTS — fondo oscuro
   ============================================================================ */
body.search .site-main, body.search .content-area,
body.search .ast-container, body.search #page {
  background: #0a0a0a !important;
  color: #fff !important;
}
body.search h1, body.search h2 { color: #fff !important; }
body.search .ast-archive-title span { color: var(--gb-accent) !important; }

/* ============================================================================
   OCULTAR VARIATION SWATCHES EN LOOP DE PRODUCTOS (crean cajas extra)
   Higher specificity to override cfvsw inline-flex !important
   ============================================================================ */
.woocommerce ul.products li.product .cfvsw-swatches-container,
.woocommerce ul.products li.product .cfvsw-swatches-wrap,
ul.products .cfvsw-swatches-container,
ul.products .cfvsw-swatches-wrap,
.woocommerce-loop-product__link .cfvsw-swatches-container,
.woocommerce ul.products li.product .cfvsw_variations_form,
.woocommerce ul.products li.product .cfvsw-shop-variations,
.woocommerce ul.products li.product .variations,
.woocommerce ul.products li.product .reset_variations,
ul.products .cfvsw_variations_form,
ul.products .variations,
.woocommerce ul.products li.product .cfvsw-swatches-container.cfvsw-shop-container,
.woocommerce-page ul.products li.product .cfvsw-swatches-container.cfvsw-shop-container,
ul.products li.product .cfvsw-swatches-container.cfvsw-shop-container,
ul.products li.product .cfvsw-shop-variations td.value,
ul.products li.product td.value .cfvsw-swatches-container {
  display: none !important;
}

/* ============================================================================
   HOMEPAGE — Fondo oscuro global (evita bleed blanco entre secciones)
   ============================================================================ */
body.home,
body.home .site-content,
body.home #primary,
body.home .ast-container,
body.home .entry-content,
body.home .ast-separate-container .ast-article-single {
  background: #0a0a0a !important;
}
body.home .entry-content > p:empty,
body.home .entry-content > p > br {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
}
body.home .entry-content p {
  margin: 0 !important;
  padding: 0 !important;
}

/* Limpiar padding/margin extra de los product cards */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product {
  padding: 0 !important;
  margin-bottom: 1.5rem !important;
}

/* ============================================================================
   RESPONSIVE
   ============================================================================ */
@media (max-width: 768px) {
  .woocommerce ul.products li.product:hover { transform: none; box-shadow: none; }

  /* Categorías: apilar verticalmente en móvil */
  body.home .entry-content div[style*="display:flex"] {
    flex-direction: column !important;
  }
  body.home .entry-content a[style*="flex:1"] {
    flex: none !important;
    width: 100% !important;
    height: 220px !important;
  }
}

/* ============================================================================
   MOBILE MENU — forzar fondo oscuro (override Astra --ast-global-color-5)
   Exact selectors from Astra inline CSS to guarantee override
   ============================================================================ */
.ast-mobile-popup-drawer .ast-mobile-popup-inner,
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
.ast-mobile-header-wrap .ast-mobile-header-content,
.ast-desktop-header-content,
.ast-mobile-popup-drawer,
.ast-mobile-popup-drawer .ast-mobile-popup-content,
.ast-mobile-popup-content .main-header-menu,
.ast-mobile-popup-content .ast-builder-menu-mobile .main-header-menu,
.ast-mobile-popup-content .ast-builder-menu-mobile .main-header-menu .sub-menu,
.ast-header-break-point .main-header-menu,
#ast-mobile-popup,
.ast-builder-menu-mobile .main-navigation,
.ast-builder-menu-mobile .main-navigation ul,
.toggle-on {
  background: #111 !important;
  background-color: #111 !important;
}
.ast-mobile-popup-drawer a,
.ast-mobile-popup-content a,
.ast-mobile-popup-content .menu-item > .menu-link,
.ast-header-break-point .main-header-menu a,
.ast-builder-menu-mobile a,
#ast-mobile-popup a,
.ast-mobile-popup-content .menu-item a {
  color: #fff !important;
}
.ast-mobile-popup-drawer a:hover,
.ast-mobile-popup-content .menu-item > .menu-link:hover,
#ast-mobile-popup a:hover {
  color: var(--gb-accent) !important;
}
/* Close button — Astra sets color:#3a3a3a, we need white */
.ast-mobile-popup-drawer.active .menu-toggle-close,
.menu-toggle-close,
.ast-mobile-popup-close,
#menu-toggle-close,
.ast-mobile-popup-drawer button,
.ast-mobile-popup-drawer .ast-mobile-popup-header .menu-toggle-close,
#ast-mobile-popup button {
  color: #fff !important;
  background: transparent !important;
}
/* Submenu arrows / toggles */
.ast-mobile-popup-content .ast-menu-toggle,
.ast-header-break-point .ast-menu-toggle,
.ast-mobile-popup-content .ast-submenu-expanded > .ast-menu-toggle {
  color: #fff !important;
  border-color: rgba(255,255,255,0.15) !important;
}
/* Separadores entre items */
.ast-mobile-popup-content .menu-item,
#ast-mobile-popup .menu-item {
  border-color: rgba(255,255,255,0.08) !important;
}
/* Account/cart icons en mobile header */
.ast-header-break-point .ast-header-account-wrap,
.ast-header-break-point .ast-header-woo-cart .ast-cart-menu-wrap {
  color: #fff !important;
}
/* Account icon SVG inside mobile popup */
.ast-mobile-popup-content .ast-header-account-wrap .ahfb-svg-iconset svg path:not(.ast-hf-account-unfill),
.ast-mobile-popup-content .ast-header-account-wrap .ahfb-svg-iconset svg circle {
  fill: #fff !important;
}