@extends('layouts.app')
@section('title', __('Platform').' — '.config('platform.name', config('app.name')))
@section('page-title', __('Platform'))
@section('page-subtitle', __('Identity, branding & defaults that appear across the app.'))

@section('content')
@include('super-admin._nav')

<form method="POST" action="{{ route('super-admin.platform.update') }}" enctype="multipart/form-data" class="space-y-6">
    @csrf

    <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
        {{-- Identity --}}
        <section class="card card-pad lg:col-span-2 space-y-5">
            <div>
                <h2 class="text-base font-semibold">{{ __('Identity') }}</h2>
                <p class="text-sm text-slate-500 dark:text-slate-400">{{ __('How your platform is presented to users.') }}</p>
            </div>

            <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
                <div class="sm:col-span-2">
                    <label class="form-label">{{ __('Platform name') }}</label>
                    <input name="name" required value="{{ old('name', $settings['name'] ?? config('platform.name')) }}" class="form-input">
                    @error('name')<p class="form-error">{{ $message }}</p>@enderror
                </div>
                <div class="sm:col-span-2">
                    <label class="form-label">{{ __('Tagline') }}</label>
                    <input name="tagline" value="{{ old('tagline', $settings['tagline'] ?? config('platform.tagline')) }}" class="form-input" placeholder="{{ __('e.g. Multi-tenant SaaS') }}">
                </div>
                <div>
                    <label class="form-label">{{ __('Default language') }}</label>
                    <select name="default_locale" class="form-select">
                        @foreach($locales as $code)
                            <option value="{{ $code }}" @selected(old('default_locale', $settings['default_locale'] ?? config('platform.default_locale')) === $code)>{{ strtoupper($code) }}</option>
                        @endforeach
                    </select>
                </div>
            </div>
        </section>

        {{-- Logo & Favicon --}}
        <section class="card card-pad space-y-5">
            <div>
                <h2 class="text-base font-semibold">{{ __('Branding') }}</h2>
                <p class="text-sm text-slate-500 dark:text-slate-400">{{ __('Logo & favicon (PNG/SVG).') }}</p>
            </div>

            <div>
                <label class="form-label">{{ __('Logo') }}</label>
                <div class="flex items-center gap-4">
                    <div class="w-16 h-16 rounded-xl bg-slate-100 dark:bg-slate-800 ring-1 ring-slate-200 dark:ring-slate-700 flex items-center justify-center overflow-hidden shrink-0">
                        @if(!empty($settings['logo']))
                            <img src="{{ asset('storage/'.$settings['logo']) }}" class="w-full h-full object-contain">
                        @else
                            <span class="text-xs text-slate-400">{{ __('None') }}</span>
                        @endif
                    </div>
                    <div class="flex-1">
                        <input type="file" name="logo" accept="image/*" class="form-input !p-2 text-sm">
                        @if(!empty($settings['logo']))
                            <label class="mt-2 inline-flex items-center gap-2 text-xs text-rose-600">
                                <input type="checkbox" name="remove_logo" value="1"> {{ __('Remove') }}
                            </label>
                        @endif
                    </div>
                </div>
                @error('logo')<p class="form-error">{{ $message }}</p>@enderror
            </div>

            <div>
                <label class="form-label">{{ __('Favicon') }}</label>
                <div class="flex items-center gap-4">
                    <div class="w-10 h-10 rounded bg-slate-100 dark:bg-slate-800 ring-1 ring-slate-200 dark:ring-slate-700 flex items-center justify-center overflow-hidden shrink-0">
                        @if(!empty($settings['favicon']))
                            <img src="{{ asset('storage/'.$settings['favicon']) }}" class="w-full h-full object-contain">
                        @endif
                    </div>
                    <div class="flex-1">
                        <input type="file" name="favicon" accept="image/*" class="form-input !p-2 text-sm">
                        @if(!empty($settings['favicon']))
                            <label class="mt-2 inline-flex items-center gap-2 text-xs text-rose-600">
                                <input type="checkbox" name="remove_favicon" value="1"> {{ __('Remove') }}
                            </label>
                        @endif
                    </div>
                </div>
            </div>
        </section>
    </div>

    {{-- Contact --}}
    <section class="card card-pad space-y-5">
        <div>
            <h2 class="text-base font-semibold">{{ __('Contact') }}</h2>
            <p class="text-sm text-slate-500 dark:text-slate-400">{{ __('Used in emails, footer and legal pages.') }}</p>
        </div>

        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
            <div>
                <label class="form-label">{{ __('Phone') }}</label>
                <input name="phone" value="{{ old('phone', $settings['phone'] ?? '') }}" class="form-input" placeholder="+1 555 0100">
            </div>
            <div>
                <label class="form-label">{{ __('Email') }}</label>
                <input type="email" name="email" value="{{ old('email', $settings['email'] ?? '') }}" class="form-input" placeholder="hello@example.com">
            </div>
            <div class="sm:col-span-2">
                <label class="form-label">{{ __('Address') }}</label>
                <textarea name="address" rows="2" class="form-input">{{ old('address', $settings['address'] ?? '') }}</textarea>
            </div>
        </div>
    </section>

    <div class="flex items-center justify-end gap-2">
        <button type="submit" class="btn-primary">
            <x-icon name="check" class="w-4 h-4"/> {{ __('Save') }}
        </button>
    </div>
</form>
@endsection