@extends('layouts.app')
@section('title', __('ui.edit_language'))
@section('page-label', __('ui.languages'))
@section('content')
<x-ui.form-shell
    :title="__('ui.edit_language').' · '.$language->name"
    :description="'Update language details, availability and text direction. '.$language->translations_count.' translations are currently stored.'"
    :breadcrumbs="[['label'=>__('ui.dashboard'),'url'=>route('dashboard')],['label'=>__('ui.administration')],['label'=>__('ui.languages'),'url'=>route('admin.languages.index')],['label'=>__('ui.edit')]]"
    narrow
>
    <form method="POST" action="{{ route('admin.languages.update', $language) }}" class="mf-form">
        @csrf
        @method('PUT')

        <x-ui.form-section :title="__('ui.language_settings')" description="Change the display name, locale code, text direction and availability.">
            <div class="mf-form-grid">
                <div class="mf-col-6">
                    <label class="mf-field-label" for="language_name">{{ __('ui.language_name') }}</label>
                    <input id="language_name" class="mf-input" name="name" value="{{ old('name', $language->name) }}" required>
                    @error('name')<p class="mf-field-error">{{ $message }}</p>@enderror
                </div>

                <div class="mf-col-6">
                    <label class="mf-field-label" for="native_name">{{ __('ui.native_name') }}</label>
                    <input id="native_name" class="mf-input" name="native_name" value="{{ old('native_name', $language->native_name) }}">
                    @error('native_name')<p class="mf-field-error">{{ $message }}</p>@enderror
                </div>

                <div class="mf-col-6">
                    <label class="mf-field-label" for="language_code">{{ __('ui.language_code') }}</label>
                    <input id="language_code" class="mf-input" name="code" value="{{ old('code', $language->code) }}" maxlength="15" required>
                    <p class="mf-field-help">Use a standard locale code such as sw, en, fr or ar.</p>
                    @error('code')<p class="mf-field-error">{{ $message }}</p>@enderror
                </div>

                <div class="mf-col-6">
                    <label class="mf-field-label" for="direction">{{ __('ui.text_direction') }}</label>
                    <select id="direction" class="mf-input" name="direction" required>
                        <option value="ltr" @selected(old('direction', $language->direction) === 'ltr')>{{ __('ui.left_to_right') }}</option>
                        <option value="rtl" @selected(old('direction', $language->direction) === 'rtl')>{{ __('ui.right_to_left') }}</option>
                    </select>
                    @error('direction')<p class="mf-field-error">{{ $message }}</p>@enderror
                </div>

                <div class="mf-col-12">
                    <label class="mf-option">
                        <input type="checkbox" name="is_active" value="1" @checked(old('is_active', $language->is_active)) @disabled($language->is_default)>
                        <span>
                            <span class="block font-medium">{{ __('ui.active') }}</span>
                            <span class="block text-xs text-muted-foreground">{{ $language->is_default ? 'The default language must remain active.' : 'Inactive languages remain stored but cannot be selected by users.' }}</span>
                        </span>
                    </label>
                </div>
            </div>
        </x-ui.form-section>

        <x-ui.form-actions>
            <a class="mf-btn" href="{{ route('admin.languages.index') }}">{{ __('ui.back_to_languages') }}</a>
            <a class="mf-btn" href="{{ route('admin.languages.translations', $language) }}">{{ __('ui.manage_translations') }}</a>
            <button class="mf-btn mf-btn-primary" type="submit">{{ __('ui.save_changes') }}</button>
        </x-ui.form-actions>
    </form>

    @unless($language->is_default)
        <div class="mt-5 border-t pt-4">
            <div class="flex flex-wrap items-center justify-between gap-3">
                <div>
                    <div class="text-sm font-medium">{{ __('ui.delete') }} {{ __('ui.language') }}</div>
                    <p class="mt-0.5 text-xs text-muted-foreground">Deleting this language also removes its saved translations.</p>
                </div>
                <form method="POST" action="{{ route('admin.languages.destroy', $language) }}" onsubmit="return confirm('Delete this language and all of its translations?')">
                    @csrf
                    @method('DELETE')
                    <button class="mf-btn" type="submit">{{ __('ui.delete') }}</button>
                </form>
            </div>
        </div>
    @endunless
</x-ui.form-shell>
@endsection
