@extends('layouts.admin')

@section('title', __('admin.integrations.title'))

@php
    $field = 'w-full rounded-lg border border-black/10 bg-white px-3 py-2 text-sm focus:border-brand focus:outline-none focus:ring-2 focus:ring-brand/20';
    $code = $field.' font-mono text-left';
    $label = 'mb-1 block text-sm font-semibold text-ink';
    $hint = 'mt-1 text-xs text-ink-soft/80';
@endphp

@section('content')
    <h1 class="text-2xl font-bold text-brand-deep">{{ __('admin.integrations.title') }}</h1>
    <p class="mt-2 max-w-3xl text-sm text-ink-soft">{{ __('admin.integrations.help') }}</p>

    <form method="POST" action="{{ lroute('admin.integrations.update') }}" class="mt-6 max-w-3xl space-y-6">
        @csrf
        @method('PUT')

        <section class="space-y-5 rounded-2xl bg-white p-6 shadow-sm ring-1 ring-black/5">
            <h2 class="text-base font-bold text-brand-deep">{{ __('admin.integrations.google') }}</h2>

            <div>
                <label for="google_site_verification" class="{{ $label }}">{{ __('admin.integrations.google_site_verification') }}</label>
                <input type="text" id="google_site_verification" name="google_site_verification" dir="ltr" value="{{ old('google_site_verification', $values->get('google_site_verification')) }}" class="{{ $field }}">
                <p class="{{ $hint }}">{{ __('admin.integrations.verification_hint') }}</p>
                @error('google_site_verification')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <div>
                <label for="google_tag_manager_id" class="{{ $label }}">{{ __('admin.integrations.google_tag_manager_id') }}</label>
                <input type="text" id="google_tag_manager_id" name="google_tag_manager_id" dir="ltr" placeholder="GTM-XXXXXXX" value="{{ old('google_tag_manager_id', $values->get('google_tag_manager_id')) }}" class="{{ $field }}">
                @error('google_tag_manager_id')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <div>
                <label for="google_analytics_id" class="{{ $label }}">{{ __('admin.integrations.google_analytics_id') }}</label>
                <input type="text" id="google_analytics_id" name="google_analytics_id" dir="ltr" placeholder="G-XXXXXXXXXX" value="{{ old('google_analytics_id', $values->get('google_analytics_id')) }}" class="{{ $field }}">
                <p class="{{ $hint }}">{{ __('admin.integrations.ga_hint') }}</p>
                @error('google_analytics_id')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>
        </section>

        <section class="space-y-5 rounded-2xl bg-white p-6 shadow-sm ring-1 ring-black/5">
            <h2 class="text-base font-bold text-brand-deep">{{ __('admin.integrations.other_verifications') }}</h2>

            <div>
                <label for="bing_site_verification" class="{{ $label }}">{{ __('admin.integrations.bing_site_verification') }}</label>
                <input type="text" id="bing_site_verification" name="bing_site_verification" dir="ltr" value="{{ old('bing_site_verification', $values->get('bing_site_verification')) }}" class="{{ $field }}">
                @error('bing_site_verification')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <div>
                <label for="facebook_domain_verification" class="{{ $label }}">{{ __('admin.integrations.facebook_domain_verification') }}</label>
                <input type="text" id="facebook_domain_verification" name="facebook_domain_verification" dir="ltr" value="{{ old('facebook_domain_verification', $values->get('facebook_domain_verification')) }}" class="{{ $field }}">
                @error('facebook_domain_verification')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <div>
                <label for="pinterest_site_verification" class="{{ $label }}">{{ __('admin.integrations.pinterest_site_verification') }}</label>
                <input type="text" id="pinterest_site_verification" name="pinterest_site_verification" dir="ltr" value="{{ old('pinterest_site_verification', $values->get('pinterest_site_verification')) }}" class="{{ $field }}">
                @error('pinterest_site_verification')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <div>
                <label for="yandex_verification" class="{{ $label }}">{{ __('admin.integrations.yandex_verification') }}</label>
                <input type="text" id="yandex_verification" name="yandex_verification" dir="ltr" value="{{ old('yandex_verification', $values->get('yandex_verification')) }}" class="{{ $field }}">
                @error('yandex_verification')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <p class="{{ $hint }}">{{ __('admin.integrations.verification_hint') }}</p>
        </section>

        <section class="space-y-5 rounded-2xl bg-white p-6 shadow-sm ring-1 ring-black/5">
            <h2 class="text-base font-bold text-brand-deep">{{ __('admin.integrations.custom_code') }}</h2>

            <div>
                <label for="custom_head_code" class="{{ $label }}">{{ __('admin.integrations.custom_head_code') }}</label>
                <textarea id="custom_head_code" name="custom_head_code" rows="5" dir="ltr" class="{{ $code }}">{{ old('custom_head_code', $values->get('custom_head_code')) }}</textarea>
                <p class="{{ $hint }}">{{ __('admin.integrations.custom_head_hint') }}</p>
                @error('custom_head_code')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>

            <div>
                <label for="custom_body_code" class="{{ $label }}">{{ __('admin.integrations.custom_body_code') }}</label>
                <textarea id="custom_body_code" name="custom_body_code" rows="5" dir="ltr" class="{{ $code }}">{{ old('custom_body_code', $values->get('custom_body_code')) }}</textarea>
                <p class="{{ $hint }}">{{ __('admin.integrations.custom_body_hint') }}</p>
                @error('custom_body_code')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
            </div>
        </section>

        <div class="flex items-center gap-3">
            <button type="submit" class="rounded-full bg-brand px-6 py-2.5 text-sm font-semibold text-white transition hover:bg-brand-deep">{{ __('admin.actions.save') }}</button>
        </div>
    </form>
@endsection