<!DOCTYPE html>


<html
  lang="<%= i18n.getLocale() === 'ar' ? 'ar' : 'en' %>"
  dir="<%= i18n.getLocale() === 'ar' ? 'rtl' : 'ltr' %>"
  id="main_html"
  class="light-style"
  data-assets-path="/admin/assets/">

<head>
  <meta charset="utf-8" />
  <meta name="viewport"
    content="width=device-width, initial-scale=1, minimum-scale=1, viewport-fit=cover" />
  <meta name="description" content="KamTeswa Admin Portal" />

  <title><%= i18n.__('auth.login') %> | KamTeswa</title>
  <link rel="icon" type="image/x-icon" href="/admin/assets/img/favicon/favicon.ico" />

  <!-- Local project icons and validation styles -->
  <link rel="stylesheet" href="/admin/assets/vendor/fonts/tabler-icons.css" />
  <link rel="stylesheet" href="/admin/assets/vendor/libs/@form-validation/umd/styles/index.min.css" />

  <!-- KamTeswa design system and login page -->
  <link rel="stylesheet" href="/admin/assets/css/design-system.css" />
  <link rel="stylesheet" href="/admin/assets/css/components.css" />
  <link rel="stylesheet" href="/admin/assets/css/animations.css" />
  <link rel="stylesheet" href="/admin/assets/css/pages/login.css?v=2.3.5" />
</head>

<body class="kt-ui kt-login-page">
  <%- body %>

  <!-- Keep this bootstrap in the layout: view-level scripts are extracted and emitted later. -->
  <script>
    (function (window, document) {
      var html = document.documentElement;
      var intro = document.querySelector('[data-kt-login-intro]');
      var page = document.querySelector('[data-kt-login]');
      var prefersReducedMotion = typeof window.matchMedia === 'function'
        && window.matchMedia('(prefers-reduced-motion: reduce)').matches;

      html.dataset.ktLoginIntro = prefersReducedMotion ? 'reduced' : 'running';
      html.dataset.ktLoginMounted = 'false';
      html.dataset.ktLoginMotion = prefersReducedMotion
        ? 'reduced'
        : 'pending';

      document.addEventListener('transitionrun', function (event) {
        if (!event.target.classList.contains('kt-login-card')) return;
        html.dataset.ktLoginMotion = 'running';
        if (typeof window.KamTeswaLoginDebugRefresh === 'function') {
          window.KamTeswaLoginDebugRefresh();
        }
      });

      document.addEventListener('transitionend', function (event) {
        if (!event.target.classList.contains('kt-login-card')) return;
        html.dataset.ktLoginMotion = 'completed';
        if (typeof window.KamTeswaLoginDebugRefresh === 'function') {
          window.KamTeswaLoginDebugRefresh();
        }
      });

      function mountLogin() {
        html.classList.add('kt-login-mounted');
        html.dataset.ktLoginMounted = 'true';
        if (page) {
          page.classList.add('kt-login-mounted');
          page.classList.remove('kt-login-preload');
        }
        if (typeof window.KamTeswaLoginDebugRefresh === 'function') {
          window.KamTeswaLoginDebugRefresh();
        }
      }

      function removeIntro() {
        if (intro && intro.parentNode) {
          intro.parentNode.removeChild(intro);
        }
      }

      function finishLoginIntro() {
        mountLogin();

        if (intro) intro.classList.add('kt-login-intro-done');
        html.dataset.ktLoginIntro = prefersReducedMotion ? 'reduced' : 'done';

        if (typeof window.KamTeswaLoginDebugRefresh === 'function') {
          window.KamTeswaLoginDebugRefresh();
        }

        window.setTimeout(removeIntro, prefersReducedMotion ? 50 : 450);
      }

      window.KamTeswaLoginMount = mountLogin;
      window.KamTeswaLoginIntroFinish = finishLoginIntro;

      if (prefersReducedMotion) {
        finishLoginIntro();
      } else if (intro) {
        window.setTimeout(finishLoginIntro, 700);
      } else {
        window.setTimeout(finishLoginIntro, 0);
      }
    })(window, document);
  </script>

  <!-- Existing validation rules with dependency-free form submission -->
  <script src="/admin/assets/vendor/libs/@form-validation/umd/bundle/popular.min.js"></script>
  <script src="/admin/assets/vendor/libs/@form-validation/umd/plugin-bootstrap5/index.min.js"></script>
  <script src="/admin/assets/vendor/libs/@form-validation/umd/plugin-auto-focus/index.min.js"></script>
  <script src="/admin/assets/js/admin-ui.js"></script>
  <script src="/admin/assets/js/pages/login.js?v=2.3.6"></script>

  <%- script %>
  <%- include('./partials/imageFallback.ejs') %>
</body>
</html>
