<x-app-layout>
    <x-slot name="header">
        <div class="flex justify-between items-center">
            <div>
                <h2 class="font-semibold text-lg text-gray-800 dark:text-gray-200 leading-tight">
                    <i class="fas fa-tachometer-alt mr-2"></i>Editează Server: {{ $nameServer->name }}
                </h2>
                <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
                    <a href="{{ route('dashboard') }}" class="text-blue-600 dark:text-blue-400 hover:underline">Dashboard</a>
                    <span class="mx-2">/</span>
                    <a href="{{ route('admin.dashboard') }}" class="text-blue-600 dark:text-blue-400 hover:underline">Admin</a>
                    <span class="mx-2">/</span>
                    <a href="{{ route('admin.nameservers.index') }}" class="text-blue-600 dark:text-blue-400 hover:underline">Name Servers</a>
                    <span class="mx-2">/</span>
                    <span>Editare</span>
                </p>
            </div>
            <a href="{{ route('admin.nameservers.index') }}" class="text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200">
                <i class="fas fa-arrow-left mr-2"></i>Înapoi
            </a>
        </div>
    </x-slot>

    <div class="py-12">
        <div class="max-w-4xl mx-auto sm:px-6 lg:px-8">
            <form action="{{ route('admin.nameservers.update', $nameServer) }}" method="POST" class="space-y-6">
                @csrf
                @method('PUT')

                <!-- Informații Generale -->
                <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
                            <i class="fas fa-info-circle text-blue-500 mr-2"></i>
                            Informații Generale
                        </h3>

                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <div>
                                <label for="name" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Nume Server <span class="text-red-500">*</span>
                                </label>
                                <input type="text" name="name" id="name" value="{{ old('name', $nameServer->name) }}" required
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('name')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="hostname" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Hostname <span class="text-red-500">*</span>
                                </label>
                                <input type="text" name="hostname" id="hostname" value="{{ old('hostname', $nameServer->hostname) }}" required
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('hostname')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="ip_address" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    IP Address (IPv4) <span class="text-red-500">*</span>
                                </label>
                                <input type="text" name="ip_address" id="ip_address" value="{{ old('ip_address', $nameServer->ip_address) }}" required
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('ip_address')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="ipv6_address" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    IP Address (IPv6) <span class="text-gray-400">(opțional)</span>
                                </label>
                                <input type="text" name="ipv6_address" id="ipv6_address" value="{{ old('ipv6_address', $nameServer->ipv6_address) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('ipv6_address')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Configurare API -->
                <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
                            <i class="fas fa-plug text-green-500 mr-2"></i>
                            Configurare API
                        </h3>

                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <div class="md:col-span-2">
                                <label for="api_url" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    API URL <span class="text-gray-400">(opțional)</span>
                                </label>
                                <input type="url" name="api_url" id="api_url" value="{{ old('api_url', $nameServer->api_url) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('api_url')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div class="md:col-span-2">
                                <label for="api_key" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    API Key <span class="text-gray-400">(opțional)</span>
                                </label>
                                <input type="text" name="api_key" id="api_key" value="{{ old('api_key', $nameServer->api_key) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('api_key')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="api_type" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Tip API <span class="text-red-500">*</span>
                                </label>
                                <select name="api_type" id="api_type" required
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                    <option value="powerdns" {{ old('api_type', $nameServer->api_type) == 'powerdns' ? 'selected' : '' }}>PowerDNS</option>
                                    <option value="bind" {{ old('api_type', $nameServer->api_type) == 'bind' ? 'selected' : '' }}>BIND</option>
                                    <option value="custom" {{ old('api_type', $nameServer->api_type) == 'custom' ? 'selected' : '' }}>Custom</option>
                                </select>
                                @error('api_type')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="api_port" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Port API <span class="text-red-500">*</span>
                                </label>
                                <input type="number" name="api_port" id="api_port" value="{{ old('api_port', $nameServer->api_port) }}" required min="1" max="65535"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('api_port')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="server_id" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Server ID <span class="text-red-500">*</span>
                                    <span class="text-gray-400 font-normal text-xs ml-1">(identificator intern PowerDNS)</span>
                                </label>
                                <div class="relative">
                                    <input type="text" name="server_id" id="server_id" value="{{ old('server_id', $nameServer->server_id) }}" required
                                        class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600"
                                        placeholder="localhost">
                                    <div class="absolute inset-y-0 right-0 flex items-center pr-3">
                                        <button type="button" onclick="showServerIdInfo()" class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-300">
                                            <i class="fas fa-info-circle"></i>
                                        </button>
                                    </div>
                                </div>
                                @error('server_id')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                                <div class="mt-2 text-sm text-gray-600 dark:text-gray-400 space-y-1">
                                    <p><strong>Valori comune:</strong></p>
                                    <div class="grid grid-cols-1 gap-2 pl-4">
                                        <button type="button" onclick="setServerId('localhost')" class="text-left hover:text-indigo-600 dark:hover:text-indigo-400">
                                            • <code class="px-1 bg-gray-100 dark:bg-gray-700 rounded">localhost</code> - configurație standard PowerDNS
                                        </button>
                                        <button type="button" onclick="setServerId('{{ request()->getHost() }}')" class="text-left hover:text-indigo-600 dark:hover:text-indigo-400">
                                            • <code class="px-1 bg-gray-100 dark:bg-gray-700 rounded">{{ request()->getHost() }}</code> - hostname serverului curent
                                        </button>
                                        <button type="button" onclick="setServerId('pdns-server')" class="text-left hover:text-indigo-600 dark:hover:text-indigo-400">
                                            • <code class="px-1 bg-gray-100 dark:bg-gray-700 rounded">pdns-server</code> - nume custom server
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Geolocație & Provider -->
                <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
                            <i class="fas fa-globe text-purple-500 mr-2"></i>
                            Geolocație & Provider
                        </h3>

                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <div>
                                <label for="country_code" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Cod Țară
                                </label>
                                <input type="text" name="country_code" id="country_code" value="{{ old('country_code', $nameServer->country_code) }}" maxlength="2"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('country_code')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="city" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Oraș
                                </label>
                                <input type="text" name="city" id="city" value="{{ old('city', $nameServer->city) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('city')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="region" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Regiune/Continent
                                </label>
                                <select name="region" id="region"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                    <option value="">Selectează...</option>
                                    <option value="EU" {{ old('region', $nameServer->region) == 'EU' ? 'selected' : '' }}>Europa (EU)</option>
                                    <option value="NA" {{ old('region', $nameServer->region) == 'NA' ? 'selected' : '' }}>America de Nord (NA)</option>
                                    <option value="SA" {{ old('region', $nameServer->region) == 'SA' ? 'selected' : '' }}>America de Sud (SA)</option>
                                    <option value="AS" {{ old('region', $nameServer->region) == 'AS' ? 'selected' : '' }}>Asia (AS)</option>
                                    <option value="OC" {{ old('region', $nameServer->region) == 'OC' ? 'selected' : '' }}>Oceania (OC)</option>
                                    <option value="AF" {{ old('region', $nameServer->region) == 'AF' ? 'selected' : '' }}>Africa (AF)</option>
                                </select>
                                @error('region')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="provider" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Provider Hosting
                                </label>
                                <input type="text" name="provider" id="provider" value="{{ old('provider', $nameServer->provider) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('provider')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="datacenter" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Datacenter
                                </label>
                                <input type="text" name="datacenter" id="datacenter" value="{{ old('datacenter', $nameServer->datacenter) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('datacenter')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="latitude" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Latitudine
                                </label>
                                <input type="number" step="0.0000001" name="latitude" id="latitude" value="{{ old('latitude', $nameServer->latitude) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('latitude')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="longitude" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Longitudine
                                </label>
                                <input type="number" step="0.0000001" name="longitude" id="longitude" value="{{ old('longitude', $nameServer->longitude) }}"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('longitude')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Setări Avansate -->
                <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
                            <i class="fas fa-cog text-orange-500 mr-2"></i>
                            Setări Avansate
                        </h3>

                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <div class="flex items-center">
                                <!-- Câmp ascuns pentru a asigura trimiterea valorii 0 când checkbox-ul nu este bifat -->
                                <input type="hidden" name="is_active" value="0">
                                <input type="checkbox" name="is_active" id="is_active" value="1" {{ old('is_active', $nameServer->is_active) ? 'checked' : '' }}
                                    class="rounded border-gray-300 dark:border-gray-700 text-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                <label for="is_active" class="ml-2 text-sm text-gray-700 dark:text-gray-300">
                                    Server Activ
                                </label>
                            </div>

                            <div class="flex items-center">
                                <!-- Câmp ascuns pentru a asigura trimiterea valorii 0 când checkbox-ul nu este bifat -->
                                <input type="hidden" name="is_primary" value="0">
                                <input type="checkbox" name="is_primary" id="is_primary" value="1" {{ old('is_primary', $nameServer->is_primary) ? 'checked' : '' }}
                                    class="rounded border-gray-300 dark:border-gray-700 text-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                <label for="is_primary" class="ml-2 text-sm text-gray-700 dark:text-gray-300">
                                    Server Primar
                                </label>
                            </div>

                            <div>
                                <label for="priority" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Prioritate <span class="text-red-500">*</span>
                                </label>
                                <input type="number" name="priority" id="priority" value="{{ old('priority', $nameServer->priority) }}" required min="1" max="100"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('priority')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="weight" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Weight <span class="text-red-500">*</span>
                                </label>
                                <input type="number" name="weight" id="weight" value="{{ old('weight', $nameServer->weight) }}" required min="1"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('weight')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div>
                                <label for="max_zones" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Număr Maxim Zone DNS
                                </label>
                                <input type="number" name="max_zones" id="max_zones" value="{{ old('max_zones', $nameServer->max_zones) }}" min="1"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                @error('max_zones')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div class="md:col-span-2">
                                <label for="description" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Descriere
                                </label>
                                <textarea name="description" id="description" rows="3"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">{{ old('description', $nameServer->description) }}</textarea>
                                @error('description')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <div class="md:col-span-2">
                                <label for="notes" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Note Administrative
                                </label>
                                <textarea name="notes" id="notes" rows="2"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">{{ old('notes', $nameServer->notes) }}</textarea>
                                @error('notes')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Colectare Statistici DNS -->
                <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
                            <i class="fas fa-chart-bar text-purple-500 mr-2"></i>
                            Colectare Statistici DNS
                        </h3>

                        <div class="bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg p-4 mb-6">
                            <div class="flex items-start">
                                <i class="fas fa-info-circle text-blue-600 dark:text-blue-400 mt-1 mr-3"></i>
                                <p class="text-sm text-blue-700 dark:text-blue-300">
                                    Configurați modul în care Panel-ul colectează statisticile de query-uri DNS de pe acest nameserver.
                                    <a href="{{ route('admin.nameservers.query-logs-setup') }}" class="underline font-semibold">Vezi documentația completă</a>
                                </p>
                            </div>
                        </div>

                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <div class="md:col-span-2">
                                <label for="stats_method" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                    Metodă Colectare Statistici
                                </label>
                                <select name="stats_method" id="stats_method" onchange="toggleStatsMethodFields()"
                                    class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600">
                                    <option value="api" {{ old('stats_method', $nameServer->stats_method) == 'api' ? 'selected' : '' }}>
                                        📊 API (Python + Cron) - Recomandat
                                    </option>
                                    <option value="ssh" {{ old('stats_method', $nameServer->stats_method) == 'ssh' ? 'selected' : '' }}>
                                        🔐 SSH Direct - Panel citește log-urile direct
                                    </option>
                                    <option value="http" {{ old('stats_method', $nameServer->stats_method) == 'http' ? 'selected' : '' }}>
                                        🌐 HTTP (PHP + Web Server) - query-logs.php
                                    </option>
                                    <option value="none" {{ old('stats_method', $nameServer->stats_method) == 'none' ? 'selected' : '' }}>
                                        ❌ Dezactivat - fără statistici per-domeniu
                                    </option>
                                </select>
                                @error('stats_method')
                                    <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                @enderror
                            </div>

                            <!-- Câmpuri pentru SSH -->
                            <div id="ssh_fields" class="md:col-span-2 {{ old('stats_method', $nameServer->stats_method) == 'ssh' ? '' : 'hidden' }}">
                                <div class="bg-purple-50 dark:bg-purple-900/20 border border-purple-200 dark:border-purple-800 rounded-lg p-4 mb-4">
                                    <h4 class="font-semibold text-purple-800 dark:text-purple-200 mb-3">
                                        <i class="fas fa-terminal mr-2"></i>Configurare SSH
                                    </h4>
                                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                                        <div>
                                            <label for="ssh_user" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                                Utilizator SSH
                                            </label>
                                            <input type="text" name="ssh_user" id="ssh_user" value="{{ old('ssh_user', $nameServer->ssh_user ?? 'root') }}"
                                                class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600"
                                                placeholder="root">
                                            @error('ssh_user')
                                                <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                            @enderror
                                        </div>

                                        <div>
                                            <label for="ssh_port" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                                Port SSH
                                            </label>
                                            <input type="number" name="ssh_port" id="ssh_port" value="{{ old('ssh_port', $nameServer->ssh_port ?? 22) }}" min="1" max="65535"
                                                class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600"
                                                placeholder="22">
                                            @error('ssh_port')
                                                <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                            @enderror
                                        </div>

                                        <div>
                                            <label for="log_path" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                                Cale Log PowerDNS
                                            </label>
                                            <input type="text" name="log_path" id="log_path" value="{{ old('log_path', $nameServer->log_path ?? '/var/log/syslog') }}"
                                                class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600"
                                                placeholder="/var/log/syslog">
                                            @error('log_path')
                                                <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                            @enderror
                                        </div>

                                        <div class="md:col-span-3">
                                            <label for="ssh_key_path" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                                Cale Cheie SSH Privată <span class="text-gray-400 text-xs">(pe serverul Panel)</span>
                                            </label>
                                            <input type="text" name="ssh_key_path" id="ssh_key_path" value="{{ old('ssh_key_path', $nameServer->ssh_key_path ?? env('DNS_SSH_KEY_PATH', '')) }}"
                                                class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600"
                                                placeholder="/home/user/.ssh/paneldns_key sau C:\Users\User\.ssh\paneldns_key">
                                            @error('ssh_key_path')
                                                <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                            @enderror
                                            <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
                                                Lăsați gol pentru a folosi valoarea din .env (DNS_SSH_KEY_PATH)
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Câmpuri pentru HTTP -->
                            <div id="http_fields" class="md:col-span-2 {{ old('stats_method', $nameServer->stats_method) == 'http' ? '' : 'hidden' }}">
                                <div class="bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg p-4">
                                    <h4 class="font-semibold text-blue-800 dark:text-blue-200 mb-3">
                                        <i class="fas fa-globe mr-2"></i>Configurare HTTP (query-logs.php)
                                    </h4>
                                    <div>
                                        <label for="web_port" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                            Port Web Server (lighttpd)
                                        </label>
                                        <input type="number" name="web_port" id="web_port" value="{{ old('web_port', $nameServer->web_port ?? 8082) }}" min="1" max="65535"
                                            class="w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 focus:border-indigo-500 dark:focus:border-indigo-600 focus:ring-indigo-500 dark:focus:ring-indigo-600"
                                            placeholder="8082">
                                        @error('web_port')
                                            <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
                                        @enderror
                                        <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
                                            URL rezultat: http://{{ $nameServer->ip_address }}:<span id="web_port_preview">{{ $nameServer->web_port ?? 8082 }}</span>/query-logs.php
                                        </p>
                                    </div>
                                </div>
                            </div>

                            <!-- Info pentru API -->
                            <div id="api_fields" class="md:col-span-2 {{ old('stats_method', $nameServer->stats_method) == 'api' || !old('stats_method', $nameServer->stats_method) ? '' : 'hidden' }}">
                                <div class="bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg p-4">
                                    <h4 class="font-semibold text-green-800 dark:text-green-200 mb-2">
                                        <i class="fas fa-check-circle mr-2"></i>Metodă API (Recomandată)
                                    </h4>
                                    <p class="text-sm text-green-700 dark:text-green-300 mb-2">
                                        Instalați scriptul <code>parse-and-send.py</code> pe acest nameserver pentru a trimite automat statisticile la Panel.
                                    </p>
                                    <p class="text-sm text-green-700 dark:text-green-300">
                                        Scriptul folosește cheia API: <code class="bg-green-100 dark:bg-green-800 px-2 py-1 rounded text-xs">{{ config('services.dns_stats.receiver_key', 'Configurați DNS_STATS_RECEIVER_KEY în .env') }}</code>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Butoane -->
                <div class="flex items-center justify-end space-x-4">
                    <a href="{{ route('admin.nameservers.index') }}" class="px-6 py-3 bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 font-semibold rounded-lg hover:bg-gray-300 dark:hover:bg-gray-600 transition">
                        Anulează
                    </a>
                    <button type="submit" class="px-6 py-3 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold rounded-lg transition">
                        <i class="fas fa-save mr-2"></i>
                        Actualizează Server
                    </button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal Server ID Info -->
    <div id="serverIdModal" class="fixed inset-0 bg-black bg-opacity-50 hidden z-50 flex items-center justify-center">
        <div class="bg-white dark:bg-gray-800 rounded-lg max-w-md w-full mx-4 p-6">
            <div class="flex items-center justify-between mb-4">
                <h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100">
                    <i class="fas fa-info-circle text-blue-500 mr-2"></i>
                    Ce este Server ID?
                </h3>
                <button onclick="hideServerIdInfo()" class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-300">
                    <i class="fas fa-times"></i>
                </button>
            </div>
            <div class="space-y-3 text-sm text-gray-600 dark:text-gray-400">
                <p><strong>Server ID</strong> este identificatorul intern al serverului PowerDNS definit în configurația acestuia.</p>

                <div class="bg-gray-50 dark:bg-gray-700 p-3 rounded">
                    <p class="font-medium text-gray-800 dark:text-gray-200 mb-2">Valori tipice:</p>
                    <ul class="space-y-1">
                        <li>• <code class="px-1 bg-gray-200 dark:bg-gray-600 rounded">localhost</code> - configurația implicită</li>
                        <li>• <code class="px-1 bg-gray-200 dark:bg-gray-600 rounded">pdns-auth</code> - server authoritative</li>
                        <li>• <code class="px-1 bg-gray-200 dark:bg-gray-600 rounded">ns1</code> - nume custom</li>
                    </ul>
                </div>

                <p><strong>Important:</strong> Această valoare trebuie să corespundă cu <code>server-id</code> din configurația PowerDNS de pe serverul de destinație.</p>
            </div>
            <div class="mt-6 flex justify-end">
                <button onclick="hideServerIdInfo()" class="px-4 py-2 bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-200 rounded hover:bg-gray-300 dark:hover:bg-gray-600">
                    Înțeles
                </button>
            </div>
        </div>
    </div>

    <script>
        function setServerId(value) {
            document.getElementById('server_id').value = value;
            document.getElementById('server_id').focus();
        }

        function showServerIdInfo() {
            document.getElementById('serverIdModal').classList.remove('hidden');
            document.body.style.overflow = 'hidden';
        }

        function hideServerIdInfo() {
            document.getElementById('serverIdModal').classList.add('hidden');
            document.body.style.overflow = 'auto';
        }

        function toggleStatsMethodFields() {
            const method = document.getElementById('stats_method').value;

            // Hide all method-specific fields
            document.getElementById('ssh_fields').classList.add('hidden');
            document.getElementById('http_fields').classList.add('hidden');
            document.getElementById('api_fields').classList.add('hidden');

            // Show fields for selected method
            if (method === 'ssh') {
                document.getElementById('ssh_fields').classList.remove('hidden');
            } else if (method === 'http') {
                document.getElementById('http_fields').classList.remove('hidden');
            } else if (method === 'api') {
                document.getElementById('api_fields').classList.remove('hidden');
            }
        }

        // Update web port preview
        document.getElementById('web_port')?.addEventListener('input', function() {
            document.getElementById('web_port_preview').textContent = this.value || '8082';
        });

        // Close modal on escape key
        document.addEventListener('keydown', function(e) {
            if (e.key === 'Escape') {
                hideServerIdInfo();
            }
        });

        // Close modal when clicking outside
        document.getElementById('serverIdModal').addEventListener('click', function(e) {
            if (e.target === this) {
                hideServerIdInfo();
            }
        });
    </script>
</x-app-layout>
