<%- include('../systemFinance/assets.ejs') %>
<main class="kt-ops kt-finance" data-ops-page data-finance-page>
  <div class="kt-ops__stack">
    <%- include('../systemFinance/hero.ejs', {
      heading: payment.paymentName || payment.slug,
      description: i18n.__('systemFinance.paymentsDescription'),
      icon: payment.slug === 'cash' ? 'ti-cash' : payment.slug === 'wallet' ? 'ti-wallet' : 'ti-credit-card',
      count: 0,
      showCount: false,
      primaryUrl: '/dashboard/payments/edit/' + payment.paymentId,
      primaryLabel: i18n.__('systemFinance.edit'),
      primaryIcon: 'ti-edit',
      backUrl: '/dashboard/payments'
    }) %>
    <section class="kt-ops-section">
      <header class="kt-ops-section__header">
        <span class="kt-ops-section-icon" aria-hidden="true"><i class="ti ti-list-details"></i></span>
        <div><h2><%= i18n.__('systemFinance.details') %></h2><p><%= i18n.__('systemFinance.paymentIdentity') %></p></div>
      </header>
      <div class="kt-ops-section__body">
        <div class="kt-ops-details-grid">
          <div class="kt-ops-detail"><span class="kt-ops-detail__label"><%= i18n.__('payments.paymentsType') %></span><strong class="kt-ops-detail__value"><%= payment.paymentName || payment.slug %></strong></div>
          <div class="kt-ops-detail"><span class="kt-ops-detail__label"><%= i18n.__('systemFinance.status') %></span><span class="kt-ops-status <%= payment.status === 'available' ? 'kt-ops-status--success' : 'kt-ops-status--danger' %>"><%= payment.status === 'available' ? i18n.__('payments.available') : i18n.__('payments.unavailable') %></span></div>
          <div class="kt-ops-detail"><span class="kt-ops-detail__label"><%= i18n.__('systemFinance.createdAt') %></span><strong class="kt-ops-detail__value"><%= payment.createdAt %></strong></div>
        </div>
      </div>
    </section>
  </div>
</main>
<%- include('../systemFinance/scripts.ejs') %>
