import { ANNOUNCEMENTS } from "@/lib/constants";

export default function Marquee() {
  const items = [...ANNOUNCEMENTS, ...ANNOUNCEMENTS];
  return (
    <div className="no-print relative overflow-hidden border-y border-gold-600/40 bg-maroon-800 py-2.5">
      <div className="pointer-events-none absolute inset-y-0 left-0 z-10 w-24 bg-gradient-to-r from-maroon-800 to-transparent" />
      <div className="pointer-events-none absolute inset-y-0 right-0 z-10 w-24 bg-gradient-to-l from-maroon-800 to-transparent" />
      <div className="animate-marquee flex w-max items-center gap-10 whitespace-nowrap">
        {items.map((text, i) => (
          <span key={i} className="flex items-center gap-10 text-[11px] font-medium uppercase tracking-[0.22em] text-gold-100/90">
            {text}
            <span className="text-gold-400">✦</span>
          </span>
        ))}
      </div>
    </div>
  );
}