/* Custom tweaks beyond Tailwind. */

* { -webkit-tap-highlight-color: rgba(45, 150, 72, 0.15); }

html { scroll-behavior: smooth; }

body { font-feature-settings: 'ss01', 'cv02'; }

/* Reserved cards get a subtle desaturation. */
.card.is-reserved .cover img {
    filter: saturate(0.55) brightness(0.95);
}

.card.is-reserved {
    opacity: 0.92;
}

/* Reservation form animation. */
.card .js-reserve-form {
    animation: slideDown 0.18s ease-out;
}

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

/* Make sure dialog close-up looks nice on iOS. */
dialog::backdrop { animation: fadeIn 0.15s ease-out; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
dialog[open] { animation: pop 0.18s ease-out; }
@keyframes pop {
    from { opacity: 0; transform: translateY(8px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}