/* Estilos para o Widget Consultor de IA Gemini */

/* Animação de Fade-in para o resultado */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Estilo para o campo de upload de arquivo */
.custom-file-upload {
    border: 2px dashed #cbd5e1;
    display: block;
    padding: 2rem;
    cursor: pointer;
    text-align: center;
    width: 100%;
    border-radius: 0.5rem;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
.custom-file-upload:hover {
    background-color: #f1f5f9;
    border-color: #94a3b8;
}

/* Garante que o container flex funcione corretamente */
#image-loading-overlay {
    display: flex;
}

/* Estilos para o botão customizável */
.gemini-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.gemini-button:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5);
}

.gemini-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Estilos para ícones do botão */
.button-icon-before,
.button-icon-after {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.button-icon-before:empty,
.button-icon-after:empty {
    display: none;
}

/* Container do botão para alinhamento */
.button-container {
    width: 100%;
}

/* Estilos responsivos para seções */
.consultant-section,
.tryout-section {
    transition: opacity 0.3s ease;
}

.consultant-section[style*="display: none"],
.tryout-section[style*="display: none"] {
    opacity: 0;
    pointer-events: none;
}

/* Compatibilidade com animações do Elementor */
.gemini-button[class*="elementor-animation-"] {
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

/* Estilos para estados do botão */
.gemini-button.loading {
    pointer-events: none;
}

.gemini-button.loading .button-text {
    opacity: 0.7;
}

/* Responsividade aprimorada */
@media (max-width: 768px) {
    .gemini-button {
        font-size: 14px;
        padding: 12px 24px;
    }
    
    .button-icon-before,
    .button-icon-after {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .gemini-button {
        font-size: 13px;
        padding: 10px 20px;
    }
    
    .button-icon-before,
    .button-icon-after {
        font-size: 14px;
    }
}