/* ================= v4: ajustes do teste de qualidade (28/10) ================= */

/* filtros no celular: a barra grudada (z-index 30) prendia o painel ATRÁS do véu → nada era clicável */
.barra.painel-on{z-index:86}

/* toques de no mínimo 44px */
.chip{min-height:44px}
@media (max-width:760px){
  .fav{width:44px;height:44px}
  /* categorias: o último chip cortado ganha um esmaecido = "tem mais pro lado" */
  .chips{-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}
}

/* bilhete "Foi pra sacola" não cobre a sacola/checkout */
body:has(#sacola:not([hidden])) .bilhete{display:none !important}

/* barra "Ver sacola" do celular não cobre o último card */
body:has(#flut.on) main{padding-bottom:96px}

/* janela da peça em telas de 320px: botões não estouram a largura */
.pd-acoes{max-width:100%}
.pd-acoes .btn{min-width:0}

/* fotos reais: corta pelos pés, não pela cabeça (ajuste fino por peça com "foco" no produtos.js/planilha) */
.card-img img,.pd-main img,.pd-thumbs img,.item-img img{object-position:50% 18%}

/* Color Friday no celular: o selo do canto não cobre a data do cabeçalho */
@media (max-width:760px){ .cf-cab .cf-kicker{padding-right:78px} }

/* 04/11 — Android: a janela da peça às vezes mostrava a grade por trás (falha de pintura do Chrome).
   No celular: sem desfoque no topo, sem a camada de grão por cima de tudo, e a janela em camada própria. */
@media (max-width:760px){
  .topo{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--fundo)!important}
  body::after{display:none!important}
  .produto,.sacola{transform:translateZ(0);will-change:translate,opacity;contain:layout paint;backface-visibility:hidden}
  .veu{will-change:opacity}
}