import { CmdKButton } from "./CmdKButton";
import { GlobalMicButton } from "./GlobalMicButton";
import { ModeBreadcrumb } from "./ModeBreadcrumb";

/**
 * TopStrip — the 48px top bar composed into the global frame in Layout.tsx
 * (Task 6). Renders the mode breadcrumb on the left and the ⌘K + global
 * mic buttons on the right. Charcoal bottom border, pure black background,
 * sticky at the top of the main column.
 *
 * Per docs/specs/2026-04-11-nexus-layout-overhaul.md §4.2.
 */
export function TopStrip() {
  return (
    <header
      aria-label="Top bar"
      className="sticky top-0 z-30 flex h-12 shrink-0 items-center justify-between border-b border-border bg-background px-6"
    >
      <ModeBreadcrumb />
      <div className="flex items-center gap-4">
        <CmdKButton />
        <GlobalMicButton state="idle" />
      </div>
    </header>
  );
}
