@extends('layouts.authapp')

@section('content')
<main class="container-fluid h-100">
        <div class="row h-100 overflow-auto">
            <div class="col-12 text-center mb-auto px-0">
                <header class="header">
                    <div class="row">
                        <div class="col-auto"></div>
                        <div class="col">
                            <div class="logo-small logo-header ">
                            <img src="{{ asset('assets/img/ALTIS_Logo-01-removebg-preview.png') }}" alt="" class="align-self-center text-center " width="100">
                            </div>
                        </div>
                      
                    </div>
                </header>
            </div>
            <div class="col-10 col-md-6 col-lg-5 col-xl-3 mx-auto align-self-center text-center py-4">
                <h1 class="mb-4 text-color-theme">Sign in</h1>
                <form class="was-validated needs-validation" method="POST" action="{{ route('login') }}">
                        @csrf
                    <div class="form-group form-floating mb-3 is-valid">
                        <input type="text" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required >
                        <label class="form-control-label" for="email">Username</label>
                    </div>
                    @error('email')
                    <span class="invalid-feedback d-block" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                    @enderror

                    <div class="form-group form-floating is-invalid mb-3">
                        <input type="password" class="form-control @error('password') is-invalid @enderror" id="password" placeholder="************" name="password" required>
                        <label class="form-control-label" for="password">Password</label>
                        <button type="button" class="text-danger tooltip-btn" data-bs-toggle="tooltip"
                            data-bs-placement="left" title="Enter valid Password" id="passworderror">
                            <i class="bi bi-info-circle"></i>
                        </button>
                    </div>
                    @error('password')
                    <span class="invalid-feedback d-block" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                    @enderror

                    <button type="submit" class="btn btn-lg btn-default w-100 mb-4 shadow">
                        Sign in
                    </button>
                </form>
                

            </div>
            
        </div>
    </main>
@endsection