/* =========================================
   RESET SEGURO (não quebra nada)
========================================= */

* {
  box-sizing: border-box;
}


/* =========================================
   BOTÃO COMPRAR (estável)
========================================= */

.botao-comprar,
button.botao-comprar,
.comprar .botao-comprar {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
}


/* =========================================
   BLOCO ATACADO PRODUTO (DESKTOP)
========================================= */

.pagina-produto .hm-produto-atacado-box,
.produto .hm-produto-atacado-box {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  margin: 18px 0 20px !important;
  overflow: hidden !important;
  clear: both !important;
}


/* GRID CORRETO (sem erro de sintaxe) */

.pagina-produto .hm-faixas-produto,
.produto .hm-faixas-produto {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important;
}

.pagina-produto .hm-faixa-produto,
.produto .hm-faixa-produto {
  min-width: 0 !important;
}


/* =========================================
   LISTAGEM (HOME / CARDS)
========================================= */

.listagem-item .hm-produto-atacado-box {
  margin: 14px 0 12px !important;
  padding: 14px 10px !important;
  border-radius: 14px !important;
}

/* layout das caixas no card */
.listagem-item .hm-faixas-produto {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.listagem-item .hm-faixa-produto {
  width: 31% !important;
  min-height: 70px !important;
  padding: 8px 4px !important;
}

.listagem-item .hm-faixa-produto strong {
  font-size: 16px !important;
}


/* =========================================
   BARRA INFERIOR (não cobrir conteúdo)
========================================= */

body {
  padding-bottom: 95px !important;
}

.hm-ticket-smart {
  min-height: 60px !important;
  padding: 10px 14px !important;
}


/* =========================================
   MOBILE (sem quebrar o que já funciona)
========================================= */

@media (max-width: 768px) {

  /* GRID produto vira 2 colunas */
  .pagina-produto .hm-faixas-produto,
  .produto .hm-faixas-produto {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* cards */
  .listagem-item .hm-faixa-produto {
    width: 48% !important;
  }

  /* barra inferior */
  body {
    padding-bottom: 100px !important;
  }

  .hm-ticket-smart {
    min-height: 70px !important;
    padding: 10px !important;
  }

  /* botão topo não brigar */
  #barraTopo,
  .botao-topo,
  .scroll-top {
    bottom: 120px !important;
    right: 14px !important;
    z-index: 9996 !important;
  }
}