import { cn } from "@/lib/utils";

/**
 * Architype Stedelijk: the five khmy$ glyph outlines from The Foundry's
 * specimen, set at their original advance widths with no added tracking.
 * Source: https://www.thefoundrytypes.com/fonts/architype-stedelijk/
 * Only the fixed logo artwork is included; no font software is bundled.
 */
const WORDMARK_PATH = [
  "M17 667 Q10 667 5 662 Q0 657 0 650 L0 17 Q0 10 5 5 Q10 0 17 0 L78 0 Q85 0 90 5 Q95 10 95 17 L95 364 Q95 371 100 376 Q105 381 112 381 L269 381 Q276 381 281 376 Q286 371 286 364 L286 208 Q286 201 291 196 Q296 191 303 191 L364 191 Q371 191 376 196 Q381 201 381 208 L381 364 Q381 371 376 376 Q371 381 364 381 L303 381 Q296 381 291 386 Q286 391 286 398 L286 460 Q286 467 291 472 Q296 477 303 477 L364 477 Q371 477 376 482 Q381 487 381 494 L381 650 Q381 657 376 662 Q371 667 364 667 L303 667 Q296 667 291 662 Q286 657 286 650 L286 494 Q286 487 281 482 Q276 477 269 477 L112 477 Q105 477 100 482 Q95 487 95 494 L95 650 Q95 657 90 662 Q85 667 78 667 L17 667 Z",
  "M422 667 Q415 667 410 662 Q405 657 405 650 L405 17 Q405 10 410 5 Q415 0 422 0 L483 0 Q490 0 495 5 Q500 10 500 17 L500 174 Q500 181 505 186 Q510 191 517 191 L674 191 Q681 191 686 196 Q691 201 691 208 L691 269 Q691 276 696 281 Q701 286 708 286 L769 286 Q776 286 781 291 Q786 296 786 303 L786 650 Q786 657 781 662 Q776 667 769 667 L708 667 Q701 667 696 662 Q691 657 691 650 L691 303 Q691 296 686 291 Q681 286 674 286 L517 286 Q510 286 505 291 Q500 296 500 303 L500 650 Q500 657 495 662 Q490 667 483 667 L422 667 Z",
  "M827 667 Q820 667 815 662 Q810 657 810 650 L810 208 Q810 201 815 196 Q820 191 827 191 L1079 191 Q1086 191 1091 196 Q1096 201 1096 208 L1096 269 Q1096 276 1101 281 Q1106 286 1113 286 L1174 286 Q1181 286 1186 281 Q1191 276 1191 269 L1191 208 Q1191 201 1196 196 Q1201 191 1208 191 L1365 191 Q1372 191 1377 196 Q1382 201 1382 208 L1382 269 Q1382 276 1387 281 Q1392 286 1399 286 L1460 286 Q1467 286 1472 291 Q1477 296 1477 303 L1477 650 Q1477 657 1472 662 Q1467 667 1460 667 L1399 667 Q1392 667 1387 662 Q1382 657 1382 650 L1382 303 Q1382 296 1377 291 Q1372 286 1365 286 L1208 286 Q1201 286 1196 291 Q1191 296 1191 303 L1191 650 Q1191 657 1186 662 Q1181 667 1174 667 L1113 667 Q1106 667 1101 662 Q1096 657 1096 650 L1096 303 Q1096 296 1091 291 Q1086 286 1079 286 L922 286 Q915 286 910 291 Q905 296 905 303 L905 650 Q905 657 900 662 Q895 667 888 667 L827 667 Z",
  "M1613 667 Q1606 667 1601 662 Q1596 657 1596 650 L1596 589 Q1596 582 1591 577 Q1586 572 1579 572 L1518 572 Q1511 572 1506 567 Q1501 562 1501 555 L1501 208 Q1501 201 1506 196 Q1511 191 1518 191 L1579 191 Q1586 191 1591 196 Q1596 201 1596 208 L1596 555 Q1596 562 1601 567 Q1606 572 1613 572 L1770 572 Q1777 572 1782 567 Q1787 562 1787 555 L1787 208 Q1787 201 1792 196 Q1797 191 1804 191 L1865 191 Q1872 191 1877 196 Q1882 201 1882 208 L1882 745 Q1882 752 1877 757 Q1872 762 1865 762 L1804 762 Q1797 762 1792 767 Q1787 772 1787 779 L1787 840 Q1787 847 1782 852 Q1777 857 1770 857 L1518 857 Q1511 857 1506 852 Q1501 847 1501 840 L1501 779 Q1501 772 1506 767 Q1511 762 1518 762 L1770 762 Q1777 762 1782 757 Q1787 752 1787 745 L1787 684 Q1787 677 1782 672 Q1777 667 1770 667 L1613 667 Z",
  "M1923 667 Q1916 667 1911 662 Q1906 657 1906 650 L1906 589 Q1906 582 1911 577 Q1916 572 1923 572 L2175 572 Q2182 572 2187 567 Q2192 562 2192 555 L2192 494 Q2192 487 2187 482 Q2182 477 2175 477 L1923 477 Q1916 477 1911 472 Q1906 467 1906 460 L1906 303 Q1906 296 1911 291 Q1916 286 1923 286 L1984 286 Q1991 286 1996 281 Q2001 276 2001 269 L2001 208 Q2001 201 2006 196 Q2011 191 2018 191 L2079 191 Q2086 191 2091 186 Q2096 181 2096 174 L2096 113 Q2096 106 2101 101 Q2106 96 2113 96 L2175 96 Q2182 96 2187 101 Q2192 106 2192 113 L2192 174 Q2192 181 2197 186 Q2202 191 2209 191 L2270 191 Q2277 191 2282 196 Q2287 201 2287 208 L2287 269 Q2287 276 2282 281 Q2277 286 2270 286 L2018 286 Q2011 286 2006 291 Q2001 296 2001 303 L2001 364 Q2001 371 2006 376 Q2011 381 2018 381 L2270 381 Q2277 381 2282 386 Q2287 391 2287 398 L2287 555 Q2287 562 2282 567 Q2277 572 2270 572 L2209 572 Q2202 572 2197 577 Q2192 582 2192 589 L2192 745 Q2192 752 2187 757 Q2182 762 2175 762 L2113 762 Q2106 762 2101 757 Q2096 752 2096 745 L2096 684 Q2096 677 2091 672 Q2086 667 2079 667 L1923 667 Z",
].join(" ");

const MONOGRAM_PATH = "M17 667 Q10 667 5 662 Q0 657 0 650 L0 17 Q0 10 5 5 Q10 0 17 0 L78 0 Q85 0 90 5 Q95 10 95 17 L95 364 Q95 371 100 376 Q105 381 112 381 L269 381 Q276 381 281 376 Q286 371 286 364 L286 208 Q286 201 291 196 Q296 191 303 191 L364 191 Q371 191 376 196 Q381 201 381 208 L381 364 Q381 371 376 376 Q371 381 364 381 L303 381 Q296 381 291 386 Q286 391 286 398 L286 460 Q286 467 291 472 Q296 477 303 477 L364 477 Q371 477 376 482 Q381 487 381 494 L381 650 Q381 657 376 662 Q371 667 364 667 L303 667 Q296 667 291 662 Q286 657 286 650 L286 494 Q286 487 281 482 Q276 477 269 477 L112 477 Q105 477 100 482 Q95 487 95 494 L95 650 Q95 657 90 662 Q85 667 78 667 L17 667 Z";

export type LogoTone = "landing" | "app" | "mono" | "inverse" | "onPrimary" | "teal";

const TONES: Record<LogoTone, string> = {
  landing: "brand-wordmark",
  app: "brand-wordmark",
  mono: "text-foreground",
  inverse: "text-background",
  onPrimary: "text-primary-foreground",
  teal: "text-[hsl(174_60%_40%)]",
};

/** Architype Stedelijk khmy$. Size by height to preserve the letterforms. */
export function Logo({ className, tone = "landing" }: { className?: string; tone?: LogoTone }) {
  return (
    <svg viewBox="0 0 2287 857" role="img" aria-label="KHMYS" focusable="false" className={cn("h-7 w-auto shrink-0", TONES[tone], className)} fill="currentColor">
      <path d={WORDMARK_PATH} />
    </svg>
  );
}

/** The same Architype Stedelijk k for square browser icons and avatars. */
export function LogoMark({ className, tone = "landing" }: { className?: string; tone?: LogoTone }) {
  return (
    <svg viewBox="-238 -95 857 857" role="img" aria-label="KHMYS" focusable="false" className={cn("h-7 w-7 shrink-0", TONES[tone], className)} fill="currentColor">
      <path d={MONOGRAM_PATH} />
    </svg>
  );
}

/** Standalone outlined wordmark for brand-kit downloads. */
export function logoSvg(color: string): string {
  if (!/^#[0-9a-f]{6}$/i.test(color)) throw new Error("Logo export requires a six-digit hex color");
  return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2287 857" role="img" aria-label="KHMYS"><path fill="${color}" d="${WORDMARK_PATH}"/></svg>\n`;
}

/** Browser icon using the same Stedelijk k, white against a dark surface. */
export function faviconSvg(): string {
  return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="-238 -95 857 857"><rect x="-238" y="-95" width="857" height="857" rx="170" fill="#12312C"/><path fill="#FFFFFF" d="${MONOGRAM_PATH}"/></svg>\n`;
}