{% load i18n %}

<h5 class="d-flex align-items-center gap-2 mb-2">
  <span class="badge text-bg-secondary">1</span>
  {% trans "Menu & panel title" %}
</h5>
<div class="card mb-4">
  <div class="card-body">
    <p class="text-muted small mb-3">
      {% blocktrans %}Titles for the sidebar menu and the object-detail card. Default for both: <strong>Security</strong>.{% endblocktrans %}
    </p>
    <form method="post" class="row g-3 align-items-end" style="max-width:640px">
      {% csrf_token %}
      <input type="hidden" name="action" value="save_ui_settings">
      <div class="col-md-5">
        <label class="form-label" for="nsm-menu-label">{% trans "Menu label" %}</label>
        <input type="text" class="form-control" id="nsm-menu-label" name="menu_label"
               maxlength="100" required value="{{ ui_settings.menu_label }}">
      </div>
      <div class="col-md-5">
        <label class="form-label" for="nsm-panel-label">{% trans "Panel label" %}</label>
        <input type="text" class="form-control" id="nsm-panel-label" name="panel_label"
               maxlength="100" required value="{{ ui_settings.resolved_panel_label }}">
      </div>
      <div class="col-md-2">
        <button type="submit" class="btn btn-primary w-100">
          <i class="mdi mdi-content-save-outline me-1"></i>{% trans "Save" %}
        </button>
      </div>
    </form>
  </div>
</div>