/* Estilos personalizados para el admin de Texfina */

/* Variables de color principales */
:root {
    --texfina-primary: #8b5cf6;
    --texfina-primary-light: #a78bfa;
    --texfina-primary-dark: #7c3aed;
    --texfina-secondary: #06b6d4;
    --texfina-success: #10b981;
    --texfina-warning: #f59e0b;
    --texfina-danger: #ef4444;
    --texfina-dark: #1f2937;
    --texfina-light: #f9fafb;
}

/* Personalización del header */
.unfold-header {
    background: linear-gradient(135deg, var(--texfina-primary) 0%, var(--texfina-primary-dark) 100%);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Personalización de la barra lateral */
.unfold-sidebar {
    background: var(--texfina-dark);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.unfold-sidebar .unfold-nav-item:hover {
    background: rgba(139, 92, 246, 0.1);
    border-radius: 6px;
    margin: 2px 8px;
}

/* Personalización de botones */
.unfold-btn-primary {
    background: var(--texfina-primary);
    border-color: var(--texfina-primary);
}

.unfold-btn-primary:hover {
    background: var(--texfina-primary-dark);
    border-color: var(--texfina-primary-dark);
}

/* Personalización de cards */
.unfold-card {
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* Personalización de la página de login */
.unfold-login-form {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

/* Personalización de KPIs en el dashboard */
.unfold-kpi-card {
    background: linear-gradient(135deg, var(--texfina-light) 0%, #ffffff 100%);
    border-left: 4px solid var(--texfina-primary);
}

/* Estilos para tablas */
.unfold-table th {
    background: var(--texfina-light);
    border-bottom: 2px solid var(--texfina-primary);
}

/* Animaciones suaves */
.unfold-nav-item,
.unfold-btn,
.unfold-card {
    transition: all 0.3s ease;
}

/* Personalización de enlaces */
a {
    color: var(--texfina-primary);
}

a:hover {
    color: var(--texfina-primary-dark);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .unfold-sidebar {
        transform: translateX(-100%);
    }
    
    .unfold-sidebar.unfold-sidebar-open {
        transform: translateX(0);
    }
}

/* Estilo para notificaciones */
.unfold-alert-success {
    background: rgba(16, 185, 129, 0.1);
    border-color: var(--texfina-success);
    color: var(--texfina-success);
}

.unfold-alert-warning {
    background: rgba(245, 158, 11, 0.1);
    border-color: var(--texfina-warning);
    color: var(--texfina-warning);
}

.unfold-alert-danger {
    background: rgba(239, 68, 68, 0.1);
    border-color: var(--texfina-danger);
    color: var(--texfina-danger);
}

/* Personalización del logo */
.unfold-logo {
    filter: brightness(1.1);
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    :root {
        --texfina-light: #1f2937;
        --texfina-dark: #f9fafb;
    }
}