{% extends 'base.html' %}
{% block title %}Programlarım · Odak Planım{% endblock %}
{% block content %}
<section class="mb-8 flex flex-col justify-between gap-4 md:flex-row md:items-end">
  <div>
    <p class="text-sm font-bold uppercase tracking-[.18em] text-teal">Program arşivi</p>
    <h1 class="display-font mt-2 text-4xl font-bold">Programlarım.</h1>
    <p class="mt-3 text-sm leading-6 text-slate-500">Kaydedilen planlarını görüntüle ve dışa aktar.</p>
  </div>
  <a href="{{ url_for('schedule_create') }}" class="inline-flex items-center justify-center gap-2 rounded-xl bg-ink px-5 py-3 text-sm font-bold text-white shadow-soft"><i class="fa-solid fa-calendar-plus"></i> Yeni Program Oluştur</a>
</section>

{% if schedules %}
<section class="grid gap-5 md:grid-cols-2 xl:grid-cols-3">
  {% for schedule in schedules %}
  <article class="rounded-2xl border border-white bg-white/85 p-6 shadow-card transition hover:-translate-y-1 hover:shadow-soft">
    <div class="flex items-start justify-between"><span class="flex h-11 w-11 items-center justify-center rounded-xl bg-gradient-to-br from-teal-100 to-sky-100 text-teal"><i class="fa-regular fa-calendar-days"></i></span><span class="rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-bold text-slate-500">#{{ schedule.id }}</span></div>
    <h2 class="mt-5 text-lg font-bold">{{ schedule.start_date.strftime('%d %B') }} — {{ schedule.end_date.strftime('%d %B %Y') }}</h2>
    <p class="mt-2 text-xs text-slate-500">{{ schedule.created_at.strftime('%d.%m.%Y %H:%M') }} tarihinde kaydedildi</p>
    <div class="mt-6 flex flex-wrap gap-2"><a href="{{ url_for('view_schedule', schedule_id=schedule.id) }}" class="rounded-lg bg-teal px-3 py-2 text-xs font-bold text-white">Görüntüle</a><form method="post" action="{{ url_for('delete_schedule', schedule_id=schedule.id) }}" onsubmit="return confirm('Bu program silinsin mi?')"><button class="rounded-lg bg-rose-50 px-3 py-2 text-xs font-bold text-rose-600">Sil</button></form></div>
  </article>
  {% endfor %}
</section>
{% else %}
<div class="rounded-2xl border border-dashed border-teal-200 bg-white/70 p-14 text-center"><span class="mx-auto flex h-14 w-14 items-center justify-center rounded-2xl bg-teal-100 text-xl text-teal"><i class="fa-regular fa-calendar-plus"></i></span><h2 class="mt-5 text-xl font-bold">Henüz kaydedilmiş program yok.</h2><p class="mt-2 text-sm text-slate-500">Günlerini ve çalışma saatlerini manuel olarak yerleştirerek ilk programını oluştur.</p><a href="{{ url_for('schedule_create') }}" class="mt-6 inline-block rounded-xl bg-teal px-5 py-3 text-sm font-bold text-white">Program oluşturmaya başla</a></div>
{% endif %}
{% endblock %}