import type { SVGProps } from "react";

export interface MARProps extends SVGProps<SVGSVGElement> {
  /**
   * Icon size (width and height)
   * @default 16
   */
  size?: number | string;
}

/**
 * Morocco — MAR icon from flag category
 *
 * @example
 * <MAR size={16} />
 * <MAR size={32} className="text-primary" />
 */
export const MAR = ({ size = 16, ...props }: MARProps) => (
  <svg
    fill="none"
    height={size}
    viewBox="0 0 24 24"
    width={size}
    xmlns="http://www.w3.org/2000/svg"
    {...props}
  >
    <g clipPath="url(#clip0_43_2020)">
<path d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z" fill="#D80027"/>
<path d="M19.0916 9.84799H13.6741L12 4.69568L10.3259 9.84799H4.90839L9.29125 13.0323L7.61711 18.1848L12 15.0004L16.3829 18.1848L14.7088 13.0324L19.0916 9.84799ZM10.5179 12.6337L11.084 10.8914H12.9159L13.4821 12.6337V12.6338L12 13.7105L10.518 12.6338L10.5179 12.6337ZM12.5769 9.84799H11.4231L12 8.07237L12.5769 9.84799ZM14.3697 11.9889L14.0131 10.8915H15.8801L14.3697 11.9889ZM9.98687 10.8915L9.63029 11.9889L8.11984 10.8915H9.98687ZM9.60193 15.4529L10.1789 13.6773L11.1124 14.3555L9.60193 15.4529ZM12.8876 14.3555L13.8212 13.6773L14.3981 15.4529L12.8876 14.3555Z" fill="#FFDA44"/>
</g>
<defs>
<clipPath id="clip0_43_2020">
<rect fill="white" height="24" width="24"/>
</clipPath>
</defs>
  </svg>
);