// Generated by orrery. Edit the diagram spec and re-render instead of editing this file.
import { type SVGProps, useId } from "react";

export default function OrderApprovalFlowchart(props: SVGProps<SVGSVGElement>) {
  const uid = useId().replace(/[^A-Za-z0-9_-]/g, "");
  return (
    <svg xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" width="731" height="1312" viewBox="0 0 731 1312" role="img" aria-labelledby={`${uid}-sdw-title ${uid}-sdw-desc`} fontFamily="'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace" {...props}>
      <title id={`${uid}-sdw-title`}>
        Order approval flowchart
      </title>
      <desc id={`${uid}-sdw-desc`}>
        Order approval flowchart. 13 components. Connections: Order received to Enter order details; Enter order details to Run credit check; Run credit check to Credit OK?; Credit OK? to Over the limit? (yes); Credit OK? to Ask for prepayment (no); Over the limit? to Manager signs off (yes); Over the limit? to Reserve stock (no); Manager signs off to Reserve stock; Ask for prepayment to Wait for payment; Wait for payment to Paid in time?; Paid in time? to Reserve stock (yes); Paid in time? to Order rejected (no); Reserve stock to Print invoice; Print invoice to Order approved.
      </desc>
      <defs>
        <linearGradient id={`${uid}-bg`} x1="0" y1="0" x2="0.34" y2="0.94">
          <stop offset="0" stopColor="#0e1a24" />
          <stop offset="0.6" stopColor="#0b1012" />
        </linearGradient>
        <pattern id={`${uid}-grid`} width="20" height="20" patternUnits="userSpaceOnUse">
          <path d="M0 0.5H20M0.5 0V20" fill="none" stroke="#ffffff" strokeOpacity="0.045" strokeWidth="1" />
        </pattern>
        <radialGradient id={`${uid}-wash`} gradientUnits="userSpaceOnUse" cx="265.5" cy="690" r="499.4">
          <stop offset="0" stopColor="#60a5fa" stopOpacity="0.12" />
          <stop offset="1" stopColor="#60a5fa" stopOpacity="0" />
        </radialGradient>
      </defs>
      <rect width="731" height="1312" fill={`url(#${uid}-bg)`} />
      <rect width="731" height="1312" fill={`url(#${uid}-grid)`} />
      <rect width="731" height="1312" fill={`url(#${uid}-wash)`} />
      <text fontSize="18" fontWeight="700" letterSpacing="1.08" fill="#dadbdb">
        <tspan x="28" y="42.89">
          ORDER APPROVAL FLOWCHART
        </tspan>
      </text>
      <text fontSize="10" fontWeight="400" fill="#9d9fa0">
        <tspan x="28" y="64.75">
          An order that fails the credit check must be paid up front; one over the credit limit needs a manager&#39;s sign-off
        </tspan>
      </text>
      <g id={`${uid}-e-e1`}>
        <path d="M437 148 L437 195.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 190 L437 196 L441 190" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 148 L437 195.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.136;0.1796;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.136;0.1556;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M433 190 L437 196 L441 190" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1796;0.1992;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e2`}>
        <path d="M437 248 L437 295.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 290 L437 296 L441 290" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 248 L437 295.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.2057;0.2492;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2057;0.2253;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M433 290 L437 296 L441 290" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2492;0.2688;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e3`}>
        <path d="M437 356 L437 403.74" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 398.24 L437 404.24 L441 398.24" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 356 L437 403.74" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.2753;0.3189;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2753;0.2949;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M433 398.24 L437 404.24 L441 398.24" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3189;0.3385;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e4`}>
        <path d="M437 479.76 L437 487.38 Q437 495 429.38 495 L234 495 Q226 495 226 503 L226 596.71" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M222 591.21 L226 597.21 L230 591.21" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e5`}>
        <path d="M437 479.76 L437 604.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 599 L437 605 L441 599" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 479.76 L437 604.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.345;0.3885;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.345;0.3646;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M433 599 L437 605 L441 599" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3885;0.4081;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e6`}>
        <path d="M226 672.79 L226 680.5 Q226 688 233.5 688 L233.5 688 Q241 688 241 695.5 L241 840.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M237 835 L241 841 L245 835" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e7`}>
        <path d="M226 672.79 L226 680.4 Q226 688 218.4 688 L102 688 Q94 688 94 696 L94 1021.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M90 1016 L94 1022 L98 1016" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e8`}>
        <path d="M241 893 L241 912 Q241 920 233 920 L102 920 Q94 920 94 928 L94 1021.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M90 1016 L94 1022 L98 1016" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e9`}>
        <path d="M437 665 L437 720.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 715 L437 721 L441 715" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 665 L437 720.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.4146;0.4582;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4146;0.4342;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M433 715 L437 721 L441 715" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4582;0.4778;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e10`}>
        <path d="M437 781 L437 828.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 823 L437 829 L441 823" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 781 L437 828.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.4843;0.5278;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4843;0.5039;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M433 823 L437 829 L441 823" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.5278;0.5474;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e11`}>
        <path d="M437 905 L437 912.5 Q437 920 429.5 920 L400 920 Q392 920 392 928 L392 981 Q392 989 384 989 L102 989 Q94 989 94 997 L94 1021.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M90 1016 L94 1022 L98 1016" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M437 905 L437 912.5 Q437 920 429.5 920 L400 920 Q392 920 392 928 L392 981 Q392 989 384 989 L102 989 Q94 989 94 997 L94 1021.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.5539;0.6628;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.5539;0.5735;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M90 1016 L94 1022 L98 1016" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6628;0.6823;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e12`}>
        <path d="M437 905 L437 1021.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M433 1016 L437 1022 L441 1016" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e13`}>
        <path d="M94 1074 L94 1121.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M90 1116 L94 1122 L98 1116" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M94 1074 L94 1121.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.6889;0.7324;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6889;0.7085;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M90 1116 L94 1122 L98 1116" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.7324;0.752;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e14`}>
        <path d="M94 1173.82 L94 1231.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M90 1226 L94 1232 L98 1226" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M94 1173.82 L94 1231.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.7585;0.8021;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.7585;0.7781;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M90 1226 L94 1232 L98 1226" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.8021;0.8216;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e4`}>
        <rect x="231" y="528" width="32" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#979899" textAnchor="middle">
          <tspan x="247.29" y="541.87">
            YES
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e5`}>
        <rect x="442" y="528" width="26" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#979899" textAnchor="middle">
          <tspan x="455.29" y="541.87">
            NO
          </tspan>
        </text>
        <g opacity="0">
          <rect x="442" y="528" width="26" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1" />
          <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#60a5fa" textAnchor="middle">
            <tspan x="455.29" y="541.87">
              NO
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.345;0.3646;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e6`}>
        <rect x="246" y="740.5" width="32" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#979899" textAnchor="middle">
          <tspan x="262.29" y="754.37">
            YES
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e7`}>
        <rect x="99" y="856.5" width="26" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#979899" textAnchor="middle">
          <tspan x="112.29" y="870.37">
            NO
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e11`}>
        <rect x="397" y="953" width="32" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#979899" textAnchor="middle">
          <tspan x="413.29" y="966.87">
            YES
          </tspan>
        </text>
        <g opacity="0">
          <rect x="397" y="953" width="32" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1" />
          <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#60a5fa" textAnchor="middle">
            <tspan x="413.29" y="966.87">
              YES
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.5539;0.5735;0.9;0.9196;1" dur="9.189s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e12`}>
        <rect x="442" y="953" width="26" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#979899" textAnchor="middle">
          <tspan x="455.29" y="966.87">
            NO
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-received`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <rect x="373" y="96" width="127" height="52" rx="26" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <rect x="373" y="96" width="127" height="52" rx="26" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="436.93" y="125.73">
            ORDER RECEIVED
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-details`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M367 196 H523 L507 248 H351 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M367 196 H523 L507 248 H351 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10" fontWeight="700" letterSpacing="0.8" fill="#9d9fa0" textAnchor="middle">
          <tspan x="437.41" y="225.55">
            ENTER ORDER DETAILS
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-credit`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <rect x="358" y="296" width="158" height="60" rx="4" />
          <path d="M368 296 V356 M506 296 V356" fill="none" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <rect x="358" y="296" width="158" height="60" rx="4" />
            <path d="M368 296 V356 M506 296 V356" fill="none" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="437.42" y="321.23">
            RUN CREDIT CHECK
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="437" y="338.75">
            Credit bureau API
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-credit-ok`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M436.5 404 L515 442 L436.5 480 L358 442 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M436.5 404 L515 442 L436.5 480 L358 442 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="436.92" y="445.73">
            CREDIT OK?
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-limit`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M225.5 597 L315 635 L225.5 673 L136 635 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M225.5 597 L315 635 L225.5 673 L136 635 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.25" fontWeight="700" letterSpacing="0.82" fill="#9d9fa0" textAnchor="middle">
          <tspan x="225.91" y="638.64">
            OVER THE LIMIT?
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-sign-off`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M155 841 H326 L310 893 H171 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M155 841 H326 L310 893 H171 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="240.92" y="870.73">
            MANAGER SIGNS OFF
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-call`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M345 605 H528 L510 665 H363 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M345 605 H528 L510 665 H363 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="436.92" y="630.23">
            ASK FOR PREPAYMENT
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="436.5" y="647.75">
            Phone call
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-wait`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M357 721 H487 A30 30 0 0 1 487 781 H357 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M357 721 H487 A30 30 0 0 1 487 781 H357 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="437.42" y="746.23">
            WAIT FOR PAYMENT
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="437" y="763.75">
            Up to 48 hours
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-paid`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M437 829 L518 867 L437 905 L356 867 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M437 829 L518 867 L437 905 L356 867 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="437.42" y="870.73">
            PAID IN TIME?
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-rejected`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <rect x="375" y="1022" width="124" height="52" rx="26" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <rect x="375" y="1022" width="124" height="52" rx="26" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="437.43" y="1051.73">
            ORDER REJECTED
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-reserve`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <rect x="33" y="1022" width="122" height="52" rx="4" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <rect x="33" y="1022" width="122" height="52" rx="4" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="94.43" y="1051.73">
            RESERVE STOCK
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-invoice`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <path d="M38 1122 H149 V1174 Q121.25 1164 93.5 1174 T38 1174 Z" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <path d="M38 1122 H149 V1174 Q121.25 1164 93.5 1174 T38 1174 Z" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="93.92" y="1151.73">
            PRINT INVOICE
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-approved`}>
        <g fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1">
          <rect x="28" y="1232" width="132" height="52" rx="26" />
        </g>
        <g opacity="0">
          <g fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1">
            <rect x="28" y="1232" width="132" height="52" rx="26" />
          </g>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0762;0.0958;0.9204;0.94;1" dur="9.189s" repeatCount="indefinite" />
        </g>
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="94.42" y="1261.73">
            ORDER APPROVED
          </tspan>
        </text>
      </g>
      <g id={`${uid}-story`}>
        <path d="M437 148 L437 195.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.5 2" strokeDashoffset="0.5" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.5;0.5;-0.5;-1;-1" keyTimes="0;0.136;0.1796;0.2013;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.136;0.1371;0.2013;0.2024;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 148 L437 195.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.136;0.1796;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1197;0.136;0.2057;0.222;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M437 248 L437 295.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.5 2" strokeDashoffset="0.5" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.5;0.5;-0.5;-1;-1" keyTimes="0;0.2057;0.2492;0.271;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2057;0.2068;0.271;0.2721;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 248 L437 295.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.2057;0.2492;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1894;0.2057;0.2753;0.2917;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M437 356 L437 403.74" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.5 2" strokeDashoffset="0.5" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.5;0.5;-0.5;-1;-1" keyTimes="0;0.2753;0.3189;0.3406;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2753;0.2764;0.3406;0.3417;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 356 L437 403.74" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.2753;0.3189;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.259;0.2753;0.345;0.3613;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <circle r="2" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 479.76 L437 487.38 Q437 495 429.38 495 L234 495 Q226 495 226 503 L226 596.71" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.4357;0.5446;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4194;0.4357;0.5446;0.5609;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M437 479.76 L437 604.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.21 2" strokeDashoffset="0.21" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.21;0.21;-0.79;-1;-1" keyTimes="0;0.345;0.3885;0.3976;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.345;0.3461;0.3976;0.3987;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 479.76 L437 604.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.345;0.3885;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3287;0.345;0.4146;0.431;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <circle r="2" fill="#60a5fa" opacity="0">
          <animateMotion path="M226 672.79 L226 680.4 Q226 688 218.4 688 L102 688 Q94 688 94 696 L94 1021.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.6356;0.7444;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6192;0.6356;0.7444;0.7607;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M437 665 L437 720.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.47 2" strokeDashoffset="0.47" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.47;0.47;-0.53;-1;-1" keyTimes="0;0.4146;0.4582;0.4786;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4146;0.4157;0.4786;0.4796;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 665 L437 720.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.4146;0.4582;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3983;0.4146;0.4843;0.5006;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M437 781 L437 828.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.5 2" strokeDashoffset="0.5" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.5;0.5;-0.5;-1;-1" keyTimes="0;0.4843;0.5278;0.5496;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4843;0.4854;0.5496;0.5507;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 781 L437 828.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.4843;0.5278;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.468;0.4843;0.5539;0.5703;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M437 905 L437 912.5 Q437 920 429.5 920 L400 920 Q392 920 392 928 L392 981 Q392 989 384 989 L102 989 Q94 989 94 997 L94 1021.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.06 2" strokeDashoffset="0.06" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.06;0.06;-0.94;-1;-1" keyTimes="0;0.5539;0.6628;0.6689;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.5539;0.555;0.6689;0.67;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M437 905 L437 912.5 Q437 920 429.5 920 L400 920 Q392 920 392 928 L392 981 Q392 989 384 989 L102 989 Q94 989 94 997 L94 1021.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.5539;0.6628;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.5376;0.5539;0.6889;0.7052;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M94 1074 L94 1121.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.5 2" strokeDashoffset="0.5" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.5;0.5;-0.5;-1;-1" keyTimes="0;0.6889;0.7324;0.7542;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6889;0.69;0.7542;0.7553;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M94 1074 L94 1121.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.6889;0.7324;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6726;0.6889;0.7585;0.7748;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
        <path d="M94 1173.82 L94 1231.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.45 2" strokeDashoffset="0.45" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.45;0.45;-0.55;-1;-1" keyTimes="0;0.7585;0.8021;0.8217;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="9.189s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.7585;0.7596;0.8217;0.8228;1" dur="9.189s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M94 1173.82 L94 1231.5" dur="9.189s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.7585;0.8021;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.7422;0.7585;0.8021;0.8184;1" dur="9.189s" repeatCount="indefinite" />
        </circle>
      </g>
    </svg>
  );
}
