@extends('customer.layout.main')
@section('css')
    <link rel="stylesheet" href="{{ asset('template/customer/css/style2.css') }}">
@endsection

@section('content')
    <section class="sign-in">
        <div class="container">
            <div class="signin-content">
                <div class="signin-image">
                    <figure><img src="{{ asset('template/customer/img/signin-image.jpg') }}" alt="sing up image"></figure>
                    <a href="{{ route('register.customer.form') }}" class="signup-image-link">Tạo tài khoản</a>
                </div>

                <div class="signin-form">
                    <h2 class="form-title text-primary">ĐĂNG NHẬP</h2>
                    <form method="POST" class="register-form" id="login-form">
                        @csrf
                        <div class="form-group">
                            <label for="email" class="@error('email') error @enderror"><i
                                    class="fa fa-envelope"></i></label>
                            <input type="text" name="email" id="email" placeholder="Nhập email" />
                            @error('email')
                                <div>
                                    <p class="message-error">
                                        {{ $message }}</p>
                                </div>
                            @enderror
                        </div>
                        <div class="form-group">
                            <label for="password" class="@error('password') error @enderror"><i
                                    class="fa fa-lock"></i></label>
                            <input type="password" name="password" id="password" placeholder="Nhập mật khẩu" />
                            @error('password')
                                <div>
                                    <p class="message-error">
                                        {{ $message }}</p>
                                </div>
                            @enderror
                        </div>
                        <div class="form-group d-flex align-items-center justify-content-between">
                            <input type="checkbox" name="remember" id="remember_me" style="width: 10%">
                            <label for="remember_me" class="no-style-label" style="width: 90%; margin-top: 6px">Ghi nhớ tài
                                khoản</label>
                        </div>
                        <div class="form-group form-button">
                            <input type="submit" name="signin" id="signin" class="form-submit" value="Đăng nhập" />
                        </div>
                    </form>
                    <div class="social-login">
                        <span class="social-label">Hoặc đăng nhập với</span>
                        <ul class="socials">
                            <li><a href="{{ route('auth.redirection', 'facebook') }}"><i
                                        class="display-flex-center zmdi zmdi-facebook"><svg style="width: 10px"
                                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
                                            <path
                                                d="M80 299.3V512H196V299.3h86.5l18-97.8H196V166.9c0-51.7 20.3-71.5 72.7-71.5c16.3 0 29.4 .4 37 1.2V7.9C291.4 4 256.4 0 236.2 0C129.3 0 80 50.5 80 159.4v42.1H14v97.8H80z" />
                                        </svg></i></a>
                            </li>
                            <li><a href="{{ route('auth.redirection', 'google') }}"><i
                                        class="display-flex-center zmdi zmdi-google"><svg style="width: 12px"
                                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 488 512">
                                            <path
                                                d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z" />
                                        </svg></i></a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection