@extends('backend.admin.layouts.app')


@section('content')
    <!-- content header -->
    <section class="content-header flex justify-between sm:px-3 md:px-section md:py-4">
        <div>
            <h2 class="text-skin-header font-medium"><a href="{{ route('admin.dashboard') }}">{{translation("Dashboard")}}</a> / <a
                    href="{{ route('admin.language.index') }}">{{translation("translation Setup")}}</a></h2>
        </div>
    </section>

    <section class="space-y-4 2xl:container 2xl:mx-auto">
        <section class="md:mx-section space-y-4 px-4 py-5 rounded-md  duration-500 ">

            <form action="{{ route('admin.language.update', $language->id) }}" method="POST" enctype="multipart/form-data">
                @csrf
                @method('PUT')
                <!-- coupon Settup -->
                <div class="rounded-md border shadow-md bg-skin-backend-content">
                    <!-- coupon setup haeder -->
                    <div>
                        <h1 class="font-semibold w-full py-3 px-4 border-b text-sm text-skin-backend-heading"><i class="fa-regular fa-comment-dots"></i>
                            {{ translation('Language Setup') }}</h1>
                    </div>
                    <!-- coupon setup body -->
                    <div class="flex-1 px-4 space-y-2 text-skin-backend-base mt-2">
                        <div class="flex-1 px-4 space-y-2 text-skin-base w-1/2 mt-2">
                            <div>
                                <label for="language-name"
                                    class="text-medium text-skin-header">{{ translation('Language Name') }}</label>
                                <input type="text" id="language-name" required name="name" value="{{$language->name}}"
                                    class="w-full bg-skin-backend-highlight rounded-md border border-gray-200 focus:border-gray-200 focus:ring-0"
                                    placeholder="language Name">
                            </div>
                        </div>
                        <div class="flex-1 px-4 space-y-2 text-skin-base w-1/2 mt-2">
                            <div>
                                <label for="language-code"
                                    class="text-medium text-skin-header">{{ translation('Language Code') }}</label>
                                <input type="text" id="language-code" required name="code" value="{{$language->code}}"
                                    class="w-full bg-skin-backend-highlight rounded-md border border-gray-200 focus:border-gray-200 focus:ring-0"
                                    placeholder="language code">
                            </div>
                        </div>
                        <div class="flex-1 px-4 space-y-2 text-skin-base w-1/2 mt-2">
                            <div>
                                <label for="is_rtl" class="text-medium text-skin-header">{{ translation('Is RTL') }}</label>
                                <select name="is_rtl" id=""
                                    class="ddss-select-with-search form-group focus:border:gray-400 border-gray-300 focus:outline-none focus:ring-0 rounded-md w-full">
                                    <option value="0" @selected($language->is_rtl == 0)>{{ translation('No') }}</option>
                                    <option value="1" @selected($language->is_rtl == 1)>{{ translation('Yes') }}</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="w-full flex justify-end gap-2 p-4">
                        <a href="{{ route('admin.language.index') }}"
                            class="px-4 py-2 bg-gray-100 text-skin-header font-medium rounded-md text-sm hover:bg-gray-200 transition-colors">{{ translation('Back') }}</a>
                        <button type="submit"
                            class="px-4 py-2 bg-skin-backend-button text-white font-medium rounded-md text-sm hover:bg-skin-backend-button-hover transition-colors">{{ translation('Submit') }}</button>
                    </div>
                </div>
            </form>
        </section>

    </section>
@endsection