/*
 * Lucaffè E.S.E. Site Guard 1.4.2
 * Global mobile horizontal lock and desktop banner centring.
 */

:root{
  --lce-safe-spacer:96px;
  --lce-desktop-banner-max:1480px;
  --lce-desktop-page-gutter:48px;
}

html{
  max-width:100%;
  overflow-x:clip;
}

body.lce-site-guard{
  max-width:100%;
  overflow-x:clip!important;
}

body.lce-site-guard :where(
  #outer-wrap,
  #wrap,
  #page,
  #page-wrapper,
  .site,
  .site-content,
  main,
  #main,
  #content,
  #content-wrap,
  #primary,
  .site-main,
  .content-area,
  article,
  section,
  .vc_row,
  .wpb_wrapper,
  .woocommerce
){
  min-width:0;
  box-sizing:border-box;
}

body.lce-site-guard :where(img,video,iframe,canvas,svg){
  max-width:100%;
}

body.lce-site-guard .lce-auto-empty-row{
  display:none!important;
  height:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}

body.lce-site-guard .lce-auto-spacer{
  height:var(--lce-safe-spacer)!important;
  min-height:0!important;
  max-height:var(--lce-safe-spacer)!important;
  margin-top:0!important;
  margin-bottom:0!important;
}

body.lce-site-guard .lce-overflow-safe,
body.lce-site-guard .lce-mobile-media-safe{
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

body.lce-site-guard :where(
  .lce-fullbleed,
  .lce-system-banner,
  .lca-fullbleed,
  .lhps-shell,
  .lhps-ese-bridge,
  .lspx-related,
  .lba-shell,
  .lch-shell,
  .lcfw-section,
  .lcm-page,
  .lmhh-home
){
  clear:both;
  isolation:isolate;
}

/*
 * All custom Lucaffè product/category banners use one desktop axis.
 * Nested banner parts are not marked by JavaScript, so the rule does
 * not stretch inner grids or cards.
 */
@media(min-width:981px){
  body.lce-site-guard .lce-desktop-centered-banner{
    position:relative!important;
    left:50%!important;
    right:auto!important;
    width:min(
      var(--lce-banner-max,var(--lce-desktop-banner-max)),
      calc(100vw - var(--lce-desktop-page-gutter))
    )!important;
    max-width:min(
      var(--lce-banner-max,var(--lce-desktop-banner-max)),
      calc(100vw - var(--lce-desktop-page-gutter))
    )!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    transform:translateX(-50%)!important;
    box-sizing:border-box!important;
  }

  body.single-product.lce-site-guard .lce-desktop-centered-banner{
    --lce-banner-max:1480px;
  }

  body.lce-site-guard .lspx-related.lce-desktop-centered-banner{
    --lce-banner-max:1600px;
  }

  body.lce-site-guard .lspx-primary-stage.lce-desktop-centered-banner{
    --lce-banner-max:1380px;
  }
}

/*
 * Mobile guarantee: the document itself cannot move horizontally.
 * Horizontal product sliders still work because their own tracks keep
 * overflow-x:auto and are explicitly excluded from JavaScript fixes.
 */
@media(max-width:980px){
  :root{
    --lce-safe-spacer:52px;
  }

  html.lce-mobile-x-lock,
  html.lce-mobile-x-lock body,
  body.lce-site-guard{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
    overscroll-behavior-x:none!important;
  }

  body.lce-site-guard :where(
    #outer-wrap,
    #wrap,
    #page,
    #page-wrapper,
    .site,
    .site-content,
    main,
    #main,
    #content,
    #content-wrap,
    #primary,
    .site-main,
    .content-area,
    .woocommerce,
    .woocommerce-page
  ){
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:clip!important;
  }

  body.lce-site-guard .lce-mobile-viewport-section{
    position:relative!important;
    left:50%!important;
    right:auto!important;
    width:var(--lce-mobile-viewport-width,calc(100dvw + 4px))!important;
    max-width:none!important;
    min-width:var(--lce-mobile-viewport-width,calc(100dvw + 4px))!important;
    margin-left:0!important;
    margin-right:0!important;
    transform:
      translateX(
        calc(
          -50% + var(--lce-mobile-center-correction,0px)
        )
      )!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    background-position:center center!important;
    background-size:cover!important;
    border-left:0!important;
    border-right:0!important;
  }

  body.lce-site-guard .lce-mobile-constrained{
    left:auto!important;
    right:auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
    transform:none!important;
    box-sizing:border-box!important;
  }

  body.lce-site-guard .lce-mobile-media-safe{
    width:auto!important;
    height:auto!important;
  }

  body.lce-site-guard table.lce-mobile-media-safe{
    width:100%!important;
    display:block!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
  }

  /* Keep intentional horizontal components operational. */
  body.lce-site-guard :where(
    .lhps-track,
    .swiper-wrapper,
    .slick-track,
    .owl-stage,
    .lspx-marquee-track,
    .lmhh-home-marquee-track,
    [data-horizontal-scroll]
  ){
    max-width:none!important;
  }
}


/* ================================================================
   v1.4.2 — PIXEL-PERFECT MOBILE EDGE COVER
   Removes 1–4 px black lines caused by viewport and subpixel rounding.
   ================================================================ */

@media(max-width:980px){
  html.lce-mobile-x-lock,
  html.lce-mobile-x-lock body,
  body.lce-site-guard{
    position:relative!important;
    inset-inline:0!important;
    margin-inline:0!important;
    padding-inline:0!important;
    touch-action:pan-y pinch-zoom;
  }

  body.lce-site-guard .lce-mobile-viewport-section{
    clip-path:inset(0 -2px 0 -2px);
  }

  body.lce-site-guard :is(
    .lce-system-banner,
    .lce-fullbleed,
    .lca-fullbleed,
    .lca-hero,
    .lce-hero,
    .lcm-page,
    .lcm-hero,
    .lmhh-home,
    .lmhh-home-hero,
    .lhps-ese-bridge,
    [class*="lucaffe-"][class*="fullbleed"],
    [class*="lucaffe-"][class*="full-width"]
  ).lce-mobile-viewport-section{
    border-radius:0!important;
    outline:1px solid transparent;
  }

  body.lce-site-guard :where(
    #outer-wrap,
    #wrap,
    #page,
    #page-wrapper,
    .site,
    .site-content,
    main,
    #main,
    #content,
    #content-wrap,
    #primary,
    .site-main,
    .content-area,
    .woocommerce,
    .woocommerce-page
  ){
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }
}
