@extends('layouts.admins.auth')

@section('page_content')
    <div class="min-h-screen bg-bg-pr py-12">
        <x-public.container>
            <div class="flex justify-center">
                <div class="max-w-md bg-bg-pr flex-1">
                    <div class="border border-fill-pr p-4 lg:p-8 rounded-xl">
                        <form action="{{ route('admin.auth.signin') }}" method="POST">
                            @csrf
                            <div class="block mb-4 lg:mb-8">
                                <h1 class="text-title-2 lg:text-title-1 tracking-tight leading-tight font-semibold font-display">
                                    {{ __('admin.signin') }}
                                </h1>
                                <p class="text-par-n text-lab-sc">
									{{ __('admin.signin-to-admin-panel', ['app_name' => config('app.name')]) }}
                                </p>
                            </div>
                            <div class="block">
                                <div class="mb-4">
                                    <x-forms.input name="email" labelText="{{ __('labels.email') }}" placeholder="{{ __('labels.email') }}"></x-forms.input>
                                </div>
                                <div class="mb-2">
                                    <x-forms.input type="password" name="password" labelText="{{ __('labels.password') }}" placeholder="{{ __('labels.password') }}"></x-forms.input>
                                </div>
                                <div class="mb-8">
									<p class="text-par-s text-lab-sc">
										{{ __('admin.signin-to-admin-panel-description') }}
									</p>
                                </div>
                                <div class="block">
									<x-forms.button width="w-full" text="{{ __('labels.sign-in-email') }}" classes="bg-brand-900 text-white w-full"></x-forms.button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </x-public.container>
    </div>
@endsection