{% extends "base.html" %}

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

{% block content %}
<div class="min-h-screen flex items-center justify-center bg-base-200">
  <div class="text-center">
    <h1 class="text-5xl font-bold mb-4">
      Welcome to <span class="text-primary">myfy</span>
    </h1>
    <p class="text-xl mb-8">
      Your frontend is ready with Tailwind 4 and DaisyUI 5
    </p>

    <div class="flex gap-4 justify-center">
      <button class="btn btn-primary">Get Started</button>
      <button class="btn btn-outline">Learn More</button>
    </div>

    <div class="mt-12 p-6 bg-base-100 rounded-lg shadow-lg max-w-2xl">
      <h2 class="text-2xl font-semibold mb-4">Next Steps</h2>
      <div class="text-left space-y-2">
        <p class="flex items-start gap-2">
          <span class="text-primary">✓</span>
          <span>Edit <code class="text-sm bg-base-200 px-2 py-1 rounded">frontend/templates/home.html</code> to customize this page</span>
        </p>
        <p class="flex items-start gap-2">
          <span class="text-primary">✓</span>
          <span>Add routes in <code class="text-sm bg-base-200 px-2 py-1 rounded">app.py</code></span>
        </p>
        <p class="flex items-start gap-2">
          <span class="text-primary">✓</span>
          <span>Style with Tailwind classes and DaisyUI components</span>
        </p>
      </div>
    </div>
  </div>
</div>
{% endblock %}