<!DOCTYPE html>
{# Get current language for HTML lang attribute #}
{% set current_lang = site['language']['code'] ? site['language']['code'] : 'ar' %}
<html lang="{{ current_lang }}" translate="no">
<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">

    {# Enhanced SEO meta tags #}
    <title>{{ title }}</title>

    {# Use site-level SEO data or page-specific SEO data #}
    {% if settings['site_keywords'] %}
    <meta name="keywords" content="{{ settings['site_keywords'] }}">
    {% endif %}

    {% if settings['site_description'] %}
    <meta name="description" content="{{ settings['site_description'] }}">
    {% endif %}

    {# Open Graph meta tags for social sharing #}
    <meta property="og:title" content="{{ title }}">
    {% if settings['site_description'] %}
    <meta property="og:description" content="{{ settings['site_description'] }}">
    {% endif %}
    <meta property="og:type" content="website">
    <meta property="og:url" content="{{ site['url'] }}">
    {% if settings['site_logo'] %}
    <meta property="og:image" content="{{ settings['site_logo'] }}">
    {% endif %}

    {# Twitter Card meta tags #}
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="{{ title }}">
    {% if settings['site_description'] %}
    <meta name="twitter:description" content="{{ settings['site_description'] }}">
    {% endif %}
    {% if settings['site_logo'] %}
    <meta name="twitter:image" content="{{ settings['site_logo'] }}">
    {% endif %}

    {# Language and localization #}
    <meta name="language" content="{{ current_lang }}">
    <link rel="canonical" href="{{ site['url'] }}">

    {% if site['favicon'] %}
    <link rel="shortcut icon" type="image/ico" href="{{ site['favicon'] }}" />
    {% endif %}


<link rel="stylesheet" type="text/css" href="https://amazingcdn.cc/css/panel/DarkMint/8ynwy6flztnl19hs.css">
					<link rel="stylesheet" type="text/css" href="https://amazingcdn.cc/css/panel/DarkMint/ki543rr5tdmeqgfh.css">
					<link rel="stylesheet" type="text/css" href="https://amazingcdn.cc/css/panel/DarkMint/bootstrap-datetimepicker.min.css">
					<link rel="stylesheet" type="text/css" href="https://storage.perfectcdn.com/css/font-awesome/css/all.min.css">
					<link rel="stylesheet" type="text/css" href="https://amazingcdn.cc/css/panel/DarkMint/w1ak29btsbdhu8s0.css">
					<link rel="stylesheet" type="text/css" href="https://amazingcdn.cc/css/panel/DarkMint/cao32di3zo8u7xgq.css">




<style>
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap');
body{ font-family:'Tajawal', sans-serif !important; }
</style>


      <style>
.navbar-inverse .navbar-nav>li>a {
    font-size: 12px !important;
}
#block_36 .component_private_sidebar .component-sidebar__menu-item-active .component-sidebar__menu-item-link {
    color: rgb(255 255 255) !important;
}
.sidebar-block__left-menu .component-sidebar__menu-item-link {
    display: flex; /* يجعل النص والأيقونة على نفس السطر */
    align-items: center; /* يجعل النص والأيقونة متساويين عموديًا */
    gap: 10px; /* مسافة بين الأيقونة والنص */
    padding: 10px; /* مساحة داخلية لكل عنصر */
    text-decoration: none; /* إزالة التسطير */
    color: #ffffff; /* لون النص */
    transition: background-color 0.3s ease; /* تأثير ناعم لتغيير اللون */
}

.sidebar-block__left-menu .component-sidebar__menu-item-link:hover {
    background-color: #1b57ef; /* لون الخلفية عند التمرير */
    border-radius: 5px; /* حواف دائرية */
    color: #ffffff; /* لون النص عند التمرير */
}
{% if user['lang'] == "ar" %}
* {
direction: rtl !important;
text-align: right;
}
#block_82 .sidebar-block__left {
position: inherit;
}
.select2-container .select2-selection__icon {
margin-left: 6px;
}
.navbar-nav .dropdown-menu {
right: 0;
}
#block_61 .sidebar-block__left {
right: 0 !important;
}
#block_61 .sidebar-block__top {
left: 0 !important;
right: auto !important;
}



.sidebar-block__left {
    direction: rtl;
    text-align: right;
    right: 0 !important;
    left: auto !important;
    position: fixed; /* إذا كنت تريد القائمة ثابتة */
    width: 250px; /* تأكد من ضبط العرض */
}

.sidebar-block__left .component-sidebar__menu {
    direction: rtl;
    text-align: right;
    
}


img {
    
    margin-left: 5px !important;
}

input#search_services_field {
    padding-right: 35px !important;
}
.navbar.navbar-default.navbar-inverse.navbar-static-top .sidebar-block__top {
    left: 0;
    right: auto !important;
}

.navbar.navbar-default.navbar-inverse.navbar-static-top .component-navbar-collapse {
    margin-right: auto;
    margin-left: 0 !important;
}


/* تغيير حجم النص في النافبار */
.navbar-nav .nav-item .component-navbar-nav-link {
    font-size: 16px; /* حجم النص */
    font-weight: 600; /* سمك النص */
        display: flex; /* يجعل النص والأيقونة على نفس السطر */
    align-items: center; /* يجعل النص والأيقونة متساويين عموديًا */
    gap: 5px; /* مسافة بين الأيقونة والنص */
    padding: 5px; /* مساحة داخلية لكل عنصر *
}

/* تغيير حجم النص في اللوجو */
.component-navbar-brand a {
    font-size: 18px; /* حجم النص */
    font-weight: 700; /* سمك النص */
}

/* تغيير حجم النص في الأزرار والعناصر الجانبية */
.navbar-toggler {
    font-size: 14px;
}

.navbar-burger {
    font-size: 14px;
}

/* تغيير حجم النص داخل القائمة الجانبية */
.navbar-nav-sidebar-menu .nav-item .component-navbar-nav-link {
    font-size: 17px; /* حجم النص */
    font-weight: 500; /* سمك النص */
}

/* تغيير حجم النص في البادجات (مثل عدد التذاكر) */
.badge {
    font-size: 12px;
    font-weight: bold;
}

{% endif %}

      </style>
</head>
<body>
{% if user['auth'] %}
			<nav class="navbar navbar-default navbar-inverse navbar-static-top ">
				<div class="container-fluid">
					<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ site['url'] }}">
{% if site["logo"] %}
<img src="{{ site['logo'] }}" alt="" title="">
{% else %}
<span style="font-weight:700;">
{{ site["site_name"] }}
</span>
{% endif %}
</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-left-block">

{% for page in pagesInformation %}

{% set page_get = page["page_get"] %}
{% set page_icon = page["page_icon"] %}


<li {% if isPageActive("#{page_get}") %} class="active" {% endif %}>

<a href="{{ site['url'] }}/{{page_get}}">
<span>
<i class="{{ page_icon }}"></i>
</span>

{% set custom_page = page["custom_page"] %}
{% set page_name = page["page_name"] %}
{% if custom_page == 1 %}
{{ lang["#{page_get}.title"] }}
{% else %}
{{page_name}}
{% endif %}

{% if page_get == "tickets" %}
{% if ticketCount %}
<span class="badge">{{ ticketCount }}
</span>
{% endif %}
{% endif %}
</a>

</li>


{% endfor %}


</ul>


<ul class="nav navbar-nav navbar-right navbar-right-block">


{% if user["access"]["admin_access"] %}

<li class="nav-item component-navbar-nav-item component-navbar-private-nav-item">
<a class="component-navbar-nav-link  component-navbar-nav-link__navbar-private" href="{{ site['url'] }}/admin">
<i class="fas fa-user-shield"></i>

</a>
</li>
{% endif %}

{% if settings["currency_converter"] == 1 %}

<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<span class="language-icon-span"></span>
<span class="language-name-span">{{user['user_pref_curr']}}</span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu dropdown-max-height">
{% for currency in currencies %}
<li>
<a class="dropdown-item" href="{{ site['url'] }}?user_pref_curr={{currency['currency_name']}}">{{currency['currency_name']}}</a>
</li>


{% endfor %}

</ul>
</li>
{% endif %}

<li>
<a>
<span class="badge">

{{convert_currency(user['balance'])}}
</span>
</a>
</li>
{% if pagesData[13]["page_status_auth"] == 2 %}
<li {% if active_menu == "account" %} class="active" {% endif %}>
<a href="account">
<span>
<i class="{{ pagesData[13]["page_icon"]}}"></i>
</span>
{{ lang['account.title'] }}</a>
</li>
{% endif %}
<li>
<a href="logout">{{ lang['logout.title'] }}</a>
</li>
</ul>
</div>

</div>
</nav>
{% else %}
<nav class="navbar navbar-default navbar-inverse navbar-static-top ">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ site['url'] }}">
{% if site["logo"] %}
<img src="{{ site['logo'] }}" alt="" title="">
{% else %}
<span style="font-weight:700;">
{{ site["site_name"] }}
</span>
{% endif %}
</a>
</div>

<div id="navbar" class="collapse navbar-collapse">
{% if site['languages']|length > 1 %}
<ul class="nav navbar-nav navbar-left-block">
<li class="dropdown">
{% for lang in site['languages'] %}
{% if lang['active'] %}
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
{{ lang['name'] }}
<span class="caret"></span>
</a>
{% endif %}
{% endfor %}
<ul class="dropdown-menu dropdown-max-height">
{% for lang in site['languages'] %}
<li {% if lang['active'] %} class="active" {% endif %}>
<a href="{{ site['url'] }}?lang={{ lang['code'] }}">{{ lang['name'] }}</a>
</li>
{% endfor %}
</ul>
</li>
</ul>
{% endif %}
<ul class="nav navbar-nav navbar-right navbar-right-block">

{% for page in pagesInformation %}

{% if page["page_status_non_auth"] == 2 %}
{% set page_get = page["page_get"] %}
{% set page_icon = page["page_icon"] %}


<li class="{% if isPageActive(" #{page_get}") %} active {% endif %}">
<a href="{{ site['url'] }}/{{page_get}}">

<span style="margin-right:4px;" class="{{ page_icon }}"></span>


{% set custom_page = page["custom_page"] %}
{% set page_name = page["page_name"] %}
{% if custom_page == 1 %}
{{ lang["#{page_get}.title"] }}
{% else %}
{{page_name}}
{% endif %}


</a>
</li>

{% endif %}
{% endfor %}

<li></li>

{% if routess["0"] == "services" %}
{% if settings["currency_converter"] == 1 %}

<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<span class="language-icon-span"></span>
<span class="language-name-span">{{guest_pref_curr}}</span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu dropdown-max-height">
{% for currency in currencies %}
<li>
<a class="dropdown-item" href="{{ site['url'] }}?user_pref_curr={{currency['currency_name']}}">{{currency['currency_name']}}</a>
</li>

{% endfor %}

</ul>
</li>
{% endif %}
{% endif %}
</li>


</ul>
</div>

</div>
</nav>
{% endif %}

<style>
.body .modal .modal-content {
background: #fff;
color: black;
}

.modal-header h5 {
color: black;
}
.modal-footer a {
color: #fff;
}
.modal-header {
border-bottom: none;
}
.modal-footer {
border-top: none;
}
</style>


{# <!-----notification popup---------> #}

{% for pop in popupNotif %}


<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>


{% if pop["title"] %}


<div class="modal fade" popids="{{ popupNotif["notifIds"] }}" id="notificationModal_{{ loop.index }}" tabindex="-1" aria-labelledby="notificationModalLabel_{{ loop.index }}" aria-hidden="true" data-keyboard="false" data-backdrop="static">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="notificationModalLabel">{{ pop["title"] }}</h5>
<button type="button" class="close" data-dismiss="modal" data-toggle="modal" data-target="#notificationModal_{{ loop.index+1 }}" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
{{ pop["description"]|replace({
"\n": "<br />"
}) }}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#notificationModal_{{ loop.index+1 }}">Close</button>
{% if pop["action_link"] %}
<a href="{{ pop["action_link"] }}" target="_blank" type="button" class="btn btn-actions">
{% if(pop["action_text"] is empty) %}
Click Here
{% else %}
{{ pop["action_text"] }}
{% endif %}
</a>
{% endif %}
</div>
</div>
</div>
</div>


{% endif %}
{% endfor %}
</html>
</body>
</html>