import { forwardRef } from "react";
import type { IconProps } from "../../types";

export const IconQuestionMarkCircleSolid = forwardRef<SVGSVGElement, IconProps>(
  ({ color = "currentColor", ...props }, forwardedRef) => {
    const { className } = props;
    props = {
      ...props,
      width: `${props.width || props.size || 20}`,
      height: `${props.height || props.size || 20}`,
      className: `${
        className ? className + " " : ""
      }customeow-shein-icon customeow-shein-icon-icon-question-mark-circle-solid`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M18.3334 10.0001C18.3334 14.6025 14.6025 18.3334 10.0001 18.3334C5.39771 18.3334 1.66675 14.6025 1.66675 10.0001C1.66675 5.39771 5.39771 1.66675 10.0001 1.66675C14.6025 1.66675 18.3334 5.39771 18.3334 10.0001ZM8.96996 7.2153C8.73057 7.48707 8.625 7.84271 8.625 8.14313H7.375C7.375 7.58262 7.56415 6.92016 8.03197 6.38906C8.51486 5.84087 9.25165 5.48193 10.2394 5.48193C11.5155 5.48193 12.4011 6.29309 12.7341 7.28125C13.062 8.25425 12.8728 9.44253 12.0109 10.2685C11.4608 10.7957 11.0945 11.148 10.8586 11.4373C10.6276 11.7206 10.6016 11.8504 10.6016 11.924H9.35165C9.35165 11.4249 9.58879 11.0166 9.88984 10.6474C10.1794 10.2923 10.6013 9.888 11.111 9.39955L11.146 9.36599C11.6232 8.90868 11.7388 8.24181 11.5496 7.68047C11.3655 7.1343 10.9121 6.73193 10.2394 6.73193C9.57721 6.73193 9.19429 6.96064 8.96996 7.2153ZM9.35165 14.1952V12.9975H10.6016V14.1952H9.35165Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconQuestionMarkCircleSolid.displayName = "IconQuestionMarkCircleSolid";

export default IconQuestionMarkCircleSolid;