.pagina-produto .ns-product-attributes .atributos ul:not(.dropdown) {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0;
  margin: 0;
}

.pagina-produto .ns-product-attributes .atributos ul:not(.dropdown) li {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Botões de variação */
.pagina-produto .ns-product-attributes .atributos ul:not(.dropdown) li a {
  display: block;
  width: 100%;
  border: 1px solid #dad5c6;
  border-radius: 5px;
  padding: 10px 14px;
  background-color: #fff;
  color: #1e1e1e;
  font-size: 14.5px;
  font-weight: 500;
  letter-spacing: 0.2px;
  text-align: center;
  transition: background-color 0.2s ease, border-color 0.2s ease;
  box-shadow: none !important;
  outline: none !important;
}

/* Remove estilos herdados do span */
.pagina-produto .ns-product-attributes .atributos ul:not(.dropdown) li a span {
  all: unset !important;
}

/* Hover com leve suavidade */
.pagina-produto .ns-product-attributes .atributos ul:not(.dropdown) li a:hover {
  background-color: #fdfaf3;
  border-color: #c7a449;
  cursor: pointer;
}

/* Estilo da opção ativa (selecionada) */
.pagina-produto .ns-product-attributes .atributos ul:not(.dropdown) li.active a {
  border-color: #c7a449 !important;
  background-color: #fffaf1 !important;
  font-weight: 600;
  color: #000;
  border-width: 1.5px;
}

/* Botão da variação esgotada */
.atributo-item.indisponivel {
  position: relative;
  background-color: #f9f9f9 !important;
  border: 1px solid #ddd !important;
  color: #aaa !important;
  cursor: pointer;
  font-weight: 500;
  padding-right: 70px !important; /* espaço para o selo */
}

/* Tarja “ESGOTADO” elegante à direita */
.atributo-item.indisponivel::after {
  content: "ESGOTADO";
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
  background-color: #e0e0e0;
  color: #666;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 10px;
  pointer-events: none;
}

/* Remove o ícone vermelho de 'x' */
.atributo-item.indisponivel .icon-remove {
  display: none !important;
}

/* Se a variação estiver ativa e indisponível, desativa a borda dourada */
li.ns-long-text.active.atributo-item.indisponivel {
  border: 1px solid #ddd !important;
  background-color: #f9f9f9 !important;
}


/* ===== Tarja de aviso — FRENESI (checkout + carrinho) ===== */
.cn-tarja-checkout{
  position: relative;
  width: 100%;
  background: #fff9df;            /* amarelo suave */
  border: 1px solid #f5d26b;       /* borda definida */
  border-radius: 10px;
  padding: 14px 18px 14px 22px;    /* sem ícone: recuo normal + espaço da borda */
  margin: 18px 0 12px;
  font-size: 15px;
  line-height: 1.45;
  text-align: left;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

/* Borda de destaque à esquerda */
.cn-tarja-checkout::before{
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 6px;
  background: #f4c542;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

/* Conteúdo (sem ícone) */
.cn-tarja-checkout .cn-alert{
  display: block;
  font-weight: 600;
}
/* Garante que qualquer <i> presente seja ocultado (sem ícone) */
.cn-tarja-checkout .cn-alert i{
  display: none !important;
}

/* Negritos (“Atenção” e “72 horas”) sem desalinho */
.cn-tarja-checkout strong{
  font-weight: 700;
  line-height: inherit;
  vertical-align: baseline;
  color: #000;
}

/* ===== Ajuste só para o CARRINHO ===== */
.cn-tarja-carrinho{
  margin-top: 16px;               /* respiro extra */
  margin-bottom: 10px;
}

/* ===== Responsivo (mobile) ===== */
@media (max-width: 480px){
  .cn-tarja-checkout{
    padding: 10px 12px 10px 18px; /* mais compacto no mobile */
    margin: 12px 0 10px;
    font-size: 14px;
    line-height: 1.4;
    border-radius: 8px;
  }
  .cn-tarja-checkout::before{ width: 4px; } /* borda lateral mais fina */
}

/* ultra-compacto para telas estreitas */
@media (max-width: 360px){
  .cn-tarja-checkout{
    padding: 9px 10px 9px 16px;
    font-size: 13.5px;
  }
}

/* Melhor quebra de linha em pt-BR */
.cn-tarja-checkout{
  word-break: normal;
  overflow-wrap: anywhere;
  hyphens: auto;
}

/* --------- Clube de pontos no carrinho (linha do resumo) --------- */
.tabela-carrinho .line-18 .cn-cashback{
  /* quebra o alinhamento central padrão da tabela */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;

  /* destaque visual elegante */
  background: #f7f6ea;
  border: 1px solid #efe5b6;
  border-radius: 8px;
  padding: 10px 12px;
  margin: 8px 0 14px;

  /* tipografia */
  text-align: left;
  font-size: 15px;
  line-height: 1.45;
  color: #444;
}

/* enfatiza o valor em pontos */
.tabela-carrinho .line-18 .cn-cashback strong{
  font-weight: 700;
  color: #000;
}

/* opcional: um pequeno “marcador” à esquerda (sem emoji) */
.tabela-carrinho .line-18 .cn-cashback::before{
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #d1b24a;         /* dourado sutil */
  box-shadow: 0 0 0 3px #f1e5a6 inset;
  display: inline-block;
}

/* corrige heranças da tabela que podem recentralizar o texto */
.tabela-carrinho .line-18 .cn-cashback,
.tabela-carrinho .line-18 .cn-cashback *{
  vertical-align: baseline;
}

/* --------- Versão mobile (mais compacto) --------- */
@media (max-width: 768px){
  .tabela-carrinho .line-18 .cn-cashback{
    font-size: 14px;
    padding: 9px 10px;
    margin: 8px 0 12px;
  }
}
@media (max-width: 360px){
  .tabela-carrinho .line-18 .cn-cashback{
    font-size: 13.5px;
    padding: 8px 9px;
  }
}

/* ===== Cashback na PÁGINA DE PRODUTO (PDP) ===== */
.pagina-produto .cn-cashback{
  display: flex;                /* texto em linha, sem quebra estranha */
  align-items: center;
  gap: 8px;
  background: #f7f6ea;
  border: 1px solid #efe5b6;
  border-radius: 8px;
  padding: 8px 10px;
  margin: 8px 0 14px;           /* respiro antes dos botões */
  text-align: left;
  font-size: 15px;
  line-height: 1.45;
  color: #444;
  max-width: 100%;
}

.pagina-produto .cn-cashback span{
  font-size: 15px;
  line-height: 1.45;
  color: inherit;
}

.pagina-produto .cn-cashback strong{
  font-weight: 700;
  color: #000;
}

/* Evita heranças do tema que recentralizam texto ou mudam espaçamento */
.pagina-produto .cn-cashback,
.pagina-produto .cn-cashback *{
  vertical-align: baseline;
  text-transform: none;
  letter-spacing: normal;
}

/* ===== Mobile (PDP) ===== */
@media (max-width: 768px){
  .pagina-produto .cn-cashback{
    font-size: 14px;
    padding: 7px 9px;
    margin: 8px 0 12px;
  }
  .pagina-produto .cn-cashback span{ font-size: 14px; }
}
@media (max-width: 360px){
  .pagina-produto .cn-cashback{
    font-size: 13.5px;
    padding: 6px 8px;
  }
}

/* ===== Destaque nas categorias do menu – compatível com editor LI ===== */

/* Links do menu principal */
.ns-section-main-menu .ns-menu > li > a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 12px;
  transition: background-color .25s ease, color .25s ease, transform .15s ease, box-shadow .25s ease;
}

/* Hover/Focus: pill com leve elevação */
.ns-section-main-menu .ns-menu > li:hover > a,
.ns-section-main-menu .ns-menu > li:focus-within > a {
  background-color: rgba(212, 175, 55, 0.12); /* dourado translúcido */
  color: #a67c00; /* dourado escuro do texto */
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* Barrinha dourada animada sob o texto */
.ns-section-main-menu .ns-menu > li > a::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 6px;
  height: 2px;
  background: linear-gradient(90deg, #d4af37, #a67c00);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
.ns-section-main-menu .ns-menu > li:hover > a::after,
.ns-section-main-menu .ns-menu > li:focus-within > a::after {
  transform: scaleX(1);
}

/* Mantém o destaque quando a categoria está ativa/aberta */
.ns-section-main-menu .ns-menu > li.em-active > a {
  background-color: rgba(212, 175, 55, 0.12);
  color: #a67c00;
}

/* Acessibilidade: reduz animações se o usuário preferir */
@media (prefers-reduced-motion: reduce) {
  .ns-section-main-menu .ns-menu > li > a,
  .ns-section-main-menu .ns-menu > li > a::after {
    transition: none;
  }
}

/* Mobile: remove a barrinha (sem hover no toque) */
@media (max-width: 992px) {
  .ns-section-main-menu .ns-menu > li > a {
    padding: 12px 10px;
    border-radius: 10px;
  }
  .ns-section-main-menu .ns-menu > li > a::after {
    display: none;
  }
}

/* ===== Cards de produto – melhora visual e interação ===== */

/* Card base */
.listagem .listagem-item {
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 2px 10px rgba(0,0,0,.03);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

/* Hover: “lift” elegante */
.listagem .listagem-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.10);
}

/* Área interna do card */
.listagem .listagem-item .produto-sobrepor {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  padding: 14px 14px 16px;
}

/* Imagem maior e centralizada */
.listagem .listagem-item .imagem-produto.portrait {
  height: 260px;                 /* ajuste fino conforme seu grid */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 -14px;              /* “sangra” pros lados pra ganhar área */
}
.listagem .listagem-item .imagem-produto img {
  max-height: 100%;
  width: auto;
  object-fit: contain;
  transition: transform .25s ease;
}
.listagem .listagem-item:hover .imagem-produto img {
  transform: scale(1.04);
}

/* Título: 2 linhas, corte limpo */
.listagem .listagem-item .nome-produto,
.listagem .listagem-item .nome-produto a {
  font-weight: 600;
  line-height: 1.25;
  color: #222;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 3.2em; /* garante alinhamento entre cards */
}

/* Estrelas/avaliação mais discreta */
.listagem .listagem-item .rating,
.listagem .listagem-item .avaliacoes {
  opacity: .75;
  font-size: 12px;
}

/* Preço: hierarquia clara */
.listagem .listagem-item .preco {
  display: grid;
  gap: 4px;
}
.listagem .listagem-item .preco .preco-venda strong {
  font-size: 20px;
  color: #a67c00;                  /* dourado FRENESI */
  font-weight: 700;
}
.listagem .listagem-item .preco .parcelamento,
.listagem .listagem-item .preco .preco-venda small,
.listagem .listagem-item .preco .preco-promocional small {
  font-size: 12px;
  color: #555;
}

/* Botão Comprar: aparece só no hover (desktop) e ocupa largura total */
.listagem .listagem-item .acoes-produto-responsiva {
  margin-top: 6px;
}
.listagem .listagem-item .acoes-produto-responsiva .botao-comprar {
  width: 100%;
  border-radius: 10px;
  padding: 10px 12px;
  font-weight: 600;
  background: #a67c00;
  border: 1px solid #a67c00;
  color: #fff;
  transition: filter .18s ease, transform .12s ease;
}
.listagem .listagem-item .acoes-produto-responsiva .botao-comprar:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

/* Esconde o bloco do botão até passar o mouse (desktop) */
@media (min-width: 993px) {
  .listagem .listagem-item .acoes-produto-responsiva { opacity: 0; transform: translateY(4px); transition: .18s ease; }
  .listagem .listagem-item:hover .acoes-produto-responsiva { opacity: 1; transform: translateY(0); }
}

/* Badges (pré-venda, % off) mais sutis para não competir com o frasco */
.listagem .listagem-item .flag,
.listagem .listagem-item .flags {
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.12));
}

/* Mobile: menos zoom, mais toque */
@media (max-width: 768px) {
  .listagem .listagem-item .imagem-produto.portrait { height: 220px; margin: 0; }
  .listagem .listagem-item:hover .imagem-produto img { transform: none; }
  .listagem .listagem-item .acoes-produto-responsiva { opacity: 1; transform: none; } /* já visível no mobile */
}

/* RODAPÉ */

.ns-footer {
  background: #111; /* Preto fosco */
  color: #f5f5f5; /* Cinza claro */
  padding: 40px 20px;
  font-size: 16px;
}

.ns-footer h4 {
  color: #d4af37; /* Dourado */
  font-weight: bold;
  margin-bottom: 15px;
  text-transform: uppercase;
}

.ns-footer a {
  color: #f5f5f5;
  text-decoration: none;
  transition: color 0.3s;
}

.ns-footer a:hover {
  color: #d4af37;
}

.ns-footer .social-icons {
  display: flex;
  gap: 15px;
  margin-top: 20px;
}

.ns-footer .social-icons a {
  font-size: 20px;
  color: #f5f5f5;
}

.ns-footer .social-icons a:hover {
  color: #d4af37;
}

/* Esconder filtros indesejáveis – cobre todas as variações de markup */
.pagina-busca .lateral,
.pagina-categoria .lateral{
  /* nada aqui, só para escopo */
}

/* 1) Quando existe a classe faceta-* */
.pagina-busca  .lateral .filtro-coluna.faceta-modelo,
.pagina-categoria .lateral .filtro-coluna.faceta-modelo,
.pagina-busca  .lateral .filtro-coluna.faceta-departamento,
.pagina-categoria .lateral .filtro-coluna.faceta-departamento,
.pagina-busca  .lateral .filtro-coluna.faceta-cor,
.pagina-categoria .lateral .filtro-coluna.faceta-cor,
.pagina-busca  .lateral .filtro-coluna.faceta-peso-liquido,
.pagina-categoria .lateral .filtro-coluna.faceta-peso-liquido{
  display: none !important;
}

/* 2) Quando o bloco vem como ".filtro.lista.borda-principal" com data-original-title */
.pagina-busca  .lateral .filtro.lista.borda-principal[data-original-title*="Modelo"],
.pagina-categoria .lateral .filtro.lista.borda-principal[data-original-title*="Modelo"],
.pagina-busca  .lateral .filtro.lista.borda-principal[data-original-title*="Departamento"],
.pagina-categoria .lateral .filtro.lista.borda-principal[data-original-title*="Departamento"],
.pagina-busca  .lateral .filtro.lista.borda-principal[data-original-title*="Cor"],
.pagina-categoria .lateral .filtro.lista.borda-principal[data-original-title*="Cor"],
.pagina-busca  .lateral .filtro.lista.borda-principal[data-original-title*="Peso Líquido"],
.pagina-categoria .lateral .filtro.lista.borda-principal[data-original-title*="Peso Líquido"]{
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 3) (Opcional) remove qualquer linha/borda que sobrou na coluna */
.pagina-busca  .lateral .borda-principal,
.pagina-categoria .lateral .borda-principal{
  border-top: 0 !important;
}

/* Esconder "Filtrar por Cor" (todas as variações) */
.pagina-categoria .lateral .filtro-coluna.faceta-cor,
.pagina-busca     .lateral .filtro-coluna.faceta-cor,
.pagina-categoria .lateral .filtro.lista.borda-principal[data-original-title*="Cor"],
.pagina-busca     .lateral .filtro.lista.borda-principal[data-original-title*="Cor"],
.pagina-categoria .lateral .filtro.atributos.borda-principal[data-original-title*="Cor"],
.pagina-busca     .lateral .filtro.atributos.borda-principal[data-original-title*="Cor"],
.pagina-categoria .lateral .filtro.lista.borda-principal[title*="Cor"],
.pagina-busca     .lateral .filtro.lista.borda-principal[title*="Cor"],
.pagina-categoria .lateral .filtro.atributos.borda-principal[title*="Cor"],
.pagina-busca     .lateral .filtro.atributos.borda-principal[title*="Cor"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}




/* Visual mais clean para os filtros sem JS */
.pagina-busca .secao-principal .coluna .lateral .borda-principal,
.pagina-categoria .secao-principal .coluna .lateral .borda-principal {
  border: 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
  padding: 12px;
  margin: 14px 0;
}

.pagina-busca .lateral .borda-principal h4,
.pagina-categoria .lateral .borda-principal h4 {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 8px;
}

/* ===== LATERAL CLEAN + DENSA (sem JS) ===== */

/* Cartões */
.pagina-categoria .lateral .borda-principal,
.pagina-busca     .lateral .borda-principal{
  background:#fff;
  border:1px solid rgba(0,0,0,0.06);
  border-radius:14px;
  box-shadow:0 6px 14px rgba(0,0,0,0.06);
  padding:10px 12px;
  margin:12px 0;
}

/* Títulos */
.pagina-categoria .lateral .borda-principal h4,
.pagina-busca     .lateral .borda-principal h4{
  margin:0 0 6px !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.02em;
  color:#111;
}

/* Lista mais densa */
.pagina-categoria .lateral .borda-principal .lista,
.pagina-busca     .lateral .borda-principal .lista{
  margin:0; padding:4px 0 0; list-style:none;
}
.pagina-categoria .lateral .borda-principal .lista li,
.pagina-busca     .lateral .borda-principal .lista li{
  margin:0;
}
.pagina-categoria .lateral .borda-principal .lista li + li,
.pagina-busca     .lateral .borda-principal .lista li + li{
  border-top:1px dashed rgba(0,0,0,0.06);
}

.pagina-categoria .lateral .borda-principal .lista li a,
.pagina-busca     .lateral .borda-principal .lista li a{
  display:flex; align-items:center; justify-content:space-between;
  gap:8px;
  padding:8px 8px;
  border-radius:10px;
  text-decoration:none !important;
  color:#1c1c1c;
  transition:background .2s ease, transform .15s ease;
}
.pagina-categoria .lateral .borda-principal .lista li a:hover,
.pagina-busca     .lateral .borda-principal .lista li a:hover{
  background:rgba(0,0,0,0.035);
  transform:translateX(1px);
}

/* Item ativo bem marcado */
.pagina-categoria .lateral .borda-principal .lista li.ativo > a,
.pagina-categoria .lateral .borda-principal .lista li.active > a,
.pagina-categoria .lateral .borda-principal .lista a[aria-current="page"],
.pagina-busca     .lateral .borda-principal .lista li.ativo > a,
.pagina-busca     .lateral .borda-principal .lista li.active > a,
.pagina-busca     .lateral .borda-principal .lista a[aria-current="page"]{
  background:rgba(0,0,0,0.045);
  border-left:3px solid #C8A957;  /* dourado FRENESI */
  padding-left:10px;
  font-weight:700;
}

/* Coluna fixa ao rolar (desktop) */
@media (min-width:1024px){
  .pagina-categoria .coluna .lateral,
  .pagina-busca     .coluna .lateral{
    position:sticky; top:110px;  /* ajuste conforme seu topo */
  }
}

/* ===== Chips no mobile só para o 1º bloco (DECANTS) ===== */
@media (max-width: 991px){
  /* transforma a primeira lista em chips roláveis na horizontal */
  .pagina-categoria .lateral > .borda-principal:first-of-type .lista,
  .pagina-busca     .lateral > .borda-principal:first-of-type .lista{
    display:flex; flex-wrap:nowrap; gap:8px;
    overflow-x:auto; padding:6px 2px 8px;
    border:0;
  }
  .pagina-categoria .lateral > .borda-principal:first-of-type .lista li,
  .pagina-busca     .lateral > .borda-principal:first-of-type .lista li{
    flex:0 0 auto; border:0 !important;
  }
  .pagina-categoria .lateral > .borda-principal:first-of-type .lista li a,
  .pagina-busca     .lateral > .borda-principal:first-of-type .lista li a{
    border:1px solid rgba(0,0,0,0.08);
    border-radius:999px;
    padding:8px 12px;
    background:#fff;
  }
  /* remove sombra extra e dá respiro geral no mobile */
  .pagina-categoria .lateral .borda-principal,
  .pagina-busca     .lateral .borda-principal{
    box-shadow:0 4px 10px rgba(0,0,0,0.04);
    border-radius:12px;
  }
  .pagina-categoria .lateral,
  .pagina-busca     .lateral{ margin-right:0; }
}
