@extends('front.layouts.login_layout')
@section('meta_title'){{ $index_meta->{'title_' . App::getLocale()} }}@stop
@section('meta_description'){{ $index_meta->{'description_' . App::getLocale()} }}@stop
@section('meta_keywords')
    {{ $index_meta->{'kewords_' . App::getLocale()} }}
@stop
@section('meta')
    <!-- Schema.org markup for Google+ -->
    <meta itemprop="name" content="{{ $index_meta->{'title_' . App::getLocale()} }}">
    <meta itemprop="description" content="{{ $index_meta->{'description_' . App::getLocale()} }}">
    <!-- Twitter Card data -->
    <meta name="twitter:card" content="site">
    <meta name="twitter:site" content="@publisher_handle">
    <meta name="twitter:title" content="{{ $index_meta->{'title_' . App::getLocale()} }}">
    <meta name="twitter:description" content="{{ $index_meta->{'description_' . App::getLocale()} }}">
    <!-- Twitter Card data -->
    <meta name="twitter:creator" content="@author_handle">
    <meta name="twitter:image" content="{{ url($index_meta->{'image_' . App::getLocale()}) }}">
    <!-- Open Graph data -->
    <meta property="og:title" content="{{ $index_meta->{'title_' . App::getLocale()} }}" />
    <meta property="og:description" content="{{ $index_meta->{'description_' . App::getLocale()} }}" />
    <!-- Schema.org markup for Google+ -->
    <meta itemprop="image" content="{{ url($index_meta->{'image_' . App::getLocale()}) }}">
    <!-- Open Graph data -->
    <meta property="og:type" content="og:site">
    <meta property="og:url" content="{{ route('home') }}">
    <meta property="og:image" content="{{ url($index_meta->{'image_' . App::getLocale()}) }}">
    <!-- Schema.org markup for Google+ -->
    <meta itemprop="name" content="{{ $index_meta->{'title_' . App::getLocale()} }}">
    <meta itemprop="description" content="{{ $index_meta->{'description_' . App::getLocale()} }}">
@endsection
@section('content')
    <section class="container-fluid auth-2-page-container">
        <!-- LOGIN FORM -->
        <div class="row">
            <div class="login-container col-lg-4 col-md-6 col-sm-12" id="loginForm">
                <div class="row logo-row">
                    <a href="{{ route('home') }}">
                        <img class="logo img-rounded" src="{{ url('front_layout/assets/imgs/logo.png') }}"
                            alt="60s Website Logo">
                    </a>
                </div>
                <div class="form-container mt-5 pt-lg-5 pt-md-5 pt-sm-4">
                    <form class="login-form mt-lg-5 mt-md-5 mt-sm-0">
                        <div class="form-head">
                            <h2 class="login-text mt-3 mb-3">{{ translate('Login') }}</h2>
                        </div>
                        <div class="sign-up-part mt-3 mb-3">
                            <span class="no-account fs-6">{{ translate('You dont have any account ?') }}</span>
                            <a href="{{ route('createShop') }}" class="sign-up-link fs-6 fw-normal" id="openSignup">
                                {{ translate('Signup Now') }}</a>
                        </div>
                        <div class="form-group mb-3">
                            <label for="email" class="visually-hidden"> {{ translate('Email address') }}</label>
                            <input type="email" class="form-control" id="email" placeholder="Email Address">
                            <div class="icon">
                                <img src="{{ url('front_layout/assets/imgs/mail-icon.png') }}" alt="">
                            </div>
                        </div>
                        <div class="form-group  mb-3">
                            <label for="loginPassword" class="visually-hidden"> {{ translate('Password') }}</label>
                            <input type="password" class="form-control" id="loginPassword" placeholder="Password">
                            <div class="icon">
                                <img src="{{ url('front_layout/assets/imgs/lock-icon.png') }}" alt="">
                            </div>
                        </div>
                        <div class="form-bottom mb-3 mt-2">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
                                <label class="form-check-label fs-7" for="flexCheckDefault">
                                    {{ translate('Remember Me') }}
                                </label>
                            </div>
                            <div class="forget-passowrd">
                                <a class="btn" href="/forget-password.html" id="forgetPasswordBtn">
                                    {{ translate('Forget Password?') }}</a>
                            </div>
                        </div>
                        <div class="large-btn-wrapper">
                            <button class="btn-primary btn mt-3 mb-3 text-white"> {{ translate('Login') }}</button>
                        </div>
                    </form>
                </div>
            </div>
            <div class="image-container col-lg-8 col-md-6 col-sm-12">
                <img class="bg" src="{{ url('front_layout/assets/imgs/auth-shapes-img.png') }}" alt="">
                <img class="logo" src="{{ url('front_layout/assets/imgs/logo-light-large.png') }}" alt="">
            </div>

        </div>
    </section>
@endsection
@section('modal')

@endsection
@section('script')

@endsection