/**
* Theme Name: Besa Child
* Description: This is a child theme for Besa
* Author: Thembay
* Author URI: https://thembay.com/
* Version: 1.0
* Template: besa
*/


/*  [ Add your custom css below ]
- - - - - - - - - - - - - - - - - - - - */
/* SINGLE PRODUCT – ancho completo robusto también en laptops */
body.single-product .wrapper-container > .container,
body.single-product .tbay-mainbody > .container,
body.single-product .tbay-content > .container,
body.single-product .container,
body.single-product .container-sm,
body.single-product .container-md,
body.single-product .container-lg,
body.single-product .container-xl,
body.single-product .container-xxl,
body.single-product [class*="container"] {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Elementor puede reimponer max-width según breakpoint */
body.single-product .elementor-section.elementor-section-boxed > .elementor-container,
body.single-product .elementor-container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Refuerzo explícito en el rango típico de laptops */
@media (min-width: 992px) and (max-width: 1440px) {
  body.single-product .wrapper-container > .container,
  body.single-product .tbay-mainbody > .container,
  body.single-product .tbay-content > .container,
  body.single-product .container,
  body.single-product .container-sm,
  body.single-product .container-md,
  body.single-product .container-lg,
  body.single-product .container-xl,
  body.single-product .container-xxl,
  body.single-product [class*="container"],
  body.single-product .elementor-section.elementor-section-boxed > .elementor-container,
  body.single-product .elementor-container {
    max-width: none !important;
    width: 100% !important;
  }
}

/* Gutters del grid que generan “márgenes” laterales */
body.single-product .row { margin-left: 0 !important; margin-right: 0 !important; }
body.single-product [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; }

/* Si usa WPBakery/VC en el single product */
body.single-product .vc_row { margin-left: 0 !important; margin-right: 0 !important; }
body.single-product .vc_column_container > .vc_column-inner {
  padding-left: 0 !important; padding-right: 0 !important;
}
/* ================================
   TIENDA/ARCHIVOS A ANCHO COMPLETO
   (contenedores del tema + Bootstrap)
   ================================ */
body.woocommerce-shop [class*="container"],
body.post-type-archive-product [class*="container"],
body.tax-product_cat [class*="container"],
body.tax-product_tag [class*="container"],
body.woocommerce-shop .wrapper-container > .container,
body.post-type-archive-product .wrapper-container > .container,
body.tax-product_cat .wrapper-container > .container,
body.tax-product_tag .wrapper-container > .container,
body.woocommerce-shop .tbay-mainbody > .container,
body.post-type-archive-product .tbay-mainbody > .container,
body.tax-product_cat .tbay-mainbody > .container,
body.tax-product_tag .tbay-mainbody > .container,
body.woocommerce-shop .tbay-content > .container,
body.post-type-archive-product .tbay-content > .container,
body.tax-product_cat .tbay-content > .container,
body.tax-product_tag .tbay-content > .container {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Refuerzo en rango típico de laptops */
@media (min-width: 992px) and (max-width: 1440px) {
  body.woocommerce-shop [class*="container"],
  body.post-type-archive-product [class*="container"],
  body.tax-product_cat [class*="container"],
  body.tax-product_tag [class*="container"] {
    max-width: none !important;
    width: 100% !important;
  }
}

/* ================================
   FILAS Y COLUMNAS (mantener sidebar visible)
   ================================ */
/* Conserve la estructura en 2 columnas pero sin “franjas” laterales */
body.woocommerce-shop .row,
body.post-type-archive-product .row,
body.tax-product_cat .row,
body.tax-product_tag .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* En lugar de eliminar gutters, dé un padding moderado a las columnas */
body.woocommerce-shop [class*="col-"],
body.post-type-archive-product [class*="col-"],
body.tax-product_cat [class*="col-"],
body.tax-product_tag [class*="col-"] {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Asegurar que el área de contenido y la barra lateral usen el ancho disponible */
body.woocommerce-shop .content-area,
body.post-type-archive-product .content-area,
body.tax-product_cat .content-area,
body.tax-product_tag .content-area {
  width: auto !important;
  max-width: none !important;
}

body.woocommerce-shop .sidebar,
body.post-type-archive-product .sidebar,
body.tax-product_cat .sidebar,
body.tax-product_tag .sidebar {
  display: block !important;     /* <- clave: NO ocultar */
  width: auto !important;
  max-width: none !important;
}

/* Si el tema usa layout tipo flex, garantice 2 columnas fluidas */
body.woocommerce-shop .content-area,
body.post-type-archive-product .content-area,
body.tax-product_cat .content-area,
body.tax-product_tag .content-area,
body.woocommerce-shop .sidebar,
body.post-type-archive-product .sidebar,
body.tax-product_cat .sidebar,
body.tax-product_tag .sidebar {
  flex: initial !important;
}

/* ================================
   ELEMENTOR BOXED (si aplica en la tienda)
   ================================ */
body.woocommerce-shop .elementor-section.elementor-section-boxed > .elementor-container,
body.post-type-archive-product .elementor-section.elementor-section-boxed > .elementor-container,
body.tax-product_cat .elementor-section.elementor-section-boxed > .elementor-container,
body.tax-product_tag .elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 100% !important;
  width: 100% !important;
}

body.woocommerce-shop .elementor-container,
body.post-type-archive-product .elementor-container,
body.tax-product_cat .elementor-container,
body.tax-product_tag .elementor-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ================================
   GRID DE PRODUCTOS (mantener legible)
   ================================ */
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products {
  padding-left: 16px;
  padding-right: 16px;
}

/* (Opcional) versión CSS Grid auto-ajustable
   - Úsela solo si el tema lo tolera y comente el layout por defecto. */
/*
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  grid-gap: 24px;
  padding-left: 16px;
  padding-right: 16px;
}
body.woocommerce-shop ul.products li.product,
body.post-type-archive-product ul.products li.product,
body.tax-product_cat ul.products li.product,
body.tax-product_tag ul.products li.product {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
*/

/* ================================
   WIDGETS DE BÚSQUEDA/FILTROS (ancho completo dentro del sidebar)
   ================================ */
body.woocommerce-shop .sidebar .widget input[type="search"],
body.woocommerce-shop .sidebar .widget input[type="text"],
body.woocommerce-shop .sidebar .widget select,
body.post-type-archive-product .sidebar .widget input[type="search"],
body.post-type-archive-product .sidebar .widget input[type="text"],
body.post-type-archive-product .sidebar .widget select,
body.tax-product_cat .sidebar .widget input[type="search"],
body.tax-product_cat .sidebar .widget input[type="text"],
body.tax-product_cat .sidebar .widget select,
body.tax-product_tag .sidebar .widget input[type="search"],
body.tax-product_tag .sidebar .widget input[type="text"],
body.tax-product_tag .sidebar .widget select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

/* No forzar ancho en widgets flotantes de WhatsApp */
#ht-ctc, .ht-ctc, .ht-ctc-chat,                /* Click to Chat (Holithemes) */
.joinchat, .joinchat__button,                  /* Join.chat */
.qlwapp-container, .qlwapp-toggle, .qlwapp-button, /* QuadLayers WhatsApp Chat */
.whatsapp-chat, .wa__btn_popup,               /* Nombres genéricos frecuentes */
.wac-floating-button, .wp-whatsapp-chat {
  width: auto !important;
  max-width: none !important;
  display: inline-block !important;
  /* Posición típica del botón flotante (ajuste si fuese necesario): */
  position: fixed !important;
  right: 16px !important;
  bottom: 16px !important;
  left: auto !important;
}

/* Evitar que herede padding/márgenes de .row/.col */
#ht-ctc, .ht-ctc, .joinchat, .qlwapp-container,
.whatsapp-chat, .wp-whatsapp-chat {
  margin: 0 !important;
  padding: 0 !important;
}

//CAMBIAR EL TAMANIO PARA LA IMAGEN DEL PRODUCTO
/* ================================
   SINGLE PRODUCT – HERO 65% / 35%
   Galería/Video (izq) 65% + Resumen corto (der) 35%
   Elementos inferiores (tabs, relacionados) al 100%
   ================================ */

/* 1) Layout superior con CSS Grid */
body.single-product .product {
  display: grid !important;
  grid-template-columns: 65% 35%;
  grid-template-areas:
    "gallery summary"
    "tabs    tabs";
  column-gap: 24px;
  align-items: start;
  width: 100%;
  box-sizing: border-box;
  padding-left: 16px;   /* respiración lateral mínima */
  padding-right: 16px;
}

/* Zonas del grid */
body.single-product .product .woocommerce-product-gallery,
body.single-product .product .tbay-product-gallery,
body.single-product .product .product-images,
body.single-product .product .product-video {
  grid-area: gallery;
  min-width: 0; /* evita desbordes horizontales */
}

body.single-product .product .summary {
  grid-area: summary;
  min-width: 0;
}

/* Todo lo que va debajo (pestañas, descripción larga, relacionados, upsells) ocupa 100% */
body.single-product .product .woocommerce-tabs,
body.single-product .product .tbay-product-meta,
body.single-product .product .upsells,
body.single-product .product .related,
body.single-product .product .products.related,
body.single-product .product .cross-sells {
  grid-area: tabs;
}

/* 2) Medios responsivos dentro de la galería/video */
body.single-product .woocommerce-product-gallery,
body.single-product .woocommerce-product-gallery__wrapper,
body.single-product .woocommerce-product-gallery__image,
body.single-product .product-video,
body.single-product .product-images {
  width: 100% !important;
  max-width: 100% !important;
}

body.single-product .woocommerce-product-gallery__image img,
body.single-product .product-images img {
  width: 100% !important;
  height: auto !important;
  display: block;
}

body.single-product .product iframe,
body.single-product .product video {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9; /* mantenga proporción del video */
}

/* 3) Breakpoints – mantiene 65/35 en desktop y laptops, ajusta en tablet y móvil */
@media (min-width: 1200px) {
  body.single-product .product { grid-template-columns: 65% 35%; }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  body.single-product .product { grid-template-columns: 65% 35%; } /* laptops */
}

@media (min-width: 768px) and (max-width: 991.98px) {
  body.single-product .product { grid-template-columns: 58% 42%; }  /* tablet apaisado */
}

@media (max-width: 767.98px) {
  body.single-product .product {
    grid-template-columns: 1fr;   /* móvil: apilado */
    grid-template-areas:
      "gallery"
      "summary"
      "tabs";
    row-gap: 24px;
  }
}

/* 4) Compatibilidad con temas Tbay/variantes: garantice 100% en el hero */
body.single-product .tbay-single-product,
body.single-product .tbay-content,
body.single-product .tbay-mainbody {
  width: 100% !important;
  max-width: none !important;
}

/* 5) No tocar widgets/botones flotantes de WhatsApp u otros plugins */
#ht-ctc, .ht-ctc, .joinchat, .qlwapp-container, .wp-whatsapp-chat,
.whatsapp-chat, .wac-floating-button { width: auto !important; max-width: none !important; }
//camibio para el quick view