{% extends "orgapy/layout/skeleton.html" %}
{% load static %}

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

{% block column_main %}
<form action="{% url 'orgapy:settings' %}" method="post">
    {% csrf_token %}
    <input hidden type="text" name="ref" value="{{ request.GET.ref }}" />
    <div class="card">
        <h1 class="card-header">Settings</h1>
        <div class="card-body">
            <p>
                <label for="input-objective-start-hours">Objective Start Hours</label>
                <input id="input-objective-start-hours" type="number" name="objective_start_hours" value="{{ settings.objective_start_hours }}" min="0" max="23" step="1" />
            </p>
            <p>
                <label for="input-lookahead">Calendar Lookahead (in days)</label>
                <input id="input-lookahead" type="number" name="calendar_lookahead" value="{{ settings.calendar_lookahead }}" min="0" />
            </p>
            <p>
                <label for="input-trash-period">Trash Period (in days)</label>
                <input id="input-trash-period" type="number" name="trash_period" value="{{ settings.trash_period }}" min="0" />
                <span class="hint">Documents in trash for longer than this value will be destroyed.</span>
            </p>
            <p>
                <label for="input-mood-hours">Mood Log Hours</label>
                <input id="input-mood-hours" type="number" name="mood_log_hours" value="{{ settings.mood_log_hours }}" min="0" max="23" step="1" />
            </p>
            <p>
                <label for="input-mood-lookback">Mood Log Lookback (days)</label>
                <input id="input-mood-lookback" type="number" name="mood_log_lookback_days" value="{{ settings.mood_log_lookback_days }}" min="0" step="1" />
            </p>
            <p>
                <label for="input-mood-activities">Mood Activities</label>
                <textarea id="input-mood-activities" name="mood_activities" rows="5">{{ settings.mood_activities}}</textarea>
                <span class="hint">Write one activity per line. Each line contains a label and an emoji, separated by a space.</span>
            </p>
            <p>
                <label class="toggle">
                    <input type="checkbox" name="beach_mode" {% if settings.beach_mode %}checked{% endif %} />
                    <span class="toggle-slider"></span>
                    <span class="toggle-text">🏖️ Beach Mode</span>
                </label>
                <span class="hint">Hide tasks, objectives and projects from homepage.</span>
            </p>
        </div>
        <div class="card-actions">
            <button><i class="ri-save-line"></i> Save</button>
        </div>
    </div>
</form>
{% endblock column_main %}