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

@layer utilities {
    .no-scrollbar::-webkit-scrollbar {
        display: none;
    }
    .no-scrollbar {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
}

@keyframes marquee-left {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@keyframes marquee-right {
    from { transform: translateX(-50%); }
    to { transform: translateX(0); }
}
.animate-marquee-left {
    animation: marquee-left 50s linear infinite;
    width: fit-content;
}
.animate-marquee-right {
    animation: marquee-right 45s linear infinite;
    width: fit-content;
}
.animate-marquee-left:hover,
.animate-marquee-right:hover {
    animation-play-state: paused;
}