import React from 'react';

const ArrowSort = ({ 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="M12.9697 16.3194L15.9697 19.3194C16.2626 19.6123 16.7374 19.6123 17.0303 19.3194L20.0303 16.3194C20.3232 16.0265 20.3232 15.5516 20.0303 15.2587C19.7374 14.9658 19.2626 14.9658 18.9697 15.2587L17.25 16.9784V6.78906C17.25 6.37485 16.9142 6.03906 16.5 6.03906C16.0858 6.03906 15.75 6.37485 15.75 6.78906L15.75 16.9784L14.0303 15.2587C13.7374 14.9658 13.2626 14.9658 12.9697 15.2587C12.6768 15.5516 12.6768 16.0265 12.9697 16.3194ZM9.03033 6.25873C8.73744 5.96584 8.26256 5.96584 7.96967 6.25873L4.96967 9.25873C4.67678 9.55163 4.67678 10.0265 4.96967 10.3194C5.26256 10.6123 5.73744 10.6123 6.03033 10.3194L7.75 8.59972V18.7891C7.75 19.2033 8.08579 19.5391 8.5 19.5391C8.91421 19.5391 9.25 19.2033 9.25 18.7891V8.59972L10.9697 10.3194C11.2626 10.6123 11.7374 10.6123 12.0303 10.3194C12.3232 10.0265 12.3232 9.55163 12.0303 9.25873L9.03033 6.25873Z"
      fill={fill}
    />
  </svg>
);

export default ArrowSort;
