body { background-color: #050505; color: white; font-family: 'Montserrat', sans-serif; overflow-x: hidden; }
.glass { background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.05); }
.sidebar-link:hover { background: rgba(177, 156, 217, 0.1); color: #b19cd9; }
.sidebar-link.active { border-right: 3px solid #b19cd9; background: rgba(177, 156, 217, 0.05); color: #b19cd9; }
.nav-btn { transition: all 0.3s ease; }
.nav-btn:hover { background: rgba(177, 156, 217, 0.2); color: white; }

/* Simple page transition */
.main-content {
    animation: fadeIn 0.25s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Flash message animations */
.flash-message {
    animation: slideDown 0.3s ease forwards;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.flash-success {
    background: linear-gradient(135deg, rgba(39, 174, 96, 0.2), rgba(39, 174, 96, 0.1));
    border-left: 4px solid #27ae60;
    color: #2ecc71;
}

.flash-danger {
    background: linear-gradient(135deg, rgba(231, 76, 60, 0.2), rgba(231, 76, 60, 0.1));
    border-left: 4px solid #e74c3c;
    color: #e74c3c;
}

.flash-warning {
    background: linear-gradient(135deg, rgba(241, 196, 15, 0.2), rgba(241, 196, 15, 0.1));
    border-left: 4px solid #f1c40f;
    color: #f1c40f;
}

.flash-info {
    background: linear-gradient(135deg, rgba(52, 152, 219, 0.2), rgba(52, 152, 219, 0.1));
    border-left: 4px solid #3498db;
    color: #3498db;
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: rgba(177, 156, 217, 0.3);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(177, 156, 217, 0.5);
}

/* Mobile sidebar styles */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 40;
    backdrop-filter: blur(4px);
}

.sidebar-overlay.active {
    display: block;
}

@media (max-width: 768px) {
    .desktop-sidebar {
        transform: translateX(-100%);
        position: fixed;
        z-index: 50;
        transition: transform 0.3s ease;
    }
    
    .desktop-sidebar.open {
        transform: translateX(0);
    }
    
    .main-content {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* Hide scrollbar for clean look on sidebar */
.hide-scrollbar::-webkit-scrollbar {
    width: 0px;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Mobile menu button - TOP LEFT (original position but with padding) */
.mobile-menu-btn {
    display: none;
    position: fixed;
    top: 1rem;
    left: 1rem;
    z-index: 60;
    background: rgba(177, 156, 217, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
}

@media (max-width: 768px) {
    .mobile-menu-btn {
        display: flex;
    }
    
    /* Add padding to main content on mobile so it doesn't go under button */
    .main-content {
        padding-top: 60px !important;
    }
}

/* Desktop styles - no extra padding */
@media (min-width: 769px) {
    .main-content {
        padding-top: 0 !important;
    }
}