/* =========================================================
   REMOVER PRETO & BRANCO DOS PRODUTOS INDISPONÍVEIS
   (não altera cores/menus/layout da loja)
   ========================================================= */

/* 1) Remove filtros/baixa opacidade aplicados no card */
.vitrine li.indisponivel,
.produto-indisponivel,
[class*="indispon"] {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}

/* 2) Garante que a imagem fique sempre colorida */
.vitrine li.indisponivel img,
.vitrine li.indisponivel .imagem-produto,
.vitrine li.indisponivel .imagem-produto img,
.produto-indisponivel img,
.produto-indisponivel .imagem-produto,
.produto-indisponivel .imagem-produto img,
[class*="indispon"] img,
[class*="indispon"] .imagem-produto,
[class*="indispon"] .imagem-produto img {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}

/* 3) Caso o tema coloque um “véu” com pseudo-elemento */
.vitrine li.indisponivel::before,
.vitrine li.indisponivel::after,
.produto-indisponivel::before,
.produto-indisponivel::after,
[class*="indispon"]::before,
[class*="indispon"]::after {
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

/* 4) Mantém o selo/flag legível (sem escurecer) */
.flag-indisponivel {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}/* =============================================
   AJUSTES DE LAYOUT (menu + fundo)
   ============================================= */

/* Fundo branco no menu */
.menu, 
.menu .nivel-um, 
.menu .nivel-um > li {
    background-color: #ffffff !important;
}

/* Centralizar menu de categorias */
.menu {
    text-align: center !important;
}
.menu ul {
    display: inline-block !important;
    float: none !important;
}

/* Texto das categorias em verde */
.menu .nivel-um > li > a {
    color: #2e4d2c !important;  /* verde */
    font-weight: 600;
}

/* Hover - verde mais escuro */
.menu .nivel-um > li > a:hover {
    color: #000000 !important;  
    background-color: #f7f7f7 !important;
}/* =============================================
   FORÇAR FUNDO BRANCO GERAL
   ============================================= */

/* Fundo do body */
body {
    background-color: #ffffff !important;
}

/* Fundo do container principal */
#header, 
#barraTopo, 
#cabecalho, 
.menu, 
.menu .nivel-um, 
.menu .nivel-um > li, 
#content, 
#rodape, 
.caixa, 
.bloco, 
.conteiner {
    background-color: #ffffff !important;
}

/* Bordas que aparecem cinzas (remover) */
.caixa, 
.bloco, 
.menu .nivel-um > li {
    border: none !important;
    box-shadow: none !important;
}/* ================================
   LAYOUT “CANASTRA NATIVA STYLE”
   (não altera indisponíveis)
   ================================ */

/* 1) Remover barra lateral na home e ampliar o conteúdo */
.pagina-inicial .sidebar,
.pagina-inicial .menu-lateral,
.pagina-inicial .newsletter,
.pagina-inicial .lista-categorias,
.pagina-inicial .banners-laterais {
  display: none !important;
}

/* Container centralizado e branco */
#corpo, 
.pagina-inicial #corpo,
.pagina-inicial .conteudo {
  width: 100% !important;
  max-width: 1200px !important; /* largura similar à referência */
  margin: 0 auto !important;
  background: #fff !important;
}

/* Remover bordas/sombras de caixas da home */
.pagina-inicial .caixa,
.pagina-inicial .caixa-destaque {
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 2) Menu horizontal com fundo branco (mantém o que você já tem) */
.menu, .menu .nivel-um, .menu .nivel-um > li {
  background: #fff !important;
}

/* 3) Mini-banners em 3 colunas grandes (abaixo do full banner) */
.pagina-inicial .lista-banners {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
}
.pagina-inicial .lista-banners li {
  flex: 1 1 calc(33.333% - 20px) !important;
  margin: 0 !important;
}
.pagina-inicial .lista-banners img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 8px !important; /* opcional */
}

/* 4) Produtos: 4 por linha (dinâmico) */
.vitrine li {
  width: 25% !important;
}
@media (max-width: 1024px) { .vitrine li { width: 33.333% !important; } }
@media (max-width: 768px)  { .vitrine li { width: 50% !important; } }
@media (max-width: 480px)  { .vitrine li { width: 100% !important; } }

/* 5) Garantir fundo branco sob as seções */
body, .pagina-inicial, .conteudo {
  background: #fff !important;
}/* ================================
   REMOVER BLOCO DE CATEGORIAS DUPLICADO
   ================================ */
.pagina-inicial .lista-categorias,
.pagina-inicial .caixa .menu-departamento {
  display: none !important;
}/* Remover o bloco de categorias vertical que aparece na HOME */
.pagina-inicial #corpo .menu-departamento,
.pagina-inicial #corpo .lista-categorias,
.pagina-inicial #corpo .menu-categorias,
.pagina-inicial #corpo .categorias,
.pagina-inicial #corpo .menu-lateral {
  display: none !important;
}/* ================================
   AJUSTES MOBILE (ESTILO CANASTRA NATIVA)
   ================================ */

/* Vitrine de produtos: 2 por linha com espaçamento */
@media (max-width: 768px) {
  .vitrine { 
    padding: 0 10px !important; 
  }
  .vitrine li { 
    width: 50% !important; 
    padding: 6px !important; 
  }

  /* Espaçamentos gerais de banners */
  .banner, 
  .fullbanner, 
  .banner-principal { 
    margin: 8px 0 12px !important; 
  }

  /* Títulos alinhados */
  .caixa-titulo, 
  .titulo, 
  h1, h2 { 
    padding: 0 14px !important; 
  }
}

/* Extra: celulares muito estreitos (até 400px) — força 1 produto por linha */
@media (max-width: 400px) {
  .vitrine li { 
    width: 100% !important; 
  }
}/* Remover a lista vertical de categorias da HOME (sem afetar o menu do topo) */
.pagina-inicial .box-categorias,
.pagina-inicial .caixa-categorias,
.pagina-inicial .lista-categorias,
.pagina-inicial .list-categories,
.pagina-inicial .menu-categorias,
.pagina-inicial .menu-vertical,
.pagina-inicial .menu-lateral,
.pagina-inicial .departamentos,
.pagina-inicial .menu-departamentos,
.pagina-inicial .widget-categorias,
.pagina-inicial .categorias,
.pagina-inicial .filtro-categorias {
  display: none !important;
}

/* Se houver uma linha/HR que separa esse bloco, esconda também */
.pagina-inicial .conteudo hr,
.pagina-inicial hr {
  display: none !important;
}/* Remove a caixinha de categorias que aparece abaixo do banner */
.pagina-inicial .secao-banners {
    display: none !important;
}/* Remover a caixinha de categorias que aparece abaixo do banner na HOME */
.pagina-inicial #corpo > .secao-banners,
.pagina-inicial .container-principal > .secao-banners,
.pagina-inicial .conteudo > .secao-banners {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* Caso a caixinha seja um bloco de categorias dentro dessa seção */
.pagina-inicial .secao-banners .lista-categorias,
.pagina-inicial .secao-banners .menu-lateral,
.pagina-inicial .secao-banners [class*="categ"],
.pagina-inicial #corpo .lista-categorias,
.pagina-inicial #corpo [class*="categ"][class*="lista"] {
  display: none !important;
}/* —————————————————————————————————————————————
   HOME: esconder a caixinha de categorias duplicada
   (não afeta o menu superior do cabeçalho)
   ————————————————————————————————————————————— */

/* Esconde listas de categorias quando estiverem dentro do #corpo (conteúdo) */
.pagina-inicial #corpo .lista-categorias,
.pagina-inicial #corpo .menu-lateral,
.pagina-inicial #corpo .box-categorias,
.pagina-inicial #corpo .categorias,
.pagina-inicial #corpo .menu-categorias,
.pagina-inicial #corpo [class*="lista-"][class*="categ"] {
  display: none !important;
}

/* Esconde caso essa lista venha embutida na “secao-banners” abaixo do topo */
.pagina-inicial .secao-banners .lista-categorias,
.pagina-inicial .secao-banners .menu-lateral,
.pagina-inicial .secao-banners .box-categorias,
.pagina-inicial .secao-banners .categorias,
.pagina-inicial .secao-banners .menu-categorias {
  display: none !important;
}

/* (Opcional) remove linhas/esperas que ficavam junto dessa caixa */
.pagina-inicial #corpo > .separador,
.pagina-inicial #corpo > hr {
  display: none !important;
}/* Esconde a caixa de categorias duplicada na home */
.pagina-inicial .caixa.lista-categorias,
.pagina-inicial .menu-lateral,
.pagina-inicial #corpo .caixa-categorias,
.pagina-inicial #corpo .lista-categorias {
    display: none !important;
}/* Remove a caixa lateral de categorias duplicada */
#corpo > div > div.secao-principal.row-fluid > div.coluna.span3.esquerda {
  display: none !important;
}/* =============== HOME “ESTILO SITE” (apenas na página inicial) =============== */
body.pagina-inicial #corpo,
body.pagina-inicial .conteudo,
body.pagina-inicial .container,
body.pagina-inicial .conteiner {
  max-width: 1200px !important;   /* largura do miolo */
  margin: 0 auto !important;
  background: #fff !important;
}

/* 1) Esconde coluna/boxes laterais da home (menu, newsletter lateral, etc.) */
body.pagina-inicial .coluna.esquerda,
body.pagina-inicial .menu-lateral,
body.pagina-inicial .lista-categorias,
body.pagina-inicial .banners-laterais,
body.pagina-inicial .newsletter-lateral,
body.pagina-inicial .caixa-lateral {
  display: none !important;
}

/* 2) Banner principal full e arredondado opcional */
body.pagina-inicial .fullbanner,
body.pagina-inicial .banner-principal,
body.pagina-inicial .banner-principal img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 10px !important;
}

/* 3) Mini-banners viram 3 blocos grandes lado a lado */
body.pagina-inicial .lista-banners {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  margin: 24px 0 !important;
}
body.pagina-inicial .lista-banners li {
  flex: 1 1 calc(33.333% - 24px) !important; /* 3 colunas */
  margin: 0 !important;
}
body.pagina-inicial .lista-banners li img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 10px !important;
}

/* 4) Produtos maiores e menos “loja”, 3 por linha (2/1 no responsivo) */
body.pagina-inicial .vitrine { gap: 24px !important; }
body.pagina-inicial .vitrine li {
  width: calc(33.333% - 16px) !important;   /* 3 por linha no desktop */
  margin: 0 !important;
}
@media (max-width: 1024px) {
  body.pagina-inicial .lista-banners li,
  body.pagina-inicial .vitrine li { width: calc(50% - 12px) !important; } /* 2 colunas */
}
@media (max-width: 600px) {
  body.pagina-inicial .lista-banners li,
  body.pagina-inicial .vitrine li { width: 100% !important; } /* 1 coluna */
}

/* Card mais limpo */
.vitrine li .imagem-produto img {
  width: 100% !important;
  height: auto !important;
  border-radius: 10px !important;
}
.vitrine li .nome-produto,
.vitrine li .produto-nome {
  font-size: 15.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin: 10px 0 4px !important;
  text-align: center !important;
}
.vitrine li .preco,
.vitrine li .preco-parcela,
.vitrine li .preco-promocional {
  font-weight: 600 !important;
  text-align: center !important;
}
.vitrine li .acoes-produto,
.vitrine li .botoes {
  display: flex !important;
  justify-content: center !important;
  margin-top: 8px !important;
}
.vitrine li .botao,
.vitrine li .botao-comprar {
  border-radius: 999px !important;
  padding: 8px 16px !important;
}

/* Opcional: tirar bordas/sombras das caixas de seção na home */
body.pagina-inicial .caixa,
body.pagina-inicial .caixa-destaque {
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}/* Exemplo: esconde a segunda prateleira de produtos da home */
body.pagina-inicial .caixa .vitrine:nth-of-type(n+2) { display: none !important; }
/* Centralizar títulos, preços e parcelamentos nos cards de produto */
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.vitrine li .parcelamento,
.vitrine li .economia,
.lista-produtos .produto .nome,
.lista-produtos .produto .preco,
.lista-produtos .produto .parcelamento {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}

/* Ajuste extra para botão */
.vitrine li .acoes-produto,
.lista-produtos .produto .acoes-produto {
  display: flex !important;
  justify-content: center !important;
}/* ============================
   PRODUTOS – ESTILO CANASTRA NATIVA
   ============================ */

/* Nome do produto */
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.lista-produtos .produto .nome {
  text-align: center !important;
  font-size: 15.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin: 10px 0 6px !important;
  color: #222 !important; /* cor mais neutra */
}

/* Preço principal */
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.lista-produtos .produto .preco {
  text-align: center !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 6px 0 !important;
  color: #2e4d2c !important; /* verde já usado no menu */
}

/* Parcelamento / economia */
.vitrine li .parcelamento,
.vitrine li .economia,
.lista-produtos .produto .parcelamento {
  text-align: center !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  margin: 2px 0 6px !important;
  color: #555 !important;
}

/* Botão centralizado e mais clean */
.vitrine li .acoes-produto,
.lista-produtos .produto .acoes-produto {
  display: flex !important;
  justify-content: center !important;
  margin-top: 8px !important;
}
.vitrine li .botao,
.vitrine li .botao-comprar {
  border-radius: 999px !important;
  padding: 8px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}/* ============================
   AJUSTES RESPONSIVOS PRODUTOS
   ============================ */

/* Tablet (até 1024px) */
@media (max-width: 1024px) {
  .vitrine li .nome-produto,
  .vitrine li .produto-nome,
  .lista-produtos .produto .nome {
    font-size: 14.5px !important;
  }

  .vitrine li .preco,
  .lista-produtos .produto .preco {
    font-size: 15px !important;
  }

  .vitrine li .parcelamento,
  .lista-produtos .produto .parcelamento {
    font-size: 12.5px !important;
  }
}

/* Mobile (até 640px) */
@media (max-width: 640px) {
  .vitrine li .nome-produto,
  .vitrine li .produto-nome,
  .lista-produtos .produto .nome {
    font-size: 13.5px !important;
    line-height: 1.2 !important;
  }

  .vitrine li .preco,
  .lista-produtos .produto .preco {
    font-size: 14px !important;
  }

  .vitrine li .parcelamento,
  .lista-produtos .produto .parcelamento {
    font-size: 12px !important;
  }

  /* Botão mais compacto no mobile */
  .vitrine li .botao,
  .vitrine li .botao-comprar {
    padding: 6px 14px !important;
    font-size: 13px !important;
  }
}
/* ================================
   CENTRALIZAR LEGENDAS DOS PRODUTOS
   ================================ */

.vitrine li,
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.vitrine li .preco-a-partir,
.vitrine li .valor,
.vitrine li .parcelamento,
.vitrine li .economia {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}

/* Garante que o botão também fique centralizado */
.vitrine li .acoes-produto,
.vitrine li .botoes {
  display: flex !important;
  justify-content: center !important;
}
/* =========================================================
   CENTRO TOTAL DAS LEGENDAS DOS PRODUTOS (desktop + mobile)
   - centraliza nome, preço, parcelamento e botões
   - sem quebrar seu grid existente
   ========================================================= */

/* 1) O card do produto vira uma coluna e alinha tudo ao centro */
.vitrine li,
.lista-produtos li,
.showcase li,
.produtos li {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;   /* alinha horizontalmente */
}

/* 2) Garante que todos os textos fiquem centralizados */
.vitrine li *,
.lista-produtos li *,
.showcase li *,
.produtos li * {
  text-align: center !important;
}

/* 3) Força largura total nos blocos de texto (evita alinhamento herdado) */
.vitrine li .nome,
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.vitrine li .preco-a-partir,
.vitrine li .valor,
.vitrine li .parcelamento,
.vitrine li .economia,
.lista-produtos li .nome,
.lista-produtos li .preco,
.lista-produtos li .valor,
.lista-produtos li .parcelamento,
.showcase li .nome,
.showcase li .preco,
.showcase li .valor,
.showcase li .parcelamento {
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 4) Botões sempre centralizados */
.vitrine li .acoes-produto,
.vitrine li .botoes,
.lista-produtos li .acoes-produto,
.lista-produtos li .botoes,
.showcase li .acoes-produto,
.showcase li .botoes {
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important; /* opcional: espaço entre botões */
}

/* 5) Imagem permanece em bloco e ocupa a largura do card */
.vitrine li .imagem-produto img,
.lista-produtos li .imagem-produto img,
.showcase li .imagem-produto img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}/* =========================================================
   REMOVER PRETO & BRANCO DOS PRODUTOS INDISPONÍVEIS
   (não altera cores/menus/layout da loja)
   ========================================================= */

/* 1) Remove filtros/baixa opacidade aplicados no card */
.vitrine li.indisponivel,
.produto-indisponivel,
[class*="indispon"] {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}

/* 2) Garante que a imagem fique sempre colorida */
.vitrine li.indisponivel img,
.vitrine li.indisponivel .imagem-produto,
.vitrine li.indisponivel .imagem-produto img,
.produto-indisponivel img,
.produto-indisponivel .imagem-produto,
.produto-indisponivel .imagem-produto img,
[class*="indispon"] img,
[class*="indispon"] .imagem-produto,
[class*="indispon"] .imagem-produto img {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}

/* 3) Caso o tema coloque um “véu” com pseudo-elemento */
.vitrine li.indisponivel::before,
.vitrine li.indisponivel::after,
.produto-indisponivel::before,
.produto-indisponivel::after,
[class*="indispon"]::before,
[class*="indispon"]::after {
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

/* 4) Mantém o selo/flag legível (sem escurecer) */
.flag-indisponivel {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}/* =============================================
   AJUSTES DE LAYOUT (menu + fundo)
   ============================================= */

/* Fundo branco no menu */
.menu, 
.menu .nivel-um, 
.menu .nivel-um > li {
    background-color: #ffffff !important;
}

/* Centralizar menu de categorias */
.menu {
    text-align: center !important;
}
.menu ul {
    display: inline-block !important;
    float: none !important;
}

/* Texto das categorias em verde */
.menu .nivel-um > li > a {
    color: #2e4d2c !important;  /* verde */
    font-weight: 600;
}

/* Hover - verde mais escuro */
.menu .nivel-um > li > a:hover {
    color: #000000 !important;  
    background-color: #f7f7f7 !important;
}/* =============================================
   FORÇAR FUNDO BRANCO GERAL
   ============================================= */

/* Fundo do body */
body {
    background-color: #ffffff !important;
}

/* Fundo do container principal */
#header, 
#barraTopo, 
#cabecalho, 
.menu, 
.menu .nivel-um, 
.menu .nivel-um > li, 
#content, 
#rodape, 
.caixa, 
.bloco, 
.conteiner {
    background-color: #ffffff !important;
}

/* Bordas que aparecem cinzas (remover) */
.caixa, 
.bloco, 
.menu .nivel-um > li {
    border: none !important;
    box-shadow: none !important;
}/* ================================
   LAYOUT “CANASTRA NATIVA STYLE”
   (não altera indisponíveis)
   ================================ */

/* 1) Remover barra lateral na home e ampliar o conteúdo */
.pagina-inicial .sidebar,
.pagina-inicial .menu-lateral,
.pagina-inicial .newsletter,
.pagina-inicial .lista-categorias,
.pagina-inicial .banners-laterais {
  display: none !important;
}

/* Container centralizado e branco */
#corpo, 
.pagina-inicial #corpo,
.pagina-inicial .conteudo {
  width: 100% !important;
  max-width: 1200px !important; /* largura similar à referência */
  margin: 0 auto !important;
  background: #fff !important;
}

/* Remover bordas/sombras de caixas da home */
.pagina-inicial .caixa,
.pagina-inicial .caixa-destaque {
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 2) Menu horizontal com fundo branco (mantém o que você já tem) */
.menu, .menu .nivel-um, .menu .nivel-um > li {
  background: #fff !important;
}

/* 3) Mini-banners em 3 colunas grandes (abaixo do full banner) */
.pagina-inicial .lista-banners {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
}
.pagina-inicial .lista-banners li {
  flex: 1 1 calc(33.333% - 20px) !important;
  margin: 0 !important;
}
.pagina-inicial .lista-banners img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 8px !important; /* opcional */
}

/* 4) Produtos: 4 por linha (dinâmico) */
.vitrine li {
  width: 25% !important;
}
@media (max-width: 1024px) { .vitrine li { width: 33.333% !important; } }
@media (max-width: 768px)  { .vitrine li { width: 50% !important; } }
@media (max-width: 480px)  { .vitrine li { width: 100% !important; } }

/* 5) Garantir fundo branco sob as seções */
body, .pagina-inicial, .conteudo {
  background: #fff !important;
}/* ================================
   REMOVER BLOCO DE CATEGORIAS DUPLICADO
   ================================ */
.pagina-inicial .lista-categorias,
.pagina-inicial .caixa .menu-departamento {
  display: none !important;
}/* Remover o bloco de categorias vertical que aparece na HOME */
.pagina-inicial #corpo .menu-departamento,
.pagina-inicial #corpo .lista-categorias,
.pagina-inicial #corpo .menu-categorias,
.pagina-inicial #corpo .categorias,
.pagina-inicial #corpo .menu-lateral {
  display: none !important;
}/* ================================
   AJUSTES MOBILE (ESTILO CANASTRA NATIVA)
   ================================ */

/* Vitrine de produtos: 2 por linha com espaçamento */
@media (max-width: 768px) {
  .vitrine { 
    padding: 0 10px !important; 
  }
  .vitrine li { 
    width: 50% !important; 
    padding: 6px !important; 
  }

  /* Espaçamentos gerais de banners */
  .banner, 
  .fullbanner, 
  .banner-principal { 
    margin: 8px 0 12px !important; 
  }

  /* Títulos alinhados */
  .caixa-titulo, 
  .titulo, 
  h1, h2 { 
    padding: 0 14px !important; 
  }
}

/* Extra: celulares muito estreitos (até 400px) — força 1 produto por linha */
@media (max-width: 400px) {
  .vitrine li { 
    width: 100% !important; 
  }
}/* Remover a lista vertical de categorias da HOME (sem afetar o menu do topo) */
.pagina-inicial .box-categorias,
.pagina-inicial .caixa-categorias,
.pagina-inicial .lista-categorias,
.pagina-inicial .list-categories,
.pagina-inicial .menu-categorias,
.pagina-inicial .menu-vertical,
.pagina-inicial .menu-lateral,
.pagina-inicial .departamentos,
.pagina-inicial .menu-departamentos,
.pagina-inicial .widget-categorias,
.pagina-inicial .categorias,
.pagina-inicial .filtro-categorias {
  display: none !important;
}

/* Se houver uma linha/HR que separa esse bloco, esconda também */
.pagina-inicial .conteudo hr,
.pagina-inicial hr {
  display: none !important;
}/* Remove a caixinha de categorias que aparece abaixo do banner */
.pagina-inicial .secao-banners {
    display: none !important;
}/* Remover a caixinha de categorias que aparece abaixo do banner na HOME */
.pagina-inicial #corpo > .secao-banners,
.pagina-inicial .container-principal > .secao-banners,
.pagina-inicial .conteudo > .secao-banners {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* Caso a caixinha seja um bloco de categorias dentro dessa seção */
.pagina-inicial .secao-banners .lista-categorias,
.pagina-inicial .secao-banners .menu-lateral,
.pagina-inicial .secao-banners [class*="categ"],
.pagina-inicial #corpo .lista-categorias,
.pagina-inicial #corpo [class*="categ"][class*="lista"] {
  display: none !important;
}/* —————————————————————————————————————————————
   HOME: esconder a caixinha de categorias duplicada
   (não afeta o menu superior do cabeçalho)
   ————————————————————————————————————————————— */

/* Esconde listas de categorias quando estiverem dentro do #corpo (conteúdo) */
.pagina-inicial #corpo .lista-categorias,
.pagina-inicial #corpo .menu-lateral,
.pagina-inicial #corpo .box-categorias,
.pagina-inicial #corpo .categorias,
.pagina-inicial #corpo .menu-categorias,
.pagina-inicial #corpo [class*="lista-"][class*="categ"] {
  display: none !important;
}

/* Esconde caso essa lista venha embutida na “secao-banners” abaixo do topo */
.pagina-inicial .secao-banners .lista-categorias,
.pagina-inicial .secao-banners .menu-lateral,
.pagina-inicial .secao-banners .box-categorias,
.pagina-inicial .secao-banners .categorias,
.pagina-inicial .secao-banners .menu-categorias {
  display: none !important;
}

/* (Opcional) remove linhas/esperas que ficavam junto dessa caixa */
.pagina-inicial #corpo > .separador,
.pagina-inicial #corpo > hr {
  display: none !important;
}/* Esconde a caixa de categorias duplicada na home */
.pagina-inicial .caixa.lista-categorias,
.pagina-inicial .menu-lateral,
.pagina-inicial #corpo .caixa-categorias,
.pagina-inicial #corpo .lista-categorias {
    display: none !important;
}/* Remove a caixa lateral de categorias duplicada */
#corpo > div > div.secao-principal.row-fluid > div.coluna.span3.esquerda {
  display: none !important;
}/* =============== HOME “ESTILO SITE” (apenas na página inicial) =============== */
body.pagina-inicial #corpo,
body.pagina-inicial .conteudo,
body.pagina-inicial .container,
body.pagina-inicial .conteiner {
  max-width: 1200px !important;   /* largura do miolo */
  margin: 0 auto !important;
  background: #fff !important;
}

/* 1) Esconde coluna/boxes laterais da home (menu, newsletter lateral, etc.) */
body.pagina-inicial .coluna.esquerda,
body.pagina-inicial .menu-lateral,
body.pagina-inicial .lista-categorias,
body.pagina-inicial .banners-laterais,
body.pagina-inicial .newsletter-lateral,
body.pagina-inicial .caixa-lateral {
  display: none !important;
}

/* 2) Banner principal full e arredondado opcional */
body.pagina-inicial .fullbanner,
body.pagina-inicial .banner-principal,
body.pagina-inicial .banner-principal img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 10px !important;
}

/* 3) Mini-banners viram 3 blocos grandes lado a lado */
body.pagina-inicial .lista-banners {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  margin: 24px 0 !important;
}
body.pagina-inicial .lista-banners li {
  flex: 1 1 calc(33.333% - 24px) !important; /* 3 colunas */
  margin: 0 !important;
}
body.pagina-inicial .lista-banners li img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 10px !important;
}

/* 4) Produtos maiores e menos “loja”, 3 por linha (2/1 no responsivo) */
body.pagina-inicial .vitrine { gap: 24px !important; }
body.pagina-inicial .vitrine li {
  width: calc(33.333% - 16px) !important;   /* 3 por linha no desktop */
  margin: 0 !important;
}
@media (max-width: 1024px) {
  body.pagina-inicial .lista-banners li,
  body.pagina-inicial .vitrine li { width: calc(50% - 12px) !important; } /* 2 colunas */
}
@media (max-width: 600px) {
  body.pagina-inicial .lista-banners li,
  body.pagina-inicial .vitrine li { width: 100% !important; } /* 1 coluna */
}

/* Card mais limpo */
.vitrine li .imagem-produto img {
  width: 100% !important;
  height: auto !important;
  border-radius: 10px !important;
}
.vitrine li .nome-produto,
.vitrine li .produto-nome {
  font-size: 15.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin: 10px 0 4px !important;
  text-align: center !important;
}
.vitrine li .preco,
.vitrine li .preco-parcela,
.vitrine li .preco-promocional {
  font-weight: 600 !important;
  text-align: center !important;
}
.vitrine li .acoes-produto,
.vitrine li .botoes {
  display: flex !important;
  justify-content: center !important;
  margin-top: 8px !important;
}
.vitrine li .botao,
.vitrine li .botao-comprar {
  border-radius: 999px !important;
  padding: 8px 16px !important;
}

/* Opcional: tirar bordas/sombras das caixas de seção na home */
body.pagina-inicial .caixa,
body.pagina-inicial .caixa-destaque {
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}/* Exemplo: esconde a segunda prateleira de produtos da home */
body.pagina-inicial .caixa .vitrine:nth-of-type(n+2) { display: none !important; }
/* Centralizar títulos, preços e parcelamentos nos cards de produto */
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.vitrine li .parcelamento,
.vitrine li .economia,
.lista-produtos .produto .nome,
.lista-produtos .produto .preco,
.lista-produtos .produto .parcelamento {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}

/* Ajuste extra para botão */
.vitrine li .acoes-produto,
.lista-produtos .produto .acoes-produto {
  display: flex !important;
  justify-content: center !important;
}/* ============================
   PRODUTOS – ESTILO CANASTRA NATIVA
   ============================ */

/* Nome do produto */
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.lista-produtos .produto .nome {
  text-align: center !important;
  font-size: 15.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin: 10px 0 6px !important;
  color: #222 !important; /* cor mais neutra */
}

/* Preço principal */
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.lista-produtos .produto .preco {
  text-align: center !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 6px 0 !important;
  color: #2e4d2c !important; /* verde já usado no menu */
}

/* Parcelamento / economia */
.vitrine li .parcelamento,
.vitrine li .economia,
.lista-produtos .produto .parcelamento {
  text-align: center !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  margin: 2px 0 6px !important;
  color: #555 !important;
}

/* Botão centralizado e mais clean */
.vitrine li .acoes-produto,
.lista-produtos .produto .acoes-produto {
  display: flex !important;
  justify-content: center !important;
  margin-top: 8px !important;
}
.vitrine li .botao,
.vitrine li .botao-comprar {
  border-radius: 999px !important;
  padding: 8px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}/* ============================
   AJUSTES RESPONSIVOS PRODUTOS
   ============================ */

/* Tablet (até 1024px) */
@media (max-width: 1024px) {
  .vitrine li .nome-produto,
  .vitrine li .produto-nome,
  .lista-produtos .produto .nome {
    font-size: 14.5px !important;
  }

  .vitrine li .preco,
  .lista-produtos .produto .preco {
    font-size: 15px !important;
  }

  .vitrine li .parcelamento,
  .lista-produtos .produto .parcelamento {
    font-size: 12.5px !important;
  }
}

/* Mobile (até 640px) */
@media (max-width: 640px) {
  .vitrine li .nome-produto,
  .vitrine li .produto-nome,
  .lista-produtos .produto .nome {
    font-size: 13.5px !important;
    line-height: 1.2 !important;
  }

  .vitrine li .preco,
  .lista-produtos .produto .preco {
    font-size: 14px !important;
  }

  .vitrine li .parcelamento,
  .lista-produtos .produto .parcelamento {
    font-size: 12px !important;
  }

  /* Botão mais compacto no mobile */
  .vitrine li .botao,
  .vitrine li .botao-comprar {
    padding: 6px 14px !important;
    font-size: 13px !important;
  }
}
/* ================================
   CENTRALIZAR LEGENDAS DOS PRODUTOS
   ================================ */

.vitrine li,
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.vitrine li .preco-a-partir,
.vitrine li .valor,
.vitrine li .parcelamento,
.vitrine li .economia {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}

/* Garante que o botão também fique centralizado */
.vitrine li .acoes-produto,
.vitrine li .botoes {
  display: flex !important;
  justify-content: center !important;
}
/* =========================================================
   CENTRO TOTAL DAS LEGENDAS DOS PRODUTOS (desktop + mobile)
   - centraliza nome, preço, parcelamento e botões
   - sem quebrar seu grid existente
   ========================================================= */

/* 1) O card do produto vira uma coluna e alinha tudo ao centro */
.vitrine li,
.lista-produtos li,
.showcase li,
.produtos li {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;   /* alinha horizontalmente */
}

/* 2) Garante que todos os textos fiquem centralizados */
.vitrine li *,
.lista-produtos li *,
.showcase li *,
.produtos li * {
  text-align: center !important;
}

/* 3) Força largura total nos blocos de texto (evita alinhamento herdado) */
.vitrine li .nome,
.vitrine li .nome-produto,
.vitrine li .produto-nome,
.vitrine li .preco,
.vitrine li .preco-promocional,
.vitrine li .preco-vista,
.vitrine li .preco-a-partir,
.vitrine li .valor,
.vitrine li .parcelamento,
.vitrine li .economia,
.lista-produtos li .nome,
.lista-produtos li .preco,
.lista-produtos li .valor,
.lista-produtos li .parcelamento,
.showcase li .nome,
.showcase li .preco,
.showcase li .valor,
.showcase li .parcelamento {
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 4) Botões sempre centralizados */
.vitrine li .acoes-produto,
.vitrine li .botoes,
.lista-produtos li .acoes-produto,
.lista-produtos li .botoes,
.showcase li .acoes-produto,
.showcase li .botoes {
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important; /* opcional: espaço entre botões */
}

/* 5) Imagem permanece em bloco e ocupa a largura do card */
.vitrine li .imagem-produto img,
.lista-produtos li .imagem-produto img,
.showcase li .imagem-produto img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}/* ===== Reexibir o container de banners na HOME (desktop + mobile) ===== */
.pagina-inicial .secao-banners,
.pagina-inicial #corpo > .secao-banners,
.pagina-inicial .container-principal > .secao-banners,
.pagina-inicial .conteudo > .secao-banners {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  overflow: visible !important;
  margin: 0 0 24px !important; /* espaço antes dos produtos */
  padding: 0 !important;
}

/* Manter escondida apenas a “caixinha de categorias” dentro desse bloco  */
.pagina-inicial .secao-banners .lista-categorias,
.pagina-inicial .secao-banners .menu-lateral,
.pagina-inicial .secao-banners .box-categorias,
.pagina-inicial .secao-banners .categorias,
.pagina-inicial .secao-banners .menu-categorias {
  display: none !important;
}

/* Banner full responsivo e visível */
.pagina-inicial .fullbanner,
.pagina-inicial .banner-principal,
.pagina-inicial .fullbanner .box-banner,
.pagina-inicial .banner-principal .box-banner {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.pagina-inicial .fullbanner img,
.pagina-inicial .banner-principal img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 10px !important; /* opcional */
}/* ==========================
   MINI-BANNERS – MOBILE ONLY
   (não altera o desktop)
   ========================== */
@media (max-width: 640px) {

  /* 1) garante que a seção apareça no mobile (alguns temas escondem com .hidden-phone) */
  .pagina-inicial .mini-banner,
  .pagina-inicial .mini-banner.hidden-phone,
  .pagina-inicial .secao-banners,
  .pagina-inicial .lista-banners,
  .pagina-inicial .banner-vitrine {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* 2) o UL vira lista flex, com respiro */
  .pagina-inicial .mini-banner ul,
  .pagina-inicial .lista-banners,
  .pagina-inicial .banner-vitrine ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px;
    margin: 12px 16px 8px;
    padding: 0;
    list-style: none;
  }

  /* 3) cada mini-banner ocupa 100% (1 por linha no mobile) */
  .pagina-inicial .mini-banner li,
  .pagina-inicial .lista-banners li,
  .pagina-inicial .banner-vitrine li {
    float: none !important;         /* cancela floats do tema */
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 100%;
    width: 100%;
  }

  /* 4) link/”card” com cantos arredondados */
  .pagina-inicial .mini-banner li a,
  .pagina-inicial .lista-banners li a,
  .pagina-inicial .banner-vitrine li a {
    position: relative;
    display: block;
    border-radius: 12px;
    overflow: hidden;
  }

  /* 5) mantém a imagem QUADRADA (1:1) sem depender de aspect-ratio */
  .pagina-inicial .mini-banner li a::before,
  .pagina-inicial .lista-banners li a::before,
  .pagina-inicial .banner-vitrine li a::before {
    content: "";
    display: block;
    padding-top: 100%;   /* 1:1 */
  }

  .pagina-inicial .mini-banner li a img,
  .pagina-inicial .lista-banners li a img,
  .pagina-inicial .banner-vitrine li a img {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
  }
}/* Remover tarja "PRODUTO ADICIONADO" (desktop + mobile) */
.vitrine [class*="adicionad"],
.lista-produtos [class*="adicionad"],
.produto [class*="adicionad"],
.flag-adicionado,
.produto-adicionado,
.etiqueta-adicionado,
.selo-adicionado,
.tag-adicionado,
.ribbon-adicionado {
  display: none !important;
}

/* Se o tema tiver um contêiner de flags, some com o espaço vazio */
.vitrine .flags:empty,
.lista-produtos .flags:empty {
  display: none !important;
}/* Remove a coluna de Social no rodapé */
#rodape > div.institucional.fundo-secundario > div > div > div.span3 {
  display: none !important;
}