<!DOCTYPE html>
<html lang="en"> 
<head>
    <title>@yield('title', 'Login')</title>
    
    <!-- Meta -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    <meta name="description" content="Login">
    <meta name="author" content="Xiaoying Riley at 3rd Wave Media">    
    <link rel="shortcut icon" href="favicon.ico"> 
    
    <!-- FontAwesome JS-->
    <script defer src="assets/plugins/fontawesome/js/all.min.js"></script>
    
    <!-- App CSS -->  
    <link id="theme-style" rel="stylesheet" href="assets/css/portal.css">

</head> 

<body class="app app-login p-0">    	
    <div class="row g-0 app-auth-wrapper">
	    <div class="col-12 col-md-7 col-lg-6 auth-main-col text-center p-5">
		    <div class="d-flex flex-column align-content-end">
			    <div class="app-auth-body mx-auto">	
				    <div class="app-auth-branding mb-4"><a class="app-logo" href="/"><img class="logo-icon me-2" src="assets/images/app-logo.svg" alt="logo"></a></div>
					<h2 class="auth-heading text-center mb-5">{{ env('APP_NAME') }}</h2>
			        <div class="auth-form-container text-start">

						<form class="auth-form login-form" method="post" action="/auth">
							
							@csrf

							<div class="email mb-3">
								<label class="sr-only" for="email">Email</label>
								<input id="email" name="email" type="email" class="form-control signin-email" placeholder="ellon@musk.com" required="required" autocomplete="off">
							</div><!--//form-group-->

							<div class="password mb-3">
								<label class="sr-only" for="password">Password</label>
								<input id="password" name="password" type="password" class="form-control signin-password" placeholder="******" required="required" autocomplete="off">
							</div><!--//form-group-->

							<div class="extra mb-3">
								<div class="form-check">
									<input class="form-check-input" type="checkbox" value="" id="whatsappInc" checked>
									<label class="form-check-label" for="whatsappInc" >
										Ao continuar, você concorda em seguir as regras do <a href="https://faq.whatsapp.com/361005896189245/?locale=pt_BR" target="_blank" class="app-link">WhatsApp</a>
									</label>
								</div>
							</div><!--//extra-->

							@if (session('error'))
								<div class="alert alert-danger">
									{{ session('error') }}
								</div>
							@endif

							@if (session('success'))
								<div class="alert alert-success">
									{{ session('success') }}
								</div>
							@endif

							<div class="text-center">
								<button type="submit" class="btn btn-success w-100 theme-btn mx-auto text-white">Autenticar</button>
								<a href="/register" class="btn w-50 mt-2 theme-btn mx-auto text-black">Cadastre-se</a>
							</div>

						</form>

						
						<hr class="divider my-2 mt-5">
						<h4 class="auth-option text-center">Ainda não tem uma conta na APIBrasil? <br /> <a class="text-link" href="https://app.apibrasil.io/auth/register" >Cadastrar-se</a> </h4>
						
					</div><!--//auth-form-container-->	

			    </div><!--//auth-body-->
		    
			    <footer class="app-auth-footer">
				    <div class="container text-center py-3">
				         <!--/* This template is free as long as you keep the footer attribution link. If you'd like to use the template without the attribution link, you can buy the commercial license via our website: themes.3rdwavemedia.com Thank you for your support. :) */-->
						<small class="copyright">
						Copyrigth &copy; {{ date('Y') }} <a class="app-link" href="{{ env('APP_URL') }}" target="_blank">{{ env('APP_NAME') }}</a>. All rights reserved.						
						</small>
					</div>
			    </footer><!--//app-auth-footer-->	
		    </div><!--//flex-column-->   
	    </div><!--//auth-main-col-->
	    <div class="col-12 col-md-5 col-lg-6 h-100 auth-background-col">
		    <div class="auth-background-holder">
		    </div>
		    <div class="auth-background-mask"></div>
		    <div class="auth-background-overlay p-3 p-lg-5">
			    <div class="d-flex flex-column align-content-end h-100">
				    <div class="h-100"></div>
				    <div class="overlay-content p-3 p-lg-4 rounded">
					    <h5 class="mb-3 overlay-title">Explore Portal Admin Template</h5>
					    <div>Portal is a free Bootstrap 5 admin dashboard template. You can download and view the template license <a href="https://themes.3rdwavemedia.com/bootstrap-templates/admin-dashboard/portal-free-bootstrap-admin-dashboard-template-for-developers/">here</a>.</div>
				    </div>
				</div>
		    </div><!--//auth-background-overlay-->
	    </div><!--//auth-background-col-->
    
    </div><!--//row-->


</body>
</html> 

