{% extends 'base.html' %}

{% block title %}Edit review · TradeHub{% endblock %}

{% block content %}
<div class="container" style="max-width: 640px;">
  <div class="page-header">
    <h1>Edit your review</h1>
    <p>Reviews can be edited within 7 days of submission.</p>
  </div>

  <div class="form-card">
    <form method="POST" novalidate>
      {{ form.hidden_tag() }}

      <div class="form-group">
        <label class="form-label">Rating</label>
        <div class="star-input" data-star-input>
          <input type="radio" id="s5" name="rating" value="5" {% if review.rating == 5 %}checked{% endif %}><label for="s5">★</label>
          <input type="radio" id="s4" name="rating" value="4" {% if review.rating == 4 %}checked{% endif %}><label for="s4">★</label>
          <input type="radio" id="s3" name="rating" value="3" {% if review.rating == 3 %}checked{% endif %}><label for="s3">★</label>
          <input type="radio" id="s2" name="rating" value="2" {% if review.rating == 2 %}checked{% endif %}><label for="s2">★</label>
          <input type="radio" id="s1" name="rating" value="1" {% if review.rating == 1 %}checked{% endif %}><label for="s1">★</label>
        </div>
      </div>

      <div class="form-group">
        <label class="form-label" for="content">Comment</label>
        <textarea id="content" name="content" class="form-textarea" rows="5"
                  maxlength="500" data-char-counter="500" data-target-counter="review-count">{{ review.content }}</textarea>
        <div class="form-hint" id="review-count">0 / 500</div>
      </div>

      <div style="display:flex; gap: var(--space-3);">
        <a href="{{ url_for('orders.my_orders') }}" class="btn btn-outline">Cancel</a>
        {{ form.submit(class="btn btn-primary btn-lg", style="flex:1;") }}
      </div>
    </form>
  </div>
</div>
{% endblock %}