<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="google" content="notranslate">
  <meta name="viewport"
    content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, minimal-ui">
  <title>Agriwise</title>
  <link rel="apple-touch-icon" href="/favicon/apple-touch-icon.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png">
  <!-- Android pin to home screen -->
  <link rel="manifest" href="/manifest.json">
  <!-- iOS pin to home screen -->
  <meta name="mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-title" content="Agriwise">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="white">
  <!-- Windows pin to start -->
  <meta name="application-name" content="Agriwise" />
  <meta name="msapplication-TileColor" content="white">
  <meta name="msapplication-TileImage" content="/favicon/ms-icon-144x144.png">
  <meta name="msapplication-config" content="none" />
  <meta name="msapplication-tooltip" content="Agriwise Website" />
  <meta name="msapplication-square150x150logo" content="/favicon/ms-icon-150x150.png" />
  <meta name="msapplication-square310x310logo" content="/favicon/ms-icon-310x310.png" />
  <meta name="msapplication-square70x70logo" content="/favicon/ms-icon-70x70.png" />
  <meta name="msapplication-wide310x150logo" content="/favicon/ms-icon-310x150.png" />
  <!-- Chromium theme color -->
  <meta name="theme-color" content="#00a693">
  <!--
      manifest.json provides metadata used when your web app is installed on a
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
    -->
  <style>
    .splash-wrapper {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      position: fixed;
      z-index: 15;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background-size: cover;
      background: linear-gradient(to top, #ececec, #deeeec);
    }

    .splash-logo {
      width: 80%;
      max-width: 1000px;
    }

    .splash-wrapper .loader-wrapper {
      position: fixed;
      bottom: 10%;
    }

    .splash-wrapper .loader-wrapper .error {
      display: none;
      flex-direction: column;
      align-items: center;
      gap: 20px;
      max-width: min(92vw, 820px);
      padding: 0 24px;
    }

    .splash-wrapper .loader-wrapper .error .error-message {
      margin: 0;
      color: #555555;
      font-size: 1.05rem;
      line-height: 1.6;
      text-align: center;
    }

    .splash-wrapper .loader-wrapper .error .error-reload {
      display: none;
    }

    .splash-wrapper .loader-wrapper .loader {
      position: relative;
      margin: 0 auto;
      width: 100px;
      height: 100px;
    }

    .splash-wrapper .loader-wrapper .loader:before {
      content: "";
      display: block;
      padding-top: 100%;
    }

    .splash-wrapper .loader-wrapper .circular-loader {
      animation: splash-rotate 2s linear infinite;
      height: 100%;
      transform-origin: center center;
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      margin: auto;
    }

    .splash-wrapper .loader-wrapper .loader-path {
      stroke-dasharray: 150, 200;
      stroke-dashoffset: -10;
      animation: splash-dash 1.5s ease-in-out infinite, splash-color 6s ease-in-out infinite;
      stroke-linecap: round;
    }

    @keyframes splash-rotate {
      100% {
        transform: rotate(360deg);
      }
    }

    @keyframes splash-dash {
      0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
      }

      50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
      }

      100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
      }
    }

    @keyframes splash-color {

      0%,
      40%,
      66%,
      80%,
      90% {
        stroke: #04BF47;
      }
    }

    .has-splash {
      overflow: hidden;
    }

    .has-error .splash-wrapper .loader {
      display: none;
    }

    .has-error .splash-wrapper .error {
      font-family: "IRANYekan", roboto;
      display: flex;
      text-align: center;
    }

    .has-error .splash-wrapper .error .error-message {
      color: #006666;
    }

    .has-error .splash-wrapper .error .error-reload {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin-top: 4px;
      padding: 10px 24px;
      font-family: inherit;
      font-size: 0.95rem;
      font-weight: 600;
      color: #ffffff;
      background: linear-gradient(135deg, #00a693 0%, #006666 100%);
      border: none;
      border-radius: 8px;
      box-shadow: 0 4px 14px rgba(0, 166, 147, 0.35);
      cursor: pointer;
      transition: transform 300ms ease-in-out, box-shadow 300ms ease-in-out, opacity 100ms ease-in-out;
    }

    .has-error .splash-wrapper .error .error-reload:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(0, 166, 147, 0.45);
    }

    .has-error .splash-wrapper .error .error-reload:active {
      transform: translateY(0);
      box-shadow: 0 2px 8px rgba(0, 166, 147, 0.3);
    }

    .has-error .splash-wrapper .error .error-reload .error-reload-icon {
      flex-shrink: 0;
    }

    @media screen and (max-width: 780px) {
      .splash-wrapper .loader-wrapper .error {
        font-size: 1rem;
        padding: 0 15px;
        text-align: justify;
      }
    }

    @media screen and (max-width: 576px) {
      .splash-wrapper .loader-wrapper .error {
        font-size: 0.9rem;
        padding: 0 10px;
        text-align: justify;
      }
    }
  </style>
  <script type="module" crossorigin src="/assets/index-7f025603.js"></script>
  <link rel="stylesheet" href="/assets/index-40a5a519.css">
</head>

<body class="dx-viewport">
  <noscript>You need to enable JavaScript to run this app.</noscript>
  <div id="root"></div>
  <div id="splashWrapper" class="splash-wrapper">
    <img class="splash-logo" src="/logo.svg" alt="Agriwise logo" />
    <div class="loader-wrapper">
      <div class="loader">
        <svg class="circular-loader" viewBox="25 25 50 50">
          <circle class="loader-path" cx="50" cy="50" r="20" fill="none" stroke-width="2" />
        </svg>
      </div>
      <div id="splashError" class="error">
        <p id="splashErrorMessage" class="error-message"></p>
        <button id="splashErrorReload" class="error-reload" type="button">
          <svg class="error-reload-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"
            fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
            aria-hidden="true">
            <path d="M1 4v6h6" />
            <path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10" />
          </svg>
          <span id="splashErrorReloadText"></span>
        </button>
      </div>
    </div>
  </div>
  
  <script type="text/javascript" src="/jsts.min.js"></script>
</body>

</html>