/* 1. Remove o fundo da caixa e do painel */
#rodape .painel, 
#rodape .redes-sociais {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* 2. Título "Social" alinhado à esquerda e sem linha inferior */
#rodape .painel .titulo,
#rodape .redes-sociais .titulo {
    color: #FFFFFF !important;
    border: none !important; 
    background: transparent !important;
    padding-bottom: 10px !important;
    text-align: left !important;
}

/* 3. Força a lista de ícones a alinhar totalmente à esquerda */
#rodape .redes-sociais ul {
    text-align: left !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important; 
    justify-content: flex-start !important; 
}

/* 4. Remove a risca vertical e ajusta margem para colar no "S" */
#rodape .redes-sociais ul li {
    border: none !important; 
    margin: 0 8px 0 0 !important; /* Espaçamento apenas na direita do ícone */
}

/* 5. Círculos BRANCOS delicados */
#rodape .redes-sociais ul li a {
    background-color: #FFFFFF !important; 
    border-radius: 50% !important; 
    width: 30px !important; 
    height: 30px !important; 
    display: inline-flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    text-decoration: none !important;
}

/* 6. Ícones na cor do rodapé (#194239) */
#rodape .redes-sociais ul li a i {
    color: #194239 !important; 
    font-size: 16px !important; 
    background: transparent !important;
    margin: 0 !important;
}

/* 7. Efeito suave ao passar o mouse */
#rodape .redes-sociais ul li a:hover {
    opacity: 0.8 !important;
    transform: scale(1.05) !important; 
    transition: 0.3s !important;
}
/* 1. Esconde a coluna inteira de "Categorias" */
#rodape .links-rodape-categorias {
    display: none !important;
}

/* 2. Muda o título "Conteúdo" para "Fale Conosco" com a fonte certa */
#rodape .links-rodape-paginas .titulo {
    font-size: 0 !important; 
}
#rodape .links-rodape-paginas .titulo::after {
    content: "Fale Conosco" !important; 
    font-size: 16px !important; 
    color: #FFFFFF !important;
    font-family: inherit !important; /* Puxa a fonte oficial da Nat.O */
    font-weight: inherit !important;
}

/* 3. Oculta os links antigos e injeta o Email e Telefone da Nat.O */
#rodape .links-rodape-paginas ul {
    display: none !important;

}

/* 4. Muda o título "Social" para "Acompanhe nos canais" com a fonte certa */
#rodape .redes-sociais .titulo {
    font-size: 0 !important; 
}
#rodape .redes-sociais .titulo::after {
    content: "Acompanhe nos canais" !important;
    font-size: 16px !important;
    color: #FFFFFF !important;
    font-family: inherit !important; /* Puxa a fonte oficial da Nat.O */
    font-weight: inherit !important;
}

/* 5. Redistribui o espaço no computador para o rodapé não ficar torto */
@media (min-width: 768px) {
    #rodape .institucional .row-fluid {
        display: flex !important;
        justify-content: space-between !important; 
    }
    /* --- BARRA SUPERIOR (CABEÇALHO) --- */

/* 1. Esconde todo o conteúdo padrão (redes coloridas e contatos) */
.barra-inicial .conteiner {
    display: none !important;
}

/* 2. Prepara a barra para centralizar o texto novo */
.barra-inicial {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 10px 0 !important; /* Ajusta a altura da barra */
}

/* 3. Injeta a frase da Nat.O */
.barra-inicial::after {
    content: "Adubo Natural e Orgânico - Entregamos para todo o Brasil" !important;
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-family: inherit !important;
    letter-spacing: 1px !important; /* Dá um leve espaçamento elegante entre as letras */
}
}
/* --- AJUSTES FINAIS DA VERSÃO MOBILE --- */
@media (max-width: 767px) {
    /* 1. Esconde o NOSSO "Fale Conosco" para não duplicar */
    #rodape .links-rodape-paginas { 
        display: none !important; 
    }

    /* 2. Mantém o Contato nativo visível */
    #rodape .institucional .contato { 
        display: block !important; 
    }

    /* 3. FORÇA O ALINHAMENTO DAS REDES SOCIAIS PARA A ESQUERDA */
    #rodape .redes-sociais {
        padding-left: 0 !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    #rodape .redes-sociais .titulo {
        display: block !important;
        text-align: left !important;
        padding-left: 0 !important;
        margin-left: 0 !important;
    }

    #rodape .redes-sociais .titulo::after {
        display: block !important;
        text-align: left !important;
        font-size: 16px !important; 
        margin-bottom: 15px !important;
    }

    /* 4. Tira o recuo dos ícones redondos */
    #rodape .redes-sociais ul {
        display: flex !important;
        justify-content: flex-start !important;
        padding-left: 0 !important;
        margin-left: 0 !important;
    }
}
/* --- REMOVE A CAIXA DE NEWSLETTER --- */
.componente.newsletter,
#componente-newsletter,
.newsletter {
    display: none !important;
}
/* --- FORÇA BRUTA: PADRONIZAÇÃO DE BOTÕES E CABEÇALHO --- */

/* 1. Destrói o degradê cinza e aplica o verde da Nat.O em TODOS os botões */
a.botao, 
button.botao, 
input.botao, 
.botao, 
.btn, 
input[type="submit"], 
input[type="button"],
#cabecalho .busca button,
#cabecalho .carrinho-cabecalho .fundo-principal,
#cabecalho .acoes-conta i {
    background-color: #194239 !important;
    background-image: none !important; /* Aniquila o degradê cinza antigo */
    border: none !important;
    color: #FFFFFF !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

/* 2. Efeito hover padronizado */
a.botao:hover, 
button.botao:hover, 
input.botao:hover, 
.botao:hover, 
.btn:hover, 
input[type="submit"]:hover,
#cabecalho .busca button:hover {
    background-color: #194239 !important;
    background-image: none !important;
    opacity: 0.85 !important;
    transition: 0.3s !important;
}

/* 3. Ajusta o texto do carrinho */
#cabecalho .carrinho-cabecalho .titulo {
    color: #194239 !important;
}
/* --- COR DOS SELOS DE DESCONTO NAS FOTOS --- */
.listagem-item .bandeiras-produto span,
.produto .bandeiras-produto span,
.bandeiras-produto .bandeira-desconto {
    background-color: #194239 !important; /* Pinta com o verde da Nat.O */
    background-image: none !important; /* Mata o efeito degradê cinza antigo */
    color: #FFFFFF !important; /* Mantém a letra branca */
    border: none !important;
}
/* --- REMOVE A BARRA FLUTUANTE (NOME EXATO DO TEMA) --- */
#barraTopo {
    display: none !important;
}
/* --- BORDAS ORGÂNICAS E SUTIS (PRODUTOS E BANNERS) --- */

/* 1. Arredonda as fotos dos produtos na vitrine e dentro da página do produto */
.listagem-item .imagem-produto img,
.produto .imagem-produto img,
/* 2. Arredonda o banner grandão e os banners menores */
.flexslider,
.banner img,
.componente .modulo .imagem img {
    border-radius: 6px !important;
    overflow: hidden !important;
}

/* 3. Garante que o contorno (se houver) acompanhe a curva da foto */
.listagem-item .produto-sobrepor {
    border-radius: 6px !important;
}
/* --- REMOVE A MENSAGEM DE BEM-VINDO DO CABEÇALHO --- */
#cabecalho .bem-vindo,
.cabecalho .bem-vindo,
.identifique-se {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}
