import Image from "next/image";
import Link from "next/link";

import { LanguageSwitcher } from "@/components/LanguageSwitcher";
import { ROUTES } from "@/lib/constants/routes";

/**
 * Shared header for auth routes (login, forgot-password). Logo sits at the
 * inline-start edge, language toggle at inline-end — a plain flex row mirrors
 * this automatically between LTR and RTL.
 */
export function AuthHeader() {
  return (
    <header className="sticky top-0 z-20 flex w-full shrink-0 items-center justify-between gap-4 border-b border-border bg-white px-4 py-3 sm:px-6">
      <Link
        href={ROUTES.HOME}
        className="flex shrink-0 items-center"
        aria-label="Washy"
      >
        <Image
          src="/icon/horizontal_icon.png"
          alt="Washy"
          width={500}
          height={152}
          className="h-8 w-auto sm:h-9"
          priority
        />
      </Link>
      <LanguageSwitcher />
    </header>
  );
}