/* Import Poppins font from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

:root {
    --primary-bg: #1f1e1e; /* Dark gray background */
    --secondary-bg: #374151; /* Lighter gray for hover/accents */
    --text-primary: #d1d5db; /* Light gray text */
    --text-secondary: #9ca3af; /* Slightly darker gray for secondary text */
    --shadow-color: rgba(0, 0, 0, 0.5);
}

body {
    background-color: var(--primary-bg);
    color: var(--text-primary);
    font-family: 'Poppins', Arial, sans-serif;
}

/* Removed .menu-card:hover rule since we don’t want background change */

/* Thumbnail styles */
.thumbnail {
    width: 100%;
    max-width: 300px; /* Adjust as needed */
    height: auto; /* Preserve aspect ratio */
    transition: transform 0.3s ease; /* Smooth zoom transition */
}

.menu-card:hover .thumbnail {
    transform: scale(1.05); /* Slight zoom on hover */
}

/* Scrollbar hiding */
.no-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    overflow-y: scroll;
}

.no-scrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari, and Opera */
}