{% extends "base.html" %}
{% load static %}

{% block title %}{{ project_name }}{% endblock %}

{% block content %}
<main>
  <section class="hero">
    <div class="container">
      <h1>Hello. I am Baymax.
      </h1>
      <p class="lead">Your personal healthcare companion. Describe your symptoms below, and I will do my best to help.</p>
    </div>
  </section>

  <div class="container mt-4">
    <div class="row justify-content-center">
      <div class="col-lg-8">
        <div class="checker-card">
          <form method="POST" action="{% url 'index' %}">
            {% csrf_token %}
            <div class="mb-3">
              <label for="symptoms" class="form-label h4">How are you feeling?</label>
              <textarea class="form-control" id="symptoms" name="symptoms" rows="5"
                placeholder="For example: 'I have a headache, a slight fever, and a runny nose.'">{{ symptoms|default:'' }}</textarea>
            </div>
            <div class="text-center">
              <button type="submit" class="btn btn-primary btn-lg">I am satisfied with my care.</button>
            </div>
          </form>
        </div>

        {% if ai_result %}
        <div class="result-card mt-4">
          <h3>Baymax's Analysis:</h3>
          {{ ai_result|linebreaks }}
          <p class="disclaimer mt-3">
            <strong>Disclaimer:</strong> This is not a substitute for professional medical advice. Always consult a doctor
            for any health concerns.
          </p>
        </div>
        {% endif %}
      </div>
    </div>
  </div>
</main>

<footer class="container mt-5">
  <p>&copy; 2025 Baymax Healthcare Companion. All Rights Reserved.</p>
</footer>
{% endblock %}