/* Ferro Velho Formigão — visual sobre o Tema Galeria (Loja Integrada)
   Colar em: Personalize sua loja > Editar CSS. Cores, cantos e tamanhos: altere só as variáveis em :root.
   O editor do painel acusa "erro de sintaxe" nas variáveis e no :where() — é o validador antigo; clique em Continuar. */
@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;700&display=swap');

/* ===== 1. VARIÁVEIS ===== */
:root {
  --ff-vermelho: #990D07;
  --ff-vermelho-hover: #7C0A05;
  --ff-asfalto: #2A2A2A;
  --ff-texto: #2A2A2A;
  --ff-suave: #6B6B6B;
  --ff-fundo: #F3F3F3;
  --ff-branco: #FFFFFF;
  --ff-linha: #E2E2E2;
  --ff-fonte: 'Onest', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;

  /* escala de texto */
  --ff-t-xs: 12px;
  --ff-t-sm: 13px;
  --ff-t-base: 14px;
  --ff-t-md: 16px;
  --ff-t-lg: 20px;
  --ff-t-xl: 26px;

  --ff-raio: 10px;
  --ff-raio-card: 14px;

  /* variáveis próprias do Tema Galeria (manual do tema, "Personalização das cores") */
  --cor-tituloContato: #2A2A2A;
  --cor-textoContato: #2A2A2A;
  --cor-menu: #2A2A2A;
  --cor-tituloVitrine: #2A2A2A;
  --cor-barraSuperior: #2A2A2A;
  --cor-textoBarraSuperior: #FFFFFF;
  --cor-botaoRastreio: #990D07;
  --cor-botaoRastreioHover: #7C0A05;
  --cor-textoBotaoRastreio: #FFFFFF;
  --cor-textoBotaoRastreioHover: #FFFFFF;
  --cor-textoRastreioTitulo: #2A2A2A;
  --cor-nomeDepoimento: #2A2A2A;
  --cor-localDepoimento: #6B6B6B;
  --cor-textoDepoimento: #6B6B6B;
  --cor-tituloRodape: #FFFFFF;
  --cor-textoRodape: #BDBDBD;
  --cor-textoRodapeHover: #FFFFFF;
  --cor-nomeProduto: #2A2A2A;
  --cor-textoFrete: #6B6B6B;
}

/* ===== 2. BASE ===== */
html body {
  background: var(--ff-fundo) !important;
  color: var(--ff-texto);
  font-size: var(--ff-t-base);
  -webkit-font-smoothing: antialiased;
}
html body,
html body :where(*:not(i):not([class^="icon-"]):not([class*=" icon-"]):not(.fa):not(.fas):not(.far):not(.fab)) {
  font-family: var(--ff-fonte);
}
html body .titulo { font-family: var(--ff-fonte) !important; }
html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible { outline: 2px solid var(--ff-vermelho); outline-offset: 2px; }
::selection { background: var(--ff-vermelho); color: #fff; }

/* Categorias vêm cadastradas em MAIÚSCULAS: mostra como frase ("Ar-condicionado e arrefecimento") */
html body .menu.superior .nivel-um > li > a strong,
html body .menu.lateral .nivel-um > li > a strong,
html body h1.titulo:not(.nome-produto),
html body .breadcrumbs a,
html body .breadcrumbs strong,
html body #rodape .institucional ul li a {
  text-transform: lowercase !important;
}
html body .menu.superior .nivel-um > li > a strong::first-letter,
html body .menu.lateral .nivel-um > li > a strong::first-letter,
html body h1.titulo:not(.nome-produto)::first-letter,
html body .breadcrumbs a::first-letter,
html body .breadcrumbs strong::first-letter,
html body #rodape .institucional ul li a::first-letter {
  text-transform: uppercase;
}
html body .breadcrumbs a,
html body .breadcrumbs strong,
html body #rodape .institucional ul li a { display: inline-block; }

/* ===== 3. CABEÇALHO ===== */
html body #cabecalho {
  background: var(--ff-branco) !important;
  border: 0 !important;
  box-shadow: 0 1px 0 var(--ff-linha);
}
html body #cabecalho > .conteiner > .row-fluid { padding: 10px 0; }
html body #cabecalho .logo img { max-height: 92px; width: auto; }
html body #cabecalho .conteudo-topo .inferior i {
  color: var(--ff-texto) !important;
  font-size: 20px !important;
  transition: color .15s ease;
}
html body #cabecalho .conteudo-topo .inferior i,
html body #cabecalho .conteudo-topo .inferior *:hover > i,
html body #cabecalho .conteudo-topo .inferior *:hover i {
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
html body #cabecalho .conteudo-topo .inferior .span4 > div:hover > div > i,
html body #cabecalho .conteudo-topo .inferior .span4 > div:hover > i,
html body #cabecalho .conteudo-topo .inferior a:hover i { color: var(--ff-vermelho) !important; }

/* Caixinhas que abrem nos ícones (Fale conosco, rastreio) */
html body #cabecalho .conteudo-topo [class*="-content"] {
  width: 260px !important;
  min-width: 0 !important;
  padding: 8px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: var(--ff-raio-card) !important;
  background: var(--ff-branco) !important;
  box-shadow: 0 16px 40px rgba(42, 42, 42, .14) !important;
  text-align: left !important;
  box-sizing: border-box;
}
html body #cabecalho .conteudo-topo [class*="-content"] .titulo {
  display: block;
  margin: 0 !important;
  padding: 8px 10px 6px !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
html body #cabecalho .conteudo-topo [class*="-content"] ul { margin: 0 !important; padding: 0 !important; }
html body #cabecalho .conteudo-topo [class*="-content"] li { margin: 0 !important; padding: 0 !important; list-style: none; text-align: left !important; }
/* cada contato: ícone num círculo + rótulo pequeno + número */
html body #cabecalho .conteudo-topo .inferior .contato-content li > a {
  position: relative;
  display: block !important;
  padding: 9px 10px 9px 56px !important;
  border-radius: 10px;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
  transition: background-color .15s ease;
}
html body #cabecalho .conteudo-topo .inferior .contato-content li > a:hover { background: var(--ff-fundo); }
html body #cabecalho .conteudo-topo .inferior .contato-content li > a > span {
  display: block;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-xs) !important;
  font-weight: 400 !important;
}
html body #cabecalho .conteudo-topo .inferior .contato-content li > a br { display: none; }
html body #cabecalho .conteudo-topo .inferior .contato-content li > a i,
html body #cabecalho .conteudo-topo .inferior .contato-content li > a:hover i {
  position: absolute;
  left: 10px;
  top: 50%;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 34px !important;
  height: 34px;
  margin: -17px 0 0 !important;
  border-radius: 999px !important;
  background: #F6E7E6 !important;
  color: var(--ff-vermelho) !important;
  font-size: 14px !important;
}
/* rastreio */
html body #cabecalho .rastreio-content { padding: 14px !important; }
html body #cabecalho .rastreio-content p { margin: 0 0 8px !important; color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; font-weight: 500 !important; }
html body #cabecalho .rastreio-content input {
  width: 100% !important;
  height: 40px !important;
  margin: 0 0 8px !important;
  padding: 0 14px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: var(--ff-raio) !important;
  box-shadow: none !important;
  box-sizing: border-box;
  color: var(--ff-texto) !important;
}
html body #cabecalho .rastreio-content button {
  width: 100%;
  height: 40px;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 600 !important;
  text-transform: lowercase !important;
}
html body #cabecalho .rastreio-content button::first-letter { text-transform: uppercase; }

html body #cabecalho .busca {
  padding: 0 !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 999px !important;
  background: var(--ff-fundo) !important;
  overflow: hidden;
  transition: border-color .15s ease, background-color .15s ease;
}
html body #cabecalho .busca:focus-within { background: var(--ff-branco) !important; border-color: var(--ff-suave) !important; }
html body #cabecalho .busca form { display: flex; margin: 0; }
html body #cabecalho .busca input#auto-complete {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
}
html body #cabecalho .busca input#auto-complete::placeholder { color: var(--ff-suave); }
html body #cabecalho .busca .botao-busca {
  position: static !important;
  flex: 0 0 36px;
  width: 36px !important;
  height: 36px !important;
  margin: 4px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: 14px !important;
  line-height: 36px !important;
}
html body #cabecalho .busca .botao-busca:hover { background: var(--ff-vermelho-hover) !important; }

/* ===== 4. MENU DE CATEGORIAS (desktop): faixa cinza, itens separados por traços finos ===== */
@media (min-width: 768px) {
  html body #cabecalho .menu.superior {
    background: #F4F4F4 !important;
    box-shadow: none !important;
    border: 0 !important;
    border-top: 1px solid var(--ff-linha) !important;
    border-bottom: 1px solid var(--ff-linha) !important;
  }
  html body #cabecalho .menu.superior ul.nivel-um {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 2px;
    max-width: 1240px;
    padding: 6px 0;
  }
  html body .menu.superior .nivel-um > li {
    position: relative;
    padding: 0 3px !important;
    margin: 0 !important;
    background: none !important;
  }
  html body .menu.superior .nivel-um > li + li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 14px;
    margin-top: -7px;
    background: #D4D4D4;
  }
  html body .menu.superior .nivel-um > li > a {
    position: relative;
    display: block !important;
    height: auto !important;
    padding: 8px 12px !important;
    background: none !important;
  }
  html body .menu.superior .nivel-um > li > a strong {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    color: var(--ff-texto) !important;
    font-size: var(--ff-t-sm) !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
    transition: color .15s ease;
  }
  /* indicador: traço vermelho curto embaixo do texto */
  html body .menu.superior .nivel-um > li > a::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 3px;
    height: 2px;
    border-radius: 2px;
    background: var(--ff-vermelho);
    transform: scaleX(0);
    transition: transform .18s ease;
  }
  html body .menu.superior .nivel-um > li:hover > a::after,
  html body .menu.superior .nivel-um > li.ativo > a::after { transform: scaleX(1); }
  html body .menu.superior .nivel-um > li:hover > a strong,
  html body .menu.superior .nivel-um > li.ativo > a strong { color: var(--ff-vermelho) !important; }

  /* submenu (ex.: Áudio e multimídia > Rádio) */
  html body .menu.superior .nivel-dois {
    top: 100% !important;
    min-width: 220px !important;
    margin-top: 0 !important;
    padding: 6px !important;
    border: 1px solid var(--ff-linha) !important;
    border-radius: 10px !important;
    background: var(--ff-branco) !important;
    box-shadow: 0 12px 28px rgba(42, 42, 42, .12) !important;
    text-align: left !important;
  }
  html body .menu.superior .nivel-dois li { margin: 0 !important; padding: 0 !important; border: 0 !important; text-align: left !important; }
  html body .menu.superior .nivel-dois a {
    display: block !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    background: none !important;
    color: var(--ff-texto) !important;
    font-family: var(--ff-fonte) !important;
    font-size: var(--ff-t-sm) !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    text-transform: none !important;
  }
  html body .menu.superior .nivel-dois a:hover { background: var(--ff-fundo) !important; color: var(--ff-vermelho) !important; }
}

/* ===== 5. TÍTULOS E NAVEGAÇÃO ===== */
html body h1.titulo:not(.nome-produto) {
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-xl) !important;
  font-weight: 700 !important;
  letter-spacing: -.01em;
  line-height: 1.2 !important;
}
html body .titulo-categoria,
html body .listagem .titulo-categoria {
  margin: 32px 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: left !important;
}
html body .titulo-categoria::before,
html body .titulo-categoria::after { display: none !important; }
html body .titulo-categoria strong,
html body .titulo-categoria .titulo,
html body .listagem .titulo-categoria strong {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-lg) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
}
html body .breadcrumbs { border: 0 !important; background: none !important; }
html body .breadcrumbs a,
html body .breadcrumbs li,
html body .breadcrumbs strong { color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; font-weight: 400 !important; }
html body .breadcrumbs strong { color: var(--ff-texto) !important; }
html body .breadcrumbs a:hover { color: var(--ff-vermelho) !important; }
html body .breadcrumbs .fa-home,
html body .breadcrumbs .icon-home { display: none; }

/* Menu lateral (página de categoria): um cartão "Categorias" */
@media (min-width: 768px) {
  html body .coluna {
    background: var(--ff-branco);
    border: 1px solid var(--ff-linha);
    border-radius: var(--ff-raio-card);
    overflow: hidden;
    align-self: flex-start;
  }
  html body .coluna::before {
    content: "Categorias";
    display: block;
    padding: 16px 18px 12px;
    color: var(--ff-texto);
    font-size: var(--ff-t-md);
    font-weight: 700;
    border-bottom: 1px solid var(--ff-linha);
  }
}
html body .coluna .menu.lateral {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body .menu.lateral .nivel-um { margin: 0 !important; padding: 0 !important; }
html body .menu.lateral .nivel-um > li {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid #EFEFEF !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body .coluna .menu.lateral.outras .nivel-um > li:last-child { border-bottom: 0 !important; }
html body .menu.lateral .nivel-um > li > a {
  position: relative;
  display: block !important;
  margin: 0 !important;
  padding: 11px 34px 11px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  transition: background-color .15s ease;
}
html body .menu.lateral .nivel-um > li > a::after {
  content: "›";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-52%);
  color: #B5B5B5;
  font-size: 18px;
  line-height: 1;
}
html body .menu.lateral .nivel-um > li > a strong {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  transition: color .15s ease;
}
html body .menu.lateral .nivel-um > li > a strong::before,
html body .menu.lateral .nivel-um > li > a i { display: none !important; }
html body .menu.lateral .nivel-um > li > a:hover { background: #F7F7F7 !important; }
html body .menu.lateral .nivel-um > li > a:hover strong { color: var(--ff-vermelho) !important; }
/* categoria em que a pessoa está */
html body .coluna .menu.lateral:not(.outras) .nivel-um > li > a {
  background: #FBF1F0 !important;
  box-shadow: inset 3px 0 0 var(--ff-vermelho) !important;
}
html body .coluna .menu.lateral:not(.outras) .nivel-um > li > a::after { content: none; }
html body .coluna .menu.lateral:not(.outras) .nivel-um > li > a strong { color: var(--ff-vermelho) !important; font-weight: 600 !important; }
html body .menu.lateral .nivel-dois { border: 0 !important; background: none !important; margin: 0 !important; padding: 4px 0 8px !important; }
html body .menu.lateral .nivel-dois a {
  display: block;
  padding: 6px 18px 6px 30px !important;
  background: none !important;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
}
html body .menu.lateral .nivel-dois a:hover { color: var(--ff-vermelho) !important; }
/* a newsletter já aparece no rodapé; some com a repetida da coluna */
html body .coluna .componente.newsletter { display: none !important; }

html body .ordenar-listagem { border: 0 !important; background: none !important; }

/* Categoria sem produtos */
html body .caixa-destaque { padding: 48px 16px !important; background: none !important; border: 0 !important; }
html body .caixa-destaque h1 {
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-lg) !important;
  font-weight: 700 !important;
  letter-spacing: -.01em;
  text-transform: none !important;
}
html body .caixa-destaque p { color: var(--ff-suave) !important; font-size: var(--ff-t-base) !important; }
html body .caixa-destaque .botao {
  margin-top: 8px;
  padding: 10px 20px !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 500 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* ===== 6. CARD DE PRODUTO ===== */
html body .listagem .listagem-item {
  display: flex;
  flex-direction: column;
  margin: 8px !important;
  padding: 0 !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: var(--ff-raio-card) !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  overflow: hidden;
  transition: border-color .15s ease;
}
html body .listagem .listagem-item:hover { border-color: #C8C8C8 !important; }
html body .listagem .listagem-item .imagem-produto {
  height: 210px !important;
  padding: 14px !important;
  box-sizing: border-box;
  background: var(--ff-branco);
}
html body .listagem .listagem-item .imagem-produto img {
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain;
}
html body .listagem .listagem-item .info-produto {
  flex: 1 1 auto;
  padding: 12px 14px 0 !important;
  border-top: 1px solid var(--ff-linha) !important;
  box-sizing: border-box;
  text-align: left !important;
}
html body .listagem .listagem-item .nome-produto {
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  height: auto !important;
  min-height: 38px;
  margin: 0 0 10px !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 400 !important;
  line-height: 19px !important;
  text-align: left !important;
  text-transform: none !important;
}
html body .listagem .listagem-item .preco-produto { text-align: left !important; color: var(--ff-suave); }
html body .listagem .listagem-item .preco-produto > div > div,
html body .listagem .listagem-item .preco-produto > div { display: flex; flex-direction: column; align-items: flex-start; }
html body .listagem .listagem-item .preco-produto .preco-venda {
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-xs) !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}
html body .listagem .listagem-item .preco-produto strong.titulo,
html body .listagem .listagem-item .preco-produto .preco-promocional,
html body .listagem .listagem-item .preco-produto:not(.com-promocao) .preco-venda {
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-lg) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
}
html body .listagem .listagem-item .acoes-produto {
  position: static !important;
  margin: 0 !important;
  padding: 12px 14px 14px !important;
  opacity: 1 !important;
}
html body .listagem .listagem-item .acoes-produto .botao-comprar {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 9px 12px !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: 0;
  text-align: center;
  text-transform: none;
}
html body .listagem .listagem-item .acoes-produto .botao-comprar:hover { background: var(--ff-vermelho-hover) !important; }
html body .listagem .listagem-item .acoes-produto .botao-comprar i { display: none !important; }
html body .bandeiras-produto span {
  border-radius: 999px !important;
  padding: 3px 9px !important;
  font-size: var(--ff-t-xs) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
}
/* selo de desconto: pequeno, dentro da foto */
html body .listagem .bandeiras-produto {
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  margin: 0 !important;
}
html body .listagem .bandeiras-produto span {
  border-radius: 6px !important;
  padding: 3px 8px !important;
  font-size: var(--ff-t-xs) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}
html body .bandeiras-produto .bandeira-promocao::before {
  content: "−" !important;
  position: static !important;
  display: inline !important;
  margin: 0 1px 0 0 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  vertical-align: baseline !important;
  font-family: var(--ff-fonte) !important;
  font-weight: 700;
}
/* nome do produto: no máximo 2 linhas */
html body .listagem .listagem-item .nome-produto { max-height: 38px !important; min-height: 38px !important; overflow: hidden !important; }

/* topo da categoria: título à esquerda, ordenação à direita */
@media (min-width: 768px) {
  html body.pagina-categoria .conteudo.span9,
  html body.pagina-busca .conteudo.span9 {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    column-gap: 16px;
  }
  html body.pagina-categoria .conteudo.span9 > *,
  html body.pagina-busca .conteudo.span9 > * { width: 100%; }
  html body.pagina-categoria .conteudo.span9 > h1,
  html body.pagina-busca .conteudo.span9 > h1 { order: -1; width: auto; flex: 1 1 auto; margin: 0 !important; }
  html body.pagina-categoria .conteudo.span9 > .ordenar-listagem.topo,
  html body.pagina-busca .conteudo.span9 > .ordenar-listagem.topo { order: 0; width: auto; margin: 0 !important; }
}
html body .ordenar-listagem .row-fluid > [class*="span"] { width: auto !important; float: none !important; margin: 0 !important; }
html body .ordenar-listagem .input-append {
  display: inline-flex !important;
  align-items: center;
  height: 38px;
  border: 1px solid var(--ff-linha);
  border-radius: var(--ff-raio);
  background: var(--ff-branco);
}
html body .ordenar-listagem .input-append label {
  margin: 0 !important;
  padding: 0 4px 0 14px !important;
  border: 0 !important;
  background: none !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  line-height: 38px !important;
}
html body .ordenar-listagem .input-append .btn {
  height: 36px !important;
  padding: 0 12px !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: var(--ff-suave) !important;
}
html body .ordenar-listagem .dropdown-menu {
  padding: 6px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 28px rgba(42, 42, 42, .12) !important;
}
html body .ordenar-listagem .dropdown-menu a {
  padding: 8px 12px !important;
  border-radius: 6px;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
}
html body .ordenar-listagem .dropdown-menu a:hover { background: var(--ff-fundo) !important; color: var(--ff-vermelho) !important; }
html body .ordenar-listagem .dropdown-menu i { display: none !important; }
html body .ordenar-listagem.rodape { display: none !important; }
html body .listagem button.slick-arrow::before { color: var(--ff-texto) !important; font-size: 30px !important; }

/* ===== 7. PÁGINA DO PRODUTO ===== */
html body.pagina-produto h1.nome-produto,
html body h1.nome-produto {
  margin: 6px 0 4px !important;
  color: var(--ff-texto) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -.01em;
  text-transform: none !important;
}
html body .codigo-produto,
html body .codigo-produto * { color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; }
html body .principal .codigo-produto { border-bottom: 1px solid var(--ff-linha) !important; padding-bottom: 14px !important; margin-bottom: 16px !important; }
html body .principal .preco-produto > div { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
html body .principal .preco-produto .preco-venda {
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 400 !important;
}
html body .principal .preco-produto .preco-promocional,
html body .principal .preco-produto strong.titulo,
html body .principal .preco-produto:not(.com-promocao) .preco-venda {
  color: var(--ff-texto) !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
html body .principal .comprar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; }
html body .principal .comprar .qtde-adicionar-carrinho { margin: 0 !important; }
html body .principal .comprar .qtde-carrinho {
  height: 48px !important;
  width: 96px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 500 !important;
}
html body .principal .comprar .botao-comprar {
  flex: 1 1 240px;
  width: auto !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 700 !important;
  line-height: 48px !important;
  text-align: center;
  text-transform: none !important;
}
html body .principal .comprar .botao-comprar:hover { background: var(--ff-vermelho-hover) !important; }
html body .principal .disponibilidade-produto { flex-basis: 100%; text-align: left !important; }
html body .principal .disponibilidade-produto,
html body .principal .disponibilidade-produto * { font-size: var(--ff-t-sm) !important; color: var(--ff-suave) !important; }
html body .principal .disponibilidade-produto b { color: #0B7A4B !important; font-weight: 700 !important; }
html body .cep label,
html body .cep .titulo { color: var(--ff-texto) !important; font-size: var(--ff-t-base) !important; font-weight: 500 !important; }
html body .cep input {
  height: 42px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: var(--ff-raio) 0 0 var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  font-size: var(--ff-t-base) !important;
}
html body .cep .btn,
html body .cep button {
  height: 42px !important;
  border: 0 !important;
  border-radius: 0 var(--ff-raio) var(--ff-raio) 0 !important;
  background: var(--ff-texto) !important;
  color: #fff !important;
  text-shadow: none !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}
html body .abas-custom,
html body.pagina-produto .tab-content {
  border: 1px solid var(--ff-linha) !important;
  border-radius: var(--ff-raio-card) !important;
  background: var(--ff-branco) !important;
  font-size: var(--ff-t-base) !important;
  line-height: 1.65;
}
html body .abas-custom p { max-width: 72ch; }
html body .principal .disponibilidade-produto > span { text-align: left !important; }
html body .principal .comprar .qtde-carrinho { height: 48px !important; box-sizing: border-box; }
html body .cep .input-append { display: flex !important; }
html body .cep input.input-cep {
  flex: 0 0 150px;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  box-sizing: border-box;
}
html body .lista-favoritos {
  background: none !important;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
html body .lista-favoritos:hover { color: var(--ff-vermelho) !important; }

/* Títulos de vitrine que o tema escreve via ::before ("Mais como esse") */
html body .listagem h4.titulo::before,
html body .listagem > .titulo::before {
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-lg) !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
}

/* ===== 8. NEWSLETTER E RODAPÉ ===== */
/* Newsletter: faixa vermelha, separada do rodapé */
html body #barraNewsletter { background: var(--ff-vermelho) !important; border: 0 !important; padding: 26px 0 !important; }
html body #barraNewsletter .componente.newsletter,
html body #barraNewsletter .interno,
html body #barraNewsletter .interno-conteudo { background: none !important; border: 0 !important; box-shadow: none !important; }
html body #barraNewsletter .interno-conteudo {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: 1080px;
  margin: 0 auto;
}
html body #barraNewsletter .texto-newsletter,
html body #barraNewsletter .titulo {
  margin: 0 !important;
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
}
html body .componente.newsletter,
html body .newsletter { border: 0 !important; }
html body .newsletter .input-conteiner { display: flex; align-items: center; gap: 8px; }
html body #barraNewsletter .input-conteiner { flex: 0 1 460px; }
html body .newsletter .input-conteiner input {
  flex: 1 1 auto;
  height: 46px !important;
  line-height: 46px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  background: #fff !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  box-sizing: border-box;
}
html body .componente.newsletter .botao,
html body .newsletter .botao,
html body .newsletter .newsletter-assinar,
html body .newsletter button {
  height: 46px !important;
  padding: 0 26px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--ff-asfalto) !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  text-transform: lowercase !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}
html body .newsletter .newsletter-assinar::first-letter,
html body .newsletter button::first-letter { text-transform: uppercase; }
html body .newsletter .newsletter-assinar:hover,
html body .newsletter button:hover { background: #111 !important; }

/* Rodapé: Sobre a loja + links + categorias em duas colunas + selos */
html body #rodape .institucional { background: var(--ff-asfalto) !important; border: 0 !important; padding: 56px 0 40px !important; }
html body #rodape .institucional > .conteiner { max-width: 1180px; margin: 0 auto; }
html body #rodape .institucional .span9 { width: 100% !important; float: none !important; margin: 0 !important; }
html body #rodape .institucional > .conteiner > .row-fluid > .span3 { display: none !important; }
@media (min-width: 980px) {
  html body #rodape .institucional .span9 > .row-fluid {
    display: grid !important;
    grid-template-columns: 1.5fr 1fr 1.7fr 1fr;
    column-gap: 48px;
    row-gap: 24px;
    align-items: start;
  }
  html body #rodape .institucional .span9 > .row-fluid > * { width: auto !important; margin: 0 !important; float: none !important; }
  html body #rodape .institucional .span9 > .row-fluid::before,
  html body #rodape .institucional .span9 > .row-fluid::after { display: none !important; }
  html body #rodape .sobre-loja-rodape { display: block !important; grid-column: 1; grid-row: 1; }
  html body #rodape .redes-sociais { grid-column: 1; grid-row: 2; }
  html body #rodape .links-rodape-paginas { grid-column: 2; grid-row: 1 / span 2; }
  html body #rodape .links-rodape-categorias { grid-column: 3; grid-row: 1 / span 2; }
  html body #rodape .selos { grid-column: 4; grid-row: 1 / span 2; }
  html body #rodape .contato-ev,
  html body #rodape .span9 > .row-fluid > .visible-phone { display: none !important; }
  html body #rodape .links-rodape-categorias ul { columns: 2; column-gap: 24px; }
  html body #rodape .links-rodape-categorias li { break-inside: avoid; }
}
html body #rodape .institucional,
html body #rodape .institucional * { word-break: normal !important; overflow-wrap: break-word; }
html body #rodape .sobre-loja-rodape .logo { width: auto !important; height: auto !important; margin: 0 0 16px !important; padding: 0 !important; line-height: 0 !important; }
html body #rodape .sobre-loja-rodape .logo a {
  display: inline-block;
  width: auto !important;
  height: auto !important;
  padding: 10px 14px;
  border-radius: 12px;
  background: #fff;
}
html body #rodape .sobre-loja-rodape .logo img { display: block; height: 56px !important; max-height: none !important; width: auto !important; max-width: 220px !important; }
html body #rodape .sobre-loja-rodape > .titulo { display: none !important; }
html body #rodape .sobre-loja-rodape p { max-width: 38ch; color: #CFCFCF !important; line-height: 1.65 !important; }
html body #rodape .redes-sociais > .titulo { display: none !important; }
html body #rodape .institucional .titulo {
  display: block;
  height: auto !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0;
  text-transform: none !important;
}
html body #rodape .institucional ul { margin: 0 !important; padding: 0 !important; }
html body #rodape .redes-sociais ul { display: flex; gap: 10px; margin: 0; }
html body #rodape .redes-sociais li { margin: 0 !important; }
html body #rodape .redes-sociais a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 0 !important;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08) !important;
  transition: background-color .15s ease;
}
html body #rodape .redes-sociais a:hover { background: var(--ff-vermelho) !important; text-decoration: none !important; }
html body #rodape .redes-sociais i { font-size: 15px !important; color: #fff !important; }
html body #rodape .institucional a,
html body #rodape .institucional li,
html body #rodape .institucional p {
  color: var(--cor-textoRodape) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 400 !important;
  line-height: 2 !important;
  text-shadow: none !important;
}
html body #rodape .institucional a:hover { color: #fff !important; text-decoration: none !important; }
html body #rodape .selos li { display: block !important; margin: 0 0 10px !important; }
html body #rodape .selos img { border-radius: 8px; }

/* Barra final: CNPJ à esquerda, Loja Integrada à direita */
html body #rodape > div:last-child { background: #1F1F1F !important; border-top: 1px solid rgba(255, 255, 255, .06); }
html body #rodape > div:last-child > .conteiner > .row-fluid {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0 !important;
}
html body #rodape > div:last-child > .conteiner > .row-fluid::before,
html body #rodape > div:last-child > .conteiner > .row-fluid::after { display: none !important; }
html body #rodape > div:last-child > .conteiner > .row-fluid > * { width: auto !important; margin: 0 !important; float: none !important; text-align: left !important; }
html body #rodape > div:last-child > .conteiner > .row-fluid > :first-child { flex: 1 1 auto; }
html body #rodape > div:last-child p { margin: 0 !important; color: #9C9C9C !important; font-size: var(--ff-t-xs) !important; line-height: 1.5 !important; }
html body #rodape > div:last-child img { height: 26px !important; width: auto !important; opacity: .6; filter: grayscale(1) invert(1); mix-blend-mode: screen; transition: opacity .15s ease; }
html body #rodape > div:last-child a:hover img { opacity: .9; }

/* ===== 9. BANNERS E BOTÕES FLUTUANTES ===== */
html body .secao-banners .flexslider,
html body .secao-banners .banner { border: 0 !important; box-shadow: none !important; }
html body .mini-banner img { border-radius: var(--ff-raio-card); }
/* botão "Topo": removido a pedido (o WhatsApp continua) */
html body .scrollToTop { display: none !important; }
/* WhatsApp flutuante: menor */
html body .li-whatsapp a {
  width: 52px !important;
  height: 52px !important;
  right: 20px !important;
  bottom: 24px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .18) !important;
}
html body .li-whatsapp a i { font-size: 28px !important; line-height: 1 !important; }

@media (prefers-reduced-motion: reduce) {
  html body * { transition: none !important; }
}

/* ===== 10. AJUSTES DO RODAPÉ ===== */
html body #rodape .institucional .sobre-loja-rodape .logo img {
  position: static !important;
  height: 56px !important;
  width: auto !important;
  max-width: none !important;
}
html body #rodape > div:last-child > .conteiner > .row-fluid > div.span9 { flex: 1 1 auto !important; }
html body #rodape > div:last-child > .conteiner > .row-fluid > div:not(.span9) { flex: 0 0 auto !important; width: auto !important; }

/* ponte invisível entre o item e o submenu: o mouse não "cai" no vão e o submenu não fecha */
@media (min-width: 768px) {
  html body .menu.superior .nivel-dois::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -10px;
    height: 10px;
  }
}

/* ===== 11. NEWSLETTER MAIS BAIXA, REDES E BARRA FINAL ===== */
html body #barraNewsletter { padding: 14px 0 !important; }
html body #barraNewsletter .texto-newsletter,
html body #barraNewsletter .titulo { font-size: var(--ff-t-md) !important; font-weight: 600 !important; }
html body #barraNewsletter .input-conteiner { flex: 0 1 400px; }
html body #barraNewsletter .input-conteiner input { height: 40px !important; line-height: 40px !important; }
html body #barraNewsletter .newsletter-assinar,
html body #barraNewsletter button,
html body #barraNewsletter .botao { height: 40px !important; padding: 0 22px !important; font-size: var(--ff-t-sm) !important; }

html body #rodape .redes-sociais ul { display: flex !important; gap: 10px !important; }

/* barra final: nome da loja em destaque + dados legais embaixo */
html body #rodape > div:last-child { border-top: 1px solid rgba(255, 255, 255, .08) !important; }
html body #rodape > div:last-child > .conteiner > .row-fluid { padding: 20px 0 !important; }
html body #rodape > div:last-child p { color: #8E8E8E !important; font-size: var(--ff-t-xs) !important; line-height: 1.6 !important; letter-spacing: .01em; }
html body #rodape > div:last-child p::before {
  content: "Ferro Velho Formigão";
  display: block;
  margin-bottom: 2px;
  color: #fff;
  font-size: var(--ff-t-sm);
  font-weight: 600;
  letter-spacing: 0;
}

/* barra final: texto ocupa o espaço, selo da plataforma fica compacto à direita */
html body #rodape > div:last-child > .conteiner > .row-fluid > div.span9 { flex: 1 1 auto !important; min-width: 0; }
html body #rodape > div:last-child > .conteiner > .row-fluid > div:not(.span9) {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 200px !important;
  text-align: right !important;
}

/* ===== 12. PÁGINA DO PRODUTO: cartões, quantidade [− 1 +] ===== */
html body.pagina-produto .breadcrumbs li:last-child::after { content: none !important; }
html body.pagina-produto .conteiner-imagem {
  background: var(--ff-branco) !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  box-sizing: border-box;
}
html body.pagina-produto .conteiner-imagem img { border-radius: 10px; }
html body.pagina-produto .principal:not(.botao) {
  background: var(--ff-branco);
  border: 1px solid var(--ff-linha);
  border-radius: 16px;
  padding: 26px 28px;
  box-sizing: border-box;
}
html body.pagina-produto .principal .info-principal-produto .breadcrumbs { padding: 0 0 6px !important; }
html body.pagina-produto .principal .cep {
  margin: 22px 0 0 !important;
  padding: 18px 0 0 !important;
  border-top: 1px solid var(--ff-linha) !important;
  border-radius: 0 !important;
  background: none !important;
}
html body.pagina-produto .principal .cep label { margin-bottom: 8px !important; font-size: var(--ff-t-sm) !important; }

/* quantidade horizontal */
html body.pagina-produto .principal .qtde-adicionar-carrinho {
  display: inline-flex !important;
  align-items: stretch;
  height: 48px !important;
  border: 1px solid #D9D9D9 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  overflow: hidden;
}
html body.pagina-produto .principal .qtde-adicionar-carrinho .quantity-nav { display: contents !important; }
html body.pagina-produto .principal .qtde-adicionar-carrinho .quantity-down { order: 0; }
html body.pagina-produto .principal .qtde-adicionar-carrinho .qtde-carrinho { order: 1; }
html body.pagina-produto .principal .qtde-adicionar-carrinho .quantity-up { order: 2; }
html body.pagina-produto .principal .qtde-adicionar-carrinho .quantity-button {
  position: static !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 38px !important;
  height: auto !important;
  margin: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--ff-suave) !important;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
html body.pagina-produto .principal .qtde-adicionar-carrinho .quantity-button:hover { background: var(--ff-fundo) !important; color: var(--ff-vermelho) !important; }
html body.pagina-produto .principal .qtde-adicionar-carrinho .quantity-button i { font-size: 11px !important; color: inherit !important; }
html body.pagina-produto .principal .comprar .qtde-carrinho {
  width: 44px !important;
  height: 46px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  text-align: center;
  font-size: var(--ff-t-md) !important;
  font-weight: 600 !important;
}

/* compartilhar / lista de desejos embaixo da foto */
html body.pagina-produto .produto-compartilhar { margin-top: 12px !important; }
html body.pagina-produto .produto-compartilhar ul { display: flex !important; align-items: center; gap: 16px; }

/* ===== 13. CAIXA DE COMPRA FLUTUANTE, COMPARTILHAR, DESCRIÇÃO, SELO ===== */
html body .acoes-flutuante {
  top: auto !important;
  left: auto !important;
  right: 20px !important;
  bottom: 96px !important;
  width: 280px !important;
  padding: 16px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 16px !important;
  background: var(--ff-branco) !important;
  box-shadow: 0 16px 40px rgba(42, 42, 42, .16) !important;
  box-sizing: border-box;
  text-align: left !important;
}
html body .acoes-flutuante .image { height: auto !important; margin: 0 0 10px !important; text-align: center; }
html body .acoes-flutuante .image img { width: 96px !important; height: 96px !important; object-fit: contain; border-radius: 10px; background: var(--ff-fundo); }
html body .acoes-flutuante .nome-produto {
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  width: auto !important;
  height: auto !important;
  margin: 0 0 8px !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
}
html body .acoes-flutuante .close_float {
  top: 8px !important;
  right: 8px !important;
  left: auto !important;
  width: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--ff-suave) !important;
}
html body .acoes-flutuante .close_float:hover { background: var(--ff-fundo); }
html body .acoes-flutuante .close_float i { color: inherit !important; font-size: 11px !important; }
html body .acoes-flutuante .acoes-produto { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
html body .acoes-flutuante .preco-venda { color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; font-weight: 400 !important; }
html body .acoes-flutuante .preco-promocional,
html body .acoes-flutuante .preco-produto:not(.com-promocao) .preco-venda,
html body .acoes-flutuante strong.titulo {
  display: block;
  color: var(--ff-texto) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}
html body .acoes-flutuante .botao-comprar {
  display: block !important;
  width: 100% !important;
  height: 42px !important;
  margin: 12px 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  line-height: 42px !important;
  text-align: center;
  text-transform: none !important;
}
html body .acoes-flutuante .botao-comprar:hover { background: var(--ff-vermelho-hover) !important; }
html body .acoes-flutuante .botao-comprar i { display: none !important; }
html body .acoes-flutuante .disponibilidade-produto,
html body .acoes-flutuante .disponibilidade-produto * { text-align: left !important; color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; }
html body .acoes-flutuante .disponibilidade-produto b { color: #0B7A4B !important; }

/* compartilhar (WhatsApp) e lista de desejos: botões discretos lado a lado */
html body.pagina-produto .produto-compartilhar ul { gap: 8px !important; margin: 0 !important; }
html body.pagina-produto .produto-compartilhar li { margin: 0 !important; padding: 0 !important; }
html body.pagina-produto .produto-compartilhar li > a {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 14px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 999px !important;
  background: var(--ff-branco) !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
html body.pagina-produto .produto-compartilhar li > a:hover { border-color: var(--ff-vermelho) !important; color: var(--ff-vermelho) !important; }
html body.pagina-produto .produto-compartilhar li > a i { font-size: 13px !important; color: inherit !important; }

/* descrição com título e menos espaço até "Mais como esse" */
html body.pagina-produto .abas-custom { margin-top: 24px !important; padding: 24px 28px !important; }
html body.pagina-produto .abas-custom .tab-content { border: 0 !important; padding: 0 !important; background: none !important; }
html body.pagina-produto .abas-custom::before {
  content: "Descrição";
  display: block;
  margin: 0 0 12px;
  color: var(--ff-texto);
  font-size: var(--ff-t-md);
  font-weight: 700;
}
html body.pagina-produto .listagem.aproveite-tambem { margin-top: 32px !important; }
html body.pagina-produto .listagem.aproveite-tambem > .titulo { margin: 0 0 4px !important; padding: 0 !important; }

/* selo de desconto mais discreto */
html body .listagem .bandeiras-produto span { padding: 2px 7px !important; font-size: 11px !important; border-radius: 6px !important; box-shadow: none !important; }
html body.pagina-produto .abas-custom .tab-content,
html body.pagina-produto .abas-custom .tab-pane { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; background: none !important; }
html body.pagina-produto .produto-compartilhar li.visible-phone > a { width: 34px; padding: 0 !important; justify-content: center; }
html body.pagina-produto .produto-compartilhar li > a i { width: auto !important; margin: 0 !important; }
html body.pagina-produto .principal .acoes-produto { padding-bottom: 0 !important; margin-bottom: 0 !important; }
html body.pagina-produto .principal .disponibilidade-produto { margin-bottom: 0 !important; }
html body.pagina-produto .principal .cep { margin-top: 18px !important; }

/* ===== 14. MINIATURAS DAS FOTOS E "MAIS COMO ESSE" ===== */
html body.pagina-produto .produto-thumbs { margin-top: 12px !important; }
html body.pagina-produto .produto-thumbs .miniaturas li { padding: 0 4px !important; }
html body.pagina-produto .produto-thumbs .miniaturas li a {
  margin: 0 !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 10px !important;
  background: var(--ff-branco) !important;
  overflow: hidden;
  box-sizing: border-box;
  transition: border-color .15s ease;
}
html body.pagina-produto .produto-thumbs .miniaturas li a:hover { border-color: #BDBDBD !important; }
html body.pagina-produto .produto-thumbs .miniaturas li.active a,
html body.pagina-produto .produto-thumbs .miniaturas li a.active,
html body.pagina-produto .produto-thumbs .miniaturas .flex-active { border: 2px solid var(--ff-vermelho) !important; }
html body.pagina-produto .produto-thumbs .miniaturas li a span,
html body.pagina-produto .produto-thumbs .miniaturas li a img { border-radius: 8px; }
html body.pagina-produto .produto-thumbs .flex-direction-nav a,
html body.pagina-produto .produto-thumbs [class*="flex-prev"],
html body.pagina-produto .produto-thumbs [class*="flex-next"] { color: var(--ff-suave) !important; opacity: .8; }

html body.pagina-produto .listagem.aproveite-tambem > h4.titulo {
  height: auto !important;
  margin: 0 0 4px !important;
  line-height: 1.2 !important;
}
html body.pagina-produto .listagem.aproveite-tambem .listagem-linha { padding-top: 0 !important; }
html body.pagina-produto .produto-thumbs a.flex-prev,
html body.pagina-produto .produto-thumbs a.flex-next { font-size: 0 !important; color: var(--ff-suave) !important; }
html body.pagina-produto .produto-thumbs a.flex-prev::before,
html body.pagina-produto .produto-thumbs a.flex-next::before { font-size: 28px !important; }

/* ===== 15. BUSCA (FILTROS), ESPAÇO DO TÍTULO, DESCRIÇÃO PADRONIZADA ===== */
@media (min-width: 768px) {
  html body.pagina-busca .coluna::before { content: "Filtros"; }
}
html body .coluna .filtro-coluna { margin: 0 !important; border: 0 !important; background: none !important; }
html body .coluna .filtro-coluna .filtro {
  margin: 0 !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-top: 1px solid #EFEFEF !important;
  border-radius: 0 !important;
  background: none !important;
}
html body .coluna > .row-fluid:has(.componente.newsletter) { display: none !important; }
html body .coluna > .row-fluid + .filtro-coluna .filtro { border-top: 0 !important; }
html body .coluna .filtro-coluna .filtro .titulo {
  margin: 0 0 6px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
html body .coluna .filtro-coluna .atributo-lista ul { margin: 0 !important; border: 0 !important; }
html body .coluna .filtro-coluna .atributo-lista li { border: 0 !important; margin: 0 !important; padding: 0 !important; }
html body .coluna .filtro-coluna .atributo-lista a {
  display: block !important;
  padding: 5px 0 !important;
  border: 0 !important;
  background: none !important;
}
html body .coluna .filtro-coluna .atributo-lista a::before { display: none !important; }
html body .coluna .filtro-coluna .atributo-lista label {
  display: inline-block;
  margin: 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 400 !important;
  text-transform: none !important;
  cursor: pointer;
}
/* departamentos vêm em MAIÚSCULAS: mostra como frase (o filtro de preço fica como está, por causa do "R$") */
html body .coluna .faceta-departamento .atributo-lista label { text-transform: lowercase !important; }
html body .coluna .faceta-departamento .atributo-lista label::first-letter { text-transform: uppercase; }
html body .coluna .filtro-coluna .atributo-lista label small { color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; }
html body .coluna .filtro-coluna .atributo-lista a:hover label { color: var(--ff-vermelho) !important; }

/* menos espaço entre o título da listagem e os produtos */
html body .listagem > h1.titulo { margin: 4px 0 8px !important; }
html body .listagem > ul > li.listagem-linha:first-child { padding-top: 0 !important; }

/* descrição do produto: mesma fonte, tamanho e cor em todos os produtos */
html body.pagina-produto .abas-custom .tab-content,
html body.pagina-produto .abas-custom .tab-content * {
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-base) !important;
  line-height: 1.65 !important;
  color: var(--ff-texto) !important;
}
html body.pagina-produto .abas-custom .tab-content p { margin: 0 0 10px !important; }
html body.pagina-produto .abas-custom .tab-content strong,
html body.pagina-produto .abas-custom .tab-content b,
html body.pagina-produto .abas-custom .tab-content * { font-weight: 400 !important; font-style: normal !important; }

/* ===== 16. ÍCONES DAS PÍLULAS, ESPAÇO DA DESCRIÇÃO, RELEVÂNCIA NA BUSCA ===== */
html body.pagina-produto .abas-custom { margin-top: 8px !important; }
html body.pagina-produto .produto-compartilhar li > a { height: 38px !important; }
html body.pagina-produto .produto-compartilhar li.visible-phone > a { width: 38px !important; }
html body.pagina-produto .produto-compartilhar li > a i { font-size: 16px !important; }
html body.pagina-produto .produto-compartilhar li.visible-phone > a i { font-size: 19px !important; }

@media (min-width: 768px) {
  html body.pagina-busca .conteudo.span9 { display: block !important; position: relative; }
  html body.pagina-busca .conteudo.span9 > .ordenar-listagem.topo {
    position: absolute !important;
    top: 0;
    right: 0;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 2;
  }
  html body.pagina-busca .listagem > h1.titulo { margin: 0 0 12px !important; padding-right: 220px !important; line-height: 38px !important; }
}
html body .coluna .faceta-preco .atributo-lista label::first-letter { text-transform: uppercase; }
html body .coluna .filtro-coluna .atributo-lista li,
html body .coluna .filtro-coluna .atributo-lista li:hover,
html body .coluna .filtro-coluna .atributo-lista li:hover > a,
html body .coluna .filtro-coluna .atributo-lista a:hover,
html body .coluna .filtro-coluna .atributo-lista label,
html body .coluna .filtro-coluna .atributo-lista label:hover { background: none !important; box-shadow: none !important; }
html body .coluna .filtro-coluna .atributo-lista li:hover label,
html body .coluna .filtro-coluna .atributo-lista li:hover label small { color: var(--ff-vermelho) !important; }

/* ===== 17. SUGESTÕES DA BUSCA (autocompletar) ===== */
html body ul.ui-autocomplete {
  margin-top: 6px !important;
  padding: 6px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 14px !important;
  background: var(--ff-branco) !important;
  box-shadow: 0 16px 40px rgba(42, 42, 42, .14) !important;
  overflow: hidden;
}
html body ul.ui-autocomplete li.ui-menu-item { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
html body ul.ui-autocomplete li.ui-menu-item > a,
html body ul.ui-autocomplete .ui-menu-item-wrapper {
  display: flex !important;
  align-items: center;
  gap: 12px;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: none !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
}
html body ul.ui-autocomplete .ui-menu-item-wrapper:hover,
html body ul.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
html body ul.ui-autocomplete .ui-state-focus {
  margin: 0 !important;
  border: 0 !important;
  background: var(--ff-fundo) !important;
  color: var(--ff-vermelho) !important;
}
html body ul.ui-autocomplete .ui-menu-item-wrapper span.img {
  flex: none;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 44px !important;
  height: 44px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 8px !important;
  background: var(--ff-branco) !important;
  overflow: hidden;
}
html body ul.ui-autocomplete .ui-menu-item-wrapper span.img img { width: auto !important; height: auto !important; max-width: 40px !important; max-height: 40px !important; }

/* newsletter: campo e botão encostados, formando uma peça só */
html body #barraNewsletter .input-conteiner { gap: 0 !important; }
html body #barraNewsletter .input-conteiner input { border-radius: 999px 0 0 999px !important; }
html body #barraNewsletter .newsletter-assinar,
html body #barraNewsletter button,
html body #barraNewsletter .botao {
  margin: 0 !important;
  border-radius: 0 999px 999px 0 !important;
  font-family: var(--ff-fonte) !important;
}

/* ===== 18. SELO CENTRALIZADO, TÍTULOS DE VITRINE EM ONEST, MENU DA CONTA ===== */
html body .bandeiras-produto { width: auto !important; height: auto !important; }
html body .bandeiras-produto span {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}
html body .titulo-categoria strong,
html body .titulo-categoria .titulo { font-family: var(--ff-fonte) !important; }

html body #cabecalho .minha-conta .dropdown-menu {
  min-width: 200px !important;
  margin-top: 6px !important;
  padding: 6px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 14px !important;
  background: var(--ff-branco) !important;
  box-shadow: 0 16px 40px rgba(42, 42, 42, .14) !important;
  text-align: left !important;
}
html body #cabecalho .minha-conta .dropdown-menu li { margin: 0 !important; padding: 0 !important; border: 0 !important; text-align: left !important; }
html body #cabecalho .minha-conta .dropdown-menu li a {
  padding: 9px 12px !important;
  border-radius: 8px !important;
  background: none !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  white-space: nowrap;
}
html body #cabecalho .minha-conta .dropdown-menu li a:hover { background: var(--ff-fundo) !important; color: var(--ff-vermelho) !important; }
html body #cabecalho .minha-conta .dropdown-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }

/* ===== 19. CONTADOR DO CARRINHO + PÁGINA DO CARRINHO ===== */
html body #cabecalho .carrinho > a { position: relative !important; display: inline-block !important; }
html body #cabecalho .carrinho .qtd-carrinho {
  position: absolute !important;
  top: -4px;
  right: -10px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-width: 18px !important;
  width: auto !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 5px !important;
  border: 2px solid var(--ff-branco) !important;
  border-radius: 999px !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-family: var(--ff-fonte) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-sizing: content-box;
}

/* título */
html body.pagina-carrinho .cabecalho-interno h1.titulo {
  margin: 8px 0 18px !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-xl) !important;
  font-weight: 700 !important;
  text-transform: none !important;
}
html body.pagina-carrinho .cabecalho-interno h1.titulo small {
  display: block;
  margin-top: 4px;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 400 !important;
}

/* tabela como cartão */
html body.pagina-carrinho .caixa-sombreada {
  padding: 0 !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 16px !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  overflow: hidden;
}
html body.pagina-carrinho .tabela-carrinho { margin: 0 !important; border: 0 !important; background: none !important; }
html body.pagina-carrinho .tabela-carrinho th,
html body.pagina-carrinho .tabela-carrinho td { border: 0 !important; background: none !important; vertical-align: middle !important; }
html body.pagina-carrinho .tabela-carrinho thead th { padding: 14px 20px !important; border-bottom: 1px solid var(--ff-linha) !important; }
html body.pagina-carrinho .tabela-carrinho thead h6 {
  margin: 0 !important;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info) td { padding: 18px 20px !important; border-bottom: 1px solid #EFEFEF !important; }
html body.pagina-carrinho .tabela-carrinho .conteiner-imagem .imagem { width: 72px !important; height: 72px !important; }
html body.pagina-carrinho .tabela-carrinho .conteiner-imagem img {
  width: 72px !important;
  height: 72px !important;
  object-fit: contain;
  border: 1px solid var(--ff-linha);
  border-radius: 10px;
  background: var(--ff-branco);
}
html body.pagina-carrinho .produto-info > a {
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}
html body.pagina-carrinho .produto-info ul { margin: 4px 0 0 !important; }
html body.pagina-carrinho .produto-info li,
html body.pagina-carrinho .produto-info li * { color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; line-height: 1.6 !important; }
html body.pagina-carrinho .produto-info li strong { font-weight: 600 !important; color: var(--ff-texto) !important; }

/* quantidade [ − 1 + ] */
html body.pagina-carrinho .tabela-carrinho .quantidade {
  display: inline-flex !important;
  align-items: stretch;
  height: 38px;
  border: 1px solid #D9D9D9;
  border-radius: var(--ff-raio);
  background: var(--ff-branco);
  overflow: hidden;
}
html body.pagina-carrinho .tabela-carrinho .quantidade a {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 32px !important;
  margin: 0 !important;
  color: var(--ff-suave) !important;
  font-size: 10px !important;
  text-decoration: none !important;
}
html body.pagina-carrinho .tabela-carrinho .quantidade a:hover { background: var(--ff-fundo); color: var(--ff-vermelho) !important; }
html body.pagina-carrinho .tabela-carrinho .quantidade input {
  width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: none !important;
  text-align: center;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
}

/* preço e excluir */
html body.pagina-carrinho .col-item-unit-price .preco-venda { display: block; color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; font-weight: 400 !important; }
html body.pagina-carrinho .col-item-unit-price strong.preco-promocional,
html body.pagina-carrinho .col-item-unit-price .preco-produto strong {
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 700 !important;
}
html body.pagina-carrinho .excluir a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  color: var(--ff-suave) !important;
  font-size: 16px !important;
  text-decoration: none !important;
  transition: background-color .15s ease, color .15s ease;
}
html body.pagina-carrinho .excluir a:hover { background: #FBEDEB; color: var(--ff-vermelho) !important; }

/* resumo (subtotal, frete, total) */
html body.pagina-carrinho .tabela-carrinho tr.bg-dark,
html body.pagina-carrinho .tabela-carrinho tr.bg-dark td { background: #FAFAFA !important; }
html body.pagina-carrinho .tabela-carrinho tr.bg-dark td { padding: 14px 20px !important; }
html body.pagina-carrinho .subtotal,
html body.pagina-carrinho .total { text-align: right !important; }
html body.pagina-carrinho .subtotal span,
html body.pagina-carrinho .total span { color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; font-weight: 500 !important; margin-right: 8px; }
html body.pagina-carrinho .valor-subtotal { color: var(--ff-texto) !important; font-size: var(--ff-t-md) !important; font-weight: 700 !important; }
html body.pagina-carrinho .tabela-carrinho tr.bg-dark:last-child td { border-top: 1px solid var(--ff-linha) !important; }
html body.pagina-carrinho .valor-total { color: var(--ff-texto) !important; font-size: 26px !important; font-weight: 800 !important; letter-spacing: -.02em; }

html body.pagina-carrinho #formCalcularFrete .control-group { display: flex; align-items: center; gap: 14px; margin: 0 !important; }
html body.pagina-carrinho #formCalcularFrete .control-label { width: auto !important; padding: 0 !important; float: none !important; }
html body.pagina-carrinho #formCalcularFrete .control-label b { color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; font-weight: 600 !important; }
html body.pagina-carrinho #formCalcularFrete .controls { display: flex; align-items: center; gap: 14px; margin: 0 !important; }
html body.pagina-carrinho #formCalcularFrete .input-append { display: flex !important; margin: 0 !important; }
html body.pagina-carrinho #formCalcularFrete .input-cep {
  width: 140px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid #D9D9D9 !important;
  border-right: 0 !important;
  border-radius: var(--ff-raio) 0 0 var(--ff-raio) !important;
  box-shadow: none !important;
  background: var(--ff-branco) !important;
  font-size: var(--ff-t-base) !important;
  box-sizing: border-box;
}
html body.pagina-carrinho #formCalcularFrete #btn-frete {
  height: 40px !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-radius: 0 var(--ff-raio) var(--ff-raio) 0 !important;
  background: var(--ff-texto) !important;
  color: #fff !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html body.pagina-carrinho #formCalcularFrete .help-inline a { color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; text-decoration: underline; text-underline-offset: 3px; }
html body.pagina-carrinho #formCalcularFrete .help-inline a i { display: none; }

html body.pagina-carrinho .formas-envio ul { margin: 0 !important; display: flex; flex-direction: column; gap: 6px; }
html body.pagina-carrinho .formas-envio li { margin: 0 !important; }
html body.pagina-carrinho .formas-envio label.radio {
  display: flex !important;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 1px solid var(--ff-linha);
  border-radius: var(--ff-raio);
  background: var(--ff-branco);
  font-size: var(--ff-t-sm) !important;
  cursor: pointer;
}
html body.pagina-carrinho .formas-envio label.radio:has(input:checked) { border-color: var(--ff-vermelho); box-shadow: 0 0 0 1px var(--ff-vermelho) inset; }
html body.pagina-carrinho .formas-envio label.radio input { position: static !important; margin: 0 !important; accent-color: var(--ff-vermelho); }
html body.pagina-carrinho .formas-envio .prazo { color: var(--ff-texto) !important; font-weight: 600 !important; }
html body.pagina-carrinho .formas-envio .valor { color: var(--ff-texto) !important; font-weight: 700 !important; }
html body.pagina-carrinho .formas-envio .nome { margin-left: auto; color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; }

/* botões */
html body.pagina-carrinho .acao-editar { margin-top: 20px !important; }
html body.pagina-carrinho .acao-editar .span12 { display: flex !important; justify-content: flex-end; align-items: center; gap: 12px; }
html body.pagina-carrinho .acao-editar a.botao {
  height: 48px;
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  padding: 0 22px !important;
  border: 1px solid #D9D9D9 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html body.pagina-carrinho .acao-editar a.botao:hover { border-color: var(--ff-texto) !important; }
html body.pagina-carrinho .acao-editar button.botao.principal {
  height: 48px;
  margin: 0 !important;
  padding: 0 32px !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html body.pagina-carrinho .acao-editar button.botao.principal:hover { background: var(--ff-vermelho-hover) !important; }
html body.pagina-carrinho .selo-ssl img { border-radius: 10px; }

/* ===== 20. PÁGINAS DE CONTA (identificação, cadastro, pedidos, favoritos) ===== */
html body .cabecalho-interno h1.titulo {
  margin: 8px 0 18px !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-xl) !important;
  font-weight: 700 !important;
  text-transform: none !important;
}
html body .cabecalho-interno h1.titulo small {
  display: block;
  margin-top: 4px;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 400 !important;
}
html body .caixa-sombreada {
  padding: 26px 28px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 16px !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
}
html body .caixa-sombreada legend,
html body .caixa-sombreada .legenda {
  margin: 0 0 18px !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ff-linha) !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
html body .caixa-sombreada legend i { display: none !important; }
html body .caixa-sombreada .form-horizontal .control-group { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px !important; }
html body .caixa-sombreada .form-horizontal .control-label {
  width: auto !important;
  float: none !important;
  padding: 0 !important;
  text-align: left !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
}
html body .caixa-sombreada .form-horizontal .controls { margin: 0 !important; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
html body .caixa-sombreada input[type="text"],
html body .caixa-sombreada input[type="email"],
html body .caixa-sombreada input[type="password"],
html body .caixa-sombreada input[type="tel"],
html body .caixa-sombreada select {
  height: 44px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid #D9D9D9 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  box-sizing: border-box;
}
html body .caixa-sombreada input:focus,
html body .caixa-sombreada select:focus { border-color: var(--ff-texto) !important; outline: none !important; }
html body .caixa-sombreada .form-horizontal .controls input[type="text"],
html body .caixa-sombreada .form-horizontal .controls input[type="email"],
html body .caixa-sombreada .form-horizontal .controls input[type="password"] { flex: 1 1 220px; width: auto !important; max-width: 100%; }
html body .caixa-sombreada .botao,
html body .caixa-sombreada button.botao {
  height: 44px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  background-image: none !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  line-height: 44px !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html body .caixa-sombreada .botao:hover { background: var(--ff-vermelho-hover) !important; }
html body .caixa-sombreada a:not(.botao) { color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; text-decoration: underline; text-underline-offset: 3px; }
html body .caixa-sombreada a:not(.botao):hover { color: var(--ff-vermelho) !important; }
html body .caixa-sombreada a:not(.botao) i { display: none !important; }
html body .caixa-sombreada table { border: 0 !important; }
html body .caixa-sombreada table th { color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; font-weight: 500 !important; text-transform: none !important; border-bottom: 1px solid var(--ff-linha) !important; }
html body .caixa-sombreada table td { border-top: 0 !important; border-bottom: 1px solid #EFEFEF !important; color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; vertical-align: middle !important; }

/* ===== 21. MINICARRINHO (abre ao passar o mouse no carrinho) ===== */
html body #cabecalho .carrinho .qtd-carrinho { top: 2px !important; right: -8px !important; }
html body #cabecalho .carrinho-interno {
  width: 300px !important;
  padding: 8px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 14px !important;
  background: var(--ff-branco) !important;
  box-shadow: 0 16px 40px rgba(42, 42, 42, .14) !important;
  text-align: left !important;
  box-sizing: border-box;
}
html body #cabecalho .carrinho-interno ul { margin: 0 !important; padding: 0 !important; max-height: 280px; overflow-y: auto; }
html body #cabecalho .carrinho-interno li {
  display: grid !important;
  grid-template-columns: 56px 1fr;
  grid-template-areas: "img nome" "img preco";
  column-gap: 12px;
  row-gap: 2px;
  align-items: center;
  margin: 0 !important;
  padding: 8px !important;
  border: 0 !important;
  border-radius: 10px;
  text-align: left !important;
}
html body #cabecalho .carrinho-interno li:hover { background: var(--ff-fundo); }
html body #cabecalho .carrinho-interno li .imagem-produto {
  grid-area: img;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 56px !important;
  height: 56px !important;
  margin: 0 !important;
  border: 1px solid var(--ff-linha);
  border-radius: 8px;
  background: var(--ff-branco);
  overflow: hidden;
}
html body #cabecalho .carrinho-interno li .imagem-produto img { width: auto !important; height: auto !important; max-width: 52px !important; max-height: 52px !important; }
html body #cabecalho .carrinho-interno li .nome-produto {
  grid-area: nome;
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  text-align: left !important;
}
html body #cabecalho .carrinho-interno li .preco-produto { grid-area: preco; margin: 0 !important; text-align: left !important; }
html body #cabecalho .carrinho-interno li .preco-produto * {
  display: inline !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 700 !important;
  text-align: left !important;
}
html body #cabecalho .carrinho-interno .carrinho-rodape {
  margin: 6px 0 0 !important;
  padding: 12px 8px 4px !important;
  border-top: 1px solid var(--ff-linha) !important;
  text-align: left !important;
}
html body #cabecalho .carrinho-interno .carrinho-info { display: flex !important; align-items: baseline; justify-content: space-between; margin-bottom: 10px; }
html body #cabecalho .carrinho-interno .carrinho-info > i {
  display: inline !important;
  color: var(--ff-suave) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-xs) !important;
  font-style: normal !important;
}
html body #cabecalho .carrinho-interno .carrino-total {
  display: inline !important;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
}
html body #cabecalho .carrinho-interno .carrino-total strong { color: var(--ff-texto) !important; font-size: var(--ff-t-md) !important; font-weight: 700 !important; }
html body #cabecalho .carrinho-interno .carrinho-rodape .botao {
  display: block !important;
  width: 100% !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  background-image: none !important;
  color: #fff !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  line-height: 42px !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow: none !important;
  box-sizing: border-box;
}
html body #cabecalho .carrinho-interno .carrinho-rodape .botao:hover { background: var(--ff-vermelho-hover) !important; }
html body #cabecalho .carrinho-interno .carrinho-rodape .botao i { display: none !important; }

/* ===== 22. MENSAGENS (erro, sucesso, aviso) ===== */
html body .alert {
  position: relative;
  margin: 16px 0 !important;
  padding: 12px 40px 12px 16px !important;
  border: 1px solid var(--ff-linha) !important;
  border-left: 4px solid var(--ff-suave) !important;
  border-radius: 12px !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  text-shadow: none !important;
}
html body .alert-error,
html body .alert-danger { border-left-color: var(--ff-vermelho) !important; background: #FBEDEB !important; border-color: #F3D3D0 !important; border-left-color: var(--ff-vermelho) !important; }
html body .alert-success { background: #E7F5EE !important; border-color: #CBE8D9 !important; border-left-color: #0B7A4B !important; }
html body .alert-info,
html body .alert-warning { background: #F7F7F7 !important; border-left-color: var(--ff-texto) !important; }
html body .alert .close {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  margin-top: -12px !important;
  width: 24px;
  height: 24px;
  line-height: 22px !important;
  border-radius: 999px;
  color: var(--ff-suave) !important;
  font-size: 18px !important;
  opacity: 1 !important;
  text-align: center;
  text-shadow: none !important;
}
html body .alert .close:hover { background: rgba(0, 0, 0, .06); color: var(--ff-texto) !important; }
html body .caixa-sombreada a.recuperar-senha { display: inline-block; margin: 4px 0 0 !important; }

/* ===== 23. MENU LATERAL: subcategorias mais juntas; filtros como seção própria ===== */
html body .coluna .menu.lateral .nivel-dois { padding: 2px 0 10px !important; }
html body .coluna .menu.lateral .nivel-dois li { margin: 0 !important; padding: 0 !important; line-height: 1.35 !important; }
html body .coluna .menu.lateral .nivel-dois a {
  padding: 5px 18px 5px 32px !important;
  font-size: var(--ff-t-sm) !important;
  line-height: 1.35 !important;
}
/* filtros (na página de categoria) com cabeçalho "Filtros" no mesmo estilo de "Categorias" */
html body .coluna .menu.lateral.outras + .filtro-coluna::before {
  content: "Filtros";
  display: block;
  padding: 16px 18px 12px;
  border-top: 6px solid var(--ff-fundo);
  border-bottom: 1px solid var(--ff-linha);
  color: var(--ff-texto);
  font-size: var(--ff-t-md);
  font-weight: 700;
}
html body .coluna .menu.lateral.outras + .filtro-coluna .filtro { border-top: 0 !important; }
html body .coluna .filtro-coluna .atributo-lista label { padding: 0 !important; line-height: 1.4 !important; }
html body .coluna .filtro-coluna .atributo-lista a { padding: 5px 0 !important; }

/* ===== 24. CRIAR CONTA: campos em 2 colunas, larguras iguais, botões padronizados ===== */
html body .botao,
html body .btn { background-image: none !important; text-shadow: none !important; }
@media (min-width: 768px) {
  html body.pagina-cadastro .caixa-sombreada fieldset {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 16px;
    align-items: start;
  }
  html body.pagina-cadastro .caixa-sombreada fieldset > legend,
  html body.pagina-cadastro .caixa-sombreada fieldset > :not(.control-group),
  html body.pagina-cadastro .caixa-sombreada .control-group:has([name="nome"]),
  html body.pagina-cadastro .caixa-sombreada .control-group:has([name="cep"]),
  html body.pagina-cadastro .caixa-sombreada .control-group:has([name="endereco"]) { grid-column: 1 / -1; }
  html body.pagina-cadastro .caixa-sombreada fieldset:has([name="tipo"]) { display: block; }
}
html body.pagina-cadastro .caixa-sombreada .controls input:not([type="radio"]):not([type="checkbox"]),
html body.pagina-cadastro .caixa-sombreada .controls select {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 auto;
}
html body.pagina-cadastro .caixa-sombreada .controls input[name="cep"]:not([type="radio"]):not([type="checkbox"]) { width: 150px !important; flex: 0 0 150px; }
html body.pagina-cadastro .caixa-sombreada .control-group:has([name="tipo"]) .controls label {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin: 0 18px 0 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
}
html body.pagina-cadastro .caixa-sombreada input[type="radio"] { margin: 0 !important; accent-color: var(--ff-vermelho); }

html body .acao-editar { display: flex !important; justify-content: flex-end; }
html body .acao-editar::before,
html body .acao-editar::after { display: none !important; }
html body .acao-editar > [class*="span"] {
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  width: auto !important;
  margin: 0 !important;
  float: none !important;
}
html body .acao-editar a.botao:not(.principal),
html body .acao-editar .botao:not(.principal) {
  height: 48px;
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  padding: 0 22px !important;
  border: 1px solid #D9D9D9 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html body .acao-editar .botao:not(.principal):hover { border-color: var(--ff-texto) !important; }
html body .acao-editar .botao.principal {
  height: 48px;
  margin: 0 !important;
  padding: 0 32px !important;
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
html body .acao-editar .botao.principal:hover { background: var(--ff-vermelho-hover) !important; }
html body.pagina-cadastro .caixa-sombreada .control-label,
html body.pagina-cadastro .caixa-sombreada .control-label * { color: var(--ff-texto) !important; font-weight: 500 !important; }
html body.pagina-cadastro .caixa-sombreada .control-label i { display: none !important; }
html body.pagina-cadastro .caixa-sombreada .control-group:has([name="tipo"]) label,
html body.pagina-cadastro .caixa-sombreada fieldset:has([name="tipo"]) label {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  margin: 0 24px 0 0 !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  cursor: pointer;
}
html body.pagina-cadastro .caixa-sombreada input[type="radio"] { width: 16px; height: 16px; }

/* ===== 25. AVISO DE COOKIES VAZIO: some (só aparece se tiver conteúdo) ===== */
html body #avisoCookies { display: none !important; }
html body #avisoCookies:has(.conteiner > *) {
  display: block !important;
  background: var(--ff-branco) !important;
  border-top: 1px solid var(--ff-linha) !important;
  box-shadow: 0 -8px 24px rgba(42, 42, 42, .10) !important;
}

/* ===== 26. ÁREA DO CLIENTE (Minha conta, Meus pedidos, Lista de desejos) ===== */
/* coluna: o próprio menu da conta é o cartão (sem o título "Categorias") */
html body .coluna:has(.conta-menu) { background: none !important; border: 0 !important; overflow: visible !important; }
html body .coluna:has(.conta-menu)::before { display: none !important; }
html body .conta-menu { padding: 0 0 8px !important; overflow: hidden; }
html body .conta-menu .nome-usuario {
  display: block !important;
  margin: 0 0 6px !important;
  padding: 16px 18px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ff-linha) !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-md) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
}
html body .conta-menu .nome-usuario i { display: none !important; }
html body .conta-menu .menu-simples { margin: 0 !important; padding: 0 8px !important; }
html body .conta-menu .menu-simples li { margin: 0 !important; padding: 0 !important; border: 0 !important; list-style: none; }
html body .conta-menu .menu-simples li.divisor { height: 1px !important; margin: 6px 10px !important; padding: 0 !important; background: #EFEFEF !important; }
html body .conta-menu .menu-simples a {
  display: block !important;
  padding: 9px 10px !important;
  border-radius: 8px;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: background-color .15s ease, color .15s ease;
}
html body .conta-menu .menu-simples a:hover { background: var(--ff-fundo) !important; color: var(--ff-vermelho) !important; }
html body .conta-menu .menu-simples li:last-child a { color: var(--ff-suave) !important; }

/* abas em pílula */
html body .abas-conta {
  display: inline-flex !important;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0 0 16px !important;
  padding: 4px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 999px !important;
  background: var(--ff-branco) !important;
}
html body .abas-conta::before,
html body .abas-conta::after { display: none !important; }
html body .abas-conta li { float: none !important; margin: 0 !important; border: 0 !important; }
html body .abas-conta li a {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  height: auto !important;
  margin: 0 !important;
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: none !important;
  color: var(--ff-suave) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}
html body .abas-conta li a i { font-size: 13px !important; color: inherit !important; }
html body .abas-conta li a:hover { color: var(--ff-texto) !important; background: var(--ff-fundo) !important; }
html body .abas-conta li.active a { background: #FBEDEB !important; color: var(--ff-vermelho) !important; }

/* conteúdo */
html body .abas-conteudo { padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; }
html body .caixa-dados {
  margin: 0 0 16px !important;
  padding: 24px 28px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 16px !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
}
html body .caixa-dados h3.titulo {
  margin: 0 0 20px !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ff-linha) !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-lg) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-transform: none !important;
}
html body .caixa-dados h3.titulo small {
  display: block;
  margin-top: 4px;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 400 !important;
  text-transform: none !important;
}
html body .caixa-dados fieldset { margin: 0 0 16px !important; }
html body .caixa-dados fieldset legend {
  width: 100%;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: left !important;
  text-transform: none !important;
}
html body .caixa-dados fieldset legend > i { display: none !important; }
html body .caixa-dados fieldset legend a { color: var(--ff-vermelho) !important; font-size: var(--ff-t-sm) !important; font-weight: 600 !important; text-decoration: none !important; }
html body .caixa-dados fieldset legend a:hover { text-decoration: underline !important; text-underline-offset: 3px; }
html body .caixa-dados fieldset legend a i { font-size: 11px !important; margin-right: 4px; }

/* lista de dados: rótulo cinza à esquerda, valor à direita */
html body .caixa-info {
  margin: 0 0 12px !important;
  padding: 4px 16px !important;
  border: 1px solid var(--ff-linha) !important;
  border-radius: 12px !important;
  background: #FAFAFA !important;
  box-shadow: none !important;
  text-align: left !important;
}
html body .caixa-info li {
  display: flex !important;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 8px;
  margin: 0 !important;
  padding: 9px 0 !important;
  border-bottom: 1px solid #EFEFEF !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  line-height: 1.45 !important;
  text-align: left !important;
}
html body .caixa-info li:last-child { border-bottom: 0 !important; }
html body .caixa-info li b { color: var(--ff-suave) !important; font-weight: 400 !important; }
html body .caixa-info li span { color: var(--ff-texto) !important; font-weight: 500 !important; margin-right: 12px; }

/* botões dentro da área do cliente */
html body .caixa-dados .acao-editar { display: flex !important; flex-wrap: wrap; justify-content: flex-start !important; gap: 10px; margin: 4px 0 0 !important; }
html body .caixa-dados .acao-editar .botao {
  float: none !important;
  height: 40px !important;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: var(--ff-raio) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}
html body .caixa-dados .acao-editar .botao i { display: none !important; }
html body .caixa-dados .acao-editar .botao:not(.principal) { border: 1px solid #D9D9D9 !important; background: var(--ff-branco) !important; color: var(--ff-texto) !important; }
html body .caixa-dados .acao-editar .botao.principal { border: 0 !important; background: var(--ff-vermelho) !important; color: #fff !important; }
html body .caixa-dados .acao-editar .botao.principal:hover { background: var(--ff-vermelho-hover) !important; }
html body .minha-conta { text-align: left !important; }
html body .caixa-dados { min-height: 0 !important; height: auto !important; }
html body .caixa-dados .caixa-destaque { padding: 32px 16px !important; }
html body .caixa-dados .caixa-destaque h4 { margin: 0 0 6px !important; color: var(--ff-texto) !important; font-size: var(--ff-t-md) !important; font-weight: 700 !important; text-transform: none !important; }
html body .caixa-dados .caixa-destaque p { color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; }
html body .caixa-dados > p.text-center { margin: 0 !important; padding: 20px 0 !important; color: var(--ff-suave) !important; font-size: var(--ff-t-base) !important; }
html body .caixa-dados > p.text-center strong { color: var(--ff-texto) !important; font-weight: 600 !important; }
html body .caixa-dados table { width: 100%; border: 0 !important; background: none !important; }
html body .caixa-dados table th { padding: 10px 12px !important; border: 0 !important; border-bottom: 1px solid var(--ff-linha) !important; background: none !important; color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; font-weight: 500 !important; text-align: left; text-transform: none !important; }
html body .caixa-dados table td { padding: 12px !important; border: 0 !important; border-bottom: 1px solid #EFEFEF !important; background: none !important; color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; vertical-align: middle !important; }
html body .caixa-dados table tr:last-child td { border-bottom: 0 !important; }

/* ===== 27. POP-UPS (modal) + FALE CONOSCO ===== */
html body .modal {
  border: 0 !important;
  border-radius: 16px !important;
  background: var(--ff-branco) !important;
  box-shadow: 0 24px 64px rgba(42, 42, 42, .28) !important;
  overflow: hidden;
}
html body .modal-backdrop.in { opacity: .55 !important; background: #1A1A1A !important; }
html body .modal-header {
  position: relative;
  padding: 20px 56px 16px 24px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ff-linha) !important;
  background: var(--ff-branco) !important;
  color: var(--ff-suave) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-sm) !important;
}
html body .modal-header .titulo {
  display: block;
  margin: 0 0 2px !important;
  color: var(--ff-texto) !important;
  font-family: var(--ff-fonte) !important;
  font-size: var(--ff-t-lg) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-transform: none !important;
}
html body .modal-header .close {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  width: 32px;
  height: 32px;
  margin: 0 !important;
  border-radius: 999px;
  color: var(--ff-suave) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html body .modal-header .close:hover { background: var(--ff-fundo); color: var(--ff-texto) !important; }
html body .modal-header .close i { font-size: 13px !important; }
html body .modal-body { padding: 20px 24px !important; border: 0 !important; }
html body .modal-footer { padding: 14px 24px !important; border-top: 1px solid var(--ff-linha) !important; background: #FAFAFA !important; box-shadow: none !important; }

/* formulário do Fale conosco: rótulo acima do campo, campos do mesmo tamanho */
html body #modalContato .form-horizontal .control-group { display: flex; flex-direction: column; gap: 6px; margin: 0 0 12px !important; }
html body #modalContato .form-horizontal .control-label { width: auto !important; float: none !important; padding: 0 !important; text-align: left !important; color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; font-weight: 500 !important; }
html body #modalContato .form-horizontal .controls { margin: 0 !important; }
html body #modalContato input,
html body #modalContato textarea {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid #D9D9D9 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  box-sizing: border-box;
}
html body #modalContato input { height: 42px !important; }
html body #modalContato textarea { min-height: 96px; padding: 10px 14px !important; resize: vertical; }
html body #modalContato input:focus,
html body #modalContato textarea:focus { border-color: var(--ff-texto) !important; outline: none !important; }
html body #modalContato .control-group:last-child { display: flex !important; flex-direction: row-reverse; justify-content: flex-start; gap: 10px; }
html body #modalContato .botao {
  float: none !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border-radius: var(--ff-raio) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 600 !important;
  line-height: 42px !important;
  box-shadow: none !important;
}
html body #modalContato .botao:not(.principal) { border: 1px solid #D9D9D9 !important; background: var(--ff-branco) !important; color: var(--ff-texto) !important; }
html body #modalContato .botao.principal { border: 0 !important; background: var(--ff-vermelho) !important; color: #fff !important; }
html body #modalContato .botao.principal:hover { background: var(--ff-vermelho-hover) !important; }

/* dados da empresa: rótulo pequeno em cinza, valor em chumbo */
html body #modalContato table { margin: 0 0 14px !important; border: 0 !important; }
html body #modalContato table tr:hover td { background: none !important; }
html body #modalContato table td {
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #EFEFEF !important;
  background: none !important;
  vertical-align: top !important;
  font-size: var(--ff-t-sm) !important;
  line-height: 1.5 !important;
}
html body #modalContato table td:first-child { width: 110px; padding-right: 12px !important; color: var(--ff-suave) !important; font-weight: 400 !important; }
html body #modalContato table td:first-child * { color: var(--ff-suave) !important; font-weight: 400 !important; }
html body #modalContato table td:last-child,
html body #modalContato table td:last-child * { color: var(--ff-texto) !important; font-weight: 500 !important; }
html body #modalContato table tr:last-child td { border-bottom: 0 !important; }
html body #modalContato .mapa { border-radius: 12px; overflow: hidden; border: 1px solid var(--ff-linha); }

/* ===== 28. FALE CONOSCO v2: formulário em 2 colunas + cartão de atendimento ===== */
html body #modalContato { width: 860px !important; max-width: calc(100vw - 32px) !important; margin-left: -430px !important; }
@media (max-width: 900px) { html body #modalContato { margin-left: 0 !important; left: 16px !important; right: 16px !important; width: auto !important; } }
html body #modalContato .modal-body { max-height: calc(100vh - 140px) !important; overflow-y: auto; }
html body #modalContato .modal-body > .row-fluid,
html body #modalContato .modal-body form > .row-fluid { display: flex !important; gap: 20px; align-items: flex-start; }
html body #modalContato .modal-body .row-fluid::before,
html body #modalContato .modal-body .row-fluid::after { display: none !important; }
html body #modalContato .modal-body .span6 { float: none !important; margin: 0 !important; width: auto !important; }
html body #modalContato .modal-body .span6:first-child { flex: 1.25 1 0; display: grid !important; grid-template-columns: 1fr 1fr; column-gap: 12px; }
html body #modalContato .modal-body .span6:last-child { flex: 1 1 0; }
html body #modalContato .span6:first-child .control-group { margin: 0 0 10px !important; gap: 4px !important; }
html body #modalContato .span6:first-child .control-group:has(textarea),
html body #modalContato .span6:first-child .control-group:has(.g-recaptcha),
html body #modalContato .span6:first-child .control-group:last-child { grid-column: 1 / -1; }
html body #modalContato .form-horizontal .control-label { font-size: var(--ff-t-xs) !important; color: var(--ff-suave) !important; }
html body #modalContato input { height: 40px !important; }
html body #modalContato textarea { min-height: 88px; }
html body #modalContato .span6:first-child .control-group:last-child { margin: 4px 0 0 !important; justify-content: flex-start !important; }

/* cartão "Atendimento" */
html body #modalContato .span6:last-child {
  padding: 16px !important;
  border: 1px solid var(--ff-linha);
  border-radius: 14px;
  background: #F7F7F7;
}
html body #modalContato .span6:last-child::before {
  content: "Atendimento";
  display: block;
  margin: 0 0 6px;
  color: var(--ff-texto);
  font-size: var(--ff-t-md);
  font-weight: 700;
}
html body #modalContato table,
html body #modalContato table tbody { display: block !important; width: 100% !important; margin: 0 0 12px !important; }
html body #modalContato table tr {
  display: flex !important;
  flex-direction: column;
  gap: 1px;
  padding: 8px 0;
  border-bottom: 1px solid #E8E8E8;
}
html body #modalContato table tr:last-child { border-bottom: 0; }
html body #modalContato table td { display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; }
html body #modalContato table td:first-child,
html body #modalContato table td:first-child * { color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; font-weight: 400 !important; }
html body #modalContato table td:last-child,
html body #modalContato table td:last-child * { color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; font-weight: 600 !important; line-height: 1.45 !important; }
html body #modalContato table td:last-child a:hover { color: var(--ff-vermelho) !important; }
html body #modalContato .mapa { height: 170px !important; background: #fff; }
html body .conteudo > .minha-conta { width: auto !important; max-width: none !important; margin: 0 !important; float: none !important; }

/* ===== 29. PÁGINAS INSTITUCIONAIS (Quem somos, políticas, meios de pagamento) ===== */
html body.pagina-pagina .breadcrumbs { margin-bottom: 14px !important; }
html body.pagina-pagina .caixa-sombreada { padding: 40px 48px !important; }
@media (max-width: 767px) { html body.pagina-pagina .caixa-sombreada { padding: 24px 20px !important; } }
html body.pagina-pagina .caixa-sombreada > div { max-width: 780px; }
html body.pagina-pagina .caixa-sombreada h1.titulo { margin: 0 0 24px !important; font-size: 30px !important; letter-spacing: -.02em; }
html body.pagina-pagina .caixa-sombreada p,
html body.pagina-pagina .caixa-sombreada li {
  color: var(--ff-texto) !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
}
html body.pagina-pagina .caixa-sombreada p { margin: 0 0 14px !important; }
/* parágrafo que é só um negrito funciona como subtítulo */
html body.pagina-pagina .caixa-sombreada p:has(> strong:only-child) { margin: 28px 0 8px !important; }
html body.pagina-pagina .caixa-sombreada p > strong:only-child { font-size: var(--ff-t-md) !important; font-weight: 700 !important; }
html body.pagina-pagina .caixa-sombreada ul,
html body.pagina-pagina .caixa-sombreada ol { margin: 0 0 16px 20px !important; padding: 0 !important; }
html body.pagina-pagina .caixa-sombreada li { margin: 0 0 6px !important; }

/* ===== 30. ABAS DA ÁREA DO CLIENTE: traço vermelho embaixo (como o menu de cima) ===== */
html body .abas-conta {
  display: flex !important;
  gap: 24px;
  width: 100%;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ff-linha) !important;
  border-radius: 0 !important;
  background: none !important;
}
html body .abas-conta li { background: none !important; box-shadow: none !important; border-radius: 0 !important; }
html body .abas-conta li a {
  display: block !important;
  padding: 10px 0 12px !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: var(--ff-suave) !important;
  font-size: var(--ff-t-base) !important;
  font-weight: 600 !important;
  word-spacing: 0 !important;
}
html body .abas-conta li a i { display: none !important; }
html body .abas-conta li a span { margin: 0 !important; }
html body .abas-conta li a:hover { background: none !important; color: var(--ff-texto) !important; }
html body .abas-conta li.active a {
  background: none !important;
  color: var(--ff-vermelho) !important;
  box-shadow: inset 0 -2px 0 var(--ff-vermelho) !important;
}

/* ===== 31. CADASTRAR/EDITAR ENDEREÇO (área do cliente): igual à tela de criar conta ===== */
html body .form-horizontal .caixa-sombreada .control-group { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px !important; }
html body .form-horizontal .caixa-sombreada .control-label {
  width: auto !important;
  float: none !important;
  padding: 0 !important;
  text-align: left !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
}
html body .form-horizontal .caixa-sombreada .control-label i { display: none !important; }
html body .form-horizontal .caixa-sombreada .controls { margin: 0 !important; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
html body .form-horizontal .caixa-sombreada .controls input:not([type="radio"]):not([type="checkbox"]),
html body .form-horizontal .caixa-sombreada .controls select { width: 100% !important; max-width: 100% !important; flex: 1 1 auto; }
html body .form-horizontal .caixa-sombreada .controls input[name="cep"]:not([type="radio"]):not([type="checkbox"]) { width: 150px !important; flex: 0 0 150px; }
@media (min-width: 768px) {
  html body[class*="pagina-conta-endereco"] .caixa-sombreada fieldset {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 16px;
    align-items: start;
  }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada fieldset > legend,
  html body[class*="pagina-conta-endereco"] .caixa-sombreada fieldset > :not(.control-group),
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="nome"]),
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="cep"]),
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="endereco"]) { grid-column: 1 / -1; }
}
html body[class*="pagina-conta-endereco"] .cadastro h1.titulo,
html body[class*="pagina-conta-endereco"] h1.titulo { margin: 8px 0 18px !important; font-size: var(--ff-t-xl) !important; }

/* ===== 32. FORMULÁRIOS DENTRO DA ÁREA DO CLIENTE (alterar senha, editar dados…) ===== */
html body .caixa-dados .control-group { display: flex; flex-direction: column; gap: 6px; max-width: 480px; margin: 0 0 16px !important; }
html body .caixa-dados .control-label {
  width: auto !important;
  float: none !important;
  padding: 0 !important;
  text-align: left !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-sm) !important;
  font-weight: 500 !important;
}
html body .caixa-dados .control-group .controls { margin: 0 !important; display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
html body .caixa-dados input[type="text"],
html body .caixa-dados input[type="email"],
html body .caixa-dados input[type="password"],
html body .caixa-dados input[type="tel"],
html body .caixa-dados select {
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid #D9D9D9 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-branco) !important;
  box-shadow: none !important;
  color: var(--ff-texto) !important;
  font-size: var(--ff-t-base) !important;
  box-sizing: border-box;
}
html body .caixa-dados input:focus,
html body .caixa-dados select:focus { border-color: var(--ff-texto) !important; outline: none !important; }
html body .caixa-dados .help-inline,
html body .caixa-dados .help-block { display: block !important; margin: 0 !important; padding: 0 !important; color: var(--ff-suave) !important; font-size: var(--ff-t-xs) !important; }

/* ===== 33. BOTÃO PRINCIPAL PADRÃO, SELO NO CARRINHO, LISTA DE DESEJOS, CARTÕES ===== */
/* todo botão principal é vermelho (sem o degradê do tema ele ficava branco com texto branco) */
html body .botao.principal,
html body button.botao.principal,
html body a.botao.principal {
  border: 0 !important;
  border-radius: var(--ff-raio) !important;
  background: var(--ff-vermelho) !important;
  color: #fff !important;
  font-family: var(--ff-fonte) !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html body .botao.principal:hover { background: var(--ff-vermelho-hover) !important; color: #fff !important; }
html body .modal-footer .botao { height: 40px !important; padding: 0 18px !important; line-height: 40px !important; font-size: var(--ff-t-sm) !important; border-radius: var(--ff-raio) !important; }
html body .modal-footer .botao:not(.principal) { border: 1px solid #D9D9D9 !important; background: var(--ff-branco) !important; color: var(--ff-texto) !important; }

/* carrinho: selo "Compra segura" à esquerda, botões à direita */
html body .acao-editar:has(.selo-ssl) { justify-content: space-between !important; align-items: center; }
html body .acao-editar .selo-ssl {
  position: static !important;
  float: none !important;
  order: -1;
  margin: 0 !important;
  width: auto !important;
}

/* lista de desejos */
html body .caixa-dados > table.table td { padding: 14px 12px !important; border-bottom: 1px solid #EFEFEF !important; }
html body .caixa-dados > table.table .imagem-produto {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 64px !important;
  height: 64px !important;
  border: 1px solid var(--ff-linha);
  border-radius: 10px;
  background: var(--ff-branco);
  overflow: hidden;
}
html body .caixa-dados > table.table .imagem-produto img { max-width: 58px !important; max-height: 58px !important; width: auto !important; height: auto !important; }
html body .caixa-dados > table.table td.text-left a { color: var(--ff-texto) !important; font-size: var(--ff-t-base) !important; font-weight: 600 !important; text-decoration: none !important; }
html body .caixa-dados > table.table td.text-left a:hover { color: var(--ff-vermelho) !important; }
html body .caixa-dados > table.table td a:has(.icon-shopping-cart),
html body .caixa-dados > table.table td a:has(.icon-trash) {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  text-decoration: none !important;
  transition: background-color .15s ease;
}
html body .caixa-dados > table.table td a:has(.icon-shopping-cart) { background: var(--ff-vermelho); }
html body .caixa-dados > table.table td a:has(.icon-shopping-cart) i { color: #fff !important; font-size: 15px !important; }
html body .caixa-dados > table.table td a:has(.icon-shopping-cart):hover { background: var(--ff-vermelho-hover); }
html body .caixa-dados > table.table td a:has(.icon-trash) i { color: var(--ff-suave) !important; font-size: 15px !important; }
html body .caixa-dados > table.table td a:has(.icon-trash):hover { background: #FBEDEB; }
html body .caixa-dados > table.table td a:has(.icon-trash):hover i { color: var(--ff-vermelho) !important; }
html body .caixa-dados > ul.caixa-info { margin-top: 18px !important; text-align: left !important; }
html body .caixa-dados > ul.caixa-info li { display: block !important; border: 0 !important; padding: 6px 0 !important; }
html body .caixa-dados > ul.caixa-info h5 { margin: 0 !important; color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; font-weight: 700 !important; }
html body .caixa-dados > ul.caixa-info input[type="text"] { text-align: left !important; color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; background: var(--ff-branco) !important; }

/* cartões salvos */
html body .caixa-dados .span12 > legend { display: block; margin: 0 0 10px !important; padding: 0 !important; border: 0 !important; color: var(--ff-texto) !important; font-size: var(--ff-t-base) !important; font-weight: 700 !important; }
html body .caixa-dados .span12 > legend i { display: none !important; }
html body .caixa-dados .cartao-salvo-vazio {
  padding: 28px 16px !important;
  border: 1px dashed #D9D9D9;
  border-radius: 12px;
  background: #FAFAFA;
}
html body .caixa-dados .cartao-salvo-vazio p { margin: 0 !important; color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; }

/* ===== 34. CELULAR (até 767px): tudo o que foi feito, ajustado para tela pequena ===== */
/* ícones dentro de botões (ex.: menu ☰) usam a fonte de ícones, não a Onest */
html body .botao[class*="icon-"]::before { font-family: FontAwesome !important; font-weight: normal !important; }
/* título das telas da conta sem caixa alta (ex.: Atualizar cadastro) */
html body .cabecalho-interno .titulo { text-transform: none !important; }
/* nome do produto não fica "empurrado" pelo caminho (Início / Categoria) */
html body.pagina-produto .info-principal-produto .nome-produto { clear: both; }

@media (max-width: 767px) {
  /* cabeçalho: botão do menu do mesmo tamanho da busca */
  html body #cabecalho a.atalho-menu {
    display: flex !important; align-items: center; justify-content: center;
    width: 46px !important; height: 46px !important; margin: 5px 10px 0 12px !important; padding: 0 !important;
    border-radius: var(--ff-raio) !important; background: var(--ff-vermelho) !important; box-shadow: none !important;
  }
  html body #cabecalho a.atalho-menu::before { width: auto !important; height: auto !important; font-size: 20px !important; line-height: 1 !important; margin: 0 !important; }
  html body #cabecalho .busca-mobile .busca { margin-right: 12px !important; }

  /* categorias em carrossel: etiquetas cinza com o nome inteiro, sem círculo vazio e sem caixa alta */
  html body #menuinsta { margin: 2px 0 12px !important; position: relative; }
  html body #menuinsta, html body #menuinsta .insta-sel { height: auto !important; min-height: 0 !important; }
  html body #menuinsta .slick-list { margin: 0 30px !important; }
  html body #menuinsta .slick-slide { margin: 0 !important; padding: 0 3px !important; box-sizing: border-box; }
  html body #menuinsta .slick-slide a {
    display: flex !important; align-items: center; justify-content: center;
    width: auto !important; height: 54px !important; margin: 0 !important; padding: 0 8px !important;
    border-radius: var(--ff-raio) !important; background: #F4F4F4 !important; box-sizing: border-box;
  }
  html body #menuinsta .slick-slide a::before, html body #menuinsta .slick-slide a::after { display: none !important; }
  html body #menuinsta .titulo {
    display: block !important; position: static !important; width: auto !important; height: auto !important; max-height: 3.75em; overflow: hidden;
    margin: 0 !important; padding: 0 !important; color: var(--ff-texto) !important; font-size: var(--ff-t-xs) !important; font-weight: 600 !important;
    line-height: 1.25 !important; text-align: center; text-transform: lowercase !important; letter-spacing: 0 !important;
  }
  html body #menuinsta .titulo::first-letter { text-transform: uppercase; }
  html body #menuinsta .slick-arrow { top: 50% !important; transform: translateY(-50%); margin: 0 !important; font-size: 14px !important; color: var(--ff-suave) !important; }
  html body #menuinsta .slick-prev { left: 8px !important; }
  html body #menuinsta .slick-next { right: 8px !important; }

  /* menu lateral (☰): itens com linha separando, sem vão quando o nome quebra */
  html body .menu.superior .nivel-um > li { border-bottom: 1px solid var(--ff-linha) !important; }
  html body .menu.superior .nivel-um > li > a .titulo { line-height: 1.35 !important; padding: 15px 34px 15px 4px !important; font-size: var(--ff-t-base) !important; font-weight: 600 !important; }
  html body .menu.superior .nivel-dois { padding: 0 0 10px 4px !important; }
  html body .menu.superior .nivel-dois a, html body .menu.superior .nivel-dois a .titulo { line-height: 1.35 !important; padding-top: 6px !important; padding-bottom: 6px !important; color: var(--ff-suave) !important; font-weight: 400 !important; }

  /* categoria e busca: título primeiro, depois Relevância (esquerda) e Filtrar (direita) */
  html body.pagina-categoria .secao-principal .conteudo, html body.pagina-busca .secao-principal .conteudo { display: flex !important; flex-direction: column; }
  html body.pagina-categoria .conteudo > h1.titulo { order: -1; margin: 4px 0 12px !important; font-size: 22px !important; }
  html body.pagina-busca .conteudo > .listagem { display: contents !important; }
  html body.pagina-busca .conteudo > .listagem > h1 { order: -1; margin: 4px 0 12px !important; font-size: 22px !important; }
  html body .ordenar-listagem.topo { margin: 0 0 14px !important; padding: 0 !important; border: 0 !important; }
  html body .ordenar-listagem.topo .row-fluid > [class*="span"] { display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; width: 100% !important; margin: 0 !important; float: none !important; }
  html body .ordenar-listagem.topo .row-fluid > [class*="span"] > div:first-child { margin-right: auto !important; }
  html body .ordenar-listagem.topo .row-fluid::before, html body .ordenar-listagem.topo .row-fluid::after { display: none !important; }
  html body .ordenar-listagem.topo .filtro-mobile-itens { flex: 1 0 100%; }
  html body .ordenar-listagem.topo .input-append { display: flex !important; align-items: center; height: 40px; padding: 0 4px 0 14px !important; border: 1px solid var(--ff-linha) !important; border-radius: var(--ff-raio) !important; box-sizing: border-box; }
  html body .ordenar-listagem.topo .input-append label { line-height: 38px !important; height: 38px !important; margin: 0 !important; padding: 0 !important; font-size: var(--ff-t-sm) !important; }
  html body .ordenar-listagem.topo .filtro-mobile, html body .ordenar-listagem.topo .filtro-mobile .btn { margin: 0 !important; float: none !important; }
  html body .ordenar-listagem.topo .filtro-mobile .btn { height: 40px !important; padding: 0 16px !important; border: 1px solid var(--ff-linha) !important; border-radius: var(--ff-raio) !important; background: #fff !important; background-image: none !important; box-shadow: none !important; color: var(--ff-texto) !important; font-size: var(--ff-t-sm) !important; font-weight: 600 !important; text-shadow: none !important; }

  /* listagens (categoria, busca, "Mais como esse"): 2 produtos por linha */
  html body li.listagem-linha { margin: 0 !important; padding: 0 !important; }
  html body li.listagem-linha > ul { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 10px !important; }
  html body li.listagem-linha > ul::before, html body li.listagem-linha > ul::after { display: none !important; }
  html body li.listagem-linha > ul > li { width: auto !important; min-width: 0; margin: 0 !important; float: none !important; }
  html body .listagem li.listagem-linha > ul > li[class][class] { margin: 0 !important; }
  html body li.listagem-linha .listagem-item { display: flex !important; flex-direction: column !important; height: 100% !important; min-height: 0 !important; margin: 0 !important; }
  html body .listagem-item .imagem-produto { height: auto !important; }
  html body .listagem-item .info-produto { padding: 10px 12px 4px !important; }
  html body .listagem-item .nome-produto { margin: 0 0 6px !important; font-size: var(--ff-t-sm) !important; line-height: 1.35 !important; }
  html body .listagem-item .preco-produto, html body .listagem-item .preco-produto > div { margin: 0 !important; padding: 0 !important; min-height: 0 !important; }
  html body .listagem-item .preco-produto strong { margin: 4px 0 0 !important; font-size: var(--ff-t-md) !important; }
  /* botão Comprar do card: vermelho, largura toda, sem caixa alta */
  html body .listagem-item .acoes-produto-responsiva { position: static !important; top: auto !important; margin: auto 0 0 !important; padding: 6px 12px 12px !important; }
  html body .listagem-item .acoes-produto-responsiva .tag-comprar {
    display: flex !important; align-items: center; justify-content: center; width: 100% !important; height: 38px !important; margin: 0 !important; padding: 0 !important;
    border: 0 !important; border-radius: var(--ff-raio) !important; background: var(--ff-vermelho) !important; box-shadow: none !important; box-sizing: border-box;
  }
  html body .listagem-item .acoes-produto-responsiva .tag-comprar .titulo {
    color: #fff !important; font-size: var(--ff-t-sm) !important; font-weight: 600 !important; text-transform: lowercase !important; letter-spacing: 0 !important; line-height: 1 !important;
  }
  html body .listagem-item .acoes-produto-responsiva .tag-comprar .titulo::first-letter { text-transform: uppercase; }

  /* página do produto: cartões com menos respiro, frete com campo largo */
  html body.pagina-produto .principal:not(.botao) { padding: 20px 18px !important; }
  html body.pagina-produto .principal .cep, html body.pagina-produto .principal .cep form, html body.pagina-produto .principal .cep label { text-align: left !important; }
  html body.pagina-produto .principal .cep .input-append { display: flex !important; width: 100% !important; }
  html body.pagina-produto .principal .cep .input-append .input-cep { flex: 1 1 auto; width: auto !important; min-width: 0; }
  html body .abas-custom .tab-content { padding: 18px !important; }

  /* carrinho: cada item vira um cartão compacto (foto | nome + lixeira | quantidade + preço) */
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info) { border: 0 !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) {
    display: grid !important; grid-template-columns: 72px 1fr auto; grid-template-areas: "img nome nome" "img qtd preco"; position: relative;
    column-gap: 12px; row-gap: 10px; align-items: center; padding: 14px !important;
  }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td { display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; text-align: left !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td *:not(.quantidade):not(input) { border: 0 !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td::before,
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td::after { display: none !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(1) { grid-area: img; align-self: start; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(1) img { width: 72px !important; height: 72px !important; object-fit: contain; border: 1px solid var(--ff-linha) !important; border-radius: 10px; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(2) { grid-area: nome; align-self: start; padding-right: 34px !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(2) * { font-size: var(--ff-t-xs); }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(2) a { font-size: var(--ff-t-sm) !important; line-height: 1.35 !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(3) { grid-area: qtd; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(3) > * { margin: 0 !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(4) { grid-area: preco; text-align: right !important; }
  html body.pagina-carrinho .tabela-carrinho tbody tr:has(.produto-info):has(> td.conteiner-imagem) > td:nth-child(5) { position: absolute !important; top: 12px; right: 12px; width: auto !important; }
  html body.pagina-carrinho .tabela-carrinho tr.hidden { display: none !important; }
  html body.pagina-carrinho .tabela-carrinho tr.bg-dark td { padding: 16px 14px !important; }
  html body.pagina-carrinho .tabela-carrinho tr.bg-dark td, html body.pagina-carrinho .tabela-carrinho tr.bg-dark td * { text-align: left !important; }
  /* botões do carrinho empilhados: Finalizar compra em cima */
  html body.pagina-carrinho .acao-editar > .span12 { flex-direction: column-reverse !important; align-items: stretch !important; gap: 10px !important; width: 100% !important; }
  html body.pagina-carrinho .acao-editar > .span12 > * { width: 100% !important; margin: 0 !important; float: none !important; text-align: center; justify-content: center; box-sizing: border-box; }

  /* área do cliente: cartões com menos respiro; lista de desejos com nome legível */
  html body .caixa-sombreada, html body .abas-conteudo .caixa-sombreada, html body .abas-conteudo .caixa-dados, html body .conteudo .caixa-dados { padding: 20px 16px !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td { padding: 10px 4px !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td:first-child { width: 68px !important; padding-left: 0 !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3), html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(4) { width: 40px !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td.text-left, html body.pagina-favorito-listar .caixa-dados table tbody td.text-left * { font-size: var(--ff-t-sm) !important; line-height: 1.35 !important; }

  /* Fale conosco: uma coluna (formulário, depois Atendimento) */
  html body #modalContato { top: 12px !important; left: 10px !important; right: 10px !important; }
  html body #modalContato .modal-body { max-height: calc(100vh - 110px) !important; padding: 16px !important; }
  html body #modalContato .modal-body > .row-fluid, html body #modalContato .modal-body form > .row-fluid { flex-direction: column !important; align-items: stretch !important; gap: 16px !important; }
  html body #modalContato .modal-body .span6:first-child { flex: none !important; grid-template-columns: 1fr !important; }
  html body #modalContato .modal-body .span6:last-child { flex: none !important; }
  html body #modalContato .span6:first-child .control-group:last-child,
  html body #modalContato .span6:first-child .control-group:last-child .controls { display: flex !important; flex-direction: row !important; flex-wrap: wrap; gap: 10px !important; }
  html body #modalContato .span6:first-child .control-group:last-child .botao { margin: 0 !important; }

  /* newsletter: título em cima, campo na largura toda */
  html body #barraNewsletter { padding: 22px 0 !important; }
  html body #barraNewsletter .interno-conteudo { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; padding: 0 20px !important; }
  html body #barraNewsletter .texto-newsletter, html body #barraNewsletter .titulo { width: auto !important; text-align: left !important; line-height: 1.3 !important; padding: 0 !important; }
  html body #barraNewsletter .input-conteiner { flex: 1 1 auto !important; width: 100% !important; }

  /* rodapé: tudo alinhado à esquerda, seções separadas, categorias em 2 colunas */
  html body #rodape .institucional { padding: 36px 0 24px !important; }
  html body #rodape .institucional .span9 > .row-fluid { padding: 0 10px !important; }
  html body #rodape .institucional .span9 > .row-fluid > * { width: auto !important; float: none !important; margin: 0 0 26px !important; text-align: left !important; }
  html body #rodape .institucional .titulo, html body #rodape .institucional li, html body #rodape .institucional p { text-align: left !important; }
  html body #rodape .links-rodape-categorias ul { columns: 2; column-gap: 16px; }
  html body #rodape .links-rodape-categorias li { break-inside: avoid; line-height: 1.4 !important; margin: 0 0 9px !important; }
  html body #rodape .redes-sociais ul { justify-content: flex-start !important; }
  /* barra final: texto na largura toda, selo da plataforma embaixo, espaço para o WhatsApp */
  html body #rodape > div:last-child > .conteiner > .row-fluid { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; padding: 18px 0 90px !important; }
  html body #rodape > div:last-child > .conteiner > .row-fluid > * { width: 100% !important; }
  html body #rodape > div:last-child > .conteiner > .row-fluid > div:not(.span9) { max-width: none !important; text-align: left !important; }

  /* WhatsApp flutuante um pouco menor */
  html body .li-whatsapp a { width: 48px !important; height: 48px !important; right: 14px !important; bottom: 16px !important; }
  html body .li-whatsapp a i { font-size: 26px !important; }
}

/* ===== 35. CELULAR v2 (padrão de app de loja): cabeçalho compacto, vitrines em grade, barra de compra fixa ===== */
@media (max-width: 767px) {
  /* cabeçalho em uma linha: ☰ | logo | conta, carrinho; busca larga embaixo */
  html body #cabecalho { position: relative !important; padding: 0 !important; }
  html body #cabecalho .atalhos-mobile { position: absolute !important; top: 10px; right: 6px; left: auto !important; width: auto !important; z-index: 6; height: 44px !important; padding: 0 !important; margin: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; }
  html body #cabecalho .atalhos-mobile > ul { display: flex !important; gap: 0; height: 44px; margin: 0 !important; padding: 0 !important; }
  html body #cabecalho .atalhos-mobile > ul > li { display: none !important; }
  html body #cabecalho .atalhos-mobile > ul > li.fundo-principal,
  html body #cabecalho .atalhos-mobile > ul > li:has(> a.icon-user) { display: block !important; width: 44px !important; height: 44px !important; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; }
  html body #cabecalho .atalhos-mobile > ul > li.fundo-principal { order: 2; }
  html body #cabecalho .atalhos-mobile > ul > li > a { display: flex !important; align-items: center; justify-content: center; width: 44px !important; height: 44px !important; margin: 0 !important; padding: 0 !important; background: none !important; color: var(--ff-asfalto) !important; font-size: 0 !important; }
  html body #cabecalho .atalhos-mobile > ul > li > a::before { font-size: 21px !important; line-height: 1 !important; color: var(--ff-asfalto) !important; margin: 0 !important; }
  html body #cabecalho > .conteiner > .row-fluid { padding: 0 !important; }
  html body #cabecalho .span3 { height: 64px !important; min-height: 0 !important; margin: 0 !important; }
  html body #cabecalho .span3 .logo { display: flex !important; align-items: center; justify-content: center; height: 64px !important; margin: 0 !important; padding: 0 !important; }
  html body #cabecalho .span3 .logo a { display: block !important; width: auto !important; height: auto !important; line-height: 0 !important; }
  html body #cabecalho .span3 .logo img { position: static !important; height: 52px !important; width: auto !important; max-width: 170px !important; margin: 0 !important; }
  html body #cabecalho a.atalho-menu { position: absolute !important; top: 10px; left: 6px; z-index: 6; width: 44px !important; height: 44px !important; margin: 0 !important; background: none !important; color: var(--ff-asfalto) !important; }
  html body #cabecalho a.atalho-menu::before { color: var(--ff-asfalto) !important; font-size: 22px !important; }
  html body #cabecalho .conteudo-topo, html body #cabecalho .conteudo-topo .inferior { margin: 0 !important; }
  html body #cabecalho .busca-mobile { padding: 0 12px 12px !important; margin: 0 !important; }
  html body #cabecalho .busca-mobile .busca { width: 100% !important; margin: 0 !important; float: none !important; }
  /* iPhone: campos com 16px para o Safari não dar zoom ao tocar */
  html body #cabecalho .busca input, html body input, html body select, html body textarea { font-size: 16px !important; }

  /* categorias: pílulas de uma linha, só na página inicial, arrastar para o lado (sem setas) */
  html body:not(.pagina-inicial) #menuinsta { display: none !important; }
  html body #menuinsta { margin: 0 0 12px !important; }
  html body #menuinsta .slick-arrow { display: none !important; }
  html body #menuinsta .slick-list { margin: 0 0 0 9px !important; }
  html body #menuinsta .slick-slide { width: auto !important; padding: 0 3px !important; }
  html body #menuinsta .slick-slide a { width: auto !important; height: 36px !important; padding: 0 14px !important; border-radius: 999px !important; background: #F2F2F2 !important; }
  html body #menuinsta .titulo { white-space: nowrap !important; max-height: none !important; line-height: 36px !important; font-size: 13px !important; font-weight: 500 !important; }

  /* banner da home mais alto (texto legível), recortando pelo lado do texto */
  html body.pagina-inicial .secao-banners .flexslider .slides img { height: 190px !important; width: 100% !important; object-fit: cover; object-position: 12% center; }

  /* vitrines da home (Lançamentos, Mais vendidos): grade 2 × 3 em vez de carrossel de 1 card */
  html body .produtos-carrossel { margin: 0 !important; padding: 0 !important; }
  html body .produtos-carrossel .flexslider { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
  html body .produtos-carrossel .flex-viewport { overflow: visible !important; height: auto !important; }
  html body .produtos-carrossel .flex-viewport > ul { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; width: auto !important; transform: none !important; margin: 0 !important; }
  html body .produtos-carrossel .flex-viewport > ul > li { width: auto !important; min-width: 0; float: none !important; margin: 0 !important; }
  html body .produtos-carrossel .flex-viewport > ul > li.clone,
  html body .produtos-carrossel .flex-viewport > ul > li:nth-child(n+7 of :not(.clone)) { display: none !important; }
  html body .produtos-carrossel .flex-direction-nav, html body .produtos-carrossel .flex-control-nav { display: none !important; }
  html body .produtos-carrossel .listagem-item { height: 100% !important; margin: 0 !important; display: flex !important; flex-direction: column !important; }

  /* produto: quantidade e Comprar na mesma linha; linhas de divisão claras */
  html body.pagina-produto .principal .comprar { flex-direction: row !important; flex-wrap: wrap !important; align-items: stretch !important; gap: 10px !important; }
  html body.pagina-produto .principal .comprar .qtde-adicionar-carrinho { flex: 0 0 128px !important; width: 128px !important; margin: 0 !important; height: 48px !important; box-sizing: border-box; justify-content: space-between; }
  html body.pagina-produto .principal .comprar .botao-comprar { flex: 1 1 0 !important; width: auto !important; min-width: 0; height: 48px !important; margin: 0 !important; display: flex !important; align-items: center; justify-content: center; }
  html body.pagina-produto .principal .comprar .disponibilidade-produto { flex: 1 0 100% !important; border: 0 !important; }
  html body.pagina-produto .principal .preco-produto, html body.pagina-produto .principal .disponibilidade-produto, html body.pagina-produto .codigo-produto { border-color: var(--ff-linha) !important; }
  html body.pagina-produto .codigo-produto { border-bottom-width: 1px !important; }

  /* produto: barra fixa no rodapé da tela com preço + Comprar (sempre à mão) */
  html body.pagina-produto .acoes-flutuante.hidden-phone {
    display: flex !important; align-items: center; gap: 12px; position: fixed !important; top: auto !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
    width: auto !important; max-width: none !important; height: auto !important; margin: 0 !important; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)) !important; z-index: 1000;
    background: #fff !important; border: 0 !important; border-top: 1px solid var(--ff-linha) !important; border-radius: 0 !important; box-shadow: 0 -6px 18px rgba(0,0,0,.06) !important; transform: none !important; opacity: 1 !important;
  }
  html body.pagina-produto .acoes-flutuante > .image, html body.pagina-produto .acoes-flutuante > .nome-produto, html body.pagina-produto .acoes-flutuante > .close_float, html body.pagina-produto .acoes-flutuante .disponibilidade-produto { display: none !important; }
  html body.pagina-produto .acoes-flutuante .acoes-produto { display: flex !important; align-items: center; justify-content: space-between; gap: 12px; width: 100% !important; margin: 0 !important; padding: 0 !important; float: none !important; border: 0 !important; background: none !important; }
  html body.pagina-produto .acoes-flutuante .acoes-produto > div, html body.pagina-produto .acoes-flutuante .preco-produto, html body.pagina-produto .acoes-flutuante .preco-produto > div { margin: 0 !important; padding: 0 !important; float: none !important; width: auto !important; min-height: 0 !important; }
  html body.pagina-produto .acoes-flutuante .preco-produto { border: 0 !important; }
  html body.pagina-produto .acoes-flutuante .preco-promocional { display: block; margin: 0 !important; font-size: 20px !important; line-height: 1.2 !important; color: var(--ff-texto) !important; }
  html body.pagina-produto .acoes-flutuante .comprar { flex: 1 1 auto; min-width: 0; max-width: 220px; width: auto !important; margin: 0 !important; }
  html body.pagina-produto .acoes-flutuante .botao-comprar { display: flex !important; align-items: center; justify-content: center; gap: 8px; height: 48px !important; width: 100% !important; min-width: 0; box-sizing: border-box; margin: 0 !important; padding: 0 16px !important; border-radius: var(--ff-raio) !important; font-size: 15px !important; }
  html body.pagina-produto { padding-bottom: 76px !important; }
  html body.pagina-produto .li-whatsapp a { bottom: 88px !important; }

  /* carrinho: frete com rótulo à esquerda e campo na largura toda */
  html body.pagina-carrinho #formCalcularFrete { margin: 0 0 6px !important; }
  html body.pagina-carrinho #formCalcularFrete .control-group { align-items: stretch !important; }
  html body.pagina-carrinho #formCalcularFrete .control-label { align-self: flex-start !important; width: auto !important; text-align: left !important; }
  html body.pagina-carrinho #formCalcularFrete .controls { flex-direction: column !important; align-items: flex-start !important; gap: 8px; }
  html body.pagina-carrinho #formCalcularFrete .input-append { width: 100% !important; }
  html body.pagina-carrinho #formCalcularFrete .input-append input { flex: 1 1 auto !important; width: auto !important; min-width: 0; }
  html body.pagina-carrinho #formCalcularFrete .help-inline { padding: 0 !important; }

  /* rodapé: lista de categorias sai no celular (já está no menu ☰) */
  html body #rodape .links-rodape-categorias { display: none !important; }
}

/* ===== 36. SEM ROLAGEM ALÉM DO CONTEÚDO: nada de faixa branca nas laterais nem "elástico" no fim ===== */
html, body { overscroll-behavior: none; }
html, body { overflow-x: hidden; }
@supports (overflow: clip) { html, body { overflow-x: clip; } }
@media (max-width: 767px) {
  /* causas da sobra de 10px na lateral: grade do rodapé e o contêiner do menu ☰ */
  html body #rodape .institucional .span9 > .row-fluid { box-sizing: border-box !important; }
  html body #cabecalho .menu.superior { left: 0 !important; right: 0 !important; width: auto !important; max-width: 100% !important; }
}

/* ===== 37. LISTA DE DESEJOS v2, MENU DA CONTA SEM MAIÚSCULAS, CEP NA LINHA DO ENDEREÇO ===== */
/* abas e menu lateral da conta: só a primeira letra maiúscula */
html body .abas-conta li a, html body .conta-menu .menu-simples a { text-transform: lowercase !important; }
html body .abas-conta li a::first-letter, html body .conta-menu .menu-simples a::first-letter { text-transform: uppercase; }

/* lista de desejos: cada produto em uma linha limpa (foto | nome | Comprar | lixeira) */
html body.pagina-favorito-listar .caixa-dados table, html body.pagina-favorito-listar .caixa-dados table tbody { display: block !important; width: 100% !important; margin: 0 !important; border: 0 !important; }
html body.pagina-favorito-listar .caixa-dados table tbody tr {
  display: grid !important; grid-template-columns: 72px minmax(0, 1fr) auto auto; align-items: center; column-gap: 16px;
  padding: 16px 0 !important; border: 0 !important; border-bottom: 1px solid var(--ff-linha) !important; background: none !important;
}
html body.pagina-favorito-listar .caixa-dados table tbody tr:last-child { border-bottom: 0 !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td { display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; background: none !important; text-align: left !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td:first-child .imagem-produto { display: block !important; width: 72px !important; height: 72px !important; margin: 0 !important; padding: 4px !important; border: 1px solid var(--ff-linha) !important; border-radius: 12px !important; background: #fff !important; box-sizing: border-box; }
html body.pagina-favorito-listar .caixa-dados table tbody td:first-child img { width: 100% !important; height: 100% !important; object-fit: contain; border: 0 !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td.text-left a { display: block; color: var(--ff-texto) !important; font-size: var(--ff-t-base) !important; font-weight: 500 !important; line-height: 1.4 !important; text-decoration: none !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td.text-left a:hover { color: var(--ff-vermelho) !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3) a {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; width: auto !important; height: 40px !important; padding: 0 18px !important;
  border: 0 !important; border-radius: var(--ff-raio) !important; background: var(--ff-vermelho) !important; color: #fff !important; text-decoration: none !important; box-shadow: none !important;
}
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3) a::after { content: "Comprar"; font-family: var(--ff-fonte); font-size: var(--ff-t-sm); font-weight: 600; }
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3) a:hover { background: var(--ff-vermelho-hover) !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3) a i { color: #fff !important; font-size: 14px !important; margin: 0 !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(4) a {
  display: inline-flex !important; align-items: center; justify-content: center; width: 40px !important; height: 40px !important; padding: 0 !important;
  border: 1px solid var(--ff-linha) !important; border-radius: var(--ff-raio) !important; background: #fff !important; box-shadow: none !important;
}
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(4) a i { color: var(--ff-suave) !important; font-size: 15px !important; margin: 0 !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(4) a:hover { border-color: var(--ff-vermelho) !important; }
html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(4) a:hover i { color: var(--ff-vermelho) !important; }
/* compartilhar a lista: faixa leve abaixo dos produtos */
html body.pagina-favorito-listar ul.caixa-info {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 12px; row-gap: 8px;
  margin: 8px 0 0 !important; padding: 18px 0 0 !important; border: 0 !important; border-top: 1px solid var(--ff-linha) !important; border-radius: 0 !important; background: none !important; text-align: left !important;
}
html body.pagina-favorito-listar ul.caixa-info > li { margin: 0 !important; padding: 0 !important; }
html body.pagina-favorito-listar ul.caixa-info > li:first-child { grid-column: 1 / -1; }
html body.pagina-favorito-listar ul.caixa-info h5 { margin: 0 !important; color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; font-weight: 500 !important; }
html body.pagina-favorito-listar ul.caixa-info input { width: 100% !important; height: 40px !important; margin: 0 !important; padding: 0 14px !important; border: 1px solid var(--ff-linha) !important; border-radius: var(--ff-raio) !important; background: #FAFAFA !important; color: var(--ff-suave) !important; font-size: var(--ff-t-sm) !important; text-align: left !important; box-shadow: none !important; box-sizing: border-box; }
html body.pagina-favorito-listar ul.caixa-info > li:last-child { display: flex; align-items: center; gap: 8px; line-height: 0; }
@media (max-width: 767px) {
  html body.pagina-favorito-listar .caixa-dados table tbody tr { grid-template-columns: 64px minmax(0, 1fr) auto auto; column-gap: 10px; }
  html body.pagina-favorito-listar .caixa-dados table tbody td:first-child .imagem-produto { width: 64px !important; height: 64px !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td.text-left a { font-size: var(--ff-t-sm) !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3) a { width: 40px !important; padding: 0 !important; }
  html body.pagina-favorito-listar .caixa-dados table tbody td:nth-child(3) a::after { content: none; }
  html body.pagina-favorito-listar ul.caixa-info { grid-template-columns: 1fr; }
}

/* endereço: CEP (estreito) e Endereço na mesma linha, sem espaço sobrando */
@media (min-width: 768px) {
  html body[class*="pagina-conta-endereco"] .caixa-sombreada fieldset { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada fieldset > .control-group { grid-column: span 3; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="cep"]) { grid-column: span 2 !important; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="endereco"]) { grid-column: span 4 !important; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="nome"]) { grid-column: 1 / -1 !important; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .controls input[name="cep"]:not([type="radio"]):not([type="checkbox"]) { width: auto !important; flex: 1 1 0 !important; min-width: 0; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="cep"]) .controls { flex-wrap: nowrap !important; }
  html body[class*="pagina-conta-endereco"] .caixa-sombreada .control-group:has([name="cep"]) .controls a { white-space: nowrap; font-size: var(--ff-t-sm); }
}

/* ===== 38. NEWSLETTER: campo e "Enviar" sem canto branco (campo arredondado dos dois lados, botão por cima) ===== */
html body #barraNewsletter .input-conteiner { position: relative; background: none !important; }
html body #barraNewsletter .input-conteiner input { border-radius: 999px !important; padding-right: 116px !important; }
html body #barraNewsletter .input-conteiner .botao-input, html body #barraNewsletter .input-conteiner button { border-radius: 999px !important; }
