/* GP-RESPONSIVE-FIX v2 — sin romper centrado ni gutters del tema */

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
  max-width: 100%;
}

img, video, iframe {
  max-width: 100%;
  height: auto;
}

/* NO tocar max-width de .container (rompe el centrado del tema).
   Solo evitar desbordes puntuales. */

.product-miniature img,
.gp-tile img,
.cms-banner img,
[class*="cmsbanner"] img {
  max-width: 100%;
  height: auto;
}

/* Gutters laterales: aire para que no se coman las letras */
#header .header-top .header-div .sub-container {
  margin-left: clamp(24px, 4vw, 72px) !important;
  margin-right: clamp(24px, 4vw, 72px) !important;
  max-width: none;
  box-sizing: border-box;
}

#wrapper,
#content-wrapper,
#main {
  box-sizing: border-box;
}

/* Restaurar contenedores centrados del tema (si custom los aplastó) */
.container {
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px;
  padding-right: 15px;
  width: 100%;
  box-sizing: border-box;
}

/* NO anular márgenes negativos de .row (Bootstrap/tema los necesita) */

/* Secciones de home / listados con respiro lateral */
#content-wrapper .products-section-title,
#content-wrapper .products,
#content-wrapper .featured-products,
#content-wrapper .product-accessories,
#index #content-wrapper > .container,
#category #content-wrapper,
#product #content-wrapper,
.footer-container .container {
  box-sizing: border-box;
}

/* Banners CMS: con padding lateral en desktop para no pegar tipografía al borde */
@media (min-width: 992px) {
  #cpcmsbanner2,
  #cpcmsbanner3 {
    padding-left: clamp(16px, 2.5vw, 40px);
    padding-right: clamp(16px, 2.5vw, 40px);
    box-sizing: border-box;
  }

  #content-wrapper {
    padding-left: clamp(12px, 2vw, 32px);
    padding-right: clamp(12px, 2vw, 32px);
  }
}

@media (max-width: 991px) {
  #header .header-top .header-div .sub-container {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }

  #content-wrapper {
    padding-left: 12px;
    padding-right: 12px;
  }

  .products,
  .product-list {
    width: 100% !important;
    max-width: 100%;
  }

  #cpcmsbanner1,
  #cpcmsbanner1 .gp-hero,
  [id^="cpcmsbanner"] {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  body {
    font-size: 15px;
  }

  .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .left-column,
  .right-column,
  #left-column,
  #right-column {
    width: 100% !important;
    float: none !important;
    max-width: 100% !important;
  }

  .product-cover img,
  .product-flags,
  .thumbnail-container {
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  #header .logo img,
  .logo img {
    max-height: 42px !important;
  }

  .cart-preview,
  .popover {
    max-width: calc(100vw - 24px) !important;
  }
}

/* Botón hoja: no solapar tipografía izquierda */
#gp-back-top.gp-back-top {
  left: 20px !important;
  bottom: 24px !important;
}