{% load static  %}
<div class="header header-one">
	<div class="header-left header-left-one">
		<a href="{% url 'billing:dashboard' %}" class="logo">
			{% comment %} <img src="{% static 'assets/img/TaxControl-Logo.png' %}" alt="Logo" style="height: 60px;"> {% endcomment %}
			<img src="{% static 'assets/img/FacControl-Logo.png' %}" alt="Logo" style="height: 60px;">
		</a>
		<a href="{% url 'billing:dashboard' %}" class="white-logo">
			{% comment %} <img src="{% static 'assets/img/TaxControl-Logo.png' %}" alt="Logo" style="height: 60px;"> {% endcomment %}
			<img src="{% static 'assets/img/FacControl-Logo.png' %}" alt="Logo" style="height: 60px;">
		</a>
		<a href="{% url 'billing:dashboard' %}" class="logo-small">
			{% comment %} <img src="{% static 'assets/img/TaxControl-Logo.png' %}" alt="Logo" width="160" height="160"> {% endcomment %}
			<img src="{% static 'assets/img/FacControl-Logo.png' %}" alt="Logo" width="160" height="160">
		</a>
	</div>
	<a href="javascript:void(0);" id="toggle_btn">
			<span class="toggle-bars">
				<span class="bar-icons"></span>
				<span class="bar-icons"></span>
				<span class="bar-icons"></span>
				<span class="bar-icons"></span>
			</span>
	</a>
	<a class="mobile_btn" id="mobile_btn">
		<i class="fas fa-bars"></i>
	</a>
	<ul class="nav nav-tabs user-menu">
		{% if perms.billing.administrateur %}
		{% if societe_active %}
		<li class="nav-item me-3 d-flex align-items-center">
			<form method="POST" action="{% url 'billing:update_taux_global' %}" class="d-flex align-items-center">
				{% csrf_token %}
				<label for="header_taux" class="me-2 mb-0" style="font-weight: bold; color: #333;">Taux:</label>
				<input type="text" name="taux" id="header_taux" value="{{ societe_active.taux }}" class="form-control form-control-sm" style="width: 100px; text-align: right;" required>
				<button type="submit" class="btn btn-sm btn-primary ms-1" title="Mettre à jour le taux"><i class="fas fa-save"></i></button>
			</form>
		</li>
		{% endif %}
		{% endif %}
		<li class="nav-item dropdown">
			<a class="user-link  nav-link" data-bs-toggle="dropdown" href="javascript:void(0)">
				<span class="user-img">
					<i class="fas fa-user-circle" style="font-size: 30px; color: #6c757d;"></i>
					<span class="animate-circle"></span>
				</span>
				<span class="user-content">
					<span class="user-details">{{ request.user.categorie.designation }}</span>
					<span class="user-name">{{ request.user.get_full_name|default:request.user.username }}</span>
				</span>
			</a>
			<div class="dropdown-menu menu-drop-user">
				<div class="profilemenu">
					<div class="subscription-menu">
						<ul>
							{% comment %} <li>
								<a class="dropdown-item" href="profile.html"><i class="fe fe-user-check"> </i> <span> Profile</span></a>
							</li>
							<li>
								<a class="dropdown-item" href="settings.html"><i class="fe fe-settings"> </i> <span> Settings</span></a>
							</li> {% endcomment %}
							<li>
								<div class="form-check card-radio dark  p-0 ">
									<input class="form-check-input" id="layout-mode-dark" name="data-layout-mode"
									       type="radio" value="dark">
									<label class="form-check-label" for="layout-mode-dark">
										<i class="fe fe-sunset"></i>
										Mode dark
									</label>
								</div>
							</li>
							<li>
								<div class="form-check card-radio p-0">
									<input class="form-check-input" id="layout-mode-light" name="data-layout-mode"
									       type="radio" value="light">
									<label class="form-check-label" for="layout-mode-light">
										<i class="fe fe-sun"></i>
										Mode Light
									</label>
								</div>
							</li>
						</ul>
					</div>
					<div class="subscription-logout">
						<ul>
							<li class="pb-0">
								<a class="dropdown-item" href="{% url 'frontsite:logout' %}"><i class="fe fe-power"> </i> <span> Déconnecté</span></a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</li>
	</ul>
</div>