<%
  const createLocale = typeof lang === 'string' && lang.toLowerCase().startsWith('en') ? 'en' : 'ar';
  const createCopy = createLocale === 'ar'
    ? {
        eyebrow: 'إدارة العملاء',
        title: 'إضافة مستخدم',
        subtitle: 'أنشئ هوية عميل بالبيانات الأساسية المعتمدة فقط.',
        cardTitle: 'بيانات المستخدم',
        cardSubtitle: 'الاسم، التواصل، وبيانات تسجيل الدخول.',
        back: 'رجوع',
        ready: 'جاهز للحفظ',
        dirty: 'توجد تغييرات غير محفوظة',
        submit: 'إضافة المستخدم',
        submitting: 'جاري الإضافة...',
        success: 'تمت إضافة المستخدم',
        error: 'تعذر إضافة المستخدم. راجع البيانات وحاول مرة أخرى.',
        validation: 'راجع الحقول المطلوبة قبل الحفظ.'
      }
    : {
        eyebrow: 'Customer management',
        title: 'Add user',
        subtitle: 'Create a customer identity using only the approved core fields.',
        cardTitle: 'User details',
        cardSubtitle: 'Name, contact, and sign-in credentials.',
        back: 'Back',
        ready: 'Ready to save',
        dirty: 'Unsaved changes',
        submit: 'Add user',
        submitting: 'Adding...',
        success: 'User added',
        error: 'Could not add the user. Review the details and try again.',
        validation: 'Review the required fields before saving.'
      };
%>

<link rel="stylesheet" href="/admin/assets/css/pages/people-resource.css?v=2.6.5.1">

<section class="kt-people-page kt-clients-page" dir="<%= createLocale === 'ar' ? 'rtl' : 'ltr' %>">
  <div class="kt-people-container kt-people-container--form">
    <header class="kt-people-hero">
      <div class="kt-people-hero__identity">
        <span class="kt-people-hero__icon" aria-hidden="true"><i class="ti ti-user-plus"></i></span>
        <div>
          <span class="kt-people-hero__eyebrow"><%= createCopy.eyebrow %></span>
          <h1><%= createCopy.title %></h1>
          <p><%= createCopy.subtitle %></p>
        </div>
      </div>
      <a class="kt-people-btn kt-people-btn--secondary" href="<%= referer || '/dashboard/clients/all' %>">
        <i class="ti ti-arrow-right" aria-hidden="true"></i><span><%= createCopy.back %></span>
      </a>
    </header>

    <section class="kt-people-form-card">
      <div class="kt-people-card-heading">
        <span class="kt-people-card-heading__icon" aria-hidden="true"><i class="ti ti-address-book"></i></span>
        <div><h2><%= createCopy.cardTitle %></h2><p><%= createCopy.cardSubtitle %></p></div>
      </div>

      <form
        id="createClient"
        action="/dashboard/clients/create"
        method="post"
        enctype="multipart/form-data"
        novalidate
        data-people-form
        data-method="POST"
        data-success-message="<%= createCopy.success %>"
        data-error-message="<%= createCopy.error %>"
        data-validation-message="<%= createCopy.validation %>"
        data-dirty-message="<%= createCopy.dirty %>"
      >
        <input type="hidden" name="_csrf" value="<%= csrfToken %>">
        <div class="kt-people-form__body">
          <%- include('./partials/formFields.ejs', {
            mode: 'create',
            client: null,
            countries: typeof countries !== 'undefined' ? countries : [],
            lang: createLocale
          }) %>
          <p class="kt-people-form-message" data-people-form-message aria-live="polite"></p>
        </div>
        <div class="kt-people-command-bar">
          <span class="kt-people-command-bar__status" data-people-form-status>
            <i class="ti ti-circle-check" aria-hidden="true"></i><span><%= createCopy.ready %></span>
          </span>
          <div class="kt-people-command-bar__actions">
            <a class="kt-people-btn kt-people-btn--soft" href="<%= referer || '/dashboard/clients/all' %>"><%= createCopy.back %></a>
            <button
              class="kt-people-btn kt-people-btn--primary kt-people-submit"
              type="submit"
              data-people-submit
              data-default-label="<%= createCopy.submit %>"
              data-loading-label="<%= createCopy.submitting %>"
            >
              <i class="ti ti-user-plus" aria-hidden="true"></i>
              <span data-people-button-label><%= createCopy.submit %></span>
            </button>
          </div>
        </div>
      </form>
    </section>
  </div>
</section>

<script src="/admin/assets/js/pages/people-resource.js?v=2.6.5.1" defer></script>
