/* =========================================
   FUENTES
   ========================================= */

:root{
  /* Si no estás cargando Open Sans, dejala como fallback al final */
  --font-sans: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-headings: "Rubik Glitch", "Gliker", "Montserrat", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Cuerpo y controles */
body, button, input, select, textarea{
  font-family: var(--font-sans);
  font-weight: 400;
}

/* Títulos */
h1,h2,h3,h4,h5,h6,
.woocommerce-products-header__title,
.entry-title,.page-title{
  font-family: var(--font-headings);
  font-weight: 700;
  letter-spacing: .2px;
}


li.menu-item > a, .header-account a, .cat-item a {
  font-size: x-large;
}

/* =========================================
   LAYOUT FULL-WIDTH (sin romper la grilla)
   ========================================= */

/* Si el theme aplica "boxed" vía clase/body, lo neutralizamos */
body.boxed, .boxed { background: inherit; }

/* Contenedores comunes a ancho completo */
html, body { overflow-x: hidden; }
.site, .site-container, .container, .container-fluid,
.wrapper, .wrap, .content-area, .site-content, .page-content,
#content, #primary, #main{
  max-width: 100% !important;
  width: 100% !important;
}

/* Mantener padding lateral cómodo (ajustá al gusto del diseño) */
.site, .site-container, .container, .container-fluid,
.wrapper, .wrap, .content-area, .site-content, .page-content,
#content, #primary, #main{
  padding-left: 24px;
  padding-right: 24px;
}
@media (min-width: 1200px){
  .site, .site-container, .container, .container-fluid,
  .wrapper, .wrap, .content-area, .site-content, .page-content,
  #content, #primary, #main{
    padding-left: 32px;
    padding-right: 32px;
  }
}

/* Header & footer a todo ancho */
header, .site-header, footer, .site-footer{
  max-width: 100% !important;
  width: 100% !important;
}

/* Algunas themes añaden ancho fijo vía media queries; anulamos patrones comunes */
@media (min-width: 1200px){
  .container,
  .site-container{
    max-width: none !important;
  }
}

/* =========================================
   GRILLA DE PRODUCTOS (fluida, limpia)
   ========================================= */

.woocommerce ul.products,
.woocommerce-page ul.products{
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce ul.products li.product{
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  list-style: none !important;
  display: flex !important;
  flex-direction: column;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.woocommerce ul.products li.product a img{
  width: 100% !important;
  height: auto !important;
  object-fit: contain;
  margin: 0 0 10px 0 !important;
  display: block;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title{
  font-size: 15px !important;
  line-height: 1.2;
  margin: 6px 0 4px 0 !important;
  min-height: 2.6em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.woocommerce ul.products li.product .price{
  display: block;
  font-weight: 600;
  margin-top: 6px;
}

.woocommerce ul.products li.product .button{
  margin-top: auto; /* botón al pie de la tarjeta */
}

/* Etiquetas de oferta si las usa el theme */
.woocommerce ul.products li.product .onsale{
  top: 10px !important;
  left: 10px !important;
}

/* Desktop grande */
@media (min-width: 1400px){
  .woocommerce ul.products,
  .woocommerce-page ul.products{
    gap: 28px !important;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  }
}

/* Móvil */
@media (max-width: 480px){
  .woocommerce ul.products,
  .woocommerce-page ul.products{
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px !important;
  }
}


/* =============================================================================================== */




/* 
#reviews .comment-text p,
#reviews .comment-text .description { display: none !important; }
 */