@php
    /** @var \App\Models\Venue $venue */
    /** @var array<string, string> $countryLabels */
    $countryLabels = $countryLabels ?? [];
    $defaultTz = old('timezone', $venue->timezone ?: config('app.timezone'));
    $countryVal = strtoupper((string) old('country', $venue->country ?? ''));
@endphp

<div class="row">
    <div class="col-lg-6">
        <div class="form-row">
            <div class="form-group col-md-8">
                <label for="name">{{ __('Nombre del recinto') }} <span class="text-danger">*</span></label>
                <input type="text" class="form-control @error('name') is-invalid @enderror" id="name" name="name"
                       value="{{ old('name', $venue->name) }}" required maxlength="255">
                @error('name')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            <div class="form-group col-md-4">
                <label for="timezone">{{ __('Zona horaria') }}</label>
                <select id="timezone" class="form-control rt-ts-search" name="timezone">
                    @foreach ($timezones as $tz)
                        <option value="{{ $tz }}" @selected(old('timezone', $defaultTz) === $tz)>{{ $tz }}</option>
                    @endforeach
                </select>
                @error('timezone')
                    <div class="small text-danger">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="form-group">
            <label class="d-block">{{ __('Dirección (línea 1)') }}</label>
            <div id="rt-venue-address-autocomplete-host" class="rt-venue-pac-host @error('address_line_1') is-invalid border border-danger rounded @enderror"></div>
            <input type="hidden" id="address_line_1" name="address_line_1" value="{{ old('address_line_1', $venue->address_line_1) }}">
            @error('address_line_1')
                <div class="invalid-feedback d-block">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-row">
            <div class="form-group col-md-6">
                <label for="latitude">{{ __('Latitud') }}</label>
                <input type="text" class="form-control @error('latitude') is-invalid @enderror" id="latitude" name="latitude"
                       value="{{ old('latitude', $venue->latitude) }}" inputmode="decimal" placeholder="18.4655">
                @error('latitude')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            <div class="form-group col-md-6">
                <label for="longitude">{{ __('Longitud') }}</label>
                <input type="text" class="form-control @error('longitude') is-invalid @enderror" id="longitude" name="longitude"
                       value="{{ old('longitude', $venue->longitude) }}" inputmode="decimal" placeholder="-66.1057">
                @error('longitude')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="form-group">
            <label for="address_line_2">{{ __('Línea 2') }}</label>
            <input type="text" class="form-control @error('address_line_2') is-invalid @enderror" id="address_line_2" name="address_line_2"
                   value="{{ old('address_line_2', $venue->address_line_2) }}" maxlength="255">
            @error('address_line_2')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-row">
            <div class="form-group col-md-4">
                <label for="city">{{ __('Ciudad') }}</label>
                <input type="text" class="form-control @error('city') is-invalid @enderror" id="city" name="city"
                       value="{{ old('city', $venue->city) }}">
                @error('city')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            <div class="form-group col-md-4">
                <label for="region">{{ __('Región / estado') }}</label>
                <input type="text" class="form-control @error('region') is-invalid @enderror" id="region" name="region"
                       value="{{ old('region', $venue->region) }}">
                @error('region')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            <div class="form-group col-md-4">
                <label for="postal_code">{{ __('Código postal') }}</label>
                <input type="text" class="form-control @error('postal_code') is-invalid @enderror" id="postal_code" name="postal_code"
                       value="{{ old('postal_code', $venue->postal_code) }}">
                @error('postal_code')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="form-group mb-0">
            <label for="country">{{ __('País (ISO-3166)') }}</label>
            <select id="country" name="country" class="form-control @error('country') is-invalid @enderror">
                <option value="">{{ __('Seleccionar…') }}</option>
                @if ($countryVal !== '' && ! array_key_exists($countryVal, $countryLabels))
                    <option value="{{ $countryVal }}" selected>{{ $countryVal }} — {{ __('valor guardado') }}</option>
                @endif
                @foreach ($countryLabels as $code => $label)
                    <option value="{{ $code }}" @selected($countryVal !== '' && $countryVal === $code)>{{ $label }}</option>
                @endforeach
            </select>
            @error('country')
                <div class="invalid-feedback d-block">{{ $message }}</div>
            @enderror
            <small class="form-text text-muted">{{ __('Código ISO de dos letras; puedes buscar por nombre o por código.') }}</small>
        </div>
    </div>

    <div class="col-lg-6 mt-4 mt-lg-0">
        <div class="position-sticky pt-1" style="top: 5.5rem;">
            @if ($googleMapsKey !== '')
                <div class="d-flex align-items-center justify-content-between mb-2">
                    <span class="small font-weight-bold text-muted text-uppercase">{{ __('Vista previa del mapa') }}</span>
                </div>
                <div id="rt-venue-page-map" class="rounded border bg-light" style="height: min(420px, 58vh); min-height: 280px;"></div>
                <p class="small text-muted mt-2 mb-0">
                    {{ __('Arrastra el marcador o haz clic en el mapa: se completarán la dirección y los demás campos según la ubicación.') }}
                </p>
            @else
                <div class="alert alert-light border small mb-0">
                    {{ __('Mapa no disponible: indica latitud y longitud manualmente.') }}
                </div>
            @endif
        </div>
    </div>
</div>
