@extends('layouts.public')

@section('content')
@php
/** @var array $user */
/** @var array $addresses */
$addresses = $addresses ?? [];
@endphp
<div class="qm-page-head">
    <div class="container-fluid">
        <h1 class="qm-page-title">{{ t_raw('account.saved_addresses_title') }}</h1>
        <nav class="breadcrumb" aria-label="{{ t_raw('common.breadcrumb_aria') }}"><a href="{{ route('home') }}">{{ t_raw('common.home') }}</a><span class="mx-2" aria-hidden="true">/</span><a href="{{ route('account') }}">{{ t_raw('account.crumb') }}</a><span class="mx-2" aria-hidden="true">/</span><span class="active">{{ t_raw('account.addresses') }}</span></nav>
    </div>
</div>
@php /* The page's messages belong UNDER its title band, inside the page the reader is
         looking at — not floating above it. getFlashes() consumes, so the layout's own
         call further out finds nothing and does not draw it twice. */
@endphp
<div class="container-fluid">@partial('flash')</div>

<section class="qm-section">
    <div class="container-fluid">
        <div class="row g-4">
            <div class="col-lg-3">@partial('account-nav')</div>
            <div class="col-lg-9">
                <div class="qm-card">
                    <h2>{{ t_raw('account.your_addresses_title') }}</h2>
                    @if (count($addresses))
                    <ul class="qm-addr-list">
                        @foreach ($addresses as $a)
                        <li class="qm-addr" data-addr-id="{{ (int) $a['id'] }}">
                            <div class="qm-addr-body">
                                <div class="qm-addr-head">
                                    <span class="qm-addr-label">{!! $a['label'] ? e($a['label']) : t('account.address_fallback_label') !!}</span>
                                    @php // Rendered always so set-default can toggle it in place (no reload).
@endphp
                                    <span class="qm-pill qm-pill-green" data-addr-default-pill{{ empty($a['is_default']) ? ' hidden' : '' }}>{{ t_raw('vendor.reservations.default_pill') }}</span>
                                </div>
                                @if (!empty($a['recipient']))<p class="qm-addr-line"><strong>{{ $a['recipient'] }}</strong></p>@endif
                                <p class="qm-addr-line">{{ $a['line1'] }}@if (!empty($a['line2'])), {{ $a['line2'] }}@endif</p>
                                @if (!empty($a['city']) || !empty($a['postcode']))
                                <p class="qm-addr-line">{{ trim(($a['city'] ?? '') . ' ' . ($a['postcode'] ?? '')) }}</p>
                                @endif
                                @if (!empty($a['phone']))<p class="qm-addr-line text-muted"><i class="fas fa-phone" aria-hidden="true"></i> {{ $a['phone'] }}</p>@endif
                            </div>
                            <div class="qm-addr-actions">
                                <button type="button" class="qm-btn qm-btn-outline qm-btn-sm" data-addr-edit="{{ (int) $a['id'] }}">{{ t_raw('common.edit') }}</button>
                                @php // Rendered always; hidden when this is the default. JS toggles it in place
                                      // on set-default, and it still works as a plain POST without JS.
@endphp
                                <form method="post" action="{{ route('account.address.default') }}" class="d-inline" data-make-default{{ !empty($a['is_default']) ? ' hidden' : '' }}>
                                    @csrf
                                    <input type="hidden" name="id" value="{{ (int) $a['id'] }}">
                                    <button type="submit" class="qm-btn qm-btn-outline qm-btn-sm">{{ t_raw('account.make_default_btn') }}</button>
                                </form>
                                <form method="post" action="{{ route('account.address.delete') }}" class="d-inline" data-confirm="{{ t_raw('account.confirm_remove_address') }}">
                                    @csrf
                                    <input type="hidden" name="id" value="{{ (int) $a['id'] }}">
                                    <button type="submit" class="qm-btn qm-btn-outline qm-btn-sm qm-btn-danger">{{ t_raw('common.delete') }}</button>
                                </form>
                            </div>
                            <form method="post" action="{{ route('account.address.save') }}" class="qm-addr-editform" id="addr-edit-{{ (int) $a['id'] }}" hidden>
                                @csrf
                                <input type="hidden" name="id" value="{{ (int) $a['id'] }}">
                                <div class="row g-3">
                                    @php $aid = (int) $a['id'];
@endphp
                                    <div class="col-md-6"><label for="addr-label-{{ $aid }}" class="form-label">{{ t_raw('vendor.tables.field_label_label') }}</label><input type="text" id="addr-label-{{ $aid }}" name="label" class="form-control" value="{{ $a['label'] ?? '' }}" maxlength="60" placeholder="{{ t_raw('account.label_placeholder') }}"></div>
                                    <div class="col-md-6"><label for="addr-recipient-{{ $aid }}" class="form-label">{{ t_raw('account.recipient_label') }}</label><input type="text" id="addr-recipient-{{ $aid }}" name="recipient" class="form-control" value="{{ $a['recipient'] ?? '' }}" maxlength="120" placeholder="{{ t_raw('vendor.settings.contact_name_placeholder') }}"></div>
                                    <div class="col-md-6"><label for="addr-phone-{{ $aid }}" class="form-label">{{ t_raw('common.phone') }}</label><input type="text" id="addr-phone-{{ $aid }}" name="phone" class="form-control" value="{{ $a['phone'] ?? '' }}" maxlength="40" placeholder="{{ t_raw('auth.phone_placeholder') }}"></div>
                                    <div class="col-12"><label for="addr-line1-{{ $aid }}" class="form-label">{{ t_raw('account.street_address_label') }} <span class="qm-req-mark" aria-hidden="true">*</span></label><input type="text" id="addr-line1-{{ $aid }}" name="line1" class="form-control" value="{{ $a['line1'] ?? '' }}" maxlength="191" required placeholder="{{ t_raw('vendor.settings.address_placeholder') }}"></div>
                                    <div class="col-12"><label for="addr-line2-{{ $aid }}" class="form-label">{{ t_raw('account.apartment_label') }}</label><input type="text" id="addr-line2-{{ $aid }}" name="line2" class="form-control" value="{{ $a['line2'] ?? '' }}" maxlength="191" placeholder="{{ t_raw('common.placeholder_line2') }}"></div>
                                    <div class="col-md-8"><label for="addr-city-{{ $aid }}" class="form-label">{{ t_raw('common.city') }}</label><input type="text" id="addr-city-{{ $aid }}" name="city" class="form-control" value="{{ $a['city'] ?? '' }}" maxlength="120" placeholder="{{ t_raw('auth.city_placeholder') }}"></div>
                                    <div class="col-md-4"><label for="addr-postcode-{{ $aid }}" class="form-label">{{ t_raw('account.postcode_label') }}</label><input type="text" id="addr-postcode-{{ $aid }}" name="postcode" class="form-control" value="{{ $a['postcode'] ?? '' }}" maxlength="20" placeholder="{{ t_raw('common.placeholder_postcode') }}"></div>
                                </div>
                                <div class="form-check form-switch mt-3">
                                    <input type="checkbox" class="form-check-input" role="switch" id="addr-default-{{ (int) $a['id'] }}" name="is_default" value="1"{{ !empty($a['is_default']) ? ' checked' : '' }}>
                                    <label class="form-check-label" for="addr-default-{{ (int) $a['id'] }}">{{ t_raw('account.use_as_default_address') }}</label>
                                </div>
                                <div class="qm-addr-editform-actions justify-content-end">
                                    <button type="submit" class="qm-btn">{{ t_raw('account.save_address_btn') }}</button>
                                    <button type="button" class="qm-btn qm-btn-outline" data-addr-cancel="{{ (int) $a['id'] }}">{{ t_raw('common.cancel') }}</button>
                                </div>
                            </form>
                        </li>
                        @endforeach
                    </ul>
                    @else
                    <div class="qm-empty">
                        <i class="fas fa-map-marker-alt d-block" aria-hidden="true"></i>
                        <p>{{ t_raw('account.no_addresses_empty') }}</p>
                    </div>
                    @endif
                </div>

                <div class="qm-card">
                    <h2>{{ t_raw('account.add_address_title') }}</h2>
                    <form method="post" action="{{ route('account.address.save') }}">
                        @csrf
                        <div class="row g-3">
                            <div class="col-md-6"><label for="label" class="form-label">{{ t_raw('vendor.tables.field_label_label') }}</label><input type="text" id="label" name="label" class="form-control" value="{{ old('label') }}" placeholder="{{ t_raw('account.label_placeholder') }}" maxlength="60"></div>
                            <div class="col-md-6"><label for="recipient" class="form-label">{{ t_raw('account.recipient_label') }}</label><input type="text" id="recipient" name="recipient" class="form-control" value="{{ old('recipient') }}" maxlength="120" placeholder="{{ t_raw('vendor.settings.contact_name_placeholder') }}"></div>
                            <div class="col-md-6"><label for="phone" class="form-label">{{ t_raw('common.phone') }}</label><input type="text" id="phone" name="phone" class="form-control" value="{{ old('phone') }}" maxlength="40" placeholder="{{ t_raw('auth.phone_placeholder') }}"></div>
                            <div class="col-12"><label for="line1" class="form-label">{{ t_raw('account.street_address_label') }} <span class="qm-req-mark" aria-hidden="true">*</span></label><input type="text" id="line1" name="line1" class="form-control" value="{{ old('line1') }}" maxlength="191" required placeholder="{{ t_raw('vendor.settings.address_placeholder') }}"></div>
                            <div class="col-12"><label for="line2" class="form-label">{{ t_raw('account.apartment_label') }}</label><input type="text" id="line2" name="line2" class="form-control" value="{{ old('line2') }}" maxlength="191" placeholder="{{ t_raw('common.placeholder_line2') }}"></div>
                            <div class="col-md-8"><label for="city" class="form-label">{{ t_raw('common.city') }}</label><input type="text" id="city" name="city" class="form-control" value="{{ old('city') }}" maxlength="120" placeholder="{{ t_raw('auth.city_placeholder') }}"></div>
                            <div class="col-md-4"><label for="postcode" class="form-label">{{ t_raw('account.postcode_label') }}</label><input type="text" id="postcode" name="postcode" class="form-control" value="{{ old('postcode') }}" maxlength="20" placeholder="{{ t_raw('common.placeholder_postcode') }}"></div>
                        </div>
                        <div class="form-check form-switch mt-3">
                            <input type="checkbox" class="form-check-input" role="switch" id="is_default" name="is_default" value="1">
                            <label class="form-check-label" for="is_default">{{ t_raw('account.use_as_default_address') }}</label>
                        </div>
                        <div class="d-flex justify-content-end qm-mt-3"><button type="submit" class="qm-btn">{{ t_raw('account.add_address_btn') }}</button></div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
<script src="{!! asset('js/account-addresses.js') !!}"></script>
@endsection