/* Los Patrones Mexican Restaurant — Custom Styles */

/* Custom property reset for Tailwind compatibility */
:root {
    --color-midnight-950: #050a14;
    --color-midnight-900: #0a1628;
    --color-midnight-800: #0f1f3a;
    --color-gold-500: #d4a017;
    --color-gold-600: #b8860b;
    --color-mint-400: #4ade80;
    --color-mint-500: #2dd4a0;
}

/* Base styles */
body {
    font-family: 'Inter', system-ui, sans-serif;
    background-color: #050a14;
    color: #ffffff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Display font */
.font-display {
    font-family: 'Playfair Display', Georgia, serif;
}

/* Selection color */
::selection {
    background-color: rgba(212, 160, 23, 0.3);
    color: #ffffff;
}

/* Focus styles */
a:focus-visible, button:focus-visible {
    outline: 2px solid #d4a017;
    outline-offset: 2px;
    border-radius: 4px;
}

/* Smooth image loading */
img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Prevent content flash on scroll */
@media (prefers-reduced-motion: no-preference) {
    .reveal {
        will-change: opacity, transform;
    }
}

/* Ensure mobile menu is hidden by default */
@media (min-width: 768px) {
    #mobileMenu {
        display: none !important;
    }
}

/* Custom scrollbar for Webkit */
@media (prefers-reduced-motion: no-preference) {
    ::-webkit-scrollbar {
        width: 8px;
    }
    ::-webkit-scrollbar-track {
        background: #0a1628;
    }
    ::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, #d4a017, #b8860b);
        border-radius: 4px;
    }
    ::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(180deg, #fde047, #d4a017);
    }
}

/* Print styles */
@media print {
    nav, #mobileMenu, .reveal {
        display: none !important;
    }
    body {
        background: white;
        color: black;
    }
    section {
        page-break-inside: avoid;
    }
}