/* ===========================
   VARIABLES (ajusta aquí)
   =========================== */
:root{
  --ra-card-pad: 16px;     /* padding interno de la card */
  --ra-card-gap: 12px;     /* separación vertical entre bloques */
  --ra-card-minh: 440px;   /* alto mínimo de la card */
  --ra-img-pad: 12px;      /* padding interno del slot de imagen */
  --ra-img-box-h: 240px;   /* alto visible del slot de imagen (sin contar padding) */
}
/* ===========================
   Varios
   =========================== */
   #post-14 header{
    display:none;
   }

/* ===========================
   GRID (contenedor 1200px)
   =========================== */
#products-loop.products {
  /* max-width: 1200px;
  margin: 0 auto; */
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: flex-start;
}

/* Orden y Mostrando resultados */
.shop-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom: 16px;
}
.toolbar-left {
  opacity:0;
}
.toolbar-left .woocommerce-result-count,
.toolbar-right .woocommerce-ordering{ margin:0 }

@media (max-width: 640px){
  .shop-toolbar{ flex-direction:column; align-items:stretch }
  .toolbar-right{ order:1 }  /* sorting arriba en mobile */
  .toolbar-left{ order:2 }   /* contador abajo */
}

/* ===========================
   Ver más LoadMore
   =========================== */
  #ra-loadmore {
    border-radius: 25px;
    background-color: white;
    color:black;
    border: 3px solid black;
    font-size: 0;
    padding: 16px;
    height: 22px;
  }

  #ra-loadmore::after {
    content: "Cargar más productos";
    font-size: 15px;
  }

/* ===========================
   CARD base
   =========================== */
li.product.ra-card {
  padding: var(--ra-card-pad) !important;   
  min-height: var(--ra-card-minh) !important;  
  box-sizing: border-box !important;
  background-color: #fff;  
  border-radius: 10px;
  box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.25); 
  overflow: hidden;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-top: 16px !important;
  gap: 3px !important;
  transition: box-shadow 0.3s ease;
}

.ra-card:hover {
  box-shadow: 0 8px 16px rgba(0,0,0,0.12); /* hover:shadow-lg */
}

input.input-text.qty.text, input.qty-field{
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

.woocommerce-js ul.products li.product .price,
.woocommerce-page ul.products li.product .price{
  text-align: center !important;
  margin-top: 16px !important;
}

/* ===== SOLO en la GRILLA: 4 columnas en escritorio ===== */
#products-loop li.product.ra-card {
  flex: 0 1 calc((100% - 3 * 24px) / 4);
}

/* ===========================
   SLOT IMAGEN (con padding)
   =========================== */
.ra-card a.woocommerce-LoopProduct-link {
  box-sizing: border-box !important;
  width: 100% !important;
  height: calc(var(--ra-img-box-h) + (var(--ra-img-pad)*2)) !important; 
  padding: var(--ra-img-pad) !important;                               
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: var(--ra-card-gap) !important;
}
.ra-card a.woocommerce-LoopProduct-link img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  max-width: none !important;   
  max-height: none !important;
}

/* ===========================
   BLOQUE INFERIOR (contenido)
   =========================== */
.ra-card .product-element-bottom {
  display: flex;
  flex-direction: column;
  gap: var(--ra-card-gap);
  padding-top: 0;
}

/* ===========================
   TÍTULO
   =========================== */
.ra-card .woocommerce-loop-product__title,
.ra-card .wd-entities-title {
  font-family: 'Montserrat', 'Inter', sans-serif;
  font-weight: 450;
  font-size: 11px;
  line-height: 1.17;
  text-align: center;
  color: #2C2E30 !important;
  margin: 0 !important; /* menos empuje */
}

/* Forzar estilos y color del <a> */
.ra-card .product-element-bottom h3.wd-entities-title,
.ra-card .product-element-bottom h3.wd-entities-title a {
  font-family: 'Montserrat', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight: 450 !important;
  font-size: clamp(11px, 0.9vw + 3px, 16px) !important;
  line-height: 1.17 !important;
  text-align: center !important;
  color: #2C2E30 !important;
  margin: 0 0 2px !important;
}
.ra-card .product-element-bottom h3.wd-entities-title a {
  color: inherit !important;
  text-decoration: none !important;
  display: inline-block !important;
}
.ra-card .product-element-bottom h3.wd-entities-title a:hover,
.ra-card .product-element-bottom h3.wd-entities-title a:focus {
  color: #2C2E30 !important;
  text-decoration: none !important;
}

/* ===========================
   SKU
   =========================== */
.ra-card .wd-product-sku{
  font-family: 'Montserrat', 'Inter', sans-serif !important;
  font-size: 10px !important;
  line-height: 1.17 !important;
  color: #888 !important;
  text-align: center !important;
  margin: 0 0 6px !important;
}
.ra-card .wd-product-sku .wd-label{
  font-weight: 600 !important;
  color: #444 !important;
  margin-right: 4px !important;
}
.ra-card .wd-product-sku span:not(.wd-label){
  color: #2C2E30 !important;
  font-weight: 500 !important;
}
.ra-card .wd-product-sku:empty { display: none !important; }

/* ===========================
   PRECIO UNITARIO — 1ª línea centrada
   =========================== */
.ra-card .product-element-bottom .price:first-of-type {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 0 !important;
  text-align: center !important;
}
.ra-card .product-element-bottom .price:first-of-type .price-label-inline {
  font-family: 'Montserrat', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  line-height: 1.17 !important;
  color: #0000F5 !important;
  white-space: nowrap !important;
}
.ra-card .product-element-bottom .price:first-of-type .unit-price-amount,
.ra-card .product-element-bottom .price:first-of-type .woocommerce-Price-amount,
.ra-card .product-element-bottom .price:first-of-type .woocommerce-Price-amount bdi,
.ra-card .product-element-bottom .price:first-of-type .woocommerce-Price-amount * {
  font-family: 'Montserrat', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  line-height: 1.17 !important;
  color: #0000F5 !important;
}

/* Etiqueta "Precio unitario" si no existe .price-label-inline */
.ra-card .product-element-bottom .price:first-of-type:not(:has(.price-label-inline))::before {
  content: "Precio unitario";
  font-family: 'Montserrat', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.17;
  color: #0000F5;
  margin-right: 6px;
  white-space: nowrap;
}

/* ===========================
   FRASES PEQUEÑAS
   =========================== */
.ra-card .woocommerce-price-suffix,
.ra-card .sobre-unidades,
.ra-card .cuantas-unidades {
  font-family: 'Montserrat', 'Inter', sans-serif;
  font-size: clamp(10px, 0.9vw + 3px, 12px) !important;
  line-height: 1.17;
  color: #000;
  text-align: center;
  margin: 0 0 6px;
  display: block;
}

/* ===========================
   CANTIDAD (+/-) + BOTÓN
   =========================== */
.wd-add-btn.quantity{
  display: flex;
}
.ra-card .wd-add-btn{
  width: 100% !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: var(--ra-card-gap) 0 0 !important;
  flex-wrap: nowrap !important;
}
.ra-card .wd-add-btn .quantity{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 84px !important;
  height: 32px !important;
}
.ra-card .wd-add-btn .quantity .minus,
.ra-card .wd-add-btn .quantity .plus{
  width: 20px !important;
  height: 35px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
  color: #666 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.ra-card .wd-add-btn .quantity .minus{
  border-right: none !important;
  border-radius: 8px 0 0 8px !important;
}
.ra-card .wd-add-btn .quantity .plus{
  border-left: none !important;
  border-radius: 0 8px 8px 0 !important;
}
.ra-card .wd-add-btn .quantity input.qty{
  width: 36px !important;
  height: 28px !important;
  padding: 0 !important;
  text-align: center !important;
  border-top: 1px solid #e5e5e5 !important;
  border-bottom: 1px solid #e5e5e5 !important;
  border-left: none !important;
  border-right: none !important;
  font-family: 'Montserrat', 'Inter', sans-serif !important;
  font-size: 12px !important;
  color: #333 !important;
  box-sizing: border-box !important;
}
.ra-card .wd-add-btn .quantity input.qty::-webkit-outer-spin-button,
.ra-card .wd-add-btn .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Botón añadir */
/* .ra-card .add-to-cart-loop{
  flex: 0 0 auto !important;
  height: 40px !important;
  padding: 0 10px !important;
  min-width: 110px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Montserrat', 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  background: #0059ff !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
  transition: background .2s ease !important;
  margin: 0 !important;
} */
/* .ra-card .add-to-cart-loop:hover{ 
  background:#0042cc !important; } */

/* Defensa extra contra width:100% del theme */
/* .ra-card a.button.add_to_cart_button.add-to-cart-loop,
.ra-card .add-to-cart-loop.button{
  width: 110px !important;  
  min-width: 0 !important;  
} */

/* Mensaje bajo el botón */
.ra-cart-feedback{
  margin-top:6px;
  padding:6px 8px;
  text-align:center;
  font-family:'Montserrat', 'Inter', sans-serif;
  font-size:12px;
  font-weight:600;
  color:#1a8f2d;
  background:#e7f7eb;
  border:1px solid #cdebd3;
  border-radius:6px;
  opacity:1;
  transform:translateY(0);
  transition:opacity .35s ease, transform .35s ease;
}
.ra-cart-feedback.is-hiding{ 
  opacity:0; 
  transform:translateY(-4px); 
}

li.product .wd-add-btn + .ra-cart-feedback,
.ra-card .wd-add-btn + .ra-cart-feedback{
  display: block;
}

.woocommerce-js ul.products li.product .price, 
.woocommerce-page ul.products li.product .price {
  font-family: 'Montserrat', 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #0059ff ;
}

.woocommerce-products-header{
  padding-right: 15px;
  padding-left: 50px;
}

.woocommerce-js .woocommerce-breadcrumb {
  font-weight: 600;
  color: #2C2E30;
  font-size: 0.99em;
}
.woocommerce-js .woocommerce-breadcrumb a{
  font-weight: 500;
  color: #68625A;
}
.woocommerce-js table.shop_table th{
  font-weight: 400;
}
div.tiered-pricing-wrapper > table.tiered-pricing-table tbody tr.tiered-pricing--active td {
  background-color: #CCCCCC !important;
}


/* ===========================
   CARRUSEL "RECIÉN LLEGADOS"
   =========================== */
.recien-llegados .productos-swiper{
  max-width: 1260px;
  margin: 0 auto;
}
.recien-llegados .products.swiper-wrapper{
  display: flex !important;
  gap: 25px !important; /* el espacio lo da Swiper (spaceBetween) */
}
.recien-llegados .products.swiper-wrapper > li.product{
  flex: 0 0 auto !important;
  max-width: none !important;
}
/* .swiper-button-prev.productos-next{
  left: 10px;
}
.swiper-button-next.productos-next{
  right: 10px;
} */

:root{
  --ra-card-minh: 480px;
  --ra-img-box-h: 260px;
}




/* ===========================
   ARCHIVE-PRODUCT.PHP
   =========================== */
.tienda-contenedor{
  display:flex;
  align-items:stretch;
  /* width:1190px;
  max-width:1200px;
  margin:0 auto; */
  /* padding-top:30px; */
  gap:24px;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.tienda-contenedor.no-sidebar .tienda-productos{ 
  width:100%; 
  max-width:100%; 
}

.tienda-sidebar{
  flex:0 0 260px;
  min-width:200px;
  background:#fff;
  position:sticky;
  top:32px;
  padding:18px 12px 22px 15px;
  font-size:14px;
  /* margin-left: -160px; */
  box-shadow: 0 4px 6px rgba(0,0,0,0.415);
  height: fit-content;
}

.tienda-productos{
  flex:1 1 0;
  min-width:0;
  display:flex;
  flex-direction:column;
}

#primary, #secondary { 
  margin:0 !important; 
}

@media (max-width: 1500px){
  .tienda-sidebar{
    /* margin-left: -5%; */
  }
}
@media (max-width: 1340px){
  .tienda-sidebar{
    margin-left: 0;
  }
}
@media (min-width: 750px) and (max-width: 1450px){
  .columns-4{
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
}
@media (max-width: 749px){
  .columns-4{
    grid-template-columns: repeat(1,minmax(0,1fr)) !important;
  }
}
@media (max-width: 1024px){
  .tienda-contenedor{ 
    flex-direction:column; 
    gap:0; 
    padding-top:10px; 
  }
  .tienda-sidebar{ 
    width:100%; 
    max-width:100%; 
    position:static; 
    margin-bottom:24px; 
  }
  .tienda-productos{ 
    width:100%; 
  }
}
