const React = require("react");
const HorizontalTrafficLightIcon = ({ title, titleId, ...props }) => (
  <svg
    width="1em"
    height="1em"
    viewBox="0 0 32 32"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    aria-labelledby={titleId}
    {...props}
  >
    {title ? <title id={titleId}>{title}</title> : null}
    <g filter="url(#filter0_ii_18_11988)">
      <path
        d="M1.84375 15C1.84375 11.69 4.53664 9 7.85019 9H23.8373C27.1509 9 29.8437 11.69 29.8437 15C29.8437 18.31 27.1509 21 23.8373 21H7.85019C4.53664 21 1.84375 18.31 1.84375 15Z"
        fill="url(#paint0_linear_18_11988)"
      />
    </g>
    <g filter="url(#filter1_di_18_11988)">
      <path
        d="M23.8438 18C25.5006 18 26.8438 16.6569 26.8438 15C26.8438 13.3431 25.5006 12 23.8438 12C22.1869 12 20.8438 13.3431 20.8438 15C20.8438 16.6569 22.1869 18 23.8438 18Z"
        fill="url(#paint1_linear_18_11988)"
      />
      <path
        d="M23.8438 18C25.5006 18 26.8438 16.6569 26.8438 15C26.8438 13.3431 25.5006 12 23.8438 12C22.1869 12 20.8438 13.3431 20.8438 15C20.8438 16.6569 22.1869 18 23.8438 18Z"
        fill="url(#paint2_radial_18_11988)"
      />
    </g>
    <g filter="url(#filter2_di_18_11988)">
      <path
        d="M15.8438 18C17.5006 18 18.8438 16.6569 18.8438 15C18.8438 13.3431 17.5006 12 15.8438 12C14.1869 12 12.8438 13.3431 12.8438 15C12.8438 16.6569 14.1869 18 15.8438 18Z"
        fill="url(#paint3_linear_18_11988)"
      />
      <path
        d="M15.8438 18C17.5006 18 18.8438 16.6569 18.8438 15C18.8438 13.3431 17.5006 12 15.8438 12C14.1869 12 12.8438 13.3431 12.8438 15C12.8438 16.6569 14.1869 18 15.8438 18Z"
        fill="url(#paint4_radial_18_11988)"
      />
    </g>
    <g filter="url(#filter3_di_18_11988)">
      <path
        d="M7.84375 18C9.50061 18 10.8438 16.6569 10.8438 15C10.8438 13.3431 9.50061 12 7.84375 12C6.18689 12 4.84375 13.3431 4.84375 15C4.84375 16.6569 6.18689 18 7.84375 18Z"
        fill="url(#paint5_linear_18_11988)"
      />
      <path
        d="M7.84375 18C9.50061 18 10.8438 16.6569 10.8438 15C10.8438 13.3431 9.50061 12 7.84375 12C6.18689 12 4.84375 13.3431 4.84375 15C4.84375 16.6569 6.18689 18 7.84375 18Z"
        fill="url(#paint6_radial_18_11988)"
      />
    </g>
    <path
      d="M24.8438 15C25.396 15 25.8438 14.5523 25.8438 14C25.8438 13.4477 25.396 13 24.8438 13C24.2915 13 23.8438 13.4477 23.8438 14C23.8438 14.5523 24.2915 15 24.8438 15Z"
      fill="url(#paint7_radial_18_11988)"
    />
    <path
      d="M16.8438 15C17.396 15 17.8438 14.5523 17.8438 14C17.8438 13.4477 17.396 13 16.8438 13C16.2915 13 15.8438 13.4477 15.8438 14C15.8438 14.5523 16.2915 15 16.8438 15Z"
      fill="url(#paint8_radial_18_11988)"
    />
    <path
      d="M8.84375 15C9.39603 15 9.84375 14.5523 9.84375 14C9.84375 13.4477 9.39603 13 8.84375 13C8.29147 13 7.84375 13.4477 7.84375 14C7.84375 14.5523 8.29147 15 8.84375 15Z"
      fill="url(#paint9_radial_18_11988)"
    />
    <path
      d="M4.19261 13.3639C4.05265 13.6757 4.30275 14 4.64456 14C4.86625 14 5.0599 13.858 5.15907 13.6597C5.65129 12.6757 6.66863 12 7.84377 12C9.01892 12 10.0362 12.6757 10.5285 13.6597C10.6276 13.858 10.8213 14 11.043 14C11.3848 14 11.6349 13.6757 11.4949 13.3639C10.8696 11.9705 9.47001 11 7.84377 11C6.21753 11 4.81797 11.9705 4.19261 13.3639Z"
      fill="url(#paint10_linear_18_11988)"
    />
    <path
      d="M12.1926 13.3639C12.0527 13.6757 12.3028 14 12.6446 14C12.8663 14 13.0599 13.858 13.1591 13.6597C13.6513 12.6757 14.6686 12 15.8438 12C17.0189 12 18.0362 12.6757 18.5285 13.6597C18.6276 13.858 18.8213 14 19.043 14C19.3848 14 19.6349 13.6757 19.4949 13.3639C18.8696 11.9705 17.47 11 15.8438 11C14.2175 11 12.818 11.9705 12.1926 13.3639Z"
      fill="url(#paint11_linear_18_11988)"
    />
    <path
      d="M20.1926 13.3639C20.0527 13.6757 20.3028 14 20.6446 14C20.8663 14 21.0599 13.858 21.1591 13.6597C21.6513 12.6757 22.6686 12 23.8438 12C25.0189 12 26.0362 12.6757 26.5285 13.6597C26.6276 13.858 26.8213 14 27.043 14C27.3848 14 27.6349 13.6757 27.4949 13.3639C26.8696 11.9705 25.47 11 23.8438 11C22.2175 11 20.818 11.9705 20.1926 13.3639Z"
      fill="url(#paint12_linear_18_11988)"
    />
    <g filter="url(#filter4_f_18_11988)">
      <path
        d="M4.79034 13.329C5.08988 12.7908 5.95445 11.4425 7.59435 11.3513C9.23425 11.2602 10.5481 12.1751 11.1305 13.4398"
        stroke="url(#paint13_linear_18_11988)"
        strokeWidth={0.4}
        strokeLinecap="round"
      />
    </g>
    <g filter="url(#filter5_f_18_11988)">
      <path
        d="M12.8438 13.329C13.1433 12.7908 14.0079 11.4425 15.6478 11.3513C17.2877 11.2602 18.6015 12.1751 19.1839 13.4398"
        stroke="url(#paint14_linear_18_11988)"
        strokeWidth={0.4}
        strokeLinecap="round"
      />
    </g>
    <g filter="url(#filter6_f_18_11988)">
      <path
        d="M20.6736 13.3352C20.9732 12.8263 21.8377 11.5516 23.4777 11.4655C25.1176 11.3794 26.4314 12.2442 27.0138 13.4399"
        stroke="url(#paint15_linear_18_11988)"
        strokeWidth={0.4}
        strokeLinecap="round"
      />
    </g>
    <defs>
      <filter
        id="filter0_ii_18_11988"
        x={1.34375}
        y={8.25}
        width={29.25}
        height={13.25}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={0.75} dy={-0.75} />
        <feGaussianBlur stdDeviation={0.375} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.2 0 0 0 0 0.129412 0 0 0 0 0.254902 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_11988"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={-0.75} dy={0.75} />
        <feGaussianBlur stdDeviation={0.25} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.372549 0 0 0 0 0.333333 0 0 0 0 0.411765 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="effect1_innerShadow_18_11988"
          result="effect2_innerShadow_18_11988"
        />
      </filter>
      <filter
        id="filter1_di_18_11988"
        x={20.0437}
        y={11.6}
        width={7.2}
        height={7.2}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={-0.2} dy={0.2} />
        <feGaussianBlur stdDeviation={0.3} />
        <feComposite in2="hardAlpha" operator="out" />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.121569 0 0 0 0 0.121569 0 0 0 0 0.14902 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="BackgroundImageFix"
          result="effect1_dropShadow_18_11988"
        />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="effect1_dropShadow_18_11988"
          result="shape"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dy={0.5} />
        <feGaussianBlur stdDeviation={0.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.313726 0 0 0 0 0.0352941 0 0 0 0 0.12549 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect2_innerShadow_18_11988"
        />
      </filter>
      <filter
        id="filter2_di_18_11988"
        x={12.0437}
        y={11.6}
        width={7.2}
        height={7.2}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={-0.2} dy={0.2} />
        <feGaussianBlur stdDeviation={0.3} />
        <feComposite in2="hardAlpha" operator="out" />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.121569 0 0 0 0 0.121569 0 0 0 0 0.14902 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="BackgroundImageFix"
          result="effect1_dropShadow_18_11988"
        />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="effect1_dropShadow_18_11988"
          result="shape"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dy={0.5} />
        <feGaussianBlur stdDeviation={0.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.439216 0 0 0 0 0.235294 0 0 0 0 0.0431373 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect2_innerShadow_18_11988"
        />
      </filter>
      <filter
        id="filter3_di_18_11988"
        x={4.04375}
        y={11.6}
        width={7.2}
        height={7.2}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={-0.2} dy={0.2} />
        <feGaussianBlur stdDeviation={0.3} />
        <feComposite in2="hardAlpha" operator="out" />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.121569 0 0 0 0 0.121569 0 0 0 0 0.14902 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="BackgroundImageFix"
          result="effect1_dropShadow_18_11988"
        />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="effect1_dropShadow_18_11988"
          result="shape"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dy={0.5} />
        <feGaussianBlur stdDeviation={0.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.0431373 0 0 0 0 0.34902 0 0 0 0 0.176471 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect2_innerShadow_18_11988"
        />
      </filter>
      <filter
        id="filter4_f_18_11988"
        x={4.19033}
        y={10.7451}
        width={7.54023}
        height={3.29463}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.2}
          result="effect1_foregroundBlur_18_11988"
        />
      </filter>
      <filter
        id="filter5_f_18_11988"
        x={12.2437}
        y={10.7451}
        width={7.54023}
        height={3.29463}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.2}
          result="effect1_foregroundBlur_18_11988"
        />
      </filter>
      <filter
        id="filter6_f_18_11988"
        x={20.0736}
        y={10.8596}
        width={7.54023}
        height={3.18025}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.2}
          result="effect1_foregroundBlur_18_11988"
        />
      </filter>
      <linearGradient
        id="paint0_linear_18_11988"
        x1={15.8438}
        y1={9}
        x2={15.8438}
        y2={18.8647}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#5B4969" />
        <stop offset={1} stopColor="#3B363E" />
      </linearGradient>
      <linearGradient
        id="paint1_linear_18_11988"
        x1={26.8438}
        y1={12}
        x2={23.0444}
        y2={16.373}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#E94489" />
        <stop offset={1} stopColor="#FA2F47" />
      </linearGradient>
      <radialGradient
        id="paint2_radial_18_11988"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(24.8949 13.5896) rotate(124.524) scale(4.77986)"
      >
        <stop offset={0.776196} stopColor="#B50F2F" stopOpacity={0} />
        <stop offset={1} stopColor="#B50F2F" />
      </radialGradient>
      <linearGradient
        id="paint3_linear_18_11988"
        x1={18.8438}
        y1={12}
        x2={15.0444}
        y2={16.373}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#FE9142" />
        <stop offset={1} stopColor="#FFE67B" />
      </linearGradient>
      <radialGradient
        id="paint4_radial_18_11988"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16.8949 13.5896) rotate(124.524) scale(4.77986)"
      >
        <stop offset={0.776196} stopColor="#C39A59" stopOpacity={0} />
        <stop offset={1} stopColor="#C39A59" />
      </radialGradient>
      <linearGradient
        id="paint5_linear_18_11988"
        x1={10.8438}
        y1={12}
        x2={7.04438}
        y2={16.373}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#3F995F" />
        <stop offset={1} stopColor="#00D26A" />
      </linearGradient>
      <radialGradient
        id="paint6_radial_18_11988"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(8.8949 13.5896) rotate(124.524) scale(4.77986)"
      >
        <stop offset={0.776196} stopColor="#1B9D5F" stopOpacity={0} />
        <stop offset={1} stopColor="#1B9D5F" />
      </radialGradient>
      <radialGradient
        id="paint7_radial_18_11988"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(24.3591 14.4696) rotate(-50.371) scale(1.63061 3.01633)"
      >
        <stop stopColor="#F2F7F7" />
        <stop offset={1} stopColor="#F2F7F7" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint8_radial_18_11988"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16.3591 14.4696) rotate(-50.371) scale(1.63061 3.01633)"
      >
        <stop stopColor="#F2F7F7" />
        <stop offset={1} stopColor="#F2F7F7" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint9_radial_18_11988"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(8.35913 14.4696) rotate(-50.371) scale(1.63061 3.01633)"
      >
        <stop stopColor="#F2F7F7" />
        <stop offset={1} stopColor="#F2F7F7" stopOpacity={0} />
      </radialGradient>
      <linearGradient
        id="paint10_linear_18_11988"
        x1={4.4375}
        y1={13.2041}
        x2={11.2344}
        y2={13.2041}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#291C32" />
        <stop offset={1} stopColor="#2A2630" />
      </linearGradient>
      <linearGradient
        id="paint11_linear_18_11988"
        x1={12.4375}
        y1={13.2041}
        x2={19.2344}
        y2={13.2041}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#291C32" />
        <stop offset={1} stopColor="#2A2630" />
      </linearGradient>
      <linearGradient
        id="paint12_linear_18_11988"
        x1={20.4375}
        y1={13.2041}
        x2={27.2344}
        y2={13.2041}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#291C32" />
        <stop offset={1} stopColor="#2A2630" />
      </linearGradient>
      <linearGradient
        id="paint13_linear_18_11988"
        x1={4.90558}
        y1={12.2469}
        x2={11.2774}
        y2={12.2469}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#4D4B4E" />
        <stop offset={0.359375} stopColor="#4D4B4E" stopOpacity={0} />
        <stop offset={1} stopColor="#4D4B4E" />
      </linearGradient>
      <linearGradient
        id="paint14_linear_18_11988"
        x1={12.959}
        y1={12.2469}
        x2={19.3308}
        y2={12.2469}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#4D4B4E" />
        <stop offset={0.359375} stopColor="#4D4B4E" stopOpacity={0} />
        <stop offset={1} stopColor="#4D4B4E" />
      </linearGradient>
      <linearGradient
        id="paint15_linear_18_11988"
        x1={20.7889}
        y1={12.3122}
        x2={27.1607}
        y2={12.3122}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#4D4B4E" />
        <stop offset={0.328025} stopColor="#4D4B4E" stopOpacity={0} />
        <stop offset={1} stopColor="#4D4B4E" />
      </linearGradient>
    </defs>
  </svg>
);
module.exports = HorizontalTrafficLightIcon;