@using Biskilog_Accounting.Shared.Interfaces
@using Biskilog_Accounting.Client.Pages.Auth.Components
@inject NavigationManager m_navigationManager
@layout AuthLayout
@inject HttpClient m_http
@inject ITokenService m_tokenService
@page "/login"

<section class="title-section">
    <a href="javascrivpt:void(0)">
        <img class="logo-image" src="../icon-512.png" alt="The logo of Biskilog pos" />
        <span>BISKILOG</span>
    </a>
</section>
<section class="form-section">
    <h2>Sign in</h2>
    <span style="font-family: sans-serif; color: rgb(141, 144, 150);">
        Enter your credentials to use <a href="javascrivpt:void(0)">Biskilog</a> accounting
    </span>
    <button type="button" class="sign-in-gbutton">
        <div style="display: inline-flex;">
            <img src="../assets/img/google-image.png" class="sign-in-gbutton-image" alt="Google logo" />
            <span class="sign-in-gbutton-title">Sign in with Google</span>
        </div>
    </button>
    <div class="line-styled-div">
        <span>OR</span>
    </div>
    <TabContainer />

    <hr style="margin-top: 15px; width: 320px; margin-bottom: 15px; color: #babec5; border-style: solid;" />
    <label class="policy-statement">
        By selecting Sign In or Sign in with Google, you agree to our <a href="#">Terms</a> and acknowledge our <a href="#">Privacy Statement</a>.
    </label>
    <div class="RecaptchaSignIn">
        Invisible reCAPTCHA by Google <a href="https://www.google.com/intl/en/policies/privacy/">Privacy Policy</a> and <a href="https://www.google.com/intl/en/policies/terms/">Terms of Use</a>.
    </div>
</section>