import type { SVGProps } from "react";

type P = SVGProps<SVGSVGElement>;

export const TenderIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M7 3h7l5 5v11a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Z"
      stroke="currentColor"
      strokeWidth="1.6"
    />
    <path d="M14 3v5h5" stroke="currentColor" strokeWidth="1.6" />
    <path
      d="M8.5 13.5h7M8.5 17h5"
      stroke="currentColor"
      strokeWidth="1.6"
      strokeLinecap="round"
    />
  </svg>
);

export const PulseIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M3 12h3l2-7 4 14 2-7h7"
      stroke="currentColor"
      strokeWidth="1.8"
      strokeLinecap="round"
      strokeLinejoin="round"
    />
  </svg>
);

export const ClockIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <circle cx="12" cy="12" r="9" stroke="currentColor" strokeWidth="1.6" />
    <path
      d="M12 7.5V12l3 2"
      stroke="currentColor"
      strokeWidth="1.6"
      strokeLinecap="round"
    />
  </svg>
);

export const CoinIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <ellipse cx="12" cy="7" rx="8" ry="3" stroke="currentColor" strokeWidth="1.6" />
    <path
      d="M4 7v5c0 1.7 3.6 3 8 3s8-1.3 8-3V7M4 12v5c0 1.7 3.6 3 8 3s8-1.3 8-3v-5"
      stroke="currentColor"
      strokeWidth="1.6"
    />
  </svg>
);

export const GlobeIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <circle cx="12" cy="12" r="9" stroke="currentColor" strokeWidth="1.6" />
    <path
      d="M3 12h18M12 3c2.5 3 4 6 4 9s-1.5 6-4 9c-2.5-3-4-6-4-9s1.5-6 4-9Z"
      stroke="currentColor"
      strokeWidth="1.6"
    />
  </svg>
);

export const SparkleIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="m12 3 1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8L12 3Z"
      stroke="currentColor"
      strokeWidth="1.4"
      strokeLinejoin="round"
    />
    <path
      d="m18 16 .8 2 2 .8-2 .8-.8 2-.8-2-2-.8 2-.8.8-2Z"
      stroke="currentColor"
      strokeWidth="1.4"
      strokeLinejoin="round"
    />
  </svg>
);

export const FireIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M12 3s4 4 4 8a4 4 0 0 1-8 0c0-1.5.7-2.6 1.5-3.5C8.5 9 8 10 8 11.5a4 4 0 0 0 8 0c0-3-4-8.5-4-8.5Z"
      stroke="currentColor"
      strokeWidth="1.6"
      strokeLinejoin="round"
    />
  </svg>
);

export const ArrowRightIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M5 12h14m0 0-5-5m5 5-5 5"
      stroke="currentColor"
      strokeWidth="1.8"
      strokeLinecap="round"
      strokeLinejoin="round"
    />
  </svg>
);

export const TrendUpIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="m3 17 6-6 4 4 8-9"
      stroke="currentColor"
      strokeWidth="1.8"
      strokeLinecap="round"
      strokeLinejoin="round"
    />
    <path
      d="M14 6h7v7"
      stroke="currentColor"
      strokeWidth="1.8"
      strokeLinecap="round"
      strokeLinejoin="round"
    />
  </svg>
);

export const TrendDownIcon = (props: P) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="m3 7 6 6 4-4 8 9"
      stroke="currentColor"
      strokeWidth="1.8"
      strokeLinecap="round"
      strokeLinejoin="round"
    />
    <path
      d="M14 18h7v-7"
      stroke="currentColor"
      strokeWidth="1.8"
      strokeLinecap="round"
      strokeLinejoin="round"
    />
  </svg>
);
