{% extends "base.html" %}

{% block styles %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/checkout.css') }}">
{% endblock %}

{% block content %}
<div class="checkout-container">
  <h1>Checkout</h1>

  <div class="checkout-content">
    <div class="order-summary">
      <h3>Order Summary</h3>
      {% for item in cart.items %}
      <div class="order-item">
        <div class="item-info">
          <h4>{{ item.product.name }}</h4>
          <p>Quantity: {{ item.quantity }} × ${{ "%.2f"|format(item.product.price) }}</p>
        </div>
        <div class="item-total">
          ${{ "%.2f"|format(item.product.price * item.quantity) }}
        </div>
      </div>
      {% endfor %}

      <div class="order-total">
        <h3>Total: ${{ "%.2f"|format(total) }}</h3>
      </div>
    </div>

    <div class="checkout-form">
      <h3>Shipping Information</h3>
      <form method="POST">
        <div class="form-group">
          <label>Full Name:</label>
          <input type="text" name="name" required class="form-control">
        </div>

        <div class="form-group">
          <label>Email:</label>
          <input type="email" name="email" value="{{ current_user.email }}" required class="form-control">
        </div>

        <div class="form-group">
          <label>Address:</label>
          <textarea name="address" required class="form-control" rows="3"></textarea>
        </div>

        <div class="form-group">
          <label>City:</label>
          <input type="text" name="city" required class="form-control">
        </div>

        <div class="form-group">
          <label>Postal Code:</label>
          <input type="text" name="postal_code" required class="form-control">
        </div>

        <div class="form-actions">
          <a href="{{ url_for('cart.view_cart') }}" class="btn-back">
            ← Back to Cart
          </a>
          <button type="submit" class="btn-confirm">
            Place Order
          </button>
        </div>
      </form>
    </div>
  </div>
</div>
{% endblock %}