/* ================================
   MAJESTAD FRAGRÂNCIAS – TEMA LUXO
   ================================ */

/* Fundo geral e tipografia */
body, html {
    background: #050608 !important;
    color: #e5e5e5 !important;
    font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Títulos em estilo mais sofisticado */
h1, h2, h3, .titulo, .titulo-categoria {
    font-family: "Playfair Display", "Times New Roman", serif !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #f4d38c;
}

/* -----------------------
   TOPO / CABEÇALHO
   ----------------------- */

/* Barra superior (telefone, WhatsApp) */
.top-bar,
.barra-topo,
#cabecalho .atalhos {
    background: #050608 !important;
    border-bottom: 1px solid #8b6b2b !important;
    color: #f4d38c !important;
}

.top-bar a,
.barra-topo a,
#cabecalho .atalhos a {
    color: #f4d38c !important;
    font-size: 13px;
}

.top-bar a:hover,
.barra-topo a:hover,
#cabecalho .atalhos a:hover {
    color: #ffe3a6 !important;
}

/* Área do logo / busca / carrinho */
#cabecalho,
.header,
.cabecalho {
    background: radial-gradient(circle at top, #1a1410 0, #050608 55%) !important;
    padding: 10px 0 15px;
}

/* Garante respiro ao redor da logo (seu banner novo) */
#cabecalho .logo,
.header .logo,
.cabecalho .logo {
    text-align: center;
    margin: 8px 0 10px;
}

#cabecalho .logo img,
.header .logo img,
.cabecalho .logo img {
    max-height: 80px;
}

/* Campo de busca */
.busca,
#form-busca,
#busca,
#formulario-busca {
    background: transparent !important;
}

.busca input,
#form-busca input,
#busca input {
    background: #121212 !important;
    border: 1px solid #8b6b2b !important;
    color: #ffe3a6 !important;
    border-radius: 4px;
}

.busca .botao-busca,
#form-busca button {
    background: #d4af37 !important;
    color: #050608 !important;
    border-radius: 4px;
}

/* -----------------------
   MENU PRINCIPAL
   ----------------------- */

.menu,
.menu-superior,
#menu {
    background: #050608 !important;
    border-top: 1px solid #8b6b2b;
    border-bottom: 1px solid #8b6b2b;
}

.menu a,
.menu-superior a,
#menu a {
    color: #f4d38c !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 13px;
}

.menu a:hover,
.menu-superior a:hover,
#menu a:hover,
.menu .active > a {
    color: #ffe3a6 !important;
    border-bottom: 2px solid #d4af37;
}

/* -----------------------
   VITRINE / PRODUTOS
   ----------------------- */

/* Fundo geral da área central */
.corpo, .conteudo, .conteiner {
    background: transparent !important;
}

/* Caixas de produto */
.listagem .listagem-item,
.listagem.com-caixa .listagem-item {
    background: #111013 !important;
    border-radius: 10px;
    border: 1px solid rgba(212, 175, 55, 0.25) !important;
    overflow: hidden;
    transition: transform .18s ease-out, box-shadow .18s ease-out, border-color .18s ease-out;
}

/* Hover com sensação premium */
.listagem .listagem-item:hover,
.listagem.com-caixa .listagem-item:hover {
    transform: translateY(-4px);
    border-color: #d4af37 !important;
    box-shadow: 0 14px 28px rgba(0,0,0,.6);
}

/* Imagem do produto */
.listagem .listagem-item .imagem-produto {
    background: radial-gradient(circle at top, #2a2017 0, #111013 80%);
    border-bottom: 1px solid rgba(212, 175, 55, 0.2);
}

/* Nome do produto */
.listagem .listagem-item .nome-produto,
.listagem .listagem-item .info-produto a.nome-produto {
    color: #f9f9f9 !important;
    font-weight: 500;
    min-height: 60px;
}

/* Preços */
.preco-produto,
.preco-venda,
.preco-promocional,
.listagem .listagem-item .preco-produto {
    color: #ffe3a6 !important;
    font-weight: 700;
}

.preco-produto s.preco-venda {
    color: #a1a1a1 !important;
}

/* Botão “Ver mais” / “Comprar” */
.listagem .listagem-item .acoes-produto-responsiva .botao,
.listagem .listagem-item .botao,
.product-buy-button,
.btn-comprar {
    background: #d4af37 !important;
    color: #050608 !important;
    border-radius: 999px !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 11px;
}

.listagem .listagem-item .acoes-produto-responsiva .botao:hover,
.listagem .listagem-item .botao:hover,
.product-buy-button:hover,
.btn-comprar:hover {
    background: #ffe3a6 !important;
}

/* Badge de desconto (quando existir) */
.flag-promocao,
.flag-desconto,
.desconto {
    background: #d4af37 !important;
    color: #050608 !important;
    text-transform: uppercase;
    font-weight: 700;
}

/* -----------------------
   NEWSLETTER + RODAPÉ
   ----------------------- */

.newsletter,
#newsletter {
    background: #111013 !important;
    border-top: 1px solid #8b6b2b;
    border-bottom: 1px solid #8b6b2b;
}

.newsletter h3,
.newsletter .titulo {
    color: #f4d38c !important;
    text-transform: uppercase;
}

.newsletter input {
    background: #050608 !important;
    border: 1px solid #8b6b2b !important;
    color: #ffe3a6 !important;
}

.newsletter button,
.newsletter .botao {
    background: #d4af37 !important;
    color: #050608 !important;
}

/* Rodapé */
#rodape,
.footer,
.rodape {
    background: #050608 !important;
    border-top: 1px solid #8b6b2b;
    color: #cfcfcf !important;
}

#rodape a,
.footer a,
.rodape a {
    color: #f4d38c !important;
}

#rodape a:hover,
.footer a:hover,
.rodape a:hover {
    color: #ffe3a6 !important;
}

/* Créditos finais */
#rodape .direitos,
.footer .direitos {
    font-size: 11px;
    color: #8e8e8e !important;
}

/* -----------------------
   MOBILE – pequenos ajustes
   ----------------------- */
@media (max-width: 768px) {

    /* mais respiro entre os cards */
    .listagem .listagem-item {
        margin-bottom: 14px;
    }

    /* menu mais legível no mobile */
    .menu a,
    #menu a {
        font-size: 12px;
        padding: 8px 10px;
    }
}
