/* Filament Premium Theme Customizations */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;900&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --primary-color: #422059;
    --primary-gradient: linear-gradient(135deg, #422059 0%, #633285 100%);
}

/* Fondo elegante para Auth */
.fi-layout-simple-main {
    background: radial-gradient(circle at top right, #fdfcfd, #f5f3f7) !important;
}


/* Tipografía Corporativa */
.fi-header-heading, 
.fi-logo,
.fi-sidebar-group-label,
.fi-section-header-heading,
.fi-ta-header-heading {
    font-family: 'Outfit', sans-serif !important;
    letter-spacing: -0.02em;
}

/* Glassmorphism Sidebar */
.fi-sidebar {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.dark .fi-sidebar {
    background: rgba(15, 23, 42, 0.7) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Estilo Premium para Botones Primarios */
.fi-btn.fi-color-primary.fi-btn-size-md {
    background: var(--primary-gradient) !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(66, 32, 89, 0.25) !important;
    transition: all 0.3s ease !important;
}

.fi-btn.fi-color-primary.fi-btn-size-md:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 15px rgba(66, 32, 89, 0.35) !important;
}

/* Suavizado general de la interfaz */
.fi-section, .fi-ta-ctn, .fi-modal-window {
    border-radius: 1.25rem !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02) !important;
}

.fi-sidebar-item-active {
    background: var(--primary-gradient) !important;
    color: white !important;
    border-radius: 0.75rem !important;
    margin: 0 0.5rem !important;
}

.fi-sidebar-item-active * {
    color: white !important;
}

/* Animación sutil de entrada */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

main {
    animation: fadeIn 0.4s ease-out;
}