@extends(getenv("THEME") . ".layouts.argo")

@php

    $config = DB::table("site_configs")->first();

@endphp

@section("content")

    <div class="container">

        <div class="row justify-content-center">

            <div class="col-md-8">

                <div class="card">
                    
                    <div class="card-header">

                        <div class="login-img">
                            
                            <img src="{{ asset("/storage/logo/$config->logo") }}" class="navbar-brand-img" alt="Logo">
                            
                        </div>
                        
                    </div>

                    @if(session("error"))

                        <div class="alert alert-danger text-center">{{ session("error") }}</div>

                    @endif
                    
                    <div class="card-body">

                        <form method="POST" action="{{ route("login") }}">

                            @csrf
                            
                            <div class="form-group row">

                                <label for="email" class="col-md-4 col-form-label text-md-right">Username / Email</label>
                                
                                <div class="col-md-6">

                                    <input id="email" type="text" class="form-control @error("email") is-invalid @enderror" name="email" value="{{ old("email") }}" required autocomplete="email" autofocus>
                                    
                                    @error("email")

                                        <span class="invalid-feedback" role="alert">
                                            
                                            <strong>{{ $message }}</strong>

                                        </span>

                                    @enderror

                                </div>

                            </div>
                            
                            <div class="form-group row">

                                <label for="password" class="col-md-4 col-form-label text-md-right">{{ __("Password") }}</label>
                                
                                <div class="col-md-6">

                                    <input id="password" type="password" class="form-control @error("password") is-invalid @enderror" name="password" required autocomplete="current-password">
                                    
                                    @error("password")

                                        <span class="invalid-feedback" role="alert">

                                            <strong>{{ $message }}</strong>

                                        </span>

                                    @enderror

                                </div>

                            </div>
                            
                            <div class="form-group row">

                                <div class="col-md-6 offset-md-4">

                                    <div class="form-check">

                                        <input class="form-check-input" type="checkbox" name="remember" id="remember" {{ old("remember") ? "checked" : "" }}>
                                        
                                        <label class="form-check-label" for="remember">

                                            {{ __("Remember Me") }}

                                        </label>

                                    </div>

                                </div>

                            </div>
                            
                            <div class="form-group row mb-0">

                                <div class="col-md-10 offset-md-2">

                                    <button type="submit" class="btn btn-default">Entrar</button>
                                    
                                    @if (Route::has("password.request"))

                                    <a class="btn btn-info" href="{{ route("password.request") }}">Esqueceu a senha?</a>
                                    
                                    @endif
                                    
                                    <a class="btn btn-warning" href="{{ route(getenv("THEME") . ".ramais.user") }}">Login como Usuário</a>

                                </div>

                            </div>

                        </form>

                        @if(getenv("THEME") == "vono")

                            <div class="d-flex flex-column align-items-center mt-3">

                                <p>Ou</p>

                                <a href="{{ route('login.google') }}" class="btn d-flex align-items-center justify-content-center border rounded shadow-sm py-2 px-3" style="background-color: #f1f3f4; text-decoration: none; gap: 10px; transition: background-color 0.2s ease;">

                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="24" height="24">

                                        <path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.54 2.58 30.18 0 24 0 14.64 0 6.63 5.64 2.56 13.81l7.98 6.19C12.23 14.04 17.63 9.5 24 9.5z"/>

                                        <path fill="#4285F4" d="M46.5 24.5c0-1.64-.15-3.22-.42-4.75H24v9.02h12.7c-.55 2.95-2.22 5.44-4.7 7.12l7.21 5.62C43.92 37.02 46.5 31.2 46.5 24.5z"/>

                                        <path fill="#FBBC05" d="M10.54 28.62a14.42 14.42 0 0 1-.78-4.62c0-1.6.28-3.14.78-4.62l-7.98-6.19A23.952 23.952 0 0 0 0 24c0 3.85.92 7.49 2.56 10.81l7.98-6.19z"/>

                                        <path fill="#34A853" d="M24 48c6.18 0 11.39-2.05 15.19-5.61l-7.21-5.62c-2 1.35-4.56 2.13-7.98 2.13-6.37 0-11.77-4.54-13.46-10.69l-7.98 6.19C6.63 42.36 14.64 48 24 48z"/>

                                    </svg>

                                    <span class="fw-semibold text-dark">Entrar com o Google</span>
                                </a>


                            
                            </div>

                        @endif

                    </div>

                </div>

            </div>

        </div>

    </div>

@endsection