/*
Theme Name: Arroyo Distribuições
Author: Arroyo Distribuições
Description: Tema exclusivo para Arroyo Distribuições.
Version: 1.0
*/

/* Smooth Scroll */
html {
    scroll-behavior: smooth;
}

/* Animação do Fade In */
.fade-in {
    animation: fadeIn 0.8s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Container Geral do Formulário */
.arroyo-cf7-form {
    max-width: 100%;
    font-family: 'Montserrat', sans-serif; /* Mesma fonte do site */
}

/* Estrutura de Linhas e Colunas (Flexbox) */
.arroyo-cf7-form .arroyo-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
    flex-wrap: wrap; /* Para quebrar linha no mobile */
}

.arroyo-cf7-form .arroyo-col {
    flex: 1; /* Ocupa espaço igual */
    min-width: 250px; /* Evita ficar muito estreito no mobile */
}

.arroyo-cf7-form .arroyo-col.full {
    flex: 100%;
}

/* Estilo das Labels (Títulos dos campos) */
.arroyo-cf7-form label {
    display: block;
    font-size: 14px;
    font-weight: 700; /* Negrito conforme imagem */
    color: #374151; /* Cinza escuro (Gray-700 do Tailwind) */
    margin-bottom: 6px;
}

/* Estilo dos Inputs (Campos de texto) */
.arroyo-cf7-form .arroyo-input {
    width: 100%;
    padding: 12px 16px;
    background-color: #F9FAFB; /* Fundo levemente cinza */
    border: 1px solid #E5E7EB; /* Borda cinza clara */
    border-radius: 8px; /* Cantos arredondados */
    font-size: 15px;
    color: #4B5563;
    outline: none;
    transition: all 0.3s ease;
    box-sizing: border-box; /* Garante que o padding não estoure a largura */
}

/* Efeito ao clicar no campo (Foco) */
.arroyo-cf7-form .arroyo-input:focus {
    border-color: #F97316; /* Laranja Prats */
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.1);
}

/* Estilização do Placeholder (Texto de exemplo) */
.arroyo-cf7-form .arroyo-input::placeholder {
    color: #9CA3AF;
    font-weight: 400;
}

/* Estilo do Botão de Enviar */
.arroyo-cf7-form input[type="submit"] {
    width: 100%;
    background-color: #F97316; /* Laranja Vibrante */
    color: white;
    font-weight: 700;
    font-size: 16px;
    padding: 16px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-transform: uppercase;
    transition: background-color 0.3s ease, transform 0.2s;
    margin-top: 10px;
}

/* Hover do Botão */
.arroyo-cf7-form input[type="submit"]:hover {
    background-color: #C2410C; /* Laranja mais escuro */
    transform: translateY(-2px); /* Leve subida */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}