/* ================= PROFILE MENU (Modern Glassmorphism) ================= */
.header nav ul li.menu {
    position: relative;
    /* Bridge: extends the hoverable area of the parent LI */
    padding-bottom: 15px; 
    margin-bottom: -15px;
}

/* Submenu Container */
.header nav ul li.menu .submenu {
    display: none;
    position: absolute;
    /* Positioned slightly above the bottom of the bridge to ensure overlap */
    top: calc(100% - 10px); 
    left: 50%;
    transform: translateX(-50%);
    
    /* Glassmorphism Logic */
    background: rgba(15, 23, 42, 0.9); /* Deep Slate/Navy */
    backdrop-filter: blur(12px); 
    -webkit-backdrop-filter: blur(12px);
    
    /* Mature Styling */
    border: 1px solid rgba(255, 255, 255, 0.1); 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    padding: 8px;
    border-radius: 12px;
    z-index: 5000;
    flex-direction: column;
    gap: 4px;
    min-width: 180px; 
    align-items: stretch; 
}

/* Entrance Animation */
@keyframes glassFadeIn {
    from { 
        opacity: 0; 
        transform: translateX(-50%) translateY(10px); 
    }
    to { 
        opacity: 1; 
        transform: translateX(-50%) translateY(0); 
    }
}

/* Show submenu on hover of the parent LI */
.header nav ul li.menu:hover .submenu {
    display: flex;
    animation: glassFadeIn 0.25s ease-out forwards;
}

/* Remove list style */
.header nav ul li.menu .submenu li {
    list-style: none;
}

/* Submenu Links */
.header nav ul li.menu .submenu a {
    display: block;
    text-align: left;
    padding: 10px 16px; 
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.85); /* Refined off-white */
    background: transparent;
    border: none; 
    text-decoration: none;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    font-size: 13px;
    font-weight: 500;
}

/* Hover Effect: Soft Light-up */
.header nav ul li.menu .submenu a:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

/* Specialized Logout Style */
.header nav ul li.menu .submenu a[href*="logout"] {
    color: #fca5a5; /* Mature soft red */
}

.header nav ul li.menu .submenu a[href*="logout"]:hover {
    background: rgba(239, 68, 68, 0.1);
    color: #ffffff;
}