{% extends "layout_public.html.twig" %}

{% set company = guest.system_company %}

{% if settings.theme == 'dark' %}
    {% set logo_url =  company.logo_url_dark %}
{% else %}
    {% set logo_url =  company.logo_url %}
{% endif %}

{% block meta_title %}{{ 'Login'|trans }}{% endblock %}
{% block meta_description %}{{ 'Log in to manage your services, invoices, support tickets, and account details.'|trans }}{% endblock %}

{% block body_class %}page-login{% endblock %}
{% block body %}
<div class="container h-100">
    <div class="row h-75 justify-content-center align-items-center">
        <div class="col-md-6 col-lg-4">
            {% if settings.login_page_show_logo %}
                <div class="d-flex justify-content-center">
                    <a href="{{ settings.login_page_logo_url|default('/') }}" target="_blank" rel="noopener noreferrer">
                        <img class="my-4" height="50px" src="{{ logo_url }}" alt="{{ company.name }}"/>
                    </a>
                </div>
            {% endif %}
            <div class="card">
                <div class="card-body">
                    <h5 class="text-center m-4">{{ 'Login to Your Account'|trans }}</h5>
                    {{ render_widgets('client.page.login.form.before') }}
                    <form method="post" action="{{ 'client/login'|api_url(role: 'guest') }}" class="auth" {{ fb_api_form({redirect: redirect_uri|default('/')|url}) }}>
                        <div class="mb-3">
                            <label class="form-label" for="email">{{ 'Email'|trans }}</label>
                            <input class="form-control" id="email" type="email" placeholder="{{ 'Enter your email address'|trans }}" name="email" value="{{ request.email }}" required="required" autofocus>
                        </div>
                        <div class="mb-3">
                            <label class="form-label" for="password">{{ 'Password'|trans }}</label>
                            <input class="form-control" id="password" type="password" placeholder="{{ 'Enter your password'|trans }}" name="password" required="required">
                        </div>
                        <button type="submit" class="btn btn-primary w-100 mb-3">{{ 'Login'|trans }}</button>
                    </form>
                    {{ render_widgets('client.page.login.form.after') }}
                    {% if settings.show_password_reset_link or settings.show_signup_link %}
                        <div class="row">
                            {% if settings.show_signup_link %}
                                <div class="col">
                                    <a class="btn btn-outline-primary mb-2 w-100" href="{{ 'signup'|url }}">{{ 'Create Account'|trans }}</a>
                                </div>
                            {% endif %}
                            {% if settings.show_password_reset_link %}
                                <div class="col">
                                    <a class="btn btn-outline-primary mb-2 w-100" href="{{ 'password-reset'|url }}">{{ 'Forgot Password?'|trans }}</a>
                                </div>
                            {% endif %}
                        </div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}
