@props([
    'nearbyUrl' => route('mobiangra.nearby_lines'),
    'mapaUrl' => route('mobiangra.mapa', ['modo' => 'proximos']),
    'defaultRadius' => (int) config('mobiangra.nearby.default_radius_m', 800),
    'defaultLimit' => (int) config('mobiangra.nearby.default_limit', 5),
])

<div class="ma-nearby-lines"
    id="ma-nearby-lines"
    data-nearby-url="{{ $nearbyUrl }}"
    data-mapa-url="{{ $mapaUrl }}"
    data-radius="{{ $defaultRadius }}"
    data-limit="{{ $defaultLimit }}"
    data-label-loading="{{ __('Buscando linhas próximas...') }}"
    data-label-empty="{{ __('Nenhuma linha encontrada em um raio de :radius m.', ['radius' => $defaultRadius]) }}"
    data-label-error-permission="{{ __('Permissão de localização negada. Ative o GPS nas configurações do navegador.') }}"
    data-label-error-unavailable="{{ __('Não foi possível obter sua localização. Tente novamente.') }}"
    data-label-error-outside="{{ __('Sua localização está fora da área de cobertura do transporte coletivo de Angra dos Reis.') }}"
    data-label-error-generic="{{ __('Não foi possível carregar as linhas próximas. Tente novamente.') }}"
    data-label-distance="{{ __('a :distance m') }}"
    data-label-stop="{{ __('Parada') }}"
    data-label-horarios="{{ __('Horários') }}"
    data-label-horarios-aria="{{ __('Horários da linha :linha') }}"
    data-label-mapa="{{ __('Ver no mapa') }}">
    <div class="ma-alerts__header">
        <h2 class="ma-alerts__title">
            <i class="fa-solid fa-location-crosshairs ma-nearby-lines__title-icon" aria-hidden="true"></i>
            {{ __('Linhas próximas a você') }}
        </h2>
        <a href="{{ $mapaUrl }}" class="ma-alerts__see-all ma-nearby-lines__map-link">
            {{ __('Ver no mapa') }}
            <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
        </a>
    </div>

    <p class="ma-nearby-lines__intro text-muted">
        {{ __('Descubra quais linhas passam perto de onde você está.') }}
    </p>

    <div class="ma-nearby-lines__actions">
        <button type="button"
            class="btn btn-primary btn-sm ma-nearby-lines__locate-btn"
            id="ma-nearby-lines-locate"
            aria-controls="ma-nearby-lines-body"
            aria-describedby="ma-nearby-lines-hint">
            <i class="fa-solid fa-location-crosshairs" aria-hidden="true"></i>
            {{ __('Usar minha localização') }}
        </button>
    </div>

    <p class="ma-nearby-lines__hint text-muted mb-0" id="ma-nearby-lines-hint">
        {{ __('Sua localização não é armazenada. O acesso ao GPS exige sua permissão.') }}
    </p>

    <div class="ma-nearby-lines__body"
        id="ma-nearby-lines-body"
        role="region"
        aria-live="polite"
        aria-atomic="true"
        hidden></div>
</div>