{% extends "base.html" %}

{% block title %}{{ t.sup_waitlist_conf_page_title }} - {{ config.APP_NAME }}{% endblock %}

{% block content %}
<main class="container-page py-12">
  <div class="card max-w-sm mx-auto mt-8 text-center">
    {% set plan_info = plans.get(plan, plans['supplier_growth']) %}

    <h1 class="text-2xl mb-4">{{ t.sup_waitlist_conf_h1 }}</h1>

    <p class="text-slate-dark">{{ t.sup_waitlist_conf_msg }}</p>
    <p class="font-semibold text-navy my-2">{{ email }}</p>

    <p class="text-slate text-sm mb-2">{{ t.sup_waitlist_conf_first_pre }}<strong>{{ plan_info.name }}</strong>{{ t.sup_waitlist_conf_first_post }}</p>

    <hr>

    <div class="text-left mt-6">
      <h3 class="text-sm font-semibold text-navy mb-3">{{ t.sup_waitlist_conf_early_h3 }}</h3>
      <ul class="list-disc pl-6 space-y-1 text-sm text-slate-dark">
        <li>{{ t.sup_waitlist_conf_li1 }}</li>
        <li>{{ t.sup_waitlist_conf_li2 }}</li>
        <li>{{ t.sup_waitlist_conf_li3 }}</li>
        <li>{{ t.sup_waitlist_conf_li4 }}</li>
      </ul>
    </div>

    <a href="{{ url_for('directory.index') }}" class="btn-outline w-full mt-6">{{ t.sup_waitlist_conf_btn }}</a>
  </div>
</main>
{% endblock %}
