/* styles.css */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body {
    font-family: 'Inter', sans-serif;
    background-color: #0f0f0f; /* Deep dark background */
    color: #e5e7eb; /* Gray-200 */
}

/* Scrollbar styling for a premium feel */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #18181b; 
}
::-webkit-scrollbar-thumb {
    background: #3f3f46; 
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #52525b; 
}

/* Custom utility for the card hover effect */
.nav-card {
    transition: all 0.2s ease-in-out;
}

.nav-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
    border-color: #52525b; /* Zinc-600 */
}

/* Map Room Styles */
.room-card {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 0.5rem;
    font-weight: 600;
    transition: filter 0.2s;
    border: 1px solid rgba(255,255,255,0.05);
}

.room-card:hover {
    filter: brightness(1.1);
    cursor: pointer;
}