@if($dsRecords && !empty($dsRecords['ds_records']))
    <div class="space-y-4">
        @foreach($dsRecords['ds_records'] as $type => $ds)
            <div class="p-4 bg-gray-50 dark:bg-gray-800 rounded-lg">
                <div class="flex items-center justify-between mb-2">
                    <span class="text-sm font-medium text-gray-700 dark:text-gray-300">
                        {{ $ds['digest_name'] ?? $type }}
                        @if($loop->first)
                            <x-filament::badge color="success" class="ml-2">{{ __('Recommended') }}</x-filament::badge>
                        @endif
                    </span>
                    <x-filament::icon-button
                        icon="heroicon-o-clipboard-document"
                        color="gray"
                        size="sm"
                        x-on:click="navigator.clipboard.writeText('{{ addslashes($ds['record']) }}'); $tooltip('{{ __('Copied!') }}')"
                        :tooltip="__('Copy to clipboard')"
                    />
                </div>
                <code class="text-xs font-mono text-gray-600 dark:text-gray-400 break-all block bg-gray-100 dark:bg-gray-900 p-2 rounded">{{ $ds['record'] }}</code>
                @if(isset($ds['parsed']))
                    <div class="mt-3 grid grid-cols-2 sm:grid-cols-4 gap-2 text-xs">
                        <div>
                            <span class="text-gray-500 dark:text-gray-400">{{ __('Key Tag') }}:</span>
                            <span class="font-mono text-gray-700 dark:text-gray-300 ml-1">{{ $ds['parsed']['key_tag'] }}</span>
                        </div>
                        <div>
                            <span class="text-gray-500 dark:text-gray-400">{{ __('Algorithm') }}:</span>
                            <span class="font-mono text-gray-700 dark:text-gray-300 ml-1">{{ $ds['parsed']['algorithm'] }}</span>
                        </div>
                        <div>
                            <span class="text-gray-500 dark:text-gray-400">{{ __('Digest Type') }}:</span>
                            <span class="font-mono text-gray-700 dark:text-gray-300 ml-1">{{ $ds['parsed']['digest_type'] }}</span>
                        </div>
                        <div>
                            <span class="text-gray-500 dark:text-gray-400">{{ __('Digest') }}:</span>
                            <span class="font-mono text-gray-700 dark:text-gray-300 ml-1 truncate block" title="{{ $ds['parsed']['digest'] ?? '' }}">{{ Str::limit($ds['parsed']['digest'] ?? '', 12) }}</span>
                        </div>
                    </div>
                @endif
            </div>
        @endforeach
    </div>
    <div class="mt-4 p-3 bg-amber-50 dark:bg-amber-900/20 rounded-lg">
        <div class="flex items-start gap-2">
            <x-filament::icon icon="heroicon-o-information-circle" class="w-5 h-5 text-amber-500 shrink-0 mt-0.5" />
            <div class="text-sm text-amber-700 dark:text-amber-300">
                <p class="font-medium mb-1">{{ __('Important') }}</p>
                <p>{{ __('Add the DS record to your domain registrar (where you purchased the domain) to complete DNSSEC setup. DNS propagation may take up to 48 hours.') }}</p>
            </div>
        </div>
    </div>
@else
    <div class="text-center py-8 text-gray-500 dark:text-gray-400">
        <x-filament::icon icon="heroicon-o-exclamation-triangle" class="w-12 h-12 mx-auto mb-4 text-gray-400" />
        <p>{{ __('No DS records available.') }}</p>
        <p class="text-sm mt-2">{{ __('DNSSEC may not be properly configured for this domain.') }}</p>
    </div>
@endif