/* ============================================================
   El Tío Omar · Estilos WooCommerce (tienda + ficha de producto)
   Diseño de marca aplicado sobre el markup nativo de WooCommerce.
   Para cambiar la paleta, editá las variables de :root de abajo.
   ============================================================ */
.woocommerce, .woocommerce-page{
  --eo-ink:#1A1A1A; --eo-ink-soft:#5c5145; --eo-gold:#C9A962; --eo-gold-deep:#b0843a;
  --eo-cream:#F5F0E6; --eo-card:#fbf8f1; --eo-line:#e4d9c6; --eo-wine:#722F37;
  --eo-serif:ui-serif,Georgia,Cambria,'Times New Roman',Times,serif;
  --eo-sans:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-family:var(--eo-sans);
}

/* Fondo crema para las páginas de tienda */
body.woocommerce, body.woocommerce-page,
body.archive.woocommerce, body.single-product{ background:var(--eo-cream); }

/* Contenedor (centra y limita el ancho del contenido de WooCommerce) */
.woocommerce-page .site-main, .single-product .site-main, .post-type-archive-product .site-main{
  max-width:1240px; margin-inline:auto; padding:0 24px 80px;
}

/* Encabezado de la tienda */
.woocommerce-products-header{ text-align:center; padding:40px 0 8px; }
.woocommerce-products-header__title.page-title{
  font-family:var(--eo-serif); font-weight:600; color:var(--eo-ink);
  font-size:clamp(34px,5vw,54px); margin:0;
}
.woocommerce .woocommerce-result-count{ color:var(--eo-ink-soft); }
.woocommerce .woocommerce-ordering select{ border:1px solid var(--eo-line); border-radius:2px; padding:8px 10px; }

/* ===================== GRILLA DE PRODUCTOS ===================== */
.woocommerce ul.products{ gap:30px; display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); margin:0; }
.woocommerce ul.products li.product{
  width:auto!important; margin:0!important; float:none!important;
  background:var(--eo-card); border:1px solid var(--eo-line); border-radius:6px;
  overflow:hidden; padding:0; transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.woocommerce ul.products li.product:hover{ transform:translateY(-6px); box-shadow:0 24px 48px rgba(26,26,26,.14); border-color:var(--eo-gold); }
.woocommerce ul.products li.product a img{ margin:0; border-radius:0; aspect-ratio:4/3; object-fit:cover; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--eo-serif); font-weight:600; font-size:22px; color:var(--eo-ink); padding:18px 20px 2px;
}
.woocommerce ul.products li.product .price{ color:var(--eo-wine); font-weight:600; padding:0 20px; display:block; }
.woocommerce ul.products li.product .price del{ color:var(--eo-ink-soft); font-weight:400; }
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{
  margin:14px 20px 22px; display:inline-block; background:var(--eo-ink); color:var(--eo-cream);
  border-radius:2px; padding:11px 20px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:600;
}
.woocommerce ul.products li.product .button:hover{ background:#000; }
.woocommerce span.onsale{ background:var(--eo-wine); color:#fbf2e4; border-radius:2px; }

/* ===================== FICHA DE PRODUCTO ===================== */
.single-product .site-main{ background:var(--eo-cream); }
/* Layout flex: imagen + resumen comparten fila; lo de abajo ocupa el ancho completo */
.woocommerce div.product{ display:flex; flex-wrap:wrap; gap:24px 56px; align-items:flex-start; padding:40px 0 20px; }
.woocommerce div.product div.images{ position:relative; margin:0; float:none; flex:1 1 44%; min-width:300px; }
.woocommerce div.product div.images img{ border-radius:8px; box-shadow:0 28px 60px rgba(26,26,26,.18); }
.woocommerce div.product div.summary{ margin:0; float:none; flex:1 1 44%; min-width:300px; }
/* Estos bloques van SIEMPRE a ancho completo (no en media columna) */
.woocommerce div.product .eo-woo-care,
.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related.products,
.woocommerce div.product .up-sells{ flex:1 1 100%; width:100%; }

/* Badge de origen sobre la imagen (inyectado por hook) */
.eo-woo-badge{ position:absolute; top:18px; left:18px; z-index:3; background:var(--eo-wine); color:#fbf2e4;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase; font-weight:600; padding:9px 16px; border-radius:2px; }

.woocommerce div.product .product_title{ font-family:var(--eo-serif); font-weight:600; color:var(--eo-ink);
  font-size:clamp(34px,4.5vw,54px); line-height:1.05; margin:0 0 6px; }
/* Categoría como kicker arriba del título (inyectado por hook) */
.eo-woo-kicker{ display:block; color:var(--eo-gold-deep); font-size:12px; letter-spacing:.28em;
  text-transform:uppercase; font-weight:600; margin-bottom:10px; }
/* Línea ---◇--- */
.eo-woo-rule{ display:flex; align-items:center; gap:16px; margin:16px 0 22px; }
.eo-woo-rule span{ flex:1; height:1px; background:rgba(176,132,58,.45); }
.eo-woo-rule i{ width:9px; height:9px; border:1.5px solid var(--eo-gold); transform:rotate(45deg); display:block; }

.woocommerce div.product p.price, .woocommerce div.product span.price{ color:var(--eo-wine); font-weight:600; font-size:26px; }
.woocommerce div.product .woocommerce-product-details__short-description{ color:var(--eo-ink-soft); font-size:17px; line-height:1.7; }

/* 3 cajas de características (inyectadas por hook) */
.eo-woo-feats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:26px 0; max-width:520px; }
.eo-woo-feat{ text-align:center; padding:18px 10px; border:1px solid rgba(201,169,98,.4); border-radius:4px; }
.eo-woo-feat svg{ color:var(--eo-wine); margin-bottom:8px; }
.eo-woo-feat span{ display:block; font-size:12px; color:rgba(26,26,26,.7); letter-spacing:.04em; }

/* Cantidad + botón de compra */
.woocommerce div.product form.cart{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin:18px 0; }
.woocommerce .quantity .qty{ border:1px solid rgba(26,26,26,.2); border-radius:2px; padding:12px; width:74px; text-align:center; }
.woocommerce div.product form.cart .button,
.woocommerce div.product .single_add_to_cart_button{
  background:var(--eo-wine); color:#fbf2e4; border-radius:2px; padding:16px 34px;
  font-size:13px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
}
.woocommerce div.product form.cart .button:hover,
.woocommerce div.product .single_add_to_cart_button:hover{ background:#5a252c; }

/* Conservación / Características (inyectado por hook después del summary) */
.eo-woo-care{ display:grid; grid-template-columns:1fr 1fr; gap:48px; margin:40px 0 0; padding-top:48px; border-top:1px solid var(--eo-line); }
.eo-woo-care .eo-care-kicker{ display:inline-block; color:var(--eo-gold-deep); font-size:12px; letter-spacing:.28em; text-transform:uppercase; font-weight:600; margin-bottom:10px; }
.eo-woo-care h2{ font-family:var(--eo-serif); font-weight:600; font-size:30px; color:var(--eo-ink); margin:0 0 22px; }
.eo-woo-care ul{ list-style:none; margin:0; padding:0; }
.eo-woo-care li{ position:relative; padding:0 0 16px 30px; color:var(--eo-ink-soft); font-size:15.5px; line-height:1.55; }
.eo-woo-care li::before{ content:""; position:absolute; left:0; top:8px; width:10px; height:10px; border-radius:50%; border:2px solid var(--eo-gold); }

/* Pestañas: las ocultamos porque usamos Conservación/Características propias */
.woocommerce div.product .woocommerce-tabs{ display:none; }

/* Relacionados ("También te puede interesar") */
.woocommerce .related.products, .woocommerce .up-sells{ background:var(--eo-ink); margin:60px 0 0; padding:70px clamp(20px,5vw,60px); border-radius:8px; }
.woocommerce .related.products > h2, .woocommerce .up-sells > h2{
  font-family:var(--eo-serif); font-weight:600; color:var(--eo-cream); text-align:center; font-size:clamp(28px,4vw,44px); margin:0 0 40px;
}
.woocommerce .related.products li.product{ background:rgba(255,255,255,.03); border-color:rgba(201,169,98,.2); }
.woocommerce .related.products li.product .woocommerce-loop-product__title{ color:var(--eo-cream); }
.woocommerce .related.products li.product .price{ color:var(--eo-gold); }

/* Mensajes / botones generales */
.woocommerce-message, .woocommerce-info, .woocommerce-error{ border-top-color:var(--eo-gold); }
.woocommerce .button, .woocommerce a.button, .woocommerce button.button{ border-radius:2px; }

/* ===================== CARRITO + PAGO ===================== */
.woocommerce-cart .site-main, .woocommerce-checkout .site-main{ max-width:1140px; }
.woocommerce-cart .entry-content, .woocommerce-checkout .entry-content,
.woocommerce-cart .entry-header, .woocommerce-checkout .entry-header{ max-width:100%; }

/* --- Bloques nuevos de WooCommerce (Cart/Checkout): forzar layout a 2 columnas --- */
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout{ width:100%; max-width:100%; }
.wc-block-cart, .wc-block-checkout{ display:flex!important; flex-wrap:wrap; gap:48px; align-items:flex-start; }
.wc-block-cart__main, .wc-block-checkout__main{ flex:1 1 58%; min-width:320px; }
.wc-block-cart__sidebar, .wc-block-checkout__sidebar{ flex:1 1 320px; min-width:300px; }
.wc-block-components-button, .wc-block-cart__submit-button, .wp-element-button{
  background:var(--eo-wine)!important; color:#fbf2e4!important; border-radius:2px!important;
}

/* --- Carrito/checkout clásico (shortcode [woocommerce_cart] / [woocommerce_checkout]) --- */
.woocommerce table.shop_table{ border:1px solid var(--eo-line); border-radius:6px; background:var(--eo-card); }
.woocommerce table.shop_table th{ font-family:var(--eo-serif); color:var(--eo-ink); }
.woocommerce .cart-collaterals{ display:flex; gap:40px; flex-wrap:wrap; width:100%; }
.woocommerce .cart-collaterals .cart_totals{ flex:1 1 340px; float:none; width:auto; }
.woocommerce .cart-collaterals .cross-sells{ flex:1 1 340px; }
.woocommerce-cart table.cart td.actions .coupon .input-text{ width:160px; }
.woocommerce #order_review, .woocommerce #customer_details{ box-sizing:border-box; }
.woocommerce form.checkout.col2-set .col-1,
.woocommerce form.checkout.col2-set .col-2{ float:none; width:100%; }
.woocommerce-checkout #order_review{ border:1px solid var(--eo-line); border-radius:6px; background:var(--eo-card); padding:22px; }
.woocommerce #payment, .woocommerce-checkout #payment{ background:transparent; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce #place_order, .woocommerce-checkout #place_order{
  background:var(--eo-wine)!important; color:#fbf2e4!important; border-radius:2px;
  font-size:14px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; padding:16px 28px;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce #place_order:hover{ background:#5a252c!important; }

/* Responsive */
@media(max-width:820px){
  .woocommerce div.product div.images,
  .woocommerce div.product div.summary{ flex:1 1 100%; min-width:0; }
  .woocommerce div.product{ gap:28px; }
  .eo-woo-care{ grid-template-columns:1fr; gap:32px; }
  /* Carrito y pago: apilar columnas */
  .wc-block-cart, .wc-block-checkout{ flex-direction:column; gap:32px; }
  .wc-block-cart__main, .wc-block-checkout__main,
  .wc-block-cart__sidebar, .wc-block-checkout__sidebar{ flex:1 1 100%; min-width:0; width:100%; }
  .woocommerce .cart-collaterals{ flex-direction:column; }
  .woocommerce ul.products{ grid-template-columns:1fr 1fr; }
}
@media(max-width:560px){
  .woocommerce ul.products{ grid-template-columns:1fr; }
  .eo-woo-feats{ grid-template-columns:1fr 1fr; }
  .woocommerce-page .site-main, .single-product .site-main, .post-type-archive-product .site-main{ padding-inline:16px; }
}

/* ===== Refuerzo responsive MÓVIL (a prueba de balas: apila todo y mata el desborde) ===== */
@media(max-width:768px){
  body.woocommerce, body.woocommerce-page{ overflow-x:hidden; }
  .woocommerce *, .woocommerce-page *{ min-width:0; max-width:100%; }
  .woocommerce div.product{ display:block!important; }
  .woocommerce div.product div.images,
  .woocommerce div.product div.summary{ width:100%!important; float:none!important; margin:0 0 24px; }
  .woocommerce div.product div.images img{ width:100%; height:auto; }
  .wc-block-cart, .wc-block-checkout, .woocommerce .cart-collaterals,
  .woocommerce form.checkout.col2-set{ display:block!important; }
  .wc-block-cart__main, .wc-block-cart__sidebar,
  .wc-block-checkout__main, .wc-block-checkout__sidebar,
  .woocommerce .cart_totals, .woocommerce #customer_details, .woocommerce #order_review{
    width:100%!important; float:none!important;
  }
  .woocommerce-cart table.cart, .woocommerce table.shop_table{ width:100%; }
  .eo-woo-feats{ grid-template-columns:1fr 1fr; }
  .woocommerce img{ height:auto; }

  /* BLOQUES Cart/Checkout de WooCommerce: forzar UNA sola columna en celular.
     Hay que apagar el FLEX en TODOS los contenedores padres del bloque. */
  .wp-block-woocommerce-cart, .wp-block-woocommerce-checkout,
  .wp-block-woocommerce-filled-cart-block,
  .wp-block-woocommerce-checkout .wc-block-checkout,
  .wc-block-components-sidebar-layout,
  .wc-block-cart, .wc-block-checkout{
    display:block !important; max-width:100% !important; width:100% !important;
    margin-left:0 !important; margin-right:0 !important;
  }
  .wp-block-woocommerce-cart-items-block,
  .wp-block-woocommerce-cart-totals-block,
  .wp-block-woocommerce-checkout-fields-block,
  .wp-block-woocommerce-checkout-totals-block,
  .wc-block-components-main, .wc-block-components-sidebar,
  .wc-block-cart__main, .wc-block-cart__sidebar,
  .wc-block-checkout__main, .wc-block-checkout__sidebar{
    width:100% !important; max-width:100% !important; min-width:0 !important;
    float:none !important; flex:0 0 100% !important;
    padding-left:0 !important; padding-right:0 !important; margin-left:0 !important;
  }
  .woocommerce-cart .ogblock-classic-layout,
  .woocommerce-checkout .ogblock-classic-layout{ display:block !important; width:auto !important; max-width:100% !important; }
}
