@php
    $values = $data['values'] ?? [];
    $options = $data['options'] ?? [];
@endphp

<div class="description">
    <p>
        {{ __('account.settings.locale.subtitle') }}
    </p>
</div>

<form method="post" action="{{ route('account.locale.store') }}" class="settings">
    @csrf
    @method('patch')

    <div class="input-row input-row--1-1">
        <div class="input-cell">
            <x-input.label for="language" :value="__('common.language')" />
            <x-input.select
                id="language"
                name="language"
                placeholder="{{ __('common.language_select') }}"
                :value="$values['language']"
                :options="$options['languages']"
                :selected="old('language', $values['language'])"
            />
            <x-input.error :messages="$errors->get('language')" />
        </div>
        <div class="input-cell">
            <x-input.label for="region" :value="__('common.region')" />
            <x-input.select
                id="region"
                name="region"
                placeholder="{{ __('common.region_select') }}"
                :value="$values['region']"
                :options="$options['regions']"
                :selected="old('region', $values['region'])"
            />
            <x-input.error :messages="$errors->get('region')" />
        </div>
    </div>

    <div class="input-row input-row--1-1">
        <div class="input-cell">
            <x-input.label for="date_format" :value="__('common.date_format')" />
            <x-input.select
                id="date_format"
                name="date_format"
                placeholder="{{ __('common.date_format_select') }}"
                :value="$values['date_format']"
                :options="$options['date_formats']"
                :selected="old('date_format', $values['date_format'])"
            />
            <x-input.error :messages="$errors->get('date_format')" />
        </div>
        <div class="input-cell">
            <x-input.label for="time_format" :value="__('common.time_format')" />
            <x-input.select
                id="time_format"
                name="time_format"
                placeholder="{{ __('common.time_format_select') }}"
                :value="$values['time_format']"
                :options="$options['time_formats']"
                :selected="old('time_format', $values['time_format'])"
            />
            <x-input.error :messages="$errors->get('time_format')" />
        </div>
    </div>

    <div class="input-row input-row--1-1">
        <div class="input-cell">
            <x-input.select-label
                :label="__('common.timezone_default')"
                id="timezone"
                name="timezone"
                placeholder="{{ __('common.timezone_select') }}"
                :value="$values['timezone']"
                :options="$options['timezones']"
                :selected="old('timezone', $values['timezone'])"
                description="This can be overridden for each calendar."
            />
            <x-input.error :messages="$errors->get('date_format')" />
        </div>
    </div>

    <div class="input-row input-row--actions input-row--start sticky-bottom">
        <x-button variant="primary" type="submit">{{ __('common.save_changes') }}</x-button>
        <x-button type="anchor"
                  variant="tertiary"
                  href="{{ route('account.locale') }}">{{ __('common.cancel') }}</x-button>
    </div>
</form>