/* Sinel Hospitality — component styles
   Loaded as a plain stylesheet (public/css/site.css). Tailwind's utility
   classes come from the CDN script in layouts/app.blade.php, so this file
   only needs the custom bits Tailwind's utilities can't express directly. */

/* ---------- Utility ticker (header) ---------- */
.ticker-track {
    display: inline-flex;
    animation: ticker 28s linear infinite;
    white-space: nowrap;
}
@keyframes ticker {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .ticker-track { animation: none; }
}

/* ---------- Nav underline hover ---------- */
.nav-link { position: relative; }
.nav-link::after {
    content: '';
    position: absolute;
    left: 0; bottom: -4px;
    width: 0; height: 2px;
    background: #FF6B4A; /* coral */
    transition: width .25s ease;
}
.nav-link:hover::after,
.nav-link:focus-visible::after { width: 100%; }

/* ---------- Mobile off-canvas menu ---------- */
.mobile-menu {
    transform: translateX(100%);
    transition: transform .35s ease;
}
.mobile-menu.open { transform: translateX(0); }

/* ---------- Focus visibility ---------- */
a:focus-visible, button:focus-visible {
    outline: 2px solid #FF6B4A; /* coral */
    outline-offset: 3px;
}

/* ---------- Scroll-reveal (paired with site.js IntersectionObserver) ---------- */
.reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .6s ease, transform .6s ease;
}
.reveal.is-visible {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- Hide scrollbar on horizontal carousels ---------- */
.no-scrollbar {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.no-scrollbar::-webkit-scrollbar {
    display: none;
}