import { SacredMotif, type MotifName } from './motifs';

const ACCENT_MOTIFS: Record<string, [MotifName, MotifName]> = {
  cyan: ['hex', 'seed'],
  magenta: ['vesica', 'yantra'],
  amber: ['spiral', 'key'],
  green: ['seed', 'hex'],
  purple: ['metatron', 'torus'],
  brass: ['flower', 'key'],
  gold: ['yantra', 'spiral'],
};

/** Corner watermarks inside neon cards */
export default function SacredCardWatermark({ accent = 'brass' }: { accent?: string }) {
  const [tl, br] = ACCENT_MOTIFS[accent] ?? ACCENT_MOTIFS.brass;
  return (
    <>
      <div className="neon-card-sacred neon-card-sacred--tl" aria-hidden>
        <SacredMotif name={tl} opacity={0.5} />
      </div>
      <div className="neon-card-sacred neon-card-sacred--tr" aria-hidden>
        <SacredMotif name="seed" opacity={0.35} />
      </div>
      <div className="neon-card-sacred neon-card-sacred--br" aria-hidden>
        <SacredMotif name={br} opacity={0.45} />
      </div>
    </>
  );
}
