import { cn } from '@/lib/cn';

/** SatelliteIndex mark: a planet disc with an inclined orbital ring and a satellite node. Single SVG, currentColor. */
export function LogoMark({ size = 28, className }: { size?: number; className?: string }) {
  return (
    <svg width={size} height={size} viewBox="0 0 32 32" fill="none" aria-hidden className={cn('shrink-0', className)}>
      <circle cx="16" cy="16" r="7.5" fill="currentColor" opacity="0.92" />
      <ellipse cx="16" cy="16" rx="14" ry="5.2" stroke="currentColor" strokeWidth="1.6" transform="rotate(-24 16 16)" opacity="0.85" />
      <circle cx="27.4" cy="9.6" r="2.3" fill="var(--accent)" />
    </svg>
  );
}

export function Wordmark({ className, compact = false }: { className?: string; compact?: boolean }) {
  return (
    <span className={cn('inline-flex items-center gap-2 font-semibold tracking-tight', className)}>
      <LogoMark size={26} className="text-ink" />
      {!compact && (
        <span className="text-[15px] leading-none">
          Satellite<span className="text-accent">Index</span>
        </span>
      )}
    </span>
  );
}