import React from "react";
import { Award, RectangleEllipsis } from "lucide-react";

const Header: React.FC = () => {
  return (
    <header className="w-full border-b border-black/10 bg-gray-100/95 shadow-sm">
      <div className="mx-auto flex max-w-7xl items-center justify-between px-4 py-3 md:px-6">
        <div className="flex items-center gap-3">
          <Award className="h-8 w-8 text-black" strokeWidth={2.6} />
          <h1 className="text-2xl font-black tracking-tight text-neutral-900 md:text-3xl">
            MCS Lose
          </h1>
        </div>
        <a href="/admin">
          <button
            type="button"
            className="inline-flex items-center gap-2 rounded-xl border border-black/10 bg-gray-200/90 px-4 py-2 font-semibold text-neutral-900 shadow-inner transition hover:bg-gray-300/90"
          >
            <RectangleEllipsis className="h-5 w-5" />
            Login
          </button>
        </a>
      </div>
    </header>
  );
};

export default Header;