@extends('layouts.admin', ['title' => 'إعدادات المتجر | RaseedNow'])

@section('content')
    <section class="lc-page-shell">
        <div class="surface p-6">
            <div class="section-heading">
                <div>
                    <span>Store settings</span>
                    <h1>إعدادات الهوية واللوجو</h1>
                </div>
                <a class="secondary-button" href="{{ route('admin.dashboard') }}">لوحة الإدارة</a>
            </div>

            @if(session('status'))
                <div class="mt-4 rounded-xl border border-emerald-200 bg-emerald-50 p-3 text-sm font-bold text-emerald-700">{{ session('status') }}</div>
            @endif

            @if($errors->any())
                <div class="mt-4 rounded-xl border border-red-200 bg-red-50 p-3 text-sm font-bold text-red-700">{{ $errors->first() }}</div>
            @endif

            <form method="POST" action="{{ route('admin.settings.update') }}" enctype="multipart/form-data" class="mt-6 grid gap-4 md:grid-cols-2">
                @csrf
                @method('PATCH')

                <label class="form-field">
                    <span>اسم المتجر عربي</span>
                    <input name="site_name_ar" value="{{ old('site_name_ar', $settings->site_name_ar) }}" required>
                </label>

                <label class="form-field">
                    <span>Store name English</span>
                    <input name="site_name_en" value="{{ old('site_name_en', $settings->site_name_en) }}" required>
                </label>

                <label class="form-field">
                    <span>رفع لوجو من الجهاز</span>
                    <input name="logo" type="file" accept="image/*">
                </label>

                <label class="form-field">
                    <span>مسار لوجو جاهز</span>
                    <input name="logo_path" value="{{ old('logo_path', $settings->logo_path) }}" placeholder="images/brand/raseednow-logo.png">
                </label>

                @if($settings->logo_path)
                    <div class="md:col-span-2 rounded-xl border border-[#dfe7e5] bg-white p-4">
                        <span class="mb-3 block text-sm font-bold text-[#475569]">اللوجو الحالي</span>
                        <img src="{{ asset($settings->logo_path) }}" alt="{{ $settings->site_name_ar }}" class="h-16 object-contain">
                    </div>
                @endif

                <div class="md:col-span-2 mt-2 border-t border-[#dfe7e5] pt-5">
                    <h2 class="text-xl font-black text-[#003d36]">روابط السوشيال في الفوتر</h2>
                    <p class="mt-1 text-sm font-bold text-[#64748b]">سيب أي خانة فاضية لو مش عايز تظهر في الفوتر.</p>
                </div>

                <label class="form-field">
                    <span>Facebook URL</span>
                    <input name="facebook_url" value="{{ old('facebook_url', $settings->facebook_url) }}" placeholder="https://facebook.com/your-page">
                </label>

                <label class="form-field">
                    <span>Instagram URL</span>
                    <input name="instagram_url" value="{{ old('instagram_url', $settings->instagram_url) }}" placeholder="https://instagram.com/your-page">
                </label>

                <label class="form-field">
                    <span>TikTok URL</span>
                    <input name="tiktok_url" value="{{ old('tiktok_url', $settings->tiktok_url) }}" placeholder="https://tiktok.com/@your-page">
                </label>

                <label class="form-field">
                    <span>YouTube URL</span>
                    <input name="youtube_url" value="{{ old('youtube_url', $settings->youtube_url) }}" placeholder="https://youtube.com/@your-channel">
                </label>

                <label class="form-field md:col-span-2">
                    <span>WhatsApp URL</span>
                    <input name="whatsapp_url" value="{{ old('whatsapp_url', $settings->whatsapp_url) }}" placeholder="https://wa.me/201000000000">
                </label>

                <button class="primary-button md:col-span-2" type="submit">حفظ إعدادات المتجر</button>
            </form>
        </div>
    </section>
@endsection