import { statusLine } from "@/lib/portfolio";

export function StatusBar() {
  return (
    <div className="border-b border-blacksite-line bg-blacksite-bg text-blacksite-muted">
      <div className="mx-auto flex max-w-7xl items-center justify-between gap-4 px-4 py-2 sm:px-6 lg:px-8">
        <p className="section-label flex min-w-0 items-center gap-2">
          <span
            aria-hidden="true"
            className="size-1.5 shrink-0 rounded-full bg-signal-green shadow-[0_0_14px_rgba(182,255,0,0.45)]"
          />
          <span className="truncate">{statusLine}</span>
        </p>
        <a
          href="#contact"
          className="section-label shrink-0 !text-blacksite-text transition-colors hover:!text-signal-cyan focus-visible:outline-signal-cyan"
        >
          Contact ↗
        </a>
      </div>
    </div>
  );
}