/* Flip card animations */
.flip-card {
    perspective: 1000px;
    min-height: 280px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    min-height: 280px;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

.flip-card.flipped .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    min-height: 280px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.flip-card-back {
    transform: rotateY(180deg);
}

.text-xxs {
    font-size: 0.6rem;
    line-height: 0.75rem;
}

/* Sidebar styles */
#sidebar {
    height: 100vh !important;
    height: 100dvh !important;
    transition: transform 0.3s ease-in-out;
}

#sidebar-overlay {
    transition: opacity 0.3s ease-in-out;
    backdrop-filter: blur(2px);
}

/* Burger menu */
button[onclick="toggleSidebar()"] {
    z-index: 70 !important;
}

/* Scrollbar styling for sidebar */
#sidebar nav::-webkit-scrollbar {
    width: 6px;
}

#sidebar nav::-webkit-scrollbar-track {
    background: transparent;
}

#sidebar nav::-webkit-scrollbar-thumb {
    background: #D1D5DB;
    border-radius: 3px;
}

.dark #sidebar nav::-webkit-scrollbar-thumb {
    background: #4B5563;
}

/* Mobile sidebar shadow */
@media (max-width: 1023px) {
    #sidebar {
        box-shadow: 2px 0 15px rgba(0, 0, 0, 0.2);
    }
    
    #sidebar:not(.-translate-x-full) {
        box-shadow: 2px 0 20px rgba(0, 0, 0, 0.3);
    }
}