{% set admin_page = "cms" %}
{% extends "admin/base_admin.html" %}

{% block title %}{% if template %}Edit Template{% else %}New Template{% endif %} — Admin{% endblock %}
{% block topbar_title %}{% if template %}Edit Template{% else %}New Template{% endif %}{% endblock %}

{% block admin_content %}
  <div style="margin-bottom:16px;">
    <a href="{{ url_for('cms.template_list') }}" style="font-size:13px;color:#64748B;text-decoration:none;">
      ← Templates
    </a>
  </div>

  <div class="card" style="padding:20px;max-width:800px;">
    <form method="post"
          action="{{ url_for('cms.template_edit', template_id=template.id) if template else url_for('cms.template_new') }}">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

      <div style="display:grid;gap:16px;">
        <div>
          <label class="text-sm" style="display:block;margin-bottom:4px;font-weight:500;">Template Name *</label>
          <input type="text" name="name" value="{{ template.name if template else '' }}" required
                 placeholder="e.g. Coffee country guide"
                 style="width:100%;box-sizing:border-box;border:1px solid #CBD5E1;border-radius:6px;padding:8px 12px;font-size:14px;">
        </div>

        {% if not template %}
        <div>
          <label class="text-sm" style="display:block;margin-bottom:4px;font-weight:500;">
            Slug *
            <span style="font-weight:400;color:#94A3B8;font-size:11px;">unique identifier</span>
          </label>
          <input type="text" name="slug" required
                 placeholder="coffee-country-guide"
                 style="width:100%;box-sizing:border-box;border:1px solid #CBD5E1;border-radius:6px;padding:8px 12px;font-size:14px;font-family:monospace;">
        </div>
        {% endif %}

        <div>
          <label class="text-sm" style="display:block;margin-bottom:4px;font-weight:500;">
            URL Pattern *
            <span style="font-weight:400;color:#94A3B8;font-size:11px;">Jinja2 vars, e.g. /coffee/{{ "{{" }}country_slug{{ "}}" }}</span>
          </label>
          <input type="text" name="url_pattern" value="{{ template.url_pattern if template else '' }}" required
                 placeholder="/coffee/{{ '{{' }}country_slug{{ '}}' }}"
                 style="width:100%;box-sizing:border-box;border:1px solid #CBD5E1;border-radius:6px;padding:8px 12px;font-size:14px;font-family:monospace;">
        </div>

        <div>
          <label class="text-sm" style="display:block;margin-bottom:4px;font-weight:500;">
            Title Pattern *
          </label>
          <input type="text" name="title_pattern" value="{{ template.title_pattern if template else '' }}" required
                 placeholder="{{ '{{' }}country_name{{ '}}' }} Coffee Production — BeanFlows"
                 style="width:100%;box-sizing:border-box;border:1px solid #CBD5E1;border-radius:6px;padding:8px 12px;font-size:14px;font-family:monospace;">
        </div>

        <div>
          <label class="text-sm" style="display:block;margin-bottom:4px;font-weight:500;">Meta Description Pattern</label>
          <input type="text" name="meta_description_pattern"
                 value="{{ template.meta_description_pattern if template else '' }}"
                 placeholder="USDA PSD data for {{ '{{' }}country_name{{ '}}' }} coffee"
                 style="width:100%;box-sizing:border-box;border:1px solid #CBD5E1;border-radius:6px;padding:8px 12px;font-size:13px;font-family:monospace;">
        </div>

        <div>
          <label class="text-sm" style="display:block;margin-bottom:4px;font-weight:500;">
            Body Template
            <span style="font-weight:400;color:#94A3B8;font-size:11px;">Jinja2 HTML rendered at request time</span>
          </label>
          <textarea name="body_template" rows="14" spellcheck="false"
                    placeholder="<h2>About {{ '{{' }}country_name{{ '}}' }}</h2>&#10;<p>{{ '{{' }}description{{ '}}' }}</p>"
                    style="width:100%;box-sizing:border-box;border:1px solid #CBD5E1;border-radius:6px;padding:10px 12px;font-size:12px;font-family:monospace;resize:vertical;background:#FAFAFA;">{{ template.body_template if template else '' }}</textarea>
        </div>
      </div>

      <div style="margin-top:20px;">
        <button type="submit" class="btn">Save Template</button>
      </div>
    </form>
  </div>
{% endblock %}
