/*
 Theme Name: Extendable Child
 Theme URI: http://example.com/ (Opcional - Pode ser o link do seu site)
 Description: Tema Filho para o Extendable
 Author: Seu Nome ou Empresa
 Author URI: http://example.com/author (Opcional)
 Template: extendable 
 Version: 1.0.0 
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: extendable-child
*/

/* Suas personalizações CSS começam aqui! */


/* DEFINIÇÕES DE COR E CONTAINER PRINCIPAL */

/* O seletor abaixo deve garantir a cor de fundo roxa e a cor do texto */
.rodape-e-commerce-completo {
    background-color: #483d8b !important; /* Cor roxa da sua imagem */
    color: #ffffff !important;
}

/* CONTAINER FLEX (COLUNAS) */
.rodape-personalizado-e-commerce {
    max-width: 1200px; /* Limita a largura do conteúdo central (ajuste se precisar) */
    margin: 0 auto; /* Centraliza o container */
    padding: 0 20px; /* Espaçamento lateral */
    
    display: flex; /* ATIVA O LAYOUT EM COLUNAS */
    flex-wrap: wrap; /* Permite quebrar para telas menores */
    justify-content: space-between; /* Distribui o espaço entre os itens */
    align-items: flex-start;
    
    /* Regra de emergência para garantir que os títulos sejam brancos */
    color: #ffffff; 
}

.rodape-personalizado-e-commerce h4 {
    color: #ffffff !important; /* Força o título a ser branco */
    font-size: 1.2em;
    margin-bottom: 15px;
    margin-top: 0;
}

/* ESTILO DAS COLUNAS */
.coluna-footer-personalizada {
    flex: 1 1 30%; /* Permite 3 colunas por linha (30% cada) */
    min-width: 250px; /* Garante que não fiquem muito apertadas */
    padding-bottom: 20px; /* Espaçamento entre blocos */
}

/* ALINHAMENTO DAS IMAGENS */
.coluna-footer-personalizada .imagens-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Espaço entre as imagens */
    align-items: center;
}

.coluna-footer-personalizada img {
    height: 30px; /* Altura padrão para imagens de bandeiras (ajuste se precisar) */
    width: auto;
    max-width: 100px;
    display: inline-block;
}

/* COPYRIGHT INFERIOR */
.copyright-rodape-inferior {
    width: 100%; /* Ocupa a largura total */
    text-align: left; /* Alinha o texto à esquerda, como na sua imagem */
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.15); /* Linha divisória sutil */
    font-size: 0.8em;
}


/* --- CORREÇÃO DE ESTILO FINAL PARA ANULAR ESTILOS INLINE E BORDA BRANCA --- */



/* ========================================================================= */
/* CORREÇÃO FINAL: REMOVER A BORDA PRETA/CONTORNO EXTERNO                     */
/* ========================================================================= */

/* 1. Alvo o Campo de Texto (Input) - Garante que ele não tem borda */
.wp-site-header .wp-block-search__input {
    /* Mantém todas as regras anteriores de altura, cor, padding, etc. */
    /* Garante que a borda do campo de texto seja removida */
    border: none !important; 
    /* Remove o contorno que aparece ao clicar */
    outline: none !important; 
    
    /* Regras anteriores de borda e cor... */
    background-color: #FFFFFF !important; 
    border-radius: 8px !important; 
}

/* 2. Alvo o Wrapper Interno (Container principal da borda) */
/* Se a borda estiver no container que agrupa input e botão, esta regra remove */
.wp-block-search__inside-wrapper {
    /* Remove bordas e contornos no container do input/button */
    border: none !important; 
    outline: none !important; 
}

/* 3. Alvo o Container Principal do Bloco de Pesquisa */
.wp-site-header .wp-block-search {
    /* Remove quaisquer bordas ou contornos do bloco principal */
    border: none !important;
    outline: none !important;
}

/* MEDIA QUERY: Ajuste para telas menores (celulares) */
@media (max-width: 768px) {
    .rodape-personalizado-e-commerce {
        flex-direction: column; /* Empilha as colunas verticalmente */
        align-items: center;
        text-align: center;
    }
    .coluna-footer-personalizada {
        min-width: 90%;
        text-align: center;
    }
    .coluna-footer-personalizada .imagens-flex {
        justify-content: center; /* Centraliza as imagens no celular */
    }
    .copyright-rodape-inferior {
        text-align: center;
    }
}