import type { SVGProps } from "react";

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

/**
 * Hong Kong SAR China — HKG icon from flag category
 *
 * @example
 * <HKG size={16} />
 * <HKG size={32} className="text-primary" />
 */
export const HKG = ({ size = 16, ...props }: HKGProps) => (
  <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_1671)">
<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="M13.2389 9.07819C12.9662 10.2125 12.4816 9.99619 12.2439 10.9854C10.8431 10.6486 9.9804 9.24005 10.3172 7.83919C10.6539 6.43842 12.0626 5.57573 13.4634 5.91253C12.9878 7.89099 13.4829 8.06367 13.2389 9.07819Z" fill="#F0F0F0"/>
<path d="M9.60408 9.91874C10.5986 10.5286 10.2431 10.9227 11.1104 11.4546C10.3572 12.6827 8.75104 13.0678 7.52283 12.3147C6.29465 11.5615 5.90948 9.95525 6.66267 8.72708C8.39733 9.79077 8.71444 9.37325 9.60408 9.91874Z" fill="#F0F0F0"/>
<path d="M9.28019 13.6356C10.1676 12.8781 10.4324 13.338 11.2062 12.6775C12.1416 13.7733 12.0115 15.4199 10.9158 16.3553C9.81991 17.2907 8.17329 17.1605 7.23804 16.0648C8.78557 14.7437 8.48646 14.3129 9.28019 13.6356Z" fill="#F0F0F0"/>
<path d="M12.715 15.0921C12.2688 14.0141 12.7879 13.9043 12.3989 12.9643C13.7301 12.4133 15.256 13.0459 15.807 14.3771C16.3579 15.7083 15.7253 17.2341 14.3941 17.7851C13.6161 15.905 13.1141 16.0563 12.715 15.0921Z" fill="#F0F0F0"/>
<path d="M15.1617 12.2754C13.9986 12.3667 14.0544 11.8389 13.0403 11.9185C12.9276 10.4823 14.0008 9.22645 15.4371 9.11371C16.8733 9.00126 18.1291 10.0743 18.2417 11.5107C16.2131 11.6697 16.2019 12.1939 15.1617 12.2754Z" fill="#F0F0F0"/>
</g>
<defs>
<clipPath id="clip0_43_1671">
<rect fill="white" height="24" width="24"/>
</clipPath>
</defs>
  </svg>
);
