{# Die Eingabefelder eines Kleidungsstücks. Geteilt zwischen Erfassen und
   Bearbeiten, damit beide Formulare nicht auseinanderlaufen.

   `vorgabe` ist beim Erfassen leer und beim Bearbeiten das Kleidungsstück;
   `zuletzt` sind die Werte des zuletzt gespeicherten Teils - beim
   Abarbeiten einer Kiste ändert sich meist nur der Titel. #}

<div class="grid grid-cols-2 gap-3">
    <div class="col-span-2">
        <label class="etikett" for="title">Titel <span class="font-normal text-slate-400 dark:text-slate-500">(freiwillig)</span></label>
        <input class="feld" id="title" name="title" maxlength="100"
               value="{{ vorgabe.title or '' if vorgabe else '' }}"
               placeholder="{{ platzhalter_titel }}">
        <p class="text-xs text-slate-500 dark:text-slate-400 dark:text-slate-500 mt-1">
            Leer lassen genügt – dann steht dort automatisch Kategorie und Grösse.
        </p>
    </div>

    <div>
        <label class="etikett" for="size">Grösse</label>
        <select class="feld" id="size" name="size" required>
            <option value="">bitte wählen</option>
            {% for g in groessen %}
                <option value="{{ g.label }}"
                    {{ 'selected' if (vorgabe.size if vorgabe else zuletzt.size) == g.label }}>
                    {{ g.label }}</option>
            {% endfor %}
        </select>
    </div>

    <div>
        <label class="etikett" for="category_id">Kategorie</label>
        <select class="feld" id="category_id" name="category_id" required>
            <option value="">bitte wählen</option>
            {% for k in kategorien %}
                <option value="{{ k.id }}"
                    {{ 'selected' if (vorgabe.category_id if vorgabe else zuletzt.category_id)|string == k.id|string }}>
                    {{ k.name }}</option>
            {% endfor %}
        </select>
    </div>

    <div>
        <label class="etikett" for="gender">Für</label>
        <select class="feld" id="gender" name="gender">
            {% for wert, text in [('unisex','egal'), ('girl','Mädchen'), ('boy','Buben')] %}
                <option value="{{ wert }}"
                    {{ 'selected' if (vorgabe.gender if vorgabe else zuletzt.gender) == wert }}>
                    {{ text }}</option>
            {% endfor %}
        </select>
    </div>

    <div>
        <label class="etikett" for="season">Saison</label>
        <select class="feld" id="season" name="season">
            {% for wert, text in [('all_year','ganzjährig'), ('spring_summer','Frühling/Sommer'), ('autumn_winter','Herbst/Winter')] %}
                <option value="{{ wert }}"
                    {{ 'selected' if (vorgabe.season if vorgabe else zuletzt.season) == wert }}>
                    {{ text }}</option>
            {% endfor %}
        </select>
    </div>

    <div class="col-span-2">
        <label class="etikett" for="condition">Zustand</label>
        <select class="feld" id="condition" name="condition">
            {% for wert, text in [('good','gut'), ('new','neu'), ('very_good','sehr gut'), ('worn','getragen')] %}
                <option value="{{ wert }}"
                    {{ 'selected' if (vorgabe.condition if vorgabe else zuletzt.condition) == wert }}>
                    {{ text }}</option>
            {% endfor %}
        </select>
    </div>

    <div class="col-span-2">
        <label class="etikett" for="description">Bemerkung <span class="font-normal text-slate-400 dark:text-slate-500">(freiwillig)</span></label>
        <textarea class="feld py-2" id="description" name="description" rows="2"
                  placeholder="z.B. kleiner Fleck am Ärmel">{{ vorgabe.description or '' if vorgabe else '' }}</textarea>
    </div>
</div>