/* TEMA ESSÊNCIA NATURAL - por Gemini AI */
/* Adaptação para Loja Integrada com foco em produtos naturais */

/* --- 1. FONTES E CORES GLOBAIS --- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&family=Lato:wght@400;700&display=swap');

body {
    background-color: #F7F6F2 !important; /* Fundo bege suave */
    font-family: 'Lato', sans-serif;
    color: #333333; /* Cor do texto principal */
}

h1, h2, h3, h4, h5, h6, .titulo, .nome-produto {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    color: #333333;
}

a {
    color: #5E8C61; /* Verde nos links */
    transition: all 0.3s ease;
}

a:hover {
    color: #333333;
    text-decoration: none;
}

/* --- 2. CABEÇALHO E MENU --- */
.cabecalho {
    background-color: #FFFFFF;
    border-bottom: 2px solid #F7F6F2;
}

.menu.superior .nivel-um > li > a {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 14px;
    color: #333333;
}

/* --- 3. BOTÕES (Call to Action) --- */
.botao-comprar, .botao.principal, .carrinho-actions .botao {
    background-color: #5E8C61 !important; /* Verde principal */
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 25px !important;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    transition: background-color 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.botao-comprar:hover, .botao.principal:hover {
    background-color: #4A6F4C !important; /* Verde mais escuro no hover */
    box-shadow: 0 6px 8px rgba(0,0,0,0.15);
}

/* --- 4. VITRINE DE PRODUTOS --- */
.listagem .produtos-listagem li .info-produto {
    background-color: #FFFFFF;
    border: 1px solid #EAE8E1;
    border-radius: 8px;
    padding: 15px;
    transition: box-shadow 0.3s ease;
}

.listagem .produtos-listagem li .info-produto:hover {
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.listagem .nome-produto {
    height: auto;
    min-height: 40px; /* Garante alinhamento */
    font-size: 16px;
    font-weight: 500;
}

.listagem .preco-produto .preco-promocional,
.componente-preco .preco-promocional {
    color: #D4A373; /* Cor de acento para promoções */
    font-size: 22px;
    font-weight: 700;
}

/* --- 5. PÁGINA DO PRODUTO --- */
.produto-detalhes .nome-produto {
    font-size: 28px;
}

.produto-detalhes .descricao.geral {
    border-top: 1px solid #EAE8E1;
    margin-top: 20px;
    padding-top: 20px;
}

/* --- 6. RODAPÉ --- */
.rodape {
    background-color: #FFFFFF;
    border-top: 1px solid #EAE8E1;
    padding-top: 30px;
}

.rodape .titulo {
    font-family: 'Montserrat', sans-serif;
    color: #5E8C61;
}