{% extends "admin/base.html" %}
{% block page_title %}{% if mode %}{{ t('edit_mode') | default('Edit Mode') }}{% else %}{{ t('add_mode') | default('Add Mode') }}{% endif %}{% endblock %}
{% block content %}
<div class="card animate-in" style="max-width:600px">
  <h3 style="margin-bottom:1.5rem">
    {% if mode %}✏️ {{ t('edit_mode') | default('Edit Mode') }}{% else %}➕ {{ t('add_mode') | default('Add New Mode') }}{% endif %}
    — <span style="color:var(--neon)">{{ game.icon }} {{ game.name }}</span>
  </h3>
  <form method="POST">
    <div class="form-group">
      <label>{{ t('mode_name') | default('Mode Name') }} *</label>
      <input class="input" name="name" value="{{ mode.name if mode else '' }}" required placeholder="Competitive 5v5">
    </div>
    <div class="form-group">
      <label>Slug *</label>
      <input class="input" name="slug" value="{{ mode.slug if mode else '' }}" required placeholder="competitive" {% if mode %}readonly{% endif %}>
    </div>
    <div class="form-group">
      <label>{{ t('description') | default('Description') }}</label>
      <textarea class="input" name="description" rows="2" placeholder="5v5 competitive matches...">{{ mode.description if mode else '' }}</textarea>
    </div>
    <div class="form-row">
      <div class="form-group">
        <label>آیکون مود</label>
        <input class="input" name="icon" value="{{ mode.icon if mode else '⚔️' }}" maxlength="10" placeholder="⚔️">
        <small style="color:var(--text-muted);font-size:0.72rem;margin-top:0.25rem;display:block">ایموجی یا کاراکتر (مثل ⚔️ 🎯 🏆)</small>
      </div>
      <div class="form-group">
        <label>حالت تیمی (مثل 5v5) *</label>
        <input class="input" type="number" name="squad_size" value="{{ mode.squad_size if mode else 5 }}" min="1" max="100" required>
        <small style="color:var(--text-muted);font-size:0.72rem;margin-top:0.25rem;display:block">تعداد بازیکن هر تیم — 1 یعنی Solo، 5 یعنی 5v5</small>
      </div>
      <div class="form-group">
        <label>حداکثر اندازه تیم</label>
        <input class="input" type="number" name="max_squad_size" value="{{ mode.max_squad_size or '' }}" min="0" placeholder="اختیاری">
      </div>
    </div>
    {% if mode %}
    <div class="form-group">
      <label style="display:flex;align-items:center;gap:0.5rem">
        <input type="checkbox" name="is_active" value="1" {% if mode.is_active %}checked{% endif %} style="width:auto">
        {{ t('is_active') | default('Active') }}
      </label>
    </div>
    {% endif %}
    <div class="flex" style="gap:0.8rem;margin-top:1.5rem">
      <button type="submit" class="btn btn-primary" style="flex:1;justify-content:center;padding:1rem">{{ t('save_changes') }}</button>
      <a href="{{ url_for('admin.modes_list', gid=game.id) }}" class="btn btn-outline">{{ t('cancel') }}</a>
    </div>
  </form>
</div>
{% endblock %}