<!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]-->
{{ headerCode }}
{% if user['lang'] == "ar" %}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-v4-rtl/4.6.0-1/css/bootstrap-rtl.min.css" integrity="sha512-+1C9xBCl0azgGjU6bIsATfB4XOQ0MSFduPs388NiyzwYt4nfelS72KSPSFZT338FjP7F3mMme2re8+gUJe2HZQ==" crossorigin="anonymous" />
{% endif %}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="/css/panel/smmgenie/cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css" integrity="sha512-wR4oNhLBHf7smjy0K4oqzdWumd+r5/+6QO/vDda76MW5iug4PT7v86FoEkySIJft3XA0Ae6axhIvHrqwm793Nw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="/css/panel/smmgenie/cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/js/fontawesome.min.js" integrity="sha512-PoFg70xtc+rAkD9xsjaZwIMkhkgbl1TkoaRrgucfsct7SVy9KvTj5LtECit+ZjQ3ts+7xWzgfHOGzdolfWEgrw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="/css/panel/smmgenie/cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css" integrity="sha512-6lLUdeQ5uheMFbWm3CP271l14RsX1xtx+J5x2yeIDkkiBpeVTNhTqijME7GgRKKi6hCqovwCoBTlRBEC20M8Mg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" type="text/css" href="/css/panel/smmgenie/cdn.mypanel.link/7o9f2j/p815mj75x8emy7k5.css">
<link rel="stylesheet" type="text/css" href="/css/panel/smmgenie/cdn.mypanel.link/7o9f2j/a5p4k3c05huzszo9.css">
<link rel="stylesheet" type="text/css" href="/css/panel/smmgenie/cdn.mypanel.link/libs/bootstrap-datetimepicker/4.17.47/bootstrap-datetimepicker.min.css">
<link rel="stylesheet" type="text/css" href="/css/panel/smmgenie/cdn.mypanel.link/css/font-awesome/css/all.min.css">
<link rel="stylesheet" type="text/css" href="/css/panel/smmgenie/cdn.mypanel.link/global/c3gyq3shygmabbke.css">
<script src="/css/panel/smmgenie/code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="/css/panel/smmgenie/cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.2/umd/popper.min.js"></script>
{# {% for style in styleList %}
<link rel="stylesheet" type="text/css" href="{{ style }}">
{% endfor %} #}
<link rel="stylesheet" type="text/css" href="/css/panel/smmgenie/style.css">
<!-- start -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.0/sweetalert.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.4.24/sweetalert2.all.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'] %}
<!--- start pop pap -->
<style>
.order-success-card {
width:380px;
background-color: #fff;
border-radius:10px;
position: fixed;
top:0;
left:50%;
padding:0 30px 30px;
color:#333;
transform: translate(-50%,-50%) scale(0.1);
visibility: hidden;
transition :transform 0.4s,top 0.4s;
box-shadow:0 20px 50px rgba(0,0,0,0.2);
z-index:9999;
font-family: 'Lobster', cursive;
}
.order-success-card-active {
visibility:visible;
top:50%;
transform: translate(-50%,-50%) scale(1);
}
.order-success-card img {
width:100px;
margin-top: -50px;
border-radius:50%;
box-shadow : 0 2px 5px rgba(0,0,0,0.2);
}
.order-success-card h2 {
font-size: 20px;
font-weight:500;
margin : 30px 0 10px;
text-align:center;
font-family: 'Lobster', cursive;
}
.order-success-card button {
width:100%;
margin-top:20px;
padding:10px 0;
background: #fe5a02;
outline:none;
border:0;
border-radius:6px;
font-size:18px;
cursor:pointer;
box-shadow : 0 5px 5px rgba(0,0,0,0.2);
}
.order-success-card .order-details p {
padding:10px;
}
.order-success-card .order-details .paid-amount {
float:left;
background-color: #b33af0;
padding : 4px;
border-radius: 4px;
margin-left:-10px;
}
.order-success-card .order-details .quantity {
float:right;
background-color:#1805a6;
padding : 4px;
border-radius: 4px;
margin-right:-10px;
}
.order-success-card .user-details {
padding:10px;
background: #fe5a02;
margin-top:25px;
border-radius: 4px;
}
</style>
<!--- end pop pap -->
<style>
.badge {
background-color: blue;
color: white;
padding: 4px 8px;
text-align: center;
border-radius: 5px;
}
</style>
<!-- <body class="dashboard-body {% if user['lang'] == 'ar' %} rtl-enable rtl{% endif %}"> -->
<body class="dashboard-body">
<script>
var app = document.getElementsByTagName("BODY")[0];
if (localStorage.lightMode == "dark") {
app.setAttribute("class", "dark");
}
</script>
<div class="app-container">
<div class="app-sidebar">
<div class="close-sidebar-btn" onclick="dashMenuToggle()">
<i class="fas fa-bars"></i>
</div>
<div class="sidebar-header">
<div class="sh-bg"></div>
<div class="app-logo">
<a target="_self" href="/">{% if site["logo"] %}
<img style="max-width:150px;" src="{{ site['logo'] }}" alt="" title="">
{% else %}<span style="text-transform: "><span style="font-size: 24px"><span style="letter-spacing: 1.0px"><span style="line-height: 60px"><strong style="font-weight: bold">{{ site["site_name"] }}</strong></span></span></span></span>{% endif %}</a>
</div>
<div class="app-user">
<div class="app-user-box">
<div class="app-user-img">
<a href="/">
<img src="img/smmgene/fastsmmbrand1.png">
</a>
</div>
<div class="app-user-info">
<h4 class="app-user-name"> {{ user['username'] }}
<img src="https://cdn.mypanel.link/08ed14/2behggr3l6cn74dd.png" width="16"/>
</h4>
<div class="app-user-blnce">{{ currency["symbol"] }} {{ (user["balance"]*currency["value"]) |round(2, 'floor') }}</div>
</div>
</div>
<ul class="list-inline">
<li class="list-inline-item">
<a href="/account">
<i class="fal fa-user-alt"></i>
</a>
</li>
<li class="list-inline-item">
<a href="/tickets">
<i class="fal fa-envelope-open"></i>
</a>
</li>
<li class="list-inline-item">
<a href="/logout">
<i class="fal fa-power-off"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="sidebar-content">
<ul class="sidebar-menu">
<li {% if active_menu == "addfunds" %} class="active" {% endif %}> <a class="menu-link " href="/addfunds" >
<i class="fas fa-wallet m-icon"></i>
<span class="menu-text">{{ lang['addfunds.title'] }}</span>
</a>
</li>
<!-- active icon-->
<li {% if active_menu == "neworder" %} class="active" {% endif %}> <a class="menu-link" href="/" >
<i class="fas fa-cart-plus m-icon"></i>
<span class="menu-text">{{ lang['neworder.title'] }}</span>
</a>
</li>
<li {% if active_menu == "massorder" %} class="active" {% endif %}> <a class="menu-link " href="/massorder" >
<i class="fas fa-ambulance m-icon"></i>
<span class="menu-text">Mass order</span>
</a>
</li>
<li {% if active_menu == "orders" %} class="active" {% endif %}> <a class="menu-link " href="/orders" >
<i class="far fa-box-heart m-icon"></i> <!-- <i class="fas fa-boxes m-icon"></i> -->
<span class="menu-text">{{ lang['orders.title'] }}</span>
</a>
</li>
<li {% if active_menu == "refill" %} class="active" {% endif %}> <a class="menu-link " href="/refill" >
<i class="far fa-recycle m-icon"></i> <!-- <i class="fas fa-boxes m-icon"></i> -->
<span class="menu-text">Refill</span>
</a>
</li>
<li {% if active_menu == "services" %} class="active" {% endif %}> <a class="menu-link " href="/services" >
<i class="fas fa-bars m-icon"></i>
<span class="menu-text">{{ lang['services.title'] }}</span>
</a>
</li>
<!-- <li {% if active_menu == "tickets" %} class="active" {% endif %}> <a class="menu-link " href="/tickets" >
<i class="fas fa-ticket-alt m-icon"></i>
<span class="menu-text">Tickets {% if(ticketCount> 0) %}
{{ ticketCount }}
{% endif %}</span>
</a>
</li> -->
<li {% if active_menu == "tickets" %} class="active" {% endif %}> <a class="menu-link " href="/tickets" >
<i class="fas fa-ticket-alt m-icon"></i>
<span class="menu-text">{{ lang['tickets.title'] }} {% if(ticketCount> 0) %} <span class="badge" style="background-color: #f0ad4e">{{ ticketCount }}</span>{% endif %}</span>
</a>
</li>
<li {% if active_menu == "api" %} class="active" {% endif %}> <a class="menu-link" href="/api" >
<i class="fas fa-code m-icon"></i>
<span class="menu-text">{{ lang['api.title'] }}</span>
</a>
</li>
{% if settings['coupon_code'] == 1 %}
<li {% if active_menu == "kupon" %} class="active" {% endif %}> <a class="menu-link" href="/kupon" >
<i class="far fa-box-full m-icon"></i>
<span class="menu-text">Cupon</span>
</a>
</li>{% endif %}
{% if settings['enable_transfer_funds'] == 1 %}
<li {% if active_menu == "transferfunds" %} class="active" {% endif %}>
<a href="/transferfunds" class="menu-link">
<i class="far fa-tachometer-alt-slowest m-icon"></i>
<span class="menu-text">{{ lang['transferfunds.title'] }}</span>
</a>
</li>
{% endif %}
{% if affiliates %}
<li {% if active_menu == "affiliates" %} class="active" {% endif %}> <a class="menu-link" href="/affiliates" >
<i class="fas fa-users m-icon"></i>
<span class="menu-text">{{ lang['affiliates.title'] }}</span>
</a>
</li> {% endif %}
{% if panelSelling %}
<li {% if active_menu == "child-panels" %} class="active" {% endif %}> <a class="menu-link" href="/child-panels" >
<i class="fas fa-store-alt m-icon"></i>
<span class="menu-text">{{ lang['childpanels.title'] }}</span>
</a>
</li> {% endif %}
<li {% if active_menu == "faq" %} class="active" {% endif %}> <a class="menu-link" href="/faq" >
<i class="fas fa-question m-icon"></i>
<span class="menu-text">{{ lang['faq.title'] }}</span>
</a>
</li>
<li {% if active_menu == "terms" %} class="active" {% endif %}> <a class="menu-link" href="/terms" >
<i class="fas fa-book m-icon"></i>
<span class="menu-text">{{ lang['terms.title'] }}</span>
</a>
</li>
<!-- <li {% if active_menu == "updates" %} class="active" {% endif %}>
<a href="/updates" class="menu-link" >
<i class="fas fa-bell m-icon"></i>
<span class="menu-text">Updates</span>
</a>
</li> -->
</ul>
</div>
</div>
<!-- end-->
<div class="app-header">
<div class="container-fluid">
<div class="row row-80">
<div class="col-auto align-self-center">
<div class="dash-menu-btn" onclick="dashMenuToggle()">
<i class="fal fa-bars"></i>
</div>
</div>
<div class="col d-inline-block d-md-none align-self-center text-center">
<div class="app-logo">
<a target="_self" href="/">{% if site["logo"] %}
<img style="max-width:150px;" src="{{ site['logo'] }}" alt="" title="">
{% else %}<span style="text-transform: "><span style="font-size: 15px"><span style="letter-spacing: 1.0px"><span style="line-height: 60px"><strong style="font-weight: bold">{{ site["site_name"] }}</strong></span></span></span></span>{% endif %}</a>
</div>
</div>
<div class="col col-100 d-none d-md-inline-block align-self-center">
<div class="d-flex justify-content-between align-items-center">
<!-- <div class="cursor_help" data-toggle="modal"
data-target="#exampleModal">
<h4 class="user_infos">{{lang['smmspot.neworder.status.title']}}: <strong> {# {% if user['spent'] >= 100000 %}
<p>{{ lang['smmspot.neworder.status.1'] }}</p>
{% elseif user['spent'] >= 8000 %}
<p>{{ lang['smmspot.neworder.status.2'] }}</p>
{% elseif user['spent'] >= 4000 %}
<p>{{ lang['smmspot.neworder.status.3'] }} </p>
{% else %}
<p>{{ lang['smmspot.neworder.status.4'] }} </p>
{% endif %} #}
Bronz
</strong>
</h4>
</div> -->
<div>
<h4 class="user_infos">
{{lang["smmspot.neworder.balance.spent.title"]}}: ≈ {{ currency["symbol"] }} {{ (user["spent"]*currency["value"]) |round(2, 'floor') }}
</h4>
</div>
<!-- <div class="cursor_help" data-toggle="modal"
data-target="#pointsModal">
<h4 class="user_infos">
Points: <span id="data_points">0.000</span> ≈ {{ currency["symbol"] }}<span id="data_balance">N/A</span>
</h4>
</div> -->
<div>
<h4 class="user_infos">
{{lang["smmspot.neworder.total.order.title"]}}: {{ordersCount}}
</h4>
</div>
</div>
</div>
<div class="col-auto align-self-center">
<a href="https://api.whatsapp.com/send/?phone=&text=Hi+&type=phone_number&app_absent=0" class="telegram_icon_top" target="_blank">
<i class="fab fa-whatsapp"></i>
</a>
<button class="darkmode" onclick="change_mode()">
<i class="fal fa-sun"></i>
<i class="fal fa-moon"></i>
</button>
<li class="dropdown dropdown-currencies currency_converter">
<a class="dropdown-toggle" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-usd-circle"></i>
</a>
<ul class="dropdown-menu" id="currencies-list">
<li>
{% for curr in site['currencies'] %}
<a href="/cur?cur={{curr['id']}}" >{{curr['name']}} </a>
{% endfor %}
</li>
</ul>
</li>
<li class="flag_lang">
<a class="dropdown-toggle" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-earth-asia"></i>
<ul class="dropdown-menu">
<li>
{% for lang in site['languages'] %}
<a href="#" onclick="changeLang('{{lang['code']}}')" >{{lang['name']}} </a>
{% endfor %}
</li>
</ul>
</a>
</li>
</div>
</div>
<!-- row -->
</div>
</div>
<!-- header -->
<!-- <nav class="mob-nav">
<ul class="mob-nav-link">
<li>
<a href="/services">
<i class="fal fa-tags"></i>
<span>{{ lang['services.title'] }}</span>
</a>
</li>
<li>
<a href="/addfunds">
<i class="fal fa-wallet"></i>
<span>{{ lang['addfunds.title'] }}</span>
</a>
</li>
<li>
<a href="/">
<i class="fal fa-edit"></i>
<span>{{ lang['neworder.title'] }}</span>
</a>
</li>
<li>
<a href="/orders">
<i class="fal fa-shopping-bag"></i>
<span>{{ lang['orders.title'] }}</span>
</a>
</li>
<li>
<a href="tickets">
<i class="fal fa-user-headset"></i>
<span>{{ lang['tickets.title'] }}</span>
</a>
</li>
</ul>
</nav> -->
<!-- header -->
{% else %}
<div class="header">
<div class="container">
<div class="row" style="height: 99px;">
<div class="col-auto align-self-center">
<div class="row">
<div class="col align-self-center">
<a target="_self" href="/">{% if site["logo"] %}
<img style="max-width:150px;" src="{{ site['logo'] }}" alt="" title="">
{% else %}<span style="text-transform: "><span style="font-size: 24px"><span style="letter-spacing: 1.0px"><span style="line-height: 60px"><strong style="font-weight: bold">{{ site["site_name"] }}</strong></span></span></span></span>{% endif %}</a>
</div>
</div>
</div>
<div class="col">
<div class="head-menu">
<div class="row">
<div class="col text-lg-right mmff">
<div class="header-menu">
<ul>
<li><a href="/services">Services</a></li>
<li><a href="/api">{{ lang['api.title'] }}</a></li>
</ul>
</div>
</div>
<div class="col-auto align-self-center mmff">
<a href="/signup" class="menu-btn">
<div class="mb-icon">
<i class="fas fa-user-circle"></i>
</div>
<div class="mb-text">Sign Up</div>
</a>
</div>
</div>
</div>
</div>
<div class="col-auto for-mobile align-self-center">
<div class="home-menu-btn px-3 py-4" onclick="homeMenuToggle()" style="color: #fff;">
<i class="fal fa-bars"></i>
</div>
</div>
</div>
</div>
</div>
<nav class="mob-nav">
<!-- <ul class="mob-nav-link">
<li>
<a href="/">
<i class="fal fa-sign-in-alt"></i>
<span>Sign in</span>
</a>
</li>
<li>
<a href="/services">
<i class="fal fa-tags"></i>
<span>Services</span>
</a>
</li>
<li>
<a href="/signup">
<i class="fal fa-user"></i>
<span>Sign Up</span>
</a>
</li>
</ul> -->
</nav>
{% 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;
}
@include 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>