{{-- One link per language: a draft translated into two has two addresses, and
     whoever is reviewing the Catalan one needs that one. --}}
<div class="space-y-3">
    @foreach ($links as $language => $url)
        <div class="space-y-1">
            <p class="text-sm font-medium text-gray-700 dark:text-gray-200">{{ $language }}</p>

            <div class="flex items-center gap-2">
                <input
                    type="text"
                    readonly
                    value="{{ $url }}"
                    onclick="this.select()"
                    class="fi-input w-full rounded-lg border-gray-300 bg-gray-50 px-3 py-2 font-mono text-xs text-gray-700 dark:border-white/10 dark:bg-white/5 dark:text-gray-300"
                />

                <x-filament::button tag="a" href="{{ $url }}" target="_blank" size="sm" color="gray">
                    {{ __('panel.preview.open') }}
                </x-filament::button>
            </div>
        </div>
    @endforeach
</div>