import Image from 'next/image'

export default function Header() {
  return (
    <header className="w-full border-b border-dark-border bg-dark/90 backdrop-blur-md sticky top-0 z-50">
      <div className="max-w-6xl mx-auto px-4 sm:px-6 py-3 sm:py-4 flex items-center justify-between">
        <div className="flex items-center gap-3 sm:gap-4">
          <Image
            src="/assets/LOGO BLOD BROS SPORT GOTA  RODONA ALTA RES.jpg"
            alt="Blood Bros Sport"
            width={52}
            height={52}
            className="rounded-full sm:hidden"
            priority
          />
          <Image
            src="/assets/LOGO BLOD BROS SPORT GOTA  RODONA ALTA RES.jpg"
            alt="Blood Bros Sport"
            width={72}
            height={72}
            className="rounded-full hidden sm:block"
            priority
          />
          <div className="hidden sm:block">
            <div className="text-sm text-slate-400 uppercase tracking-widest leading-none">
              Blood Bros Sport
            </div>
            <div className="text-xl font-black text-white leading-tight mt-0.5">
              Cursa de la Cirera 2026
            </div>
          </div>
        </div>

        <div className="flex items-center gap-2">
          <span className="text-xs text-slate-500 hidden sm:block">Comandes fins al</span>
          <span className="badge badge-red text-xs">25 Juny</span>
        </div>
      </div>
    </header>
  )
}
