@extends('layouts.app')

@section('title', 'Site Düzenle')

@section('content')
<div class="px-4 sm:px-6 lg:px-8">
    <div>
        <h1 class="text-3xl font-semibold text-gray-900 dark:text-gray-100 mb-6">Site Düzenle</h1>

        <form action="{{ route('sites.update', $site) }}" method="POST" class="bg-white dark:bg-gray-800 shadow-sm ring-1 ring-gray-900/5 dark:ring-gray-700/50 sm:rounded-xl md:col-span-2">
            @csrf
            @method('PUT')

            <div class="px-4 py-6 sm:p-8">
                <div class="grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
                    <div class="sm:col-span-6">
                        <label for="name" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            Site Adı <span class="text-red-500">*</span>
                        </label>
                        <input type="text" name="name" id="name" required value="{{ old('name', $site->name) }}" 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200" 
                            placeholder="Site adını girin">
                        @error('name')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-4">
                        <label for="url" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            URL <span class="text-red-500">*</span>
                        </label>
                        <input type="url" name="url" id="url" required value="{{ old('url', $site->url) }}" 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200" 
                            placeholder="https://example.com">
                        @error('url')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-2">
                        <label for="language" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-language"></i> Dil <span class="text-red-500">*</span>
                        </label>
                        <select name="language" id="language" required
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200 cursor-pointer">
                            <option value="" disabled {{ old('language', $site->language) ? '' : 'selected' }}>Dil Seçiniz</option>
                            @php
                                $languages = [
                                    'tr' => 'Türkçe',
                                    'en' => 'İngilizce',
                                    'de' => 'Almanca',
                                    'fr' => 'Fransızca',
                                    'es' => 'İspanyolca',
                                    'it' => 'İtalyanca',
                                    'ru' => 'Rusça',
                                    'ar' => 'Arapça',
                                    'zh' => 'Çince',
                                    'ja' => 'Japonca',
                                ];
                            @endphp
                            @foreach($languages as $code => $name)
                            <option value="{{ $code }}" {{ old('language', $site->language) === $code ? 'selected' : '' }}>
                                {{ $name }} ({{ strtoupper($code) }})
                            </option>
                            @endforeach
                        </select>
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>Site dilini seçin. Fiyat yönetimi sayfasında filtreleme için kullanılır.</span>
                        </p>
                        @error('language')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-2">
                        <label for="sector" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-industry"></i> Sektör <span class="text-red-500">*</span>
                        </label>
                        <select name="sector" id="sector" required
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200 cursor-pointer">
                            <option value="" disabled {{ old('sector', $site->sector) ? '' : 'selected' }}>Sektör Seçiniz</option>
                            @foreach(($sectors ?? []) as $sectorOption)
                            <option value="{{ $sectorOption }}" {{ old('sector', $site->sector) === $sectorOption ? 'selected' : '' }}>
                                {{ ucfirst($sectorOption) }}
                            </option>
                            @endforeach
                            @php
                                $currentSector = old('sector', $site->sector);
                            @endphp
                            @if($currentSector && $currentSector !== '__custom' && !collect($sectors ?? [])->contains($currentSector))
                            <option value="{{ $currentSector }}" selected>{{ ucfirst($currentSector) }}</option>
                            @endif
                            <option value="__custom" {{ old('sector', $site->sector) === '__custom' ? 'selected' : '' }}>Yeni Sektör Ekle</option>
                        </select>
                        <input type="text"
                            name="custom_sector"
                            id="custom_sector"
                            value="{{ old('custom_sector') }}"
                            class="mt-2 {{ old('sector', $site->sector) === '__custom' ? '' : 'hidden' }} block w-full rounded-lg border border-dashed border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2 text-sm text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20"
                            placeholder="Örn: health, finance">
                        @error('sector')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-2">
                        <label for="currency" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-dollar-sign"></i> Para Birimi <span class="text-red-500">*</span>
                        </label>
                        <select name="currency" id="currency" required
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200 cursor-pointer">
                            @php
                                $currencies = [
                                    'TRY' => 'Türk Lirası (₺)',
                                    'USD' => 'ABD Doları ($)',
                                    'EUR' => 'Euro (€)',
                                    'GBP' => 'İngiliz Sterlini (£)',
                                    'CHF' => 'İsviçre Frangı (CHF)',
                                    'JPY' => 'Japon Yeni (¥)',
                                    'CAD' => 'Kanada Doları (C$)',
                                    'AUD' => 'Avustralya Doları (A$)',
                                ];
                            @endphp
                            @foreach($currencies as $code => $name)
                            <option value="{{ $code }}" {{ old('currency', $site->currency ?? 'TRY') === $code ? 'selected' : '' }}>
                                {{ $name }}
                            </option>
                            @endforeach
                        </select>
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>Site para birimini seçin. Bu siteye ait tüm ürünler bu para birimini kullanır.</span>
                        </p>
                        @error('currency')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-2">
                        <label for="assigned_to" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            Atanan Geliştirici <span class="text-red-500">*</span>
                        </label>
                        <select name="assigned_to" id="assigned_to" required
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200 cursor-pointer">
                            <option value="" disabled {{ old('assigned_to', $site->assigned_to) ? '' : 'selected' }}>Geliştirici Seçiniz</option>
                            @foreach($developers as $developer)
                            <option value="{{ $developer->id }}" {{ old('assigned_to', $site->assigned_to) == $developer->id ? 'selected' : '' }}>{{ $developer->name }}</option>
                            @endforeach
                        </select>
                        @error('assigned_to')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-3">
                        <label for="status" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            Durum <span class="text-red-500">*</span>
                        </label>
                        <select name="status" id="status" required 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200 cursor-pointer">
                            <option value="active" {{ old('status', $site->status) === 'active' ? 'selected' : '' }}>Aktif</option>
                            <option value="inactive" {{ old('status', $site->status) === 'inactive' ? 'selected' : '' }}>Pasif</option>
                            <option value="maintenance" {{ old('status', $site->status) === 'maintenance' ? 'selected' : '' }}>Bakım</option>
                        </select>
                        @error('status')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6">
                        <label for="wp_cli_script" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            WP-CLI Script
                        </label>
                        <textarea name="wp_cli_script" id="wp_cli_script" rows="4" 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200 resize-y">{{ old('wp_cli_script', $site->wp_cli_script) }}</textarea>
                        @error('wp_cli_script')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    @if(isset($categories) && $categories->count() > 0)
                    <div class="sm:col-span-3">
                        <label class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-folder"></i> Kategoriler
                        </label>
                        <div class="space-y-2 max-h-40 overflow-y-auto border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 p-3">
                            @foreach($categories as $category)
                            <label class="flex items-center gap-2 cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-600 p-2 rounded transition">
                                <input type="checkbox" name="category_ids[]" value="{{ $category->id }}" 
                                    {{ in_array($category->id, old('category_ids', $site->categories->pluck('id')->toArray())) ? 'checked' : '' }}
                                    class="rounded border-gray-300 dark:border-gray-600 text-indigo-600 dark:text-indigo-400 focus:ring-indigo-500 dark:focus:ring-indigo-400 bg-white dark:bg-gray-700">
                                <div class="flex items-center gap-2 flex-1">
                                    <div class="h-4 w-4 rounded-full" style="background-color: {{ $category->color }};"></div>
                                    <span class="text-sm text-gray-900 dark:text-gray-100">{{ $category->name }}</span>
                                </div>
                            </label>
                            @endforeach
                        </div>
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400">
                            Siteyi kategorilere göre organize edin.
                        </p>
                    </div>
                    @endif

                    @if(isset($tags) && $tags->count() > 0)
                    <div class="sm:col-span-3">
                        <label class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-tags"></i> Etiketler
                        </label>
                        <div class="space-y-2 max-h-40 overflow-y-auto border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 p-3">
                            @foreach($tags as $tag)
                            <label class="flex items-center gap-2 cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-600 p-2 rounded transition">
                                <input type="checkbox" name="tag_ids[]" value="{{ $tag->id }}" 
                                    {{ in_array($tag->id, old('tag_ids', $site->tags->pluck('id')->toArray())) ? 'checked' : '' }}
                                    class="rounded border-gray-300 dark:border-gray-600 text-indigo-600 dark:text-indigo-400 focus:ring-indigo-500 dark:focus:ring-indigo-400 bg-white dark:bg-gray-700">
                                <div class="flex items-center gap-2 flex-1">
                                    <div class="h-4 w-4 rounded-full" style="background-color: {{ $tag->color }};"></div>
                                    <span class="text-sm text-gray-900 dark:text-gray-100">{{ $tag->name }}</span>
                                </div>
                            </label>
                            @endforeach
                        </div>
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400">
                            Siteye etiketler ekleyerek daha iyi organize edin.
                        </p>
                    </div>
                    @endif

                    <div class="sm:col-span-6">
                        <label for="api_secret" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-key"></i> GSP API Secret Key
                        </label>
                        <input type="text" name="api_secret" id="api_secret" value="{{ old('api_secret', $site->api_secret) }}" 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200" 
                            placeholder="GSP Connector eklentisi için API Secret Key">
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>WordPress'teki GSP Connector eklentisinde oluşturulan API Secret Key'i buraya girin. Bu key ile uzaktan ürün yönetimi yapılabilir.</span>
                        </p>
                        @error('api_secret')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6 border-t border-gray-200 dark:border-gray-700 pt-6 mt-2">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">
                            <i class="fas fa-wordpress"></i> WordPress REST API Yetkilendirme
                        </h3>
                        <p class="mb-4 text-sm text-gray-600 dark:text-gray-400">
                            Sayfa transferi ve WordPress standart REST API işlemleri için WordPress Application Password gereklidir.
                        </p>
                    </div>

                    <div class="sm:col-span-3">
                        <label for="wp_username" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-user"></i> WordPress Kullanıcı Adı
                        </label>
                        <input type="text" name="wp_username" id="wp_username" value="{{ old('wp_username', $site->wp_username) }}" 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200" 
                            placeholder="WordPress kullanıcı adı">
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>WordPress REST API erişimi için kullanılacak kullanıcı adı.</span>
                        </p>
                        @error('wp_username')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-3">
                        <label for="wp_application_password" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-lock"></i> WordPress Application Password
                        </label>
                        <input type="password" name="wp_application_password" id="wp_application_password" value="{{ old('wp_application_password', $site->wp_application_password) }}" 
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200" 
                            placeholder="Application Password">
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>WordPress > Kullanıcılar > Profil > Application Passwords bölümünden oluşturun.</span>
                        </p>
                        @error('wp_application_password')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6 border-t border-gray-200 dark:border-gray-700 pt-6 mt-2">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">
                            <i class="fas fa-terminal"></i> SSH Bağlantı Bilgileri
                        </h3>
                        <p class="mb-4 text-sm text-gray-600 dark:text-gray-400">
                            Blueprint klonlama ve WP-CLI komutlarını çalıştırmak için uzak sunucu erişim bilgilerini girin.
                        </p>
                    </div>

                    <div class="sm:col-span-3">
                        <label for="ssh_host" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-network-wired"></i> SSH Host
                        </label>
                        <input type="text" name="ssh_host" id="ssh_host" value="{{ old('ssh_host', $site->ssh_host) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="sunucu.domain.com">
                        @error('ssh_host')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-3">
                        <label for="ssh_user" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-user-shield"></i> SSH Kullanıcı
                        </label>
                        <input type="text" name="ssh_user" id="ssh_user" value="{{ old('ssh_user', $site->ssh_user) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="deploy">
                        @error('ssh_user')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-2">
                        <label for="ssh_port" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-door-open"></i> SSH Port
                        </label>
                        <input type="number" name="ssh_port" id="ssh_port" value="{{ old('ssh_port', $site->ssh_port ?? 22) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            min="1" max="65535">
                        @error('ssh_port')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-4">
                        <label for="ssh_path" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-folder-open"></i> Sunucu Dizini (Path)
                        </label>
                        <input type="text" name="ssh_path" id="ssh_path" value="{{ old('ssh_path', $site->ssh_path) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="/home/username/public_html/yeni-site">
                        @error('ssh_path')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6">
                        <label for="ssh_password" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-key"></i> SSH Parola (Opsiyonel)
                        </label>
                        <input type="password" name="ssh_password" id="ssh_password" value="{{ old('ssh_password', $site->ssh_password) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="Parola veya boş bırakın">
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>SSH anahtarınız tanımlıysa boş bırakabilirsiniz.</span>
                        </p>
                        @error('ssh_password')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6">
                        <label for="ssh_private_key_path" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-file-key"></i> SSH Private Key Yolu
                        </label>
                        <input type="text" name="ssh_private_key_path" id="ssh_private_key_path" value="{{ old('ssh_private_key_path', $site->ssh_private_key_path) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="C:\Users\Mahmut\.ssh\id_rsa_new">
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>Private key dosyasının tam yolu. Örnek: C:\Users\Mahmut\.ssh\id_rsa_new</span>
                        </p>
                        @error('ssh_private_key_path')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6">
                        <label for="ssh_private_key_passphrase" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-lock"></i> SSH Private Key Passphrase (Opsiyonel)
                        </label>
                        <input type="password" name="ssh_private_key_passphrase" id="ssh_private_key_passphrase" value="{{ old('ssh_private_key_passphrase', $site->ssh_private_key_passphrase) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="Passphrase varsa girin">
                        <p class="mt-1.5 text-xs text-gray-500 dark:text-gray-400 flex items-start">
                            <i class="fas fa-info-circle mr-1.5 mt-0.5"></i>
                            <span>Private key'inizde passphrase varsa buraya girin. Yoksa boş bırakın.</span>
                        </p>
                        @error('ssh_private_key_passphrase')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-6 border-t border-gray-200 dark:border-gray-700 pt-6 mt-2">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">
                            <i class="fas fa-user-cog"></i> WordPress Admin Bilgileri
                        </h3>
                        <p class="mb-4 text-sm text-gray-600 dark:text-gray-400">
                            Admin panelinden otomatik çekilen giriş bilgilerini burada görebilir veya güncelleyebilirsiniz.
                        </p>
                    </div>

                    <div class="sm:col-span-3">
                        <label for="wp_admin_login" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-user"></i> WP Admin Kullanıcı Adı
                        </label>
                        <input type="text" name="wp_admin_login" id="wp_admin_login" value="{{ old('wp_admin_login', $site->wp_admin_login) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="admin">
                        @error('wp_admin_login')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>

                    <div class="sm:col-span-3">
                        <label for="wp_admin_email" class="block text-sm font-semibold text-gray-900 dark:text-gray-100 mb-2">
                            <i class="fas fa-envelope"></i> WP Admin E-posta
                        </label>
                        <input type="email" name="wp_admin_email" id="wp_admin_email" value="{{ old('wp_admin_email', $site->wp_admin_email) }}"
                            class="block w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 px-4 py-2.5 text-gray-900 dark:text-gray-100 shadow-sm placeholder:text-gray-400 dark:placeholder:text-gray-500 focus:border-blue-500 dark:focus:border-blue-400 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-opacity-20 sm:text-sm transition-all duration-200"
                            placeholder="admin@example.com">
                        @error('wp_admin_email')
                        <p class="mt-2 text-sm text-red-600 dark:text-red-400 flex items-center">
                            <i class="fas fa-exclamation-circle mr-1"></i>{{ $message }}
                        </p>
                        @enderror
                    </div>
                </div>
            </div>

            <div class="flex items-center justify-end gap-x-6 border-t border-gray-900/10 dark:border-gray-700 px-4 py-4 sm:px-8">
                <a href="{{ route('sites.index') }}" class="text-sm font-semibold leading-6 text-gray-900 dark:text-gray-100">İptal</a>
                <button type="submit" class="rounded-md bg-blue-600 dark:bg-blue-500 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 dark:hover:bg-blue-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600 dark:focus-visible:outline-blue-400">
                    Güncelle
                </button>
            </div>
        </form>
    </div>
</div>
@endsection

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', () => {
    const sectorSelect = document.getElementById('sector');
    const customSectorInput = document.getElementById('custom_sector');

    if (!sectorSelect || !customSectorInput) {
        return;
    }

    const toggleCustomSector = () => {
        if (sectorSelect.value === '__custom') {
            customSectorInput.classList.remove('hidden');
            customSectorInput.required = true;
            customSectorInput.focus();
        } else {
            customSectorInput.classList.add('hidden');
            customSectorInput.required = false;
            if (customSectorInput.value && sectorSelect.value !== '__custom') {
                customSectorInput.value = '';
            }
        }
    };

    sectorSelect.addEventListener('change', toggleCustomSector);
    toggleCustomSector();
});
</script>
@endpush