{% extends "base.html" %}
{% block body_class %}settings-bg{% endblock %}

{% block content %}
<div class="container">
  <h1 class="page-title">Settings</h1>

  <!-- Blank Settings box -->
  <div class="settings-card">
    <h2 class="section-title">Settings</h2>
    <p class="muted small">No settings here yet — add options later.</p>
    <!-- Add form fields or options inside this box as needed -->
  </div>

  <!-- Tools box -->
  <div class="settings-card">
    <h2 class="section-title">Tools</h2>

    <!-- Scripture Normalizer -->
    <div class="tool-block">
      <h3>Scripture Normalizer</h3>
      <p class="small muted">
        Standardizes Bible references (book abbreviations, separators, and repeats book names as needed).
        Use preview first; Apply will modify all <code>scripture_raw</code> fields.
      </p>
      <div class="tool-actions">
        <form method="get" action="{% url 'normalize_scripture' %}" class="inline">
          <input type="number" min="0" name="limit" placeholder="Preview limit (optional)" class="tool-input">
          <button class="btn btn-secondary">Preview (dry-run)</button>
        </form>
        {% if user.is_authenticated and user.is_staff %}
        <form method="post" action="{% url 'normalize_scripture' %}" class="inline">
          {% csrf_token %}
          <button class="btn btn-danger"
                  onclick="return confirm('Apply Scripture Normalizer to ALL entries? This will modify scripture_raw fields.');">
            Apply to all
          </button>
        </form>
        {% endif %}
      </div>
    </div>

    <hr class="tool-sep">

    <!-- Source Normalizer -->
    <div class="tool-block">
      <h3>Source Normalizer</h3>
      <p class="small muted">
        Converts Watchtower/Awake!/Yearbook/KM references (e.g., “March 15, 2013 WT page 14”) into WOL short-codes
        like <code>w13 3/15 p.14</code>. Non-JW sources are left unchanged.
      </p>
      <div class="tool-actions">
        <form method="get" action="{% url 'normalize_source' %}" class="inline">
          <input type="number" min="0" name="limit" placeholder="Preview limit (optional)" class="tool-input">
          <button class="btn btn-secondary">Preview (dry-run)</button>
        </form>
        {% if user.is_authenticated and user.is_staff %}
        <form method="post" action="{% url 'normalize_source' %}" class="inline">
          {% csrf_token %}
          <button class="btn btn-danger"
                  onclick="return confirm('Apply Source Normalizer to ALL entries? This cannot be undone. Make a backup first.');">
            Apply to all
          </button>
        </form>
        {% endif %}
      </div>
    </div>

    <hr class="tool-sep">

    <!-- Subject Normalizer -->
    <div class="tool-block">
      <h3>Subject Normalizer</h3>
      <p class="small muted">
        Normalize the <strong>Subject</strong> field so individual subjects are comma-separated.
        Preserves multi-word subjects; lightly fixes separators like “;” and spaced dashes.
        Uses your <code>subjects.txt</code> catalog when available.
      </p>
      <div class="tool-actions">
        <form method="get" action="{% url 'normalize_subjects' %}" class="inline">
          <input type="number" min="0" name="limit" placeholder="Preview limit (optional)" class="tool-input">
          <button class="btn btn-secondary">Dry-run Preview</button>
        </form>
        {% if user.is_authenticated and user.is_staff %}
        <form method="post" action="{% url 'normalize_subjects' %}" class="inline">
          {% csrf_token %}
          <button class="btn btn-danger"
                  onclick="return confirm('Apply subject normalization to all entries? This cannot be undone. Make a backup first.')">
            Apply to all
          </button>
        </form>
        {% endif %}
      </div>
    </div>
  </div>
</div>

<style>
  /* Background for Settings page */
  .settings-bg {
    background: linear-gradient(135deg, #fef9c3, #f3f4f6, #ffffff);
    min-height: 100vh;
  }

  .settings-card {
    background:#fff;
    border:1px solid var(--border, #e5e7eb);
    border-radius:16px;
    padding:20px;
    box-shadow:0 6px 20px rgba(0,0,0,.05);
    margin-top:20px;
  }

  .section-title {
    margin:0 0 12px;
    font-size:20px;
    font-weight:600;
    color:#1f2937;
  }

  .tool-block {
    margin-bottom:16px;
  }
  .tool-block h3 {
    margin:0 0 6px;
    font-size:18px;
    color:#0f172a;
  }
  .tool-actions {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:8px;
  }
  .tool-input {
    border:1px solid var(--border, #d1d5db);
    border-radius:8px;
    padding:6px 8px;
    font-size:14px;
    margin-right:6px;
  }
  .tool-sep {
    border:none;
    border-top:1px solid var(--border, #e5e7eb);
    margin:18px 0;
  }
</style>
{% endblock %}