@extends('admin.layout')
@section('title', 'Ajustes de Inicio de Sesión OAuth')
@section('page-title', 'OAuth Giriş Ayarları (Google & Facebook)')

@section('content')
<div class="content-card">
    <p class="text-muted mb-4">
        Google ve Facebook ile giriş butonlarını etkinleştirmek için API anahtarlarınızı aşağıya girin.
        Alanları boş bırakırsanız mevcut değerler korunur. Anahtarları değiştirdiğinizde sayfa yenilenir ve yeni değerler hemen aktif olur.
    </p>

    @if (session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="bi bi-check-circle me-2"></i>{{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <form action="{{ route('admin.social-auth-settings.update') }}" method="POST">
        @csrf
        @method('PUT')

        {{-- Google --}}
        <div class="card mb-4">
            <div class="card-header d-flex align-items-center gap-2">
                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 48 48">
                    <path fill="#4285F4" d="M45.12 24.5c0-1.57-.14-3.08-.4-4.54H24v8.59h11.84c-.51 2.75-2.06 5.08-4.39 6.64v5.52h7.11c4.16-3.83 6.56-9.47 6.56-16.21z"/>
                    <path fill="#34A853" d="M24 46c5.94 0 10.92-1.97 14.56-5.33l-7.11-5.52c-1.97 1.32-4.49 2.1-7.45 2.1-5.73 0-10.58-3.87-12.32-9.07H4.34v5.7C7.96 41.07 15.4 46 24 46z"/>
                    <path fill="#FBBC05" d="M11.68 28.18A13.9 13.9 0 0 1 10.8 24c0-1.45.25-2.85.68-4.18v-5.7H4.34A23.93 23.93 0 0 0 .04 24c0 3.87.93 7.53 2.55 10.76l7.09-5.7.5-.88z" style="fill:#fbbc05"/>
                    <path fill="#EA4335" d="M24 10.75c3.23 0 6.13 1.11 8.41 3.29l6.31-6.31C34.91 4.18 29.93 2 24 2 15.4 2 7.96 6.93 4.34 14.12l7.34 5.7C13.42 14.62 18.27 10.75 24 10.75z"/>
                </svg>
                <span class="fw-semibold">Google OAuth</span>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Client ID</label>
                        <input
                            type="text"
                            class="form-control @error('google_client_id') is-invalid @enderror"
                            name="google_client_id"
                            value="{{ $settings['google_client_id'] ?? '' }}"
                            placeholder="123456789-xxxx.apps.googleusercontent.com"
                            autocomplete="off"
                        >
                        @error('google_client_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                        <small class="text-muted">Google Cloud Console → Kimlik Bilgileri → OAuth 2.0 İstemci Kimliği</small>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Client Secret</label>
                        <div class="input-group">
                            <input
                                type="password"
                                class="form-control @error('google_client_secret') is-invalid @enderror"
                                name="google_client_secret"
                                id="googleSecret"
                                value="{{ $settings['google_client_secret'] ?? '' }}"
                                autocomplete="new-password"
                                placeholder="{{ $settings['google_client_secret'] ? '••••••••••••••••' : 'Henüz girilmedi' }}"
                            >
                            <button class="btn btn-outline-secondary" type="button" onclick="toggleVisibility('googleSecret', this)">
                                <i class="bi bi-eye"></i>
                            </button>
                        </div>
                        @error('google_client_secret')
                            <div class="invalid-feedback d-block">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
                <div class="mt-3 p-3 bg-light rounded">
                    <small class="text-muted">
                        <strong>Callback URL:</strong>
                        <code>{{ config('app.url') }}/auth/google/callback</code>
                        — Bu URL'yi Google Cloud Console'daki "Yetkili yönlendirme URI'leri" listesine ekleyin.
                    </small>
                </div>
            </div>
        </div>

        {{-- Facebook --}}
        <div class="card mb-4">
            <div class="card-header d-flex align-items-center gap-2">
                <i class="bi bi-facebook text-primary fs-5"></i>
                <span class="fw-semibold">Facebook OAuth</span>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">App ID (Client ID)</label>
                        <input
                            type="text"
                            class="form-control @error('facebook_client_id') is-invalid @enderror"
                            name="facebook_client_id"
                            value="{{ $settings['facebook_client_id'] ?? '' }}"
                            placeholder="123456789012345"
                            autocomplete="off"
                        >
                        @error('facebook_client_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                        <small class="text-muted">Facebook Geliştiriciler → Uygulamanız → Uygulama Kimliği</small>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">App Secret (Client Secret)</label>
                        <div class="input-group">
                            <input
                                type="password"
                                class="form-control @error('facebook_client_secret') is-invalid @enderror"
                                name="facebook_client_secret"
                                id="fbSecret"
                                value="{{ $settings['facebook_client_secret'] ?? '' }}"
                                autocomplete="new-password"
                                placeholder="{{ $settings['facebook_client_secret'] ? '••••••••••••••••' : 'Henüz girilmedi' }}"
                            >
                            <button class="btn btn-outline-secondary" type="button" onclick="toggleVisibility('fbSecret', this)">
                                <i class="bi bi-eye"></i>
                            </button>
                        </div>
                        @error('facebook_client_secret')
                            <div class="invalid-feedback d-block">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
                <div class="mt-3 p-3 bg-light rounded">
                    <small class="text-muted">
                        <strong>Callback URL:</strong>
                        <code>{{ config('app.url') }}/auth/facebook/callback</code>
                        — Bu URL'yi Facebook Geliştiriciler → Uygulamanız → Facebook Girişi → Ayarlar → Geçerli OAuth Yönlendirme URI'leri bölümüne ekleyin.
                    </small>
                </div>
                <div class="mt-2 p-3 bg-light rounded">
                    <small class="text-muted">
                        <strong>Veri Silme Callback URL:</strong>
                        <code>{{ config('app.url') }}/auth/facebook/data-deletion</code>
                        — Facebook Geliştiriciler → Uygulamanız → Ayarlar → Gelişmiş → Veri Silme Talebi URL'si
                    </small>
                </div>
            </div>
        </div>

        {{-- Durum Bilgisi --}}
        <div class="card mb-4 border-info">
            <div class="card-header bg-info bg-opacity-10 text-info">
                <i class="bi bi-info-circle me-1"></i> Mevcut Durum
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-md-6">
                        <div class="d-flex align-items-center gap-2 mb-2">
                            @if($settings['google_client_id'] && $settings['google_client_secret'])
                                <span class="badge bg-success"><i class="bi bi-check-lg"></i> Google Aktif</span>
                            @else
                                <span class="badge bg-secondary"><i class="bi bi-x-lg"></i> Google Pasif</span>
                            @endif
                            <small class="text-muted">
                                @if($settings['google_client_id'])
                                    ID: <code>{{ substr($settings['google_client_id'], 0, 20) }}…</code>
                                @else
                                    Anahtar girilmemiş
                                @endif
                            </small>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="d-flex align-items-center gap-2 mb-2">
                            @if($settings['facebook_client_id'] && $settings['facebook_client_secret'])
                                <span class="badge bg-success"><i class="bi bi-check-lg"></i> Facebook Aktif</span>
                            @else
                                <span class="badge bg-secondary"><i class="bi bi-x-lg"></i> Facebook Pasif</span>
                            @endif
                            <small class="text-muted">
                                @if($settings['facebook_client_id'])
                                    ID: <code>{{ $settings['facebook_client_id'] }}</code>
                                @else
                                    Anahtar girilmemiş
                                @endif
                            </small>
                        </div>
                    </div>
                </div>
                <p class="text-muted small mb-0 mt-2">
                    <i class="bi bi-lightbulb me-1"></i>
                    Anahtarlar veritabanında şifresiz saklanır. Uygun güvenlik için sunucu düzeyinde şifreleme (Laravel Vault / Envoyer Secrets) önerilir.
                </p>
            </div>
        </div>

        <div class="d-flex gap-2">
            <button type="submit" class="btn btn-primary">
                <i class="bi bi-check2-circle me-1"></i> Kaydet
            </button>
            <a href="{{ route('admin.dashboard') }}" class="btn btn-outline-secondary">İptal</a>
        </div>
    </form>
</div>

<script>
function toggleVisibility(inputId, btn) {
    const input = document.getElementById(inputId);
    if (!input) return;
    const isPassword = input.type === 'password';
    input.type = isPassword ? 'text' : 'password';
    btn.innerHTML = isPassword ? '<i class="bi bi-eye-slash"></i>' : '<i class="bi bi-eye"></i>';
}
</script>
@endsection