import React from 'react';

const ZoomIn = ({ fill = '#C1C8CD', width = '25', className = '', viewBox = '0 0 25 25' }) => (
  <svg
    width={width}
    height={width}
    viewBox={viewBox}
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    className={className}
  >
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M7.5 3.03906C4.87665 3.03906 2.75 5.16571 2.75 7.78906V17.7891C2.75 20.4124 4.87665 22.5391 7.5 22.5391H9.125C9.53921 22.5391 9.875 22.2033 9.875 21.7891C9.875 21.3748 9.53921 21.0391 9.125 21.0391H7.5C5.70507 21.0391 4.25 19.584 4.25 17.7891V7.78906C4.25 5.99414 5.70507 4.53906 7.5 4.53906H17.5C19.2949 4.53906 20.75 5.99414 20.75 7.78906V9.41406C20.75 9.82828 21.0858 10.1641 21.5 10.1641C21.9142 10.1641 22.25 9.82828 22.25 9.41406V7.78906C22.25 5.16571 20.1234 3.03906 17.5 3.03906H7.5ZM10.25 15.7891C10.25 12.8896 12.6005 10.5391 15.5 10.5391C18.3995 10.5391 20.75 12.8896 20.75 15.7891C20.75 18.6886 18.3995 21.0391 15.5 21.0391C12.6005 21.0391 10.25 18.6886 10.25 15.7891ZM15.5 9.03906C11.7721 9.03906 8.75 12.0611 8.75 15.7891C8.75 19.517 11.7721 22.5391 15.5 22.5391C17.0938 22.5391 18.5585 21.9867 19.7133 21.063L20.9697 22.3194C21.2626 22.6123 21.7374 22.6123 22.0303 22.3194C22.3232 22.0265 22.3232 21.5516 22.0303 21.2587L20.7739 20.0023C21.6976 18.8476 22.25 17.3828 22.25 15.7891C22.25 12.0611 19.2279 9.03906 15.5 9.03906ZM16.25 13.7891C16.25 13.3748 15.9142 13.0391 15.5 13.0391C15.0858 13.0391 14.75 13.3748 14.75 13.7891V15.0391H13.5C13.0858 15.0391 12.75 15.3748 12.75 15.7891C12.75 16.2033 13.0858 16.5391 13.5 16.5391H14.75V17.7891C14.75 18.2033 15.0858 18.5391 15.5 18.5391C15.9142 18.5391 16.25 18.2033 16.25 17.7891V16.5391H17.5C17.9142 16.5391 18.25 16.2033 18.25 15.7891C18.25 15.3748 17.9142 15.0391 17.5 15.0391H16.25V13.7891Z"
      fill={fill}
    />
  </svg>
);

export default ZoomIn;
