<?php
$pageTitle = $mode === 'create' ? 'Add Topic' : 'Edit Topic';
$v = fn($key) => htmlspecialchars($topic[$key] ?? '', ENT_QUOTES, 'UTF-8');
require __DIR__ . '/../layout/header.php';
?>

<div class="d-flex align-items-center gap-3 mb-4">
  <a href="<?= BASE_URL ?>/topics<?= $selProject ? '?project_id=' . $selProject : '' ?>" class="btn btn-sm btn-light">
    <i class="bi bi-arrow-left"></i>
  </a>
  <h4 class="fw-bold mb-0"><?= $mode === 'create' ? 'Add New Topic' : 'Edit Topic' ?></h4>
</div>

<form method="POST" action="<?= $action ?>">
  <div class="row g-4">

    <div class="col-lg-8">
      <div class="card border-0 shadow-sm mb-4">
        <div class="card-header bg-white py-3">
          <h6 class="fw-semibold mb-0"><i class="bi bi-tag text-primary me-2"></i>Topic Details</h6>
        </div>
        <div class="card-body">
          <div class="row g-3">
            <div class="col-12">
              <label class="form-label fw-medium">Topic Title <span class="text-danger">*</span></label>
              <input type="text" name="title" class="form-control" required value="<?= $v('title') ?>"
                     placeholder="e.g. How to Choose the Best SEO Agency for Small Business">
              <div class="form-text">The H1 title of the content piece.</div>
            </div>
            <div class="col-md-6">
              <label class="form-label fw-medium">Primary Keyword <span class="text-danger">*</span></label>
              <input type="text" name="primary_keyword" class="form-control" required value="<?= $v('primary_keyword') ?>"
                     placeholder="e.g. best SEO agency for small business">
            </div>
            <div class="col-md-6">
              <label class="form-label fw-medium">Search Intent</label>
              <select name="search_intent" class="form-select">
                <?php foreach (['informational', 'navigational', 'transactional', 'commercial'] as $si): ?>
                <option value="<?= $si ?>" <?= ($topic['search_intent'] ?? 'informational') === $si ? 'selected' : '' ?>><?= ucfirst($si) ?></option>
                <?php endforeach; ?>
              </select>
            </div>
            <div class="col-12">
              <label class="form-label fw-medium">Supporting Keywords</label>
              <textarea name="supporting_keywords" class="form-control" rows="2"
                        placeholder="Comma-separated LSI and supporting keywords. e.g. local SEO agency, affordable SEO, small business marketing"><?= $v('supporting_keywords') ?></textarea>
            </div>
            <div class="col-12">
              <label class="form-label fw-medium">Content Angle</label>
              <textarea name="content_angle" class="form-control" rows="2"
                        placeholder="Unique angle or positioning for this content. e.g. Compare 5 proven strategies vs generic advice. Target owners frustrated with wasted ad spend."><?= $v('content_angle') ?></textarea>
              <div class="form-text">Tell the AI exactly what makes this piece unique.</div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="col-lg-4">
      <div class="card border-0 shadow-sm mb-4">
        <div class="card-header bg-white py-3">
          <h6 class="fw-semibold mb-0"><i class="bi bi-gear text-secondary me-2"></i>Settings</h6>
        </div>
        <div class="card-body">
          <div class="mb-3">
            <label class="form-label fw-medium">Project <span class="text-danger">*</span></label>
            <select name="project_id" class="form-select" required>
              <option value="">— Select Project —</option>
              <?php foreach ($projects as $p): ?>
              <option value="<?= $p['id'] ?>" <?= ($topic['project_id'] ?? $selProject) == $p['id'] ? 'selected' : '' ?>>
                <?= htmlspecialchars($p['business_name']) ?>
              </option>
              <?php endforeach; ?>
            </select>
          </div>
          <div class="mb-3">
            <label class="form-label fw-medium">Page Type <span class="text-danger">*</span></label>
            <select name="page_type_id" class="form-select" required>
              <option value="">— Select Page Type —</option>
              <?php foreach ($pageTypes as $pt): ?>
              <option value="<?= $pt['id'] ?>" <?= ($topic['page_type_id'] ?? '') == $pt['id'] ? 'selected' : '' ?>>
                <?= htmlspecialchars($pt['name']) ?>
                <? if($pt['category']): ?>(<?= $pt['category'] ?>)<? endif; ?>
              </option>
              <?php endforeach; ?>
            </select>
          </div>
          <div class="mb-0">
            <label class="form-label fw-medium">Target Word Count</label>
            <input type="number" name="target_word_count" class="form-control"
                   value="<?= htmlspecialchars($topic['target_word_count'] ?? 1200) ?>"
                   min="200" max="5000" step="100">
          </div>
        </div>
      </div>

      <div class="d-grid gap-2">
        <button type="submit" class="btn btn-primary">
          <i class="bi bi-<?= $mode === 'create' ? 'plus-lg' : 'check-lg' ?> me-1"></i>
          <?= $mode === 'create' ? 'Add Topic' : 'Save Changes' ?>
        </button>
        <a href="<?= BASE_URL ?>/topics<?= $selProject ? '?project_id=' . $selProject : '' ?>" class="btn btn-light">Cancel</a>
      </div>
    </div>

  </div>
</form>

<?php require __DIR__ . '/../layout/footer.php'; ?>
