/* Dashboard CSS */

/* Custom Properties for Level Gradients */
:root {
    --level-gradient-1: linear-gradient(135deg, #fcece0 0%, #ffe0b2 100%);
    --level-gradient-2: linear-gradient(135deg, #e6f4ea 0%, #c8e6c9 100%);
    --level-gradient-3: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
    --level-gradient-4: linear-gradient(135deg, #e0f2f1 0%, #b2dfdb 100%);

    --level-gradient-1-dark: linear-gradient(135deg, rgba(255, 152, 0, 0.1) 0%, rgba(255, 152, 0, 0.2) 100%);
    --level-gradient-2-dark: linear-gradient(135deg, rgba(76, 175, 80, 0.1) 0%, rgba(76, 175, 80, 0.2) 100%);
    --level-gradient-3-dark: linear-gradient(135deg, rgba(156, 39, 176, 0.1) 0%, rgba(156, 39, 176, 0.2) 100%);
    --level-gradient-4-dark: linear-gradient(135deg, rgba(0, 150, 136, 0.1) 0%, rgba(0, 150, 136, 0.2) 100%);
}

/* Custom Scrollbar */
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(156, 163, 175, 0.3);
    border-radius: 9999px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: rgba(156, 163, 175, 0.5);
}

/* Animations */
@keyframes pulse-glow {

    0%,
    100% {
        box-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
    }

    50% {
        box-shadow: 0 0 20px rgba(34, 197, 94, 0.8);
    }
}

.shadow-glow {
    box-shadow: 0 0 20px -5px rgba(239, 131, 84, 0.4);
}

.shadow-soft {
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.08);
}

/* Material Symbols Fill */
.material-symbols-outlined.fill-1 {
    font-variation-settings:
        'FILL' 1,
        'wght' 400,
        'GRAD' 0,
        'opsz' 24
}

/* Project Selector Dropdown transition */
#project-selector-dropdown {
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out, visibility 0.2s;
}

#project-selector-dropdown.hidden {
    opacity: 0;
    transform: translateY(-10px);
    visibility: hidden;
    display: flex;
    /* keep layout but hide visually */
}

#project-selector-dropdown:not(.hidden) {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    display: flex;
}