/* R40 — correção consolidada desktop/notebook + mobile/iPhone */

/* Um único comportamento: a página pública usa a rolagem nativa do navegador. */
html,
body,
body.r27-browse-mode{
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  position:static!important;
  touch-action:pan-y!important;
  scroll-behavior:auto!important;
  overflow-anchor:none;
}
body.r27-browse-mode #publicApp,
body.r27-browse-mode #publicApp>.wrap,
body.r27-browse-mode #catalogo,
body.r27-browse-mode #ggCatalogBrowse,
body.r27-browse-mode .r27-results,
body.r27-browse-mode .r27-results .grid{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  position:relative!important;
  touch-action:pan-y!important;
  overflow-anchor:none!important;
}
#r27ProductGrid{overflow-anchor:none!important}

/* Trilhos horizontais continuam rolando para os lados, sem bloquear swipe vertical. */
.r27-chip-scroll,
.r29-category-shell,
#r27CategoryChips{
  touch-action:pan-x pan-y!important;
  overscroll-behavior-x:contain!important;
  scroll-behavior:auto!important;
}

/* ---------- CARDS NO CELULAR ---------- */
@media(max-width:620px){
  .r27-results .grid,
  #r27ProductGrid{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .r27-results .card{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    border-radius:20px!important;
    overflow:hidden!important;
  }
  .r27-results .card .thumb{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:1.42/1!important;
    border-radius:0!important;
  }
  .r27-results .card .thumb img{
    width:100%!important;
    height:100%!important;
    padding:18px!important;
    object-fit:contain!important;
  }
  .r27-results .card .card-body{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:18px 18px 20px!important;
    gap:7px!important;
  }
  .r27-results .card .card-body .meta{
    font-size:10px!important;
    line-height:1.35!important;
    letter-spacing:.07em!important;
    overflow-wrap:anywhere;
  }
  .r27-results .card .card-body h3{
    font-size:19px!important;
    line-height:1.18!important;
    overflow-wrap:anywhere!important;
    hyphens:auto;
  }
  .r27-results .card .price{
    font-size:24px!important;
    line-height:1.15!important;
  }
  .r27-results .card .ref,
  .r27-results .card .install,
  .r27-results .card .gg-install-link{
    font-size:12px!important;
    line-height:1.4!important;
  }
  .r27-results .card .card-actions{margin-top:8px!important}
}

/* ---------- FICHA DO PRODUTO NO MOBILE ---------- */
@media(max-width:820px){
  /* Ao abrir produto, a navegação global sai do caminho; VOLTAR/X viram o cabeçalho da ficha. */
  body:has(#detailModal.open) .top{display:none!important}

  #detailModal,
  #detailModal.open{
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    z-index:9999!important;
    background:#fff!important;
  }
  #detailModal .modal-card,
  #detailModal.open .modal-card{
    width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;
    touch-action:pan-y!important;
    scroll-behavior:auto!important;
    overflow-anchor:none!important;
    background:#fff!important;
  }
  #detailModal .close-row{
    position:sticky!important;
    top:0!important;
    z-index:500!important;
    width:100%!important;
    min-height:62px!important;
    margin:0!important;
    padding:10px 14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    background:rgba(255,255,255,.98)!important;
    border-bottom:1px solid #ece8e2!important;
    box-shadow:0 5px 18px rgba(43,31,21,.07)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
  }
  #detailModal #detailBack,
  #detailModal #detailClose{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:42px!important;
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
  }
  #detailModal #detailBack{padding:9px 13px!important}
  #detailModal #detailClose{width:42px!important;height:42px!important;padding:0!important}

  #detailModal #detailBody{
    width:100%!important;
    max-width:none!important;
    padding:18px 14px 80px!important;
    margin:0!important;
  }
  #detailModal .detail,
  #detailModal .r30-detail{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:20px!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    align-items:start!important;
  }
  #detailModal .r30-detail>div:first-child,
  #detailModal .detail>div:first-child{
    position:static!important;
    top:auto!important;
    width:100%!important;
    min-width:0!important;
  }
  #detailModal .r30-main-image,
  #detailModal .detail-gallery{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    border-radius:18px!important;
  }
  #detailModal .r30-main-image img,
  #detailModal .detail-gallery img{
    width:100%!important;
    height:auto!important;
    max-height:46dvh!important;
    object-fit:contain!important;
    padding:18px!important;
  }
  #detailModal .detail h2,
  #detailModal .r30-info h2{
    font-size:clamp(28px,9vw,40px)!important;
    line-height:1.02!important;
    letter-spacing:-.04em!important;
    overflow-wrap:anywhere!important;
  }
  #detailModal .detail-price{font-size:30px!important}
  #detailModal .gg-payment-choice,
  #detailModal .r30-payment-grid,
  #detailModal .detail-actions,
  #detailModal .r30-note-grid{
    grid-template-columns:1fr!important;
  }
  #detailModal .box,
  #detailModal .r30-specs,
  #detailModal .r35-fragrance-profile{
    width:100%!important;
    min-width:0!important;
    overflow-wrap:anywhere!important;
  }
  #detailModal .r30-thumbs{
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    touch-action:pan-x!important;
  }

  body.dark #detailModal,
  body.dark #detailModal.open,
  body.dark #detailModal .modal-card,
  body.dark #detailModal .close-row{background:#11100f!important}
}

/* ---------- DESKTOP/NOTEBOOK ---------- */
@media(min-width:821px){
  #detailModal .close-row{position:sticky!important;top:0!important}
  #detailModal .r30-detail>div:first-child{position:sticky!important;top:86px!important;align-self:start!important}
}

/* ---------- CABEÇALHO COLORIDO DA CATEGORIA ---------- */
#ggCatalogBrowse{
  --r40-cat-bg:linear-gradient(105deg,#faf7f1,#fff);
  --r40-cat-border:#e7dfd5;
}
#ggCatalogBrowse .r27-browse-hero{
  margin:0 calc(-1 * clamp(18px,3vw,58px)) 14px!important;
  padding:28px clamp(18px,3vw,58px) 20px!important;
  background:var(--r40-cat-bg)!important;
  border-bottom:1px solid var(--r40-cat-border)!important;
}
#ggCatalogBrowse[data-r39-category="PERFUMARIA"]{--r40-cat-bg:linear-gradient(105deg,#f7e4eb,#fff7fa 66%,#fff);--r40-cat-border:#e1beca}
#ggCatalogBrowse[data-r39-category="SKINCARE"]{--r40-cat-bg:linear-gradient(105deg,#e7f0ea,#f7fbf8 66%,#fff);--r40-cat-border:#bfd1c5}
#ggCatalogBrowse[data-r39-category="HAIR & BEAUTY"]{--r40-cat-bg:linear-gradient(105deg,#f5e4ea,#fcf4f7 66%,#fff);--r40-cat-border:#ddbdc8}
#ggCatalogBrowse[data-r39-category="TECNOLOGIA"]{--r40-cat-bg:linear-gradient(105deg,#e7edf4,#f5f8fa 66%,#fff);--r40-cat-border:#bdcad7}
#ggCatalogBrowse[data-r39-category="CASA INTELIGENTE"]{--r40-cat-bg:linear-gradient(105deg,#edf0e3,#fafbf6 66%,#fff);--r40-cat-border:#ccd2b8}
#ggCatalogBrowse[data-r39-category="IMAGEM & CONTEÚDO"]{--r40-cat-bg:linear-gradient(105deg,#f3e8e1,#fbf6f2 66%,#fff);--r40-cat-border:#dac1b5}
#ggCatalogBrowse[data-r39-category="GAMES"]{--r40-cat-bg:linear-gradient(105deg,#ece7f1,#f8f6fa 66%,#fff);--r40-cat-border:#cbbfd3}
#ggCatalogBrowse[data-r39-category="ÁUDIO & FONES"]{--r40-cat-bg:linear-gradient(105deg,#e6efef,#f5fafa 66%,#fff);--r40-cat-border:#bdd0d0}
#ggCatalogBrowse[data-r39-category="INFORMÁTICA"]{--r40-cat-bg:linear-gradient(105deg,#eceff1,#f8f9fa 66%,#fff);--r40-cat-border:#c8ced2}
#ggCatalogBrowse[data-r39-category="PERFUMARIA"][data-r39-profile="Feminino"]{--r40-cat-bg:linear-gradient(105deg,#f5d9e4,#fff1f6 66%,#fff);--r40-cat-border:#ddaabf}
#ggCatalogBrowse[data-r39-category="PERFUMARIA"][data-r39-profile="Masculino"]{--r40-cat-bg:linear-gradient(105deg,#dfe9f2,#f3f7fa 66%,#fff);--r40-cat-border:#b5c9d8}
