/* ARQUIVO: /recursos/css/estilo.css (VERSÃO 2.0 MELHORADA) */

/* --- CORES E FONTES (VARIÁVEIS) --- */
:root {
    --cor-primaria: #2C5F2D;      /* Verde escuro */
    --cor-secundaria: #97BC62;   /* Verde claro */
    --cor-acao: #FF9F1C;         /* Laranja vibrante */
    --cor-fundo: #F8F9FA;        /* Cinza muito claro */
    --cor-texto: #343A40;        /* Cinza escuro */
    --cor-branco: #FFFFFF;
    --sombra-suave: 0 4px 15px rgba(0, 0, 0, 0.07);

    --fonte-principal: 'Montserrat', sans-serif;
    --fonte-secundaria: 'Lato', sans-serif;
}

/* --- GERAL E RESET --- */
*, *::before, *::after {
    box-sizing: border-box;
}
body {
    font-family: var(--fonte-secundaria);
    color: var(--cor-texto);
    background-color: var(--cor-fundo);
    margin: 0;
    padding: 0;
    line-height: 1.7;
    font-size: 16px;
}

/* --- LAYOUT E CONTAINERS --- */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
main {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* --- CABEÇALHO E NAVEGAÇÃO (VERSÃO CAPRICHADA) --- */
.cabecalho-principal {
    background-color: var(--cor-branco);
    padding: 10px 0;
    border-bottom: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    
    /* Mágica do cabeçalho fixo */
    position: sticky;
    top: 0;
    z-index: 1000;
}

.container-nav {
    display: flex; /* ATIVA O FLEXBOX */
    justify-content: space-between; /* Espaça os itens: logo na esquerda, resto na direita */
    align-items: center; /* Alinha tudo verticalmente no centro */
    height: 60px; /* Define uma altura fixa para o cabeçalho */
}

.logo {
    font-family: var(--fonte-principal);
    font-weight: 700;
    font-size: 26px;
    color: var(--cor-primaria);
    text-decoration: none;
    letter-spacing: -1px; /* Um toque de design */
}

.menu-principal {
    display: flex; /* Flexbox para o menu também */
    align-items: center;
    gap: 40px; /* Espaço entre o menu e os botões de ação */
}

.menu-principal ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 35px; /* Espaço entre cada item do menu */
}

.menu-principal a {
    text-decoration: none;
    color: var(--cor-texto);
    font-weight: 700;
    font-size: 16px;
    position: relative;
    padding: 20px 0; /* Aumenta a área de clique */
    transition: color 0.3s ease;
}

.menu-principal ul a::after {
    content: '';
    position: absolute;
    bottom: 15px; /* Posição da linha */
    left: 0;
    width: 0;
    height: 3px;
    background-color: var(--cor-acao);
    transition: width 0.3s ease;
}

.menu-principal ul a:hover {
    color: var(--cor-primaria);
}

.menu-principal ul a:hover::after {
    width: 100%; /* Animação da linha ao passar o mouse */
}

/* Bloco Novo e Melhorado */
.menu-acoes {
    background-color: var(--cor-primaria);
    padding: 8px 15px; /* Espaçamento interno do bloco */
    border-radius: 8px; /* Cantos arredondados */
    display: flex;
    align-items: center;
    gap: 15px; /* Espaço entre os dois botões */
    transition: all 0.3s ease;
}

/* Estilo do botão "Login" como um ghost button */
.menu-acoes .btn-login {
    color: var(--cor-branco); /* Texto branco */
    text-decoration: none;
    font-weight: 700;
    padding: 8px 16px; /* Espaçamento para parecer um botão */
    border: 2px solid var(--cor-branco); /* Borda branca */
    border-radius: 5px;
    transition: all 0.3s ease;
}

/* Efeito ao passar o mouse no botão "Login" */
.menu-acoes .btn-login:hover {
    background-color: var(--cor-branco);
    color: var(--cor-primaria); /* Texto muda para verde */
}

/* Mantém o estilo do botão de cadastro no header */
.menu-acoes .btn-primario {
    /* Este já tem um estilo bom, mas garantimos que ele se adapte */
    border-color: transparent;
    background-color: var(--cor-acao);
    color: var(--cor-branco);
}
.menu-acoes .btn-primario:hover {
    background-color: #e68a00; /* Laranja mais escuro */
}

.btn-primario {
    display: block;
    width: 100%;
    padding: 12px 20px;
    background-color: transparent;
    color: var(--cor-acao); /* Laranja */
    border: 2px solid var(--cor-acao); /* Borda Laranja */
    border-radius: 5px;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: none; /* Remove qualquer sombra restante */
}

.btn-primario:hover {
    background-color: var(--cor-acao); /* Preenche com laranja no hover */
    color: var(--cor-branco);
    transform: translateY(-2px);
}

.menu-toggle { display: none; } /* Continua escondido em telas grandes */

/* ARQUIVO: /recursos/css/estilo.css */

/* --- SEÇÃO HERO (VERSÃO 2.0 - IMPACTO VISUAL) --- */
.secao-hero {
    /* Imagem de fundo - Escolhi uma imagem de alta qualidade que remete à tecnologia no campo */
    background: 
        linear-gradient(rgba(44, 95, 45, 0.85), rgba(44, 95, 45, 0.85)), /* Sobreposição verde mais escura para legibilidade */
        url('https://images.unsplash.com/photo-1620063141934-2457652c0f20?q=80&w=1932') center center/cover no-repeat;
    
    color: var(--cor-branco);
    padding: 100px 0; /* Mais espaçamento vertical para dar impacto */
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 50vh; /* Altura mínima de 50% da tela */
}

.hero-texto {
    max-width: 800px; /* Limita a largura do texto */
    margin-bottom: 40px;
}

.hero-texto h1 {
    color: var(--cor-branco);
    font-size: 3rem; /* Tamanho maior para o título principal */
    font-weight: 700;
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3); /* Sombra no texto para destacar */
}

.hero-texto p {
    font-size: 1.25rem;
    opacity: 0.9;
}

.filtro-vagas-hero {
    background: rgba(255, 255, 255, 0.15); /* Fundo branco com transparência */
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 20px;
    border-radius: 12px;
    display: flex;
    flex-wrap: wrap; /* Permite que os itens quebrem a linha em telas menores */
    gap: 15px;
    max-width: 900px;
    margin: 0 auto;
    backdrop-filter: blur(5px); /* Efeito de vidro fosco no fundo */
}

.campo-filtro {
    flex: 1; /* Faz os campos crescerem para preencher o espaço */
    display: flex;
    align-items: center;
    background-color: var(--cor-branco);
    border-radius: 8px;
    padding: 0 15px;
}

.campo-filtro i {
    color: #999;
    margin-right: 10px;
}

.filtro-vagas-hero input[type="text"] {
    flex-grow: 1;
    padding: 15px 10px;
    border: none;
    background: transparent;
    font-size: 1rem;
    width: 100%;
}
.filtro-vagas-hero input[type="text"]:focus {
    outline: none; /* Remove a borda azul ao focar */
}

.filtro-vagas-hero .btn-primario {
    padding: 15px 30px;
    font-size: 1rem;
    flex-shrink: 0; /* Impede que o botão encolha */
}

/* --- CARDS DE VAGA --- */
.vagas-destaque h2 {
    text-align: center;
    margin-bottom: 40px;
    font-size: 2rem;
}
.grid-vagas {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 30px;
}
.card-vaga {
    background-color: var(--cor-branco);
    border-radius: 8px;
    box-shadow: var(--sombra-suave);
    display: flex;
    flex-direction: column;
    padding: 25px;
    transition: all 0.3s ease;
}
.card-vaga:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}
.card-vaga h3 {
    margin: 0 0 10px 0;
    font-size: 1.25rem;
}
.card-vaga p {
    margin: 0 0 5px 0;
    color: #6c757d;
}
.card-vaga .btn-primario {
    margin-top: 20px;
    width: 100%;
    text-align: center;
}

/* --- FORMULÁRIOS (estilos que você já tinha, com pequenos ajustes) --- */
.form-container {
    background-color: var(--cor-branco);
    padding: 30px 40px;
    border-radius: 8px;
    box-shadow: var(--sombra-suave);
    max-width: 700px;
    margin: 40px auto;
}
.form-grupo { margin-bottom: 20px; }
.form-grupo label {
    display: block;
    margin-bottom: 8px;
    font-weight: 700;
}
.form-grupo input[type="text"],
.form-grupo input[type="email"],
.form-grupo input[type="password"],
.form-grupo input[type="number"],
.form-grupo select,
.form-grupo textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
    box-sizing: border-box;
}
.form-grupo-par { display: flex; gap: 20px; }
.form-grupo-par > div { flex: 1; }
.form-grupo-check { display: flex; align-items: center; gap: 10px; }
.form-grupo-check input[type="checkbox"] { width: auto; }

/* --- RODAPÉ --- */
.rodape-principal {
    background-color: #343A40;
    color: var(--cor-branco);
    padding: 40px 0;
    margin-top: 60px;
    text-align: center;
}
.rodape-principal a {
    color: var(--cor-secundaria);
    text-decoration: none;
}

/* --- RESPONSIVIDADE (MOBILE) --- */
@media (max-width: 768px) {
    .menu-principal {
        display: none; /* Esconde o menu principal */
        position: absolute;
        top: 70px; /* Altura do header */
        left: 0;
        width: 100%;
        background-color: var(--cor-branco);
        flex-direction: column;
        padding: 20px;
        box-shadow: var(--sombra-suave);
    }
    .menu-principal.ativo {
        display: flex; /* Mostra quando a classe 'ativo' é adicionada via JS */
    }
    .menu-principal ul {
        flex-direction: column;
        width: 100%;
        text-align: center;
    }
    .menu-acoes {
        flex-direction: column;
        margin-top: 20px;
        gap: 20px;
    }
    .menu-toggle {
        display: block; /* Mostra o botão hambúrguer */
        background: none;
        border: none;
        font-size: 24px;
        cursor: pointer;
        color: var(--cor-primaria);
    }

    .filtro-container {
        flex-direction: column;
    }

    .vaga-conteudo {
        flex-direction: column;
    }
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS PARA O MENU DO USUÁRIO LOGADO --- */

.menu-usuario {
    position: relative; /* Essencial para o posicionamento do dropdown */
}

.menu-usuario .nome-usuario {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: var(--cor-fundo);
    padding: 10px 15px;
    border-radius: 50px; /* Deixa o botão arredondado */
    font-weight: 700;
    color: var(--cor-primaria);
    cursor: pointer;
    transition: all 0.3s ease;
}

.menu-usuario .nome-usuario:hover {
    background-color: #e9ecef;
}

.menu-usuario .fa-user-circle {
    font-size: 1.2em;
}

.dropdown-menu {
    display: none; /* O menu começa escondido */
    position: absolute;
    top: 100%; /* Aparece logo abaixo do botão */
    right: 0;
    background-color: var(--cor-branco);
    border-radius: 8px;
    box-shadow: var(--sombra-suave);
    min-width: 180px;
    z-index: 1001;
    overflow: hidden; /* Garante que os cantos arredondados se apliquem aos links */
    padding: 5px 0;
}

.menu-usuario:hover .dropdown-menu {
    display: block; /* Mostra o menu quando o mouse está sobre o contêiner */
}

.dropdown-menu a {
    display: block;
    padding: 12px 20px;
    color: var(--cor-texto);
    text-decoration: none;
    font-weight: 700;
    transition: all 0.2s ease-in-out;
}

.dropdown-menu a:hover {
    background-color: var(--cor-acao);
    color: var(--cor-branco);
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS ADICIONAIS PARA PÁGINAS MELHORADAS --- */

/* --- Detalhes da Vaga (vaga_detalhe.php) --- */
.vaga-banner {
    background-color: var(--cor-primaria);
    color: var(--cor-branco);
    padding: 40px 0;
    text-align: center;
    margin-bottom: 40px;
}
.vaga-banner h1 { color: var(--cor-branco); font-size: 2.8rem; margin: 10px 0; }
.vaga-banner .empresa-nome-detalhe { font-size: 1.2rem; opacity: 0.9; }
.vaga-logo-detalhe { width: 100px; height: 100px; border-radius: 50%; border: 4px solid var(--cor-branco); background-color: var(--cor-branco); box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
.vaga-conteudo-wrapper { display: flex; gap: 40px; }
.lista-beneficios { list-style: none; padding-left: 0; }
.lista-beneficios li { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.lista-beneficios .fa-check-circle { color: var(--cor-secundaria); }
.info-item { display: flex; align-items: center; gap: 10px; margin-bottom: 15px; }
.info-item i { font-size: 1.2rem; color: var(--cor-acao); width: 25px; text-align: center; }
.vaga-info-card, .vaga-acao-card, .vaga-share-card { background-color: var(--cor-branco); padding: 25px; border-radius: 8px; box-shadow: var(--sombra-suave); margin-bottom: 25px; }
.btn-candidatura { width: 100%; display: block; text-align: center; background-color: var(--cor-acao); color: var(--cor-branco); padding: 15px; border-radius: 5px; font-size: 1.1rem; font-weight: 700; text-decoration: none; border: none; cursor: pointer; transition: all 0.3s ease; }
.btn-candidatura:hover { background-color: #e68a00; transform: translateY(-2px); }
.btn-candidatura:disabled { background-color: #ccc; cursor: not-allowed; }
.social-share { display: flex; gap: 15px; justify-content: center; }
.social-share a { font-size: 1.8rem; text-decoration: none; transition: all 0.3s ease; }
.social-share a:hover { transform: scale(1.2); }
.share-whatsapp { color: #25D366; }
.share-linkedin { color: #0A66C2; }
.share-email { color: #6c757d; }


/* --- Painel da Empresa (empresa/painel.php) --- */
.painel-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 30px; }
.dashboard-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 25px; margin-bottom: 40px; }
.card-kpi { display: flex; align-items: center; gap: 20px; background-color: var(--cor-branco); padding: 25px; border-radius: 8px; box-shadow: var(--sombra-suave); }
.card-kpi i { font-size: 2.5rem; color: var(--cor-acao); }
.card-kpi-info span { font-size: 1rem; color: #6c757d; }
.card-kpi-info strong { font-size: 2rem; color: var(--cor-primaria); display: block; }
.painel-tabela-container { background-color: var(--cor-branco); padding: 25px; border-radius: 8px; box-shadow: var(--sombra-suave); }
.tabela-painel { width: 100%; border-collapse: collapse; }
.tabela-painel th, .tabela-painel td { padding: 15px; border-bottom: 1px solid #e9ecef; text-align: left; }
.tabela-painel th { font-family: var(--fonte-principal); color: var(--cor-primaria); }
.tabela-painel tbody tr:hover { background-color: #f8f9fa; }
.badge-status { padding: 5px 10px; border-radius: 20px; font-size: 0.8rem; font-weight: 700; color: var(--cor-branco); }
.status-ativa { background-color: #28a745; }
.status-pausada { background-color: #ffc107; }
.status-fechada { background-color: #dc3545; }
.badge-candidatos { background-color: var(--cor-acao); color: var(--cor-branco); border-radius: 50%; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.acoes-tabela a { margin: 0 8px; font-size: 1.1rem; color: #6c757d; text-decoration: none; }
.acoes-tabela a:hover { color: var(--cor-acao); }

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS ADICIONAIS PARA GESTÃO E PERFIL --- */

/* --- Gerenciar Candidatos --- */
.link-voltar { display: inline-block; margin-bottom: 20px; color: var(--cor-primaria); text-decoration: none; font-weight: 700; }
.link-voltar i { margin-right: 8px; }
.gestao-header { text-align: center; margin-bottom: 40px; }
.gestao-header h1 { font-size: 2.5rem; margin: 0; }
.gestao-header h2 { font-size: 1.2rem; color: #6c757d; font-weight: 400; }
.lista-candidatos { display: flex; flex-direction: column; gap: 25px; }
.card-candidato { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; background: var(--cor-branco); padding: 20px; border-radius: 8px; box-shadow: var(--sombra-suave); gap: 20px; }
.candidato-info { display: flex; align-items: center; gap: 20px; flex-grow: 1; }
.candidato-foto { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; }
.candidato-nome { margin: 0; color: var(--cor-primaria); }
.candidato-detalhe { margin: 2px 0; color: #6c757d; }
.candidato-status { display: flex; flex-direction: column; gap: 5px; }
.select-status { padding: 8px; border-radius: 5px; border: 1px solid #ccc; }
.status-salvo-msg { font-size: 0.8rem; height: 1em; }
.candidato-acoes { display: flex; gap: 10px; }
.btn-secundario { background-color: #6c757d; color: var(--cor-branco); }
.btn-secundario:hover { background-color: #5a6268; }

/* --- Perfil do Técnico --- */
.perfil-container { max-width: 900px; }
.perfil-header { text-align: center; background: var(--cor-branco); padding: 40px; border-radius: 8px; box-shadow: var(--sombra-suave); margin-bottom: 40px; }
.perfil-header img { width: 150px; height: 150px; border-radius: 50%; border: 6px solid var(--cor-fundo); }
.perfil-header h1 { margin: 10px 0 5px 0; }
.perfil-header h2 { margin: 0; color: #6c757d; font-weight: 400; font-size: 1.2rem; }
.perfil-conteudo { display: grid; gap: 25px; }
.perfil-card { background: var(--cor-branco); padding: 25px; border-radius: 8px; box-shadow: var(--sombra-suave); }
.perfil-card h3 { display: flex; align-items: center; gap: 10px; margin-top: 0; }

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS ADICIONAIS PARA BADGES DE STATUS DO TÉCNICO --- */

/* Badge para candidatura enviada (um cinza neutro) */
.status-enviada {
    background-color: #6c757d;
}

/* Badge para candidatura visualizada (um azul informativo) */
.status-visualizada {
    background-color: #007bff;
}

/* Badge para candidatura em processo (um amarelo de atenção) */
.status-em-processo {
    background-color: #ffc107;
    color: var(--cor-texto); /* Texto escuro para melhor contraste no amarelo */
}

/* Badge para candidatura recusada (um vermelho de finalização) */
.status-recusada {
    background-color: #dc3545;
}

/* Badge para contratado (um verde de sucesso) */
.status-contratado {
    background-color: #28a745;
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS PARA A NOVA HOMEPAGE PREMIUM --- */

/* --- Seção Hero com Vídeo --- */
.hero-com-video {
    position: relative;
    height: 80vh; /* Altura de 80% da tela */
    min-height: 500px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: var(--cor-branco);
    overflow: hidden; /* Garante que o vídeo não vaze */
}
.hero-video-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    z-index: -2;
}
/* Sobreposição escura para garantir a legibilidade do texto */
.hero-com-video::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: -1;
}
.hero-conteudo {
    animation: fadeIn 1.5s ease-in-out;
}
.hero-conteudo h1 {
    color: var(--cor-branco);
    font-size: 3.5rem;
    font-weight: 700;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.5);
    max-width: 800px;
    line-height: 1.2;
}
.hero-conteudo p {
    font-size: 1.3rem;
    margin-top: 1rem;
    margin-bottom: 2.5rem;
    opacity: 0.9;
}
.filtro-vagas-hero {
    display: flex;
    max-width: 700px;
    margin: 0 auto;
    background: var(--cor-branco);
    border-radius: 50px; /* Deixa a barra de busca arredondada */
    padding: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}
.filtro-vagas-hero .campo-filtro { padding: 0 20px; }
.filtro-vagas-hero .btn-primario { border-radius: 30px; }

/* --- Seção Como Funciona --- */
.secao-como-funciona {
    padding: 80px 0;
    background-color: var(--cor-fundo);
}
.subtitulo-secao {
    text-align: center;
    font-size: 1.2rem;
    color: #6c757d;
    margin-top: -20px;
    margin-bottom: 60px;
}
.secao-como-funciona h2 { text-align: center; font-size: 2.5rem; }
.passos-container {
    display: flex;
    justify-content: space-around;
    gap: 30px;
    flex-wrap: wrap;
}
.passo-card {
    background: var(--cor-branco);
    padding: 40px 30px;
    border-radius: 12px;
    text-align: center;
    box-shadow: var(--sombra-suave);
    flex-basis: 30%;
    transition: all 0.3s ease;
}
.passo-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}
.passo-icone {
    font-size: 3rem;
    color: var(--cor-acao);
    margin-bottom: 20px;
}
.passo-card h3 {
    font-size: 1.5rem;
    margin-bottom: 15px;
}

/* --- Seção Vagas com Novo Card --- */
.secao-vagas-destaque {
    padding: 80px 0;
}
.secao-vagas-destaque h2 {
    text-align: center;
    font-size: 2.5rem;
    margin-bottom: 60px;
}
.grid-vagas-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px;
}
.card-vaga-v2 {
    background: var(--cor-branco);
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 25px;
    text-decoration: none;
    color: var(--cor-texto);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
}
.card-vaga-v2:hover {
    border-color: var(--cor-acao);
    transform: translateY(-5px);
    box-shadow: var(--sombra-suave);
}
.card-vaga-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}
.card-vaga-logo {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    object-fit: contain;
    border: 1px solid #f0f0f0;
    flex-shrink: 0;
}
.card-vaga-titulo {
    font-size: 1.2rem;
    margin: 0;
    color: var(--cor-primaria);
}
.card-vaga-empresa {
    margin: 5px 0 0 0;
    color: #6c757d;
}
.card-vaga-footer {
    border-top: 1px solid #f0f0f0;
    padding-top: 20px;
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6c757d;
}
.card-vaga-vermais {
    color: var(--cor-acao);
    font-weight: 700;
}

/* Animações */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS PARA PÁGINA DE BUSCA DE VAGAS --- */

.busca-container-pagina {
    background-color: var(--cor-branco);
    padding: 40px;
    border-radius: 12px;
    box-shadow: var(--sombra-suave);
    margin-bottom: 50px;
    text-align: center;
}

.busca-container-pagina h1 {
    margin-top: 0;
    margin-bottom: 30px;
}

.resultados-container {
    padding: 20px 0;
}

.resultados-titulo {
    font-size: 1.8rem;
    margin-bottom: 30px;
    border-bottom: 2px solid var(--cor-secundaria);
    padding-bottom: 10px;
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS PARA VAGA EXPIRADA E BOTÃO REATIVAR --- */

.status-expirada {
    background-color: #ff6347; /* Tomate - um alerta */
}

.btn-reativar {
    display: inline-block;
    padding: 8px 12px;
    background-color: var(--cor-secundaria);
    color: var(--cor-branco);
    text-decoration: none;
    border-radius: 5px;
    font-weight: 700;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}
.btn-reativar:hover {
    background-color: var(--cor-primaria);
}
.btn-reativar i {
    margin-right: 5px;
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS PARA O LOGO GENÉRICO (PLACEHOLDER) --- */

.logo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--fonte-principal);
    font-size: 2rem; /* Tamanho da letra */
    font-weight: 700;
    color: var(--cor-branco);
    background-color: var(--cor-secundaria); /* Fundo verde claro */
    /* Garante que ele tenha o mesmo tamanho dos logos nas diferentes telas */
    width: 100%;
    height: 100%;
}

/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILOS PARA PAGINAÇÃO --- */

.paginacao {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 50px;
    flex-wrap: wrap; /* Garante que funcione bem em telas pequenas */
}

.paginacao a,
.paginacao .pagina-ativa {
    display: inline-block;
    padding: 10px 15px;
    min-width: 40px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-decoration: none;
    color: var(--cor-primaria);
    background-color: var(--cor-branco);
    font-weight: 700;
    transition: all 0.3s ease;
}

.paginacao a:hover {
    background-color: var(--cor-secundaria);
    color: var(--cor-branco);
    border-color: var(--cor-secundaria);
}

.paginacao .pagina-ativa {
    background-color: var(--cor-primaria);
    color: var(--cor-branco);
    border-color: var(--cor-primaria);
    cursor: default;
}

/* --- ESTILOS PARA O PAINEL ADMINISTRATIVO --- */
.admin-login-body {
    background-color: var(--cor-fundo);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}
.admin-login-container {
    max-width: 400px;
    width: 100%;
}
.admin-header {
    background-color: #343a40; /* Um cinza escuro para diferenciar */
    color: var(--cor-branco);
    padding: 15px 0;
}
.admin-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.admin-logo {
    font-size: 1.2rem;
    font-weight: 700;
}
.admin-nav nav a {
    color: var(--cor-branco);
    text-decoration: none;
    margin-left: 20px;
    font-weight: 700;
}
.admin-nav nav a:hover {
    color: var(--cor-acao);
}
.admin-main {
    padding: 40px 0;
}

/* --- ESTILOS PARA INTERFACE DE CHAT --- */
.container-chat { max-width: 800px; }
.chat-header { text-align: center; padding: 20px; background: #f8f9fa; border-radius: 8px 8px 0 0; border: 1px solid #dee2e6; }
.chat-header h3 { margin: 0; }
.chat-header p { margin: 5px 0 0 0; color: #6c757d; }
.chat-box { height: 50vh; border: 1px solid #dee2e6; border-top: none; border-bottom: none; padding: 20px; overflow-y: auto; display: flex; flex-direction: column; gap: 15px; }
.chat-aviso { color: #6c757d; text-align: center; margin: auto; }
.balao-mensagem { max-width: 70%; padding: 10px 15px; border-radius: 18px; line-height: 1.5; }
.balao-mensagem p { margin: 0; }
.horario-mensagem { font-size: 0.75rem; color: #fff; opacity: 0.8; display: block; text-align: right; margin-top: 5px; }
.balao-remetente { background-color: var(--cor-primaria); color: var(--cor-branco); align-self: flex-end; border-bottom-right-radius: 4px; }
.balao-destinatario { background-color: #e9ecef; color: var(--cor-texto); align-self: flex-start; border-bottom-left-radius: 4px; }
.balao-destinatario .horario-mensagem { color: #6c757d; }
.chat-form { border: 1px solid #dee2e6; border-top: none; border-radius: 0 0 8px 8px; }
.chat-form form { display: flex; }
.chat-form textarea { flex-grow: 1; border: none; padding: 15px; resize: none; font-family: var(--fonte-principal); font-size: 1rem; }
.chat-form textarea:focus { outline: none; }
.chat-form button { border-radius: 0 0 8px 0; border: none; font-size: 1.2rem; }

/* --- ESTILOS PARA CAIXA DE ENTRADA --- */
.lista-conversas { display: flex; flex-direction: column; gap: 15px; }
.card-conversa { display: flex; justify-content: space-between; align-items: center; background: var(--cor-branco); padding: 20px; border-radius: 8px; box-shadow: var(--sombra-suave); text-decoration: none; color: var(--cor-texto); transition: all 0.3s ease; }
.card-conversa:hover { transform: translateX(5px); border-left: 5px solid var(--cor-acao); }
.conversa-info .conversa-titulo { display: block; font-weight: 700; color: var(--cor-primaria); }
.conversa-info .conversa-empresa { color: #6c757d; font-size: 0.9rem; }
.badge-notificacao { background-color: #dc3545; color: white; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.card-link { text-decoration: none; }

/* ARQUIVO: /recursos/css/estilo.css */

/* --- REFINAMENTO DO CARD DE CANDIDATO (LAYOUT LADO A LADO) --- */

.card-candidato {
    display: flex; /* O segredo do alinhamento */
    flex-direction: row; /* Itens em linha (lado a lado) */
    justify-content: space-between; /* Empurra o conteúdo e as ações para os cantos opostos */
    align-items: center; /* Alinha tudo verticalmente no centro */
    gap: 20px;
    background: var(--cor-branco);
    padding: 20px;
    border-radius: 8px;
    box-shadow: var(--sombra-suave);
    transition: all 0.3s ease;
}
.card-candidato:hover {
    border-left: 5px solid var(--cor-acao);
    transform: translateX(5px);
}

.candidato-info {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-grow: 1; /* Permite que esta seção cresça e ocupe o espaço */
}

.candidato-foto {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0; /* Impede que a foto encolha */
}

.candidato-nome {
    margin: 0;
    color: var(--cor-primaria);
}

.candidato-detalhe {
    margin: 2px 0;
    color: #6c757d;
}

.candidato-acoes {
    flex-shrink: 0; /* Impede que o botão encolha */
}

/* Mantemos o estilo do botão que você gostou */
.btn-secundario {
    display: block;
    padding: 12px 24px;
    background-color: transparent;
    color: var(--cor-primaria);
    border: 2px solid var(--cor-primaria);
    border-radius: 5px;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-secundario:hover {
    background-color: var(--cor-primaria);
    color: var(--cor-branco);
    transform: translateY(-2px);
}


/* ARQUIVO: /recursos/css/estilo.css */

/* --- ESTILO REFINADO PARA A BARRA DE BUSCA AVANÇADA --- */

.form-busca-avancada {
    display: flex;
    flex-wrap: wrap; /* Permite quebrar a linha em telas menores */
    gap: 20px; /* Espaço entre os campos */
    align-items: flex-end; /* Alinha os itens pela base */
    background-color: var(--cor-branco);
    padding: 25px;
    border-radius: 12px;
    box-shadow: var(--sombra-suave);
}

.campo-busca {
    flex: 1; /* Faz com que cada campo tente ocupar o mesmo espaço */
    min-width: 200px; /* Largura mínima antes de quebrar a linha */
}

.campo-busca label {
    display: block;
    font-weight: 700;
    margin-bottom: 8px;
    font-size: 0.9rem;
    color: var(--cor-primaria);
}

.form-busca-avancada input[type="text"],
.form-busca-avancada select {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 8px;
    font-size: 1rem;
}

.form-busca-avancada input[type="text"]:focus,
.form-busca-avancada select:focus {
    outline: none;
    border-color: var(--cor-acao);
    box-shadow: 0 0 0 3px rgba(255, 159, 28, 0.2);
}

.campo-busca-acao {
    flex-shrink: 0; /* Impede que o botão encolha */
}

.campo-busca-acao .btn-primario {
    width: auto; /* Para não ocupar 100% da largura no filtro */
    padding: 12px 25px;
    height: 47px;
}


/* ARQUIVO: /recursos/css/estilo.css */

/* --- EXCEÇÃO PARA O BOTÃO DE BUSCA NA HOMEPAGE (HERO) --- */
/* Esta regra garante que o botão de busca no banner principal
   tenha sempre o fundo laranja sólido para maior destaque. */

.hero-conteudo .filtro-vagas-hero .btn-primario {
    background-color: var(--cor-acao); /* Garante o fundo laranja */
    color: var(--cor-branco);          /* Garante o texto branco */
    border-color: var(--cor-acao);     /* Garante que a borda seja da mesma cor */
}

/* Efeito hover específico para este botão */
.hero-conteudo .filtro-vagas-hero .btn-primario:hover {
    background-color: #e68a00; /* Laranja mais escuro no hover */
    border-color: #e68a00;
}

/* --- ESTILOS PARA PÁGINAS DE CONTEÚDO (SOBRE, DEPOIMENTOS) --- */
.pagina-conteudo-container {
    padding: 60px 0;
}
.conteudo-header {
    text-align: center;
    margin-bottom: 60px;
}
.conteudo-header h1 {
    font-size: 2.8rem;
}
.conteudo-card {
    background: var(--cor-branco);
    padding: 30px 40px;
    border-radius: 12px;
    box-shadow: var(--sombra-suave);
    margin-bottom: 30px;
}
.conteudo-card h2 {
    border-bottom: 3px solid var(--cor-secundaria);
    padding-bottom: 10px;
    margin-top: 0;
}
.grid-depoimentos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px;
}
.card-depoimento {
    background: var(--cor-branco);
    padding: 30px;
    border-radius: 12px;
    box-shadow: var(--sombra-suave);
    display: flex;
    flex-direction: column;
}
.card-depoimento .fa-quote-left {
    font-size: 2.5rem;
    color: var(--cor-acao);
    opacity: 0.5;
}
.depoimento-texto {
    font-size: 1.1rem;
    font-style: italic;
    flex-grow: 1; /* Empurra o autor para o fundo */
    margin: 20px 0;
}
.depoimento-autor {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}
.autor-foto {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}
.autor-nome { display: block; font-weight: 700; }
.autor-info { font-size: 0.9rem; color: #6c757d; }