<!DOCTYPE html>
{% for lang in site['languages'] %}
{% if lang['active'] %}
<html lang="{{ lang['code'] }}">
{% endif %}
{% endfor %}
<head>
  <base href="{{ site['url'] }}/">
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>{{ title }}</title>
  <meta name="keywords" content="{{ keywords }}">
  <meta name="description" content="{{ description }}">
  {% if site['favicon'] %}
    <link rel="shortcut icon" type="image/ico" href="{{ site['favicon'] }}" />
  {% endif %}

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
  
  
  <link rel="stylesheet" type="text/css" href="https://cdn.mypanel.link/j71eqe/8iijdhm9yzks1i1w.css">
					<link rel="stylesheet" type="text/css" href="../css/panel/1xpanel/q9jpaly92nnfra97.css">
					<link rel="stylesheet" type="text/css" href="https://cdn.mypanel.link/libs/bootstrap-datetimepicker/4.17.47/bootstrap-datetimepicker.min.css">
					<link rel="stylesheet" type="text/css" href="https://cdn.mypanel.link/css/font-awesome/css/all.min.css">
					<link rel="stylesheet" type="text/css" href="https://cdn.mypanel.link/global/29sz1jwqs2y1tscl.css">
		 		<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <link href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" rel="stylesheet">
  
    {{ headerCode }}


    
    <link rel="stylesheet" type="text/css" href="../css/panel/1xpanel/style.css">
   
	 <script src="/css/panel/smmgenie/cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.2/umd/popper.min.js"></script>

   
   
   <!-- end -->
	
  </head>

	{%  if settings['demo_mode'] == 1 %}
    	
       <style>
            .fixed-footer{
                position: fixed;
                background: #fff;
                border:1px solid #000;
                width:100%;
                bottom:0;
                z-index:99999;
                padding:10px;
            }
        </style>
        
    <div class="fixed-footer">
            <h4 style="color:#000">Choose Theme: 
                
                   {% for thm in site['themes'] %}
<a href="/select-theme/{{thm['dirname']}}" style="color:blue;margin:0 10px;font-size:16px">[ {{thm['name']}} ]</a>
{% endfor %}

            </h4>
    </div>
  
{% endif %}
 

{% if user['auth'] %}

<body class="dashboard ">
      <script>
         if (localStorage.getItem("darkMode") == null) {
             localStorage.setItem("darkMode", true);
             document.body.classList.add("dark");
         }
         else if (JSON.parse(localStorage.getItem('darkMode'))) {
             document.body.classList.add("dark");
             document.addEventListener("DOMContentLoaded", function() {
                 document.querySelector('#switch-theme-input').checked = true;
             });
         }
      </script>

      <header class="d-flex align-items-center px-xl-7 px-4 py-3">
        <button class="close-sidebar js-close-sidebar" style="display: block !important;">
                      <i class="ri-arrow-right-s-line"></i>
                  </button>
		<div class="header-msg">
							<h6 class="header-title">New order</h6>
			        </div>
         <div class="navbar ms-auto">

           <!-- <div class="nav-item currencyItem toggle-item ms-auto">
               <button class="toggle-head nav-link basket-drawer-toggle">
					<i class="ri-shopping-cart-2-line"></i>
                 	<span id="sepetsayi" style="display: none;"></span>
               </button>
            </div> -->
                       <div class="nav-item currencyItem toggle-item">
               <button class="toggle-head nav-link">
               		<i class="ri-earth-line"></i>
               </button>
               <div class="toggle-body" >
                  <div class="top d-flex align-items-center justify-content-between mb-3">
                     <div class="toggle-title ms-3">
                                                     Language
                                                </div>
                  </div>
                  <div class="currencyList" id="currencies-list" style="max-height: 250px; overflow-x: scroll">
				                        {% for lang in site['languages'] %}
				                         <a class="item d-flex align-items-center justify-content-start p-3 position-relative" onclick="changeLang('{{lang['code']}}')" >
                        <div class="content">
                           <div class="item-title mb-1 d-flex align-items-center justify-content-between">
                              <div class="name"><span class="cText">{{lang['name']}}</span></div>
                           </div>
                        </div>
                     </a>{% endfor %}
					        
					                  </div>
               </div>
            </div>
                       
                       <div class="nav-item currencyItem toggle-item">
               <button class="toggle-head nav-link">
               		<i class="ri-swap-line"></i>
               </button>
               <div class="toggle-body" >
                  <div class="top d-flex align-items-center justify-content-between mb-3">
                     <div class="toggle-title ms-3">
                                                     Currency
                                              </div>
                  </div>
                  <div class="currencyList" id="currencies-list" style="max-height: 250px; overflow-x: scroll">
				                         {% for curr in site['currencies'] %}
<a href="/cur?cur={{curr['id']}}" class="item d-flex align-items-center 
justify-content-start p-3 position-relative" href="javascript:void(0)">
    
                        <div class="content">
                           <div class="item-title mb-1 d-flex align-items-center justify-content-between">
                              <div class="name"> <!-- <span class="cSymbol">{{curr['symbol']}}</span> --> <span class="cText">{{curr['name']}}</span></div>
                           </div>
                        </div>
                     </a>{% endfor %}
					                    
					                  </div>
               </div>
            </div>
                      
            <div class="nav-item user-item toggle-item me-2">
               <div class="toggle-head nav-link">
                  <span id="named">{U}</span>
                  <span class="onlineDot"></span>
               </div>
               <div class="toggle-body">
                <!-- <div class="nav d-flex align-items-center">
                   <span>
     			   		<a style="border-bottom: 0; height: auto" class="norServices" onclick="norServices()">
                     						Platform mode
                     
                     </a>
                   		<a style="border-bottom: 0; height: auto" class="devServices" onclick="devServices()">
                     						Platform mode
                     
                     </a>		   
                   </span>
                   <span>
                  		 <i class="ri-checkbox-circle-line"></i>
                  		 <i class="ri-checkbox-circle-fill"></i>
                   </span>
                 </div> -->
                  <div class="nav">
                     <a class="item" role="button" href="/account">Account</a>
                  </div>
                  <div class="nav">
                     <a class="item logout" role="button" href="/logout"><i class="ri-shut-down-line pe-2"></i>     						Logout
                    </a>
                  </div>
               </div>
            </div>
         </div>
      </header>
      
      
       <script>
         const name = "{{ user['username'] }}"
         document.getElementById('named').innerHTML = name.substring(0, 1).toUpperCase()
       </script>
      
      
      <aside class="sidebar passive d-flex flex-column position-fixed flex-nowrap p-1 pt-4">
         <div class="d-flex sidebar-top justify-content-center align-items-center mb-3 w-100">
            <a class="logo flex-shrink-0" href="/">
				<img class="main-logo" src="{{ site['logo'] }}">
										<img src="{{ site['logo'] }}" class="main-logo-lg light" alt="{{ site["site_name"] }}">
					              			<img src="{{ site['logo'] }}" class="main-logo-lg dark" alt="{{ site["site_name"] }}">
            </a>
            <button class="close-sidebar js-close-sidebar d-block d-md-none">
				<i class="ri-close-line"></i>
            </button>
         </div>
		 
               <div class="nav nav-pills mb-auto mt-3 menu">
                  					<div  class="nav-item mb-2 active" >
                         <a {% if active_menu == "neworder" %} href="/"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/"   class="nav-link d-flex align-items-center p-3"> 
                       
                                                     <i class="ri-home-line"></i>
                                                     <span class="menu-text">New order</span>
                        </a>
                     </div>
                     
                   
                    
                  					<div   class="nav-item mb-2 " >
                        <a {% if active_menu == "orders" %} href="/orders"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/orders"   class="nav-link d-flex align-items-center p-3"> 
                                                     <i class="ri-archive-line"></i>
                                                     <span class="menu-text">My Orders</span>
                        </a>
                     </div>
                  					<div  class="nav-item mb-2" >
                          <a {% if active_menu == "services" %} href="/services"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/services"   class="nav-link d-flex align-items-center p-3"> 
                      
                                                     <i class="ri-file-list-3-line"></i>
                                                     <span class="menu-text">Services List</span>
                        </a>
                     </div>
                  					<div  class="nav-item mb-2" >
                    <a {% if active_menu == "addfunds" %} href="/addfunds"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/addfunds"   class="nav-link d-flex align-items-center p-3"> 
                      
                                                     <i class="ri-money-dollar-circle-line"></i>
                                                     <span class="menu-text">Add funds</span>
                        </a>
                     </div>
                  				<!--	<div  class="nav-item mb-2" >
                        <a href="/massorder"  class="nav-link d-flex align-items-center p-3"   >
                                                     <i class="ri-shopping-basket-2-line"></i>
                                                     <span class="menu-text">Mass order</span>
                        </a>
                     </div> -->
                  					<div  class="nav-item mb-2" >
                  	 <a {% if active_menu == "tickets" %} href="/tickets"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/tickets"   class="nav-link d-flex align-items-center p-3"> 
                   		                             <i class="ri-chat-1-line"></i>
                                                     <span class="menu-text">Support</span>
                        </a>
                     </div>
                  					<div  class="nav-item mb-2" >
                  	 <a {% if active_menu == "affiliates" %} href="/affiliates"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/affiliates"   class="nav-link d-flex align-items-center p-3"> 
                   	                              <i class="ri-link-unlink"></i>
                                                     <span class="menu-text">Affiliate Program</span>
                        </a>
                     </div>
                  					<div  class="nav-item mb-2" >
                  	 <a {% if active_menu == "child-panels" %} href="/child-panels"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/child-panels"   class="nav-link d-flex align-items-center p-3"> 
                   	                             <i class="ri-store-line"></i>
                                                     <span class="menu-text">Reseller Program</span>
                        </a>
                     </div>
                  			
                  					<div  class="nav-item mb-2" >
              <a {% if active_menu == "faq" %} href="/faq"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/faq"   class="nav-link d-flex align-items-center p-3"> 
                   	                              <i class="ri-questionnaire-line"></i>
                                                      <span class="menu-text">FAQ</span>
                        </a>
                     </div>
                  					<div  class="nav-item mb-2" >
                <a {% if active_menu == "api" %} href="/api"   class="nav-link d-flex align-items-center p-3 active"  {% endif %} href="/api"   class="nav-link d-flex align-items-center p-3"> 
                   	   	                           <i class="ri-code-box-line"></i>
                                                     <span class="menu-text">API</span>
                        </a>
                     </div>
                  				<!--	<div  class="nav-item mb-2" >
                        <a href="/updates"  class="nav-link d-flex align-items-center p-3"   >
                                                     <i class="ri-refresh-line"></i>
                                                     <span class="menu-text">Updates</span>
                        </a>
                     </div> -->
                   
               </div>
		 
		 
         <div class="border-top bottom pt-4">
            <input id="switch-theme-input" type="checkbox">
            <label class="switch-theme js-theme-switch d-flex" for="switch-theme-input">
               <div class="mode-light d-flex flex-fill align-items-center justify-content-center">
                  <div class="theme-icon">
                     <i class="ri-contrast-2-line"></i>
                  </div>
                  <div class="theme-text">
                    						Light
                                     </div>
               </div>
               <div class="mode-dark d-flex flex-fill align-items-center justify-content-center">
                  <div class="theme-icon">
                     <i class="ri-contrast-2-fill"></i>
                  </div>
                  <div class="theme-text">
                    						Dark
                                     
                  </div>
               </div>
            </label>
         </div>
      </aside>

	<div class="basket-overlay"></div>
	<div class="basket-drawer">
	  <div class="drawer-header">
		  <h3 class="drawer-header-title">
            				My Cart
                    
          </h3>
		<div class="basket-header-close">
		  <i class="ri-close-line"></i>
		</div>
	  </div>
		<div class="drawer-body topbar">
			<div class="sepetmodal">
				<div class="sepetbos" style="display: flex;">
					<i class="ri-shopping-bag-3-line"></i>
					<p>
                                              There are no orders in your cart.
                                           </p>
				</div>
						
				<div id="sepetListe">
				
				</div>

				<div id="sepetAlt">
					
				</div>
		  </div>
		</div>        
	</div>        
		
         
         
         
{% else %}
<body id="outside" class="dark ">
        <div id="header" class="headOut">
            <div class="b-menu-wrapper">
                <button class="b-menu-close" onclick="noAuthMenu()">
                    <i class="ri-close-line"></i>
                </button>
                <div class="container">
                    <div class="row row-btn align-items-center">
                        <div class="col-lg-auto d-none d-lg-block">
                            <div class="home-logo">
                              <a href="/">
																	<img src="{{ site["logo"] }}" height="45" alt="{{ site["site_name"] }}" title="">
								                              </a>
                            </div>
                        </div>
                      	<div class="col">
                       <div class="nav-item currencyItem toggle-item">
               <button class="toggle-head nav-link">
               		<i class="ri-earth-line outside-lang"></i>
               </button>
               <div class="toggle-body outside-toggle" >
                  <div class="currencyList" id="currencies-list">
				                          {% for lang in site['languages'] %}
				                         <a class="item d-flex align-items-center justify-content-start p-3 position-relative" onclick="changeLang('{{lang['code']}}')" >
                        <div class="content">
                           <div class="item-title mb-1 d-flex align-items-center justify-content-between">
                              <div class="name"><span class="cText">{{lang['name']}}</span></div>
                           </div>
                        </div>
                     </a>{% endfor %}
					                  </div>
               </div>
            </div>
                                    </div>
                        <div class="col text-center">
                            <ul class="nmenu">
							                                <li class="nmenu-item">
                                    <a href="/services"   class="nmenu-link" >
                                        Services
                                    </a>
                                </li>
							                                <li class="nmenu-item">
                                    <a href="/api"   class="nmenu-link" >
                                        API
                                    </a>
                                </li>
							                            </ul>
                        </div>
						<div class="row align-items-center">
							<div class="col-lg-auto col-6">
							  <a href="/" class="header-btn btn-100 without-icon">
								<span class="text">Sign in</span>
								<span class="icon">
								  <i class="ri-arrow-right-line icon-ri"></i>
								</span>
							  </a>
							</div>
							<div class="col-lg-auto col-6">
							  <a href="/signup" class="header-btn btn-100">
								<span class="text">Sign up</span>
								<span class="icon">
								  <i class="ri-arrow-right-line icon-ri"></i>
								</span>
							  </a>
							</div>
						  </div>
                    </div>
                </div>
            </div>
            <div class="sm-header">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col">
                            <a href="/">
																	<img src="{{ site["logo"] }}" height="45" alt="{{ site["site_name"] }}" title="">
								                            </a>
                        </div>
                                           	<div class="col-auto">
                       <div class="nav-item currencyItem toggle-item">
               <button class="toggle-head nav-link">
               		<i class="ri-earth-line outside-lang"></i>
               </button>
               <div class="toggle-body outside-toggle" >
                  <div class="currencyList" id="currencies-list" style="max-height: 250px; overflow-x: scroll">
				                     {% for lang in site['languages'] %}
				                         <a class="item d-flex align-items-center justify-content-start p-3 position-relative" onclick="changeLang('{{lang['code']}}')" >
                        <div class="content">
                           <div class="item-title mb-1 d-flex align-items-center justify-content-between">
                              <div class="name"><span class="cText">{{lang['name']}}</span></div>
                           </div>
                        </div>
                     </a>{% endfor %}        </div>
               </div>
            </div>
                                    </div>
                        <div class="col-auto">
                            <button class="menu-btn" onclick="noAuthMenu()">
                                <i class="ri-menu-line"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
		
{% endif %}


 
  		
<style>
    .cookie-overlay {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  background: #fff;
  z-index: 2051;
  line-height: 20px;
  font-size: 14px;
  border-radius: 6px;

  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);

  > div:first-child {
    width: 458px;
  }

  a {
    text-decoration: underline;
  }

  .close-cookies {
    cursor: pointer;
  }

  @damoe media-breakpoint-down(md) {
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 0;

    > div:first-child {
      width: auto;
    }
  }
}
</style>


<script>
    
    
      $('.langs-btn').hover(function(){
    $('.langs-btn-content').toggle();
  });
  
    $('.currency-btn').hover(function(){
    $('.currency-btn-content').toggle();
  });
  
   $('.theme-btn').hover(function(){
    $('.theme-btn-content').toggle();
  });
  
$(document).on('ready', function() {
  if (document.cookie.indexOf("accepted_cookies=") < 0) {
    $('.cookie-overlay').removeClass('d-none').addClass('d-block');
  }

  $('.accept-cookies').on('click', function() {
    document.cookie = "accepted_cookies=yes;"
    $('.cookie-overlay').removeClass('d-block').addClass('d-none');
  })

  // expand depending on your needs
  $('.close-cookies').on('click', function() {
    $('.cookie-overlay').removeClass('d-block').addClass('d-none');
  })
  

  
  
})
</script>


<script src="https://unpkg.com/wavesurfer.js"></script>

<script>


 $('.langs-btn').hover(function(){
    $('.langs-btn-content').toggle();
  });
  
    $('.currency-btn').hover(function(){
    $('.currency-btn-content').toggle();
  });
  
  
 function changeLang(newLang){
        $.ajax
        ({ 
            url: '/account/change_lang/',
            data: {lang: newLang},
            type: 'post',
            success: function(result)
            {
                
               location.href  = "";
            }
        });
    }
    
    var wavesurfer = WaveSurfer.create({
    container: '#waveform',
    waveColor: 'violet',
    progressColor: 'purple',
    mediaControls:true
});
wavesurfer.load('{{settings['music_url']}}');

wavesurfer.on('ready', wavesurfer.play.bind(wavesurfer));


</script>