{% extends "app.html" %}
{% block content %}
<p class="choice-hint">{{ shell.tr.add_choice_hint }}</p>
<div class="choice-stack">
  <form method="post" action="/timer/demarrer" style="margin:0">
    <input type="hidden" name="csrf" value="{{ shell.csrf }}">
    <input type="hidden" name="retour" value="{{ shell.start_return }}">
    <button type="submit" class="choice-card choice-timer"{% if busy.is_some() %} disabled aria-describedby="timer-busy"{% endif %}>
      <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="13.5" r="7.5"></circle><path d="M12 10v3.5l2.2 1.6"></path><path d="M9.4 2.5h5.2"></path></svg>
      <span>
        <span class="choice-title">{{ shell.tr.start_timer }}</span>
        <span class="choice-sub">{{ shell.tr.choice_timer_sub }}</span>
      </span>
    </button>
  </form>
  {% if let Some(why) = busy %}
  <p class="choice-busy" id="timer-busy">{{ why }}</p>
  {% endif %}
  <a class="choice-card choice-manual" href="/temps/nouveau?mode=manuel">
    <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v8M8 12h8"></path></svg>
    <span>
      <span class="choice-title">{{ shell.tr.title_add }}</span>
      <span class="choice-sub">{{ shell.tr.choice_manual_sub }}</span>
    </span>
  </a>
  <a class="btn btn-ghost choice-manage" href="/parametres/categories">{{ shell.tr.manage_categories }}</a>
</div>
{% endblock %}