/*
 * Website-specific styles for the public-facing site.
 * Kept separate from GatePass app styles for easy extraction into a standalone project.
 */

/* Smooth scroll for anchor links */
html {
    scroll-behavior: smooth;
}

/* Navigation link hover/active state */
.website-nav-link:hover {
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-body-color) !important;
}

.website-nav-link:active {
    background-color: var(--bs-secondary-bg);
}

/* Mobile menu – positioned below the header via position: absolute */
.website-mobile-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1030;
}

/* Timeline – subtle pulsing ring for the currently active step (Vägen till öppning) */
.timeline-step-active {
    box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0.55);
    animation: timeline-pulse 2s infinite;
}

@keyframes timeline-pulse {
    0%   { box-shadow: 0 0 0 0    rgba(var(--bs-primary-rgb), 0.55); }
    70%  { box-shadow: 0 0 0 12px rgba(var(--bs-primary-rgb), 0);    }
    100% { box-shadow: 0 0 0 0    rgba(var(--bs-primary-rgb), 0);    }
}

@media (prefers-reduced-motion: reduce) {
    .timeline-step-active { animation: none; }
}