{% extends "admin/base.html" %}
{% import "macros/ui.html" as ui %}

{% block title %}{% if profile %}{{ t(key="edit-profile", lang=lang | default(value='sk')) }}{% else %}{{ t(key="new-profile", lang=lang | default(value='sk')) }}{% endif %}{% endblock title %}
{% block crumb %}{{ t(key="admin-discount-profiles", lang=lang | default(value='sk')) }}{% endblock crumb %}

{% block content %}
<div class="flex items-center justify-between gap-3">
  <h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">
    {% if profile %}{{ t(key="edit-profile", lang=lang | default(value='sk')) }}{% else %}{{ t(key="new-profile", lang=lang | default(value='sk')) }}{% endif %}
  </h1>
  {{ ui::button(variant="outline-secondary", label=t(key="cancel", lang=lang | default(value='sk')), href="/admin/catalog/discount-profiles", size="px-3 py-2 text-sm") }}
</div>

{% if profile %}{% set v_name = profile.name %}{% set v_percent = profile.percent %}{% set v_scope = profile.scope_type %}
{% else %}{% set v_name = "" %}{% set v_percent = "" %}{% set v_scope = "include" %}{% endif %}

<form method="post"
  action="{% if profile %}/admin/catalog/discount-profiles/{{ profile.id }}{% else %}/admin/catalog/discount-profiles{% endif %}"
  class="mt-6 space-y-5 rounded-radius border border-outline bg-surface p-6 dark:border-outline-dark dark:bg-surface-dark-alt">
  {{ ui::csrf_field() }}

  {% if error %}{{ ui::alert_danger(message=t(key=error, lang=lang | default(value='sk'))) }}{% endif %}

  <div class="grid gap-5 sm:grid-cols-2">
    <div class="space-y-1.5">
      <label for="name" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="name", lang=lang | default(value='sk')) }}</label>
      {{ ui::input(name="name", id="name", required=true, value=v_name) }}
    </div>
    <div class="space-y-1.5">
      <label for="percent" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="discount-percent", lang=lang | default(value='sk')) }}</label>
      {{ ui::input(name="percent", id="percent", required=true, value=v_percent, placeholder="0", attrs='inputmode="decimal" min="0" max="100"') }}
    </div>
  </div>

  <fieldset class="space-y-2">
    <legend class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="scope", lang=lang | default(value='sk')) }}</legend>
    <label class="flex items-center gap-2 text-sm text-on-surface dark:text-on-surface-dark">
      <input type="radio" name="scope_type" value="include" {% if v_scope != "all_except" %}checked{% endif %}>
      {{ t(key="scope-include-hint", lang=lang | default(value='sk')) }}
    </label>
    <label class="flex items-center gap-2 text-sm text-on-surface dark:text-on-surface-dark">
      <input type="radio" name="scope_type" value="all_except" {% if v_scope == "all_except" %}checked{% endif %}>
      {{ t(key="scope-all-except-hint", lang=lang | default(value='sk')) }}
    </label>
  </fieldset>

  <div class="space-y-1.5">
    <span class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="products", lang=lang | default(value='sk')) }}</span>
    <div class="max-h-72 overflow-y-auto rounded-radius border border-outline p-3 dark:border-outline-dark">
      {% if products | length > 0 %}
      <div class="grid gap-2 sm:grid-cols-2">
        {% for product in products %}
        <label class="flex items-center gap-2 text-sm text-on-surface dark:text-on-surface-dark">
          <input type="checkbox" name="product_ids" value="{{ product.id }}" {% if product.selected %}checked{% endif %}>
          {{ product.name }}
        </label>
        {% endfor %}
      </div>
      {% else %}
      <p class="text-sm text-on-surface/60 dark:text-on-surface-dark/60">{{ t(key="admin-no-products", lang=lang | default(value='sk')) }}</p>
      {% endif %}
    </div>
  </div>

  <div class="flex gap-3 pt-2">
    {{ ui::button(label=t(key="save", lang=lang | default(value='sk')), type="submit") }}
    {{ ui::button(variant="outline-secondary", label=t(key="cancel", lang=lang | default(value='sk')), href="/admin/catalog/discount-profiles") }}
  </div>
</form>
{% endblock content %}
