@extends('admin.layouts.admin')

@section('title', 'Site Settings')

@section('content')

    <h1 class="text-lg font-semibold text-brand-ink lg:text-2xl lg:font-extrabold">Site Settings</h1>
    <p class="mt-1 text-brand-ink/65">Contact details and social links shown across the website.</p>

    <form method="POST" action="{{ route('admin.settings.update') }}" class="mt-8 space-y-8">
        @csrf
        @method('PUT')

        <div class="card border border-brand-green-200 grid grid-cols-1 gap-6 p-6 sm:grid-cols-2">
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">Phone Number</label>
                <input type="text" name="phone" value="{{ old('phone', $setting->phone) }}" placeholder="+91 00000 00000"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">WhatsApp Number</label>
                <input type="text" name="whatsapp" value="{{ old('whatsapp', $setting->whatsapp) }}" placeholder="91XXXXXXXXXX (with country code, no + or spaces)"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">Email Address</label>
                <input type="email" name="email" value="{{ old('email', $setting->email) }}"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">Address</label>
                <input type="text" name="address" value="{{ old('address', $setting->address) }}"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
        </div>

        <div class="card border border-brand-green-200 grid grid-cols-1 gap-6 p-6 sm:grid-cols-2">
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">Facebook URL</label>
                <input type="url" name="facebook_url" value="{{ old('facebook_url', $setting->facebook_url) }}"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">Instagram URL</label>
                <input type="url" name="instagram_url" value="{{ old('instagram_url', $setting->instagram_url) }}"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">YouTube URL</label>
                <input type="url" name="youtube_url" value="{{ old('youtube_url', $setting->youtube_url) }}"
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
            </div>
            <div>
                <label class="mb-1.5 block text-sm font-semibold text-brand-ink">Google Maps Embed URL</label>
                <input type="text" name="map_embed_url" value="{{ old('map_embed_url', $setting->map_embed_url) }}" placeholder="https://www.google.com/maps/embed?..."
                       class="w-full rounded-xl border border-brand-green-100 px-4 py-2.5 text-sm focus:border-brand-green-700 focus:outline-none focus:ring-1 focus:ring-brand-green-700">
                <p class="mt-1 text-xs text-brand-ink/65">In Google Maps: Share &rarr; Embed a map &rarr; copy the src="..." URL only.</p>
            </div>
        </div>

        <button type="submit" class="btn-primary">Save Settings</button>
    </form>

@endsection