@import "../tailwind/pagy.css";
@import "../tailwind/flatpickr.min.css";
@import "../tailwind/public_front.css";

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  /* v3 doesn't emit theme tokens as CSS variables (v4's @theme did), but
     public_front.css references var(--font-*) throughout — so define them here.
     Colours are included too for parity, even though nothing references them yet. */
  :root {
    --color-paper: #faf7f2;
    --color-paper-dark: #f0ebe3;
    --color-ink: #2c2c2c;
    --color-ink-light: #6b6560;
    --color-matcha: #5b7a5e;
    --color-matcha-light: #8fa88e;
    --color-terracotta: #c67b5c;
    --color-red-sun: #c5392f;
    --color-cream: #f5f0e1;
    --font-serif: "Cormorant Garamond", "Noto Serif JP", serif;
    --font-sans: "Noto Sans JP", sans-serif;
    --font-jp: "Noto Serif JP", serif;
  }

  html {
    scroll-behavior: smooth;
  }
}

/* Touch devices do not have true hover; suppress sticky hover visuals project-wide.
   Selectors are spelled out (not wrapped in :where()) so this also applies on
   Safari < 14, which doesn't support :where(). */
@media (hover: none) and (pointer: coarse) {
  .v-matcha-front button:hover,
  .v-matcha-front input[type="button"]:hover,
  .v-matcha-front input[type="submit"]:hover,
  .v-matcha-front input[type="reset"]:hover,
  .v-matcha-front [role="button"]:hover,
  .v-matcha-front .v-matcha-submit:hover,
  .v-matcha-front .staff-action:hover,
  .v-matcha-front .reservation-cta:hover,
  .v-matcha-front .hotline-cta:hover,
  .v-matcha-front .customer-menu__trigger:hover,
  .v-matcha-front .customer-menu__item:hover,
  .v-matcha-front .staff-header__nav a:hover,
  .v-matcha-front .staff-header__logout:hover,
  .v-matcha-front .public-header__link:hover {
    transition: none !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
  }
}