/* Colores únicos para niveles de usuario */

/* Nivel 0 - ADMIN - Efecto Dorado */
.level-0 {
    background: linear-gradient(135deg, #FFD700, #FFA500, #FF8C00, #FFD700) !important;
    background-size: 300% 300% !important;
    animation: goldShimmer 3s ease-in-out infinite !important;
    color: #2c1810 !important;
    border: 2px solid #DAA520 !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) !important;
    box-shadow: 
        0 2px 8px rgba(255, 215, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Para el botón dropdown del nombre de usuario - Efecto discreto solo texto */
.nav-link.dropdown-toggle.level-0 {
    background: transparent !important; /* Fondo completamente transparente */
    color: transparent !important;
    background-image: linear-gradient(45deg, #FFD700, #FFA500, #FF8C00, #FFD700) !important;
    background-size: 300% 300% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    animation: goldTextShimmer 3s ease-in-out infinite !important;
    border: none !important; /* Sin contorno exterior */
    box-shadow: none !important; /* Sin sombras exteriores */
    font-weight: bold !important;
    filter: none !important; /* Sin filtros de sombra */
    position: relative !important;
}

/* Para badges y otros elementos - Efecto completo */
.badge.level-0, .admin-level {
    background: linear-gradient(135deg, #FFD700, #FFA500, #FF8C00, #FFD700) !important;
    background-size: 300% 300% !important;
    animation: goldShimmer 3s ease-in-out infinite !important;
    color: #2c1810 !important;
    border: 2px solid #DAA520 !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) !important;
    box-shadow: 
        0 2px 8px rgba(255, 215, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Animación de brillo dorado */
@keyframes goldShimmer {
    0% {
        background-position: 0% 50%;
        box-shadow: 
            0 2px 8px rgba(255, 215, 0, 0.4),
            inset 0 1px 0 rgba(255, 255, 255, 0.3);
    }
    25% {
        background-position: 50% 0%;
        box-shadow: 
            0 3px 12px rgba(255, 215, 0, 0.6),
            inset 0 1px 0 rgba(255, 255, 255, 0.4);
    }
    50% {
        background-position: 100% 50%;
        box-shadow: 
            0 4px 16px rgba(255, 215, 0, 0.8),
            inset 0 1px 0 rgba(255, 255, 255, 0.5);
    }
    75% {
        background-position: 50% 100%;
        box-shadow: 
            0 3px 12px rgba(255, 215, 0, 0.6),
            inset 0 1px 0 rgba(255, 255, 255, 0.4);
    }
    100% {
        background-position: 0% 50%;
        box-shadow: 
            0 2px 8px rgba(255, 215, 0, 0.4),
            inset 0 1px 0 rgba(255, 255, 255, 0.3);
    }
}

/* Animación de brillo dorado solo para el texto */
@keyframes goldTextShimmer {
    0% {
        background-position: 0% 50%;
    }
    25% {
        background-position: 50% 0%;
    }
    50% {
        background-position: 100% 50%;
    }
    75% {
        background-position: 50% 100%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* Efecto de brillo adicional para Admin - Solo para badges y elementos completos */
.badge.level-0::before, .admin-level::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    animation: goldSweep 4s ease-in-out infinite;
    pointer-events: none;
}

/* Efecto de brillo sutil para el texto del dropdown - Deshabilitado */
.nav-link.dropdown-toggle.level-0::before {
    display: none; /* Sin efecto de barrido para máxima discreción */
}

@keyframes goldSweep {
    0% { left: -100%; }
    50% { left: 100%; }
    100% { left: 100%; }
}

/* Hover especial para badges y elementos completos */
.badge.level-0:hover, .admin-level:hover {
    background: linear-gradient(135deg, #FFED4E, #FFCD3C, #FF9500, #FFED4E) !important;
    transform: scale(1.05) !important;
    box-shadow: 
        0 6px 20px rgba(255, 215, 0, 0.7),
        inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
    transition: all 0.3s ease !important;
    animation-duration: 1.5s !important;
}

/* Hover especial para el texto del dropdown - Más discreto */
.nav-link.dropdown-toggle.level-0:hover {
    background: transparent !important;
    background-image: linear-gradient(45deg, #FFED4E, #FFCD3C, #FF9500, #FFED4E) !important;
    background-size: 400% 400% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    transform: scale(1.02) !important;
    filter: none !important; /* Sin sombras en hover */
    box-shadow: none !important; /* Sin sombras exteriores */
    transition: all 0.3s ease !important;
    animation-duration: 1.5s !important;
}

/* Nivel 1 - C/Molde */
.level-1, .badge.level-1 {
    background-color: #8B4513 !important; /* Marrón */
    color: white !important;
    border-color: #8B4513 !important;
}

/* Nivel 2 - TÉC INY */
.level-2, .badge.level-2 {
    background-color: #FF4500 !important; /* Naranja rojizo */
    color: white !important;
    border-color: #FF4500 !important;
}

/* Nivel 3 - Diseño de Molde */
.level-3, .badge.level-3 {
    background-color: #4B0082 !important; /* Índigo */
    color: white !important;
    border-color: #4B0082 !important;
}

/* Nivel 4 - Matricería */
.level-4, .badge.level-4 {
    background-color: #2F4F4F !important; /* Gris pizarra oscuro */
    color: white !important;
    border-color: #2F4F4F !important;
}

/* Nivel 5 - Personal C/M + Moldes */
.level-5, .badge.level-5 {
    background-color: #17a2b8 !important; /* Cian/Info */
    color: white !important;
    border-color: #17a2b8 !important;
}

/* Nivel 6 - Proceso C/M + Maquinas */
.level-6, .badge.level-6 {
    background-color: #20c997 !important; /* Teal */
    color: white !important;
    border-color: #20c997 !important;
}

/* Nivel 7 - Supervisor */
.level-7, .badge.level-7 {
    background-color: #6f42c1 !important; /* Púrpura */
    color: white !important;
    border-color: #6f42c1 !important;
}

/* Nivel 8 - RRNN / Planificación */
.level-8, .badge.level-8 {
    background-color: #ffc107 !important; /* Amarillo/Warning */
    color: #212529 !important;
    border-color: #ffc107 !important;
}

/* Nivel 9 - Mantenimiento */
.level-9, .badge.level-9 {
    background-color: #28a745 !important; /* Verde/Success */
    color: white !important;
    border-color: #28a745 !important;
}

/* Nivel 10 - Dirección */
.level-10, .badge.level-10 {
    background-color: #dc3545 !important; /* Rojo/Danger */
    color: white !important;
    border-color: #dc3545 !important;
}

/* Estilos hover para interacción - Genérico */
.level-0:hover { 
    background: linear-gradient(135deg, #FFED4E, #FFCD3C, #FF9500, #FFED4E) !important;
    transform: scale(1.05) !important;
    animation-duration: 1.5s !important;
}
.level-1:hover { background-color: #654321 !important; }
.level-2:hover { background-color: #FF6347 !important; }
.level-3:hover { background-color: #6A0DAD !important; }
.level-4:hover { background-color: #696969 !important; }
.level-5:hover { background-color: #138496 !important; }
.level-6:hover { background-color: #1e7e34 !important; }
.level-7:hover { background-color: #5a32a3 !important; }
.level-8:hover { background-color: #e0a800 !important; }
.level-9:hover { background-color: #1e7e34 !important; }
.level-10:hover { background-color: #c82333 !important; }

/* Estilos para botones con niveles */
.btn.level-0, .btn.level-1, .btn.level-2, .btn.level-3, .btn.level-4, .btn.level-5,
.btn.level-6, .btn.level-7, .btn.level-8, .btn.level-9, .btn.level-10 {
    border: none;
    font-weight: 500;
    text-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

/* Botones Admin tienen efecto especial */
.btn.level-0 {
    background: linear-gradient(135deg, #FFD700, #FFA500, #FF8C00, #FFD700) !important;
    background-size: 300% 300% !important;
    animation: goldShimmer 3s ease-in-out infinite !important;
    color: #2c1810 !important;
    border: 2px solid #DAA520 !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) !important;
    font-weight: bold !important;
}

/* Estilos para cards con niveles */
.card.level-0, .card.level-1, .card.level-2, .card.level-3, .card.level-4, .card.level-5,
.card.level-6, .card.level-7, .card.level-8, .card.level-9, .card.level-10 {
    border-width: 2px;
}

/* Cards Admin tienen efecto dorado */
.card.level-0 {
    border-width: 3px;
    border-color: #DAA520;
    box-shadow: 
        0 4px 16px rgba(255, 215, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* Efecto de brillo para elementos seleccionados */
.level-selected {
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    transform: scale(1.02);
    transition: all 0.2s ease;
}