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

export const IconVideoPauseCircleOutline = 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-video-pause-circle-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M7.35007 6.99988V12.9999H8.65007V6.99988H7.35007ZM11.3501 12.9999V6.99988H12.6501V12.9999H11.3501Z"
          fill={color}
        />
        <path
          d="M18.3334 9.99984C18.3334 14.6022 14.6025 18.3332 10.0001 18.3332C5.39771 18.3332 1.66675 14.6022 1.66675 9.99984C1.66675 5.39746 5.39771 1.6665 10.0001 1.6665C14.6025 1.6665 18.3334 5.39746 18.3334 9.99984ZM17.0834 9.99984C17.0834 13.9119 13.9121 17.0832 10.0001 17.0832C6.08806 17.0832 2.91675 13.9119 2.91675 9.99984C2.91675 6.08782 6.08806 2.9165 10.0001 2.9165C13.9121 2.9165 17.0834 6.08782 17.0834 9.99984Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconVideoPauseCircleOutline.displayName = "IconVideoPauseCircleOutline";

export default IconVideoPauseCircleOutline;