{% include 'header.twig' %}
<main>

<div class="smmspot-head">
<div class="smmspot-content" style="background-image: url(/assets/smmspot/assets/images/home/x8e2teldxfwxfuof_kzhick_gmmefm.png), linear-gradient(to right, #212529, #212529);background-size: cover;">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-8 col-12 d-none d-md-block">
<!--<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<lottie-player src="https://assets8.lottiefiles.com/packages/lf20_cctgy7u6.json"  background="transparent"  speed="2"  style="width: 600px; height: 600px;"  loop  autoplay></lottie-player>-->

<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<lottie-player src="https://assets3.lottiefiles.com/packages/lf20_rs2oai36.json"  background="transparent"  speed="1"  style="width: 600px; height: 600px;"  loop  autoplay></lottie-player>
</div>	  
<div class="col-lg-5">
<div class="card" style="background: #2f353a;"><div class="py-4 px-lg-3 px-4">
<div class="smmspot-big"></div>
<div class="smmspot-big-sp">
<div class="s-head s-3">
<div class="row align-items-center">
<div class="col-md-auto">
<div class="s-icon" style="font-size: 50px;width: 120px;">
<i class="fa fa-handshake"></i>
</div>
</div>
<div class="col-md col-12">
<h2>{{ lang['smmspot.login.welcome.text'] }} &nbsp; {{ site["site_name"] }}</h2>
<p style="color: #000;">{{lang['enter_username_password']}}</p>
</div>
</div>
</div>
<form   style="padding: 30px 50px 50px 50px;"  method="post" action="/">
    
      {% if errorText %}
											<div class="alert alert-dismissible alert-danger {% if site['rtl'] %} rtl-alert {% endif %}">
											  <button type="button" class="close" data-dismiss="alert">×</button>
											  {{ errorText }}
											</div>
										  {% endif %}

										  {% if successText %}
											<div class="alert alert-success alert-dismissible" role="alert">
											  <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
											  {{ successText }}
											</div>
										  {% endif %}
										  
<div class="form-group">
<div class="fga mb-4">
<label class="fla">{{ lang['smmspot.login.username.text'] }}</label>
<div class="fg">
<div class="fg-icon">
<i class="fas fa-user"></i>
</div>
<input type="text" class="fg-control" id="username" name="username" style="background: #212529;">
</div>
</div>
</div>
<div class="form-group">
<div class="fga mb-4">
<label class="fla">{{ lang['smmspot.login.password.text'] }}</label>
<div class="fg">
<div class="fg-icon">
<i class="fas fa-unlock-alt"></i>
</div>
<input type="password" class="fg-control" id="password" name="password" style="background: #212529;">
</div>
</div>
</div>
<div class="row mt-2">
<div class="col-6 py-2 mb-2">
<div class="form-check">
<input type="checkbox" class="form-check-input" name="remember" value="1" id="remember">
<label class="form-check-label" for="remember">{{ lang['smmspot.login.remember.text'] }}</label>
<span class="checkpoint"></span>
</div>
</div>
<div class="col-6 py-2 text-right">
<a href="/resetpassword" class="frgpass">{{ lang['smmspot.login.resetpassword.text'] }}</a>
</div>
</div>	
 {% if captcha %}
                                            <div class="row mt-2">
                                                <div class="g-recaptcha" data-sitekey="{{ captchaKey }}"></div>
                                            </div>
                                            {% endif %}


<input type="hidden" name="_csrf" value="pgtZF2ab4iV32GgtRcTRRfE5WsOPMCfCTq3hJOuTUC_uVDFBD9PWaQGrIHo__ON1yHIRibwBZfcp-pMVpNg8eg==">
<button class="btn btn-primary btn-xl btn-block mt-4">{{ lang['signin.title'] }}</button>
</form>  
</div>
</div>  
</div>  
<div class="smmspot-btns mt-5">
<div class="row align-items-center">
<div class="col-md-auto col-12 mb-4 mb-lg-0">
<div class="d-flex align-items-center">
<img src="/assets/smmspot/assets/images/crown.svg">
<h3>{{ lang['smmspot.login.dont.account.text'] }}</h3>
</div>
</div>
<div class="col-md-auto col-12 ps-5 mb-4 mb-lg-0">
<div class="reg-btn">
<a href="/signup" class="btn btn-primary btn-border">
<div class="mb-text"><span>{{ lang['signup.title'] }}</span> <i class="far fa-user-crown ps-3"></i></div>
</a>
</div>
</div>
</div>
</div>
</div>				
</div>
</div>
</div>
</div> 
        

     

        <section class="smmspot-section">
            
            <div class="container">
                <div class="row align-items-center">
                    
                    <div class="col-lg-5">
                        <h2 class="smmspot-hp-title mb-5">
                            {{ lang['smmspot.login.information.title1'] }}
                        </h2>
                        <div class="smmspot-hp-line"></div>
                        <p class="smmspot-hp-text">
                            {{ lang['smmspot.login.information.description1'] }} 
                        </p>
                        <div class="btns-container mt-5">
                            <div class="row">
                                <div class="col-md-auto col-12 mb-4 mb-lg-0">
                                    <a href="/services" class="btn btn-secondary  btn-block">
                                        {{ lang['smmspot.login.information.button1'] }}
                                    </a>
                                </div>			
                                <div class="col-md-auto col-12">
                                    <a href="/signup" class="btn btn-primary btn-border btn-block">
                                        {{ lang['signup.title'] }}
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                   <div class="col-lg-6 offset-lg-1 d-none d-md-block">
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<lottie-player src="https://assets3.lottiefiles.com/packages/lf20_ep20cd8e.json"  background="transparent"  speed="2"  style="width: 600px; height: 600px;"  loop  autoplay>
</lottie-player>
</div>
                </div>
            </div>
        </section><!-- ./smmspot-section -->
		
        <section class="smmspot-section">
            <div class="container">
                <div class="row align-items-center">
                   
                  <div class="col-lg-7">
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<lottie-player src="https://assets4.lottiefiles.com/packages/lf20_7fy2yzzs.json"  background="transparent"  speed="2"  style="width: 600px; height: 600px;"  loop  autoplay>
</lottie-player>
</div>

 <div class="col-lg-5">
                        <h2 class="smmspot-hp-title mb-5">
                            {{ lang['smmspot.login.information.title2'] }} 
                        </h2>
                        <div class="smmspot-hp-line"></div>
                        <p class="smmspot-hp-text">
                            {{ lang['smmspot.login.information.description2'] }}
                        </p>
                        <div class="btns-container mt-5">
                            <div class="row">
                                <div class="col-md-auto col-12 mb-4 mb-lg-0">
                                    <a href="/services" class="btn btn-block pl-0">
                                       {{ lang['smmspot.login.information.button2'] }}
                                    </a>
                                </div>			
                                <div class="col-md-auto col-12">
                                    <a href="/signup" class="btn btn-primary btn-border btn-block">
                                        {{ lang['signup.title'] }}
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section><!-- ./smmspot-section -->



        <section class="smmspot-section">
            <div class="container">
                <div class="smmspot-bbox mt-5">
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="hpbb-body">
                                <h2 class="smmspot-hp-title">{{ lang['smmspot.login.information.title3'] }}  </h2>
                                <p class="hpbb-text">{{ lang['smmspot.login.information.description3'] }}</p>
                                <div class="btns-container mt-5">
                                    <div class="row">
                                        <div class="col-md-auto col-12 mb-4 mb-lg-0">
                                            <a href="/services" class="btn btn-secondary   btn-border btn-block">
                                                {{ lang['smmspot.login.information.button3'] }}
                                            </a>
                                        </div>
                                        <div class="col-md-auto col-12">
                                            <a href="/signup" class="btn btn-block btn-primary">
                                                {{ lang['signup.title'] }}
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="hpbb-right  {{ custom_lang == 'ar' ? ' hpbb-left': ' '  }} ">
                       <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<lottie-player src="https://assets2.lottiefiles.com/packages/lf20_toofqbxc.json"  background="transparent"  speed="2"  style="width: 550px; height: 550px;"  loop  autoplay>
</lottie-player>
                    </div>
                </div>
            </div>
        </section><!-- ./smmspot-section -->

    </main>






{% for lang in site['languages'] %}
{% if lang['active'] %}
<script src="https://www.google.com/recaptcha/api.js?hl={{ lang['code'] }}"></script>
{% endif %}
{% endfor %}
{% include 'footer.twig' %}