{% extends 'base.html' %}
{% block title %}Post Announcement — CampusTalent{% endblock %}
{% block content %}
<div class="page-content">
<div class="container-sm">
  <div style="margin-bottom:2rem">
    <h1 style="font-size:1.75rem;margin-bottom:0.375rem">Post an Announcement</h1>
    <p style="color:var(--text-muted)">Share events and opportunities with the campus community. Posts are reviewed before publishing.</p>
  </div>
  <div class="card card-accent">
    <form method="post">
      {% csrf_token %}
      {% if form.errors %}<div class="alert alert-danger">Please fix the errors below.</div>{% endif %}
      <div class="form-group">
        <label class="form-label">Title *</label>
        {{ form.title }}
      </div>
      <div class="form-group">
        <label class="form-label">Body *</label>
        {{ form.body }}
        <div class="form-hint">Include all relevant details — dates, location, requirements, how to apply.</div>
      </div>
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:1rem">
        <div class="form-group">
          <label class="form-label">Category *</label>
          {{ form.category }}
        </div>
        <div class="form-group">
          <label class="form-label">Event Date (optional)</label>
          {{ form.event_date }}
        </div>
      </div>
      <div class="form-group">
        <label class="form-label">External Link (optional)</label>
        {{ form.external_link }}
      </div>
      <div class="alert alert-info">
        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
        Your announcement will be reviewed by moderators before it goes live.
      </div>
      <div style="display:flex;gap:0.75rem">
        <button type="submit" class="btn btn-primary btn-lg">Submit for Review</button>
        <a href="{% url 'notices:list' %}" class="btn btn-ghost btn-lg">Cancel</a>
      </div>
    </form>
  </div>
</div>
</div>
{% endblock %}