<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">

<t t-name="mail.ScheduledDateDialog">
    <Dialog title.translate="Set Scheduled Date" size="'md'">
        <div role="radiogroup">
            <div class="d-flex justify-content-between justify-content-md-start my-3 my-sm-2">
                <div class="form-check w-md-50">
                    <input type="radio" class="form-check-input ms-0 me-2" id="input_tomorrow_morning" value="morning" t-model="state.selectedOption"/>
                    <label class="form-check-label" for="input_tomorrow_morning">
                        Tomorrow Morning
                    </label>
                </div>
                <span class="text-muted" t-out="tomorrowMorning.toLocaleString(this.dateTimeFormat)"/>
            </div>
            <div class="d-flex justify-content-between justify-content-md-start my-3 my-sm-2">
                <div class="form-check w-md-50">
                    <input type="radio" class="form-check-input ms-0 me-2" id="input_tomorrow_afternoon" value="afternoon" t-model="state.selectedOption"/>
                    <label class="form-check-label" for="input_tomorrow_afternoon">
                        Tomorrow Afternoon
                    </label>
                </div>
                <span class="text-muted" t-out="tomorrowAfternoon.toLocaleString(this.dateTimeFormat)"/>
            </div>
            <div class="d-flex justify-content-between justify-content-md-start my-3 my-sm-2">
                <div class="form-check w-md-50">
                    <input type="radio" class="form-check-input ms-0 me-2" id="input_monday_morning" value="monday" t-model="state.selectedOption"/>
                    <label class="form-check-label" for="input_monday_morning">
                        Next Monday Morning
                    </label>
                </div>
                <span class="text-muted" t-out="mondayMorning.toLocaleString(this.dateTimeFormat)"/>
            </div>
            <div class="d-flex justify-content-between justify-content-md-start my-3 my-sm-2">
                <div class="form-check my-auto w-md-50">
                    <input type="radio" class="form-check-input ms-0 me-2" id="input_specific_date" value="custom" t-model="state.selectedOption"/>
                    <label class="form-check-label" for="input_specific_date">
                        Pick a specific time
                    </label>
                </div>
                <div class="my-2 my-sm-0" t-if="state.selectedOption === 'custom'">
                    <DateTimeInput t-props="dateTimePickerProps"/>
                </div>
            </div>
        </div>
        <t t-set-slot="footer">
            <button class="btn btn-primary" t-on-click="save" data-hotkey="S">
                Save
            </button>
            <button class="btn btn-secondary" t-on-click="props.close" data-hotkey="C">
                Close
            </button>
            <button t-if="props.isRemovable and props.scheduledDate" class="btn btn-secondary ms-auto" t-on-click="clear" data-hotkey="shift+C">
                Clear Time
            </button>
        </t>
    </Dialog>
</t>
</templates>
