<?phpuse Twig\Environment;use Twig\Error\LoaderError;use Twig\Error\RuntimeError;use Twig\Extension\CoreExtension;use Twig\Extension\SandboxExtension;use Twig\Markup;use Twig\Sandbox\SecurityError;use Twig\Sandbox\SecurityNotAllowedTagError;use Twig\Sandbox\SecurityNotAllowedFilterError;use Twig\Sandbox\SecurityNotAllowedFunctionError;use Twig\Source;use Twig\Template;/* Base/_sidebar_admin.html.twig */class __TwigTemplate_e37cf6551fa46b9b521a49d5f87163ce8743775b5fa70bff370074ba078606a8 extends Template{ private $source; private $macros = []; public function __construct(Environment $env) { parent::__construct($env); $this->source = $this->getSourceContext(); $this->parent = false; $this->blocks = [ ]; } protected function doDisplay(array $context, array $blocks = []) { $macros = $this->macros; $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"]; $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "Base/_sidebar_admin.html.twig")); $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"]; $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "Base/_sidebar_admin.html.twig")); // line 1 yield "<div class=\"d-flex flex-column flex-root\"> <div class=\"page d-flex flex-row flex-column-fluid\"><div id=\"kt_aside\" class=\"aside aside-modern\" data-kt-drawer=\"true\" data-kt-drawer-name=\"aside\" data-kt-drawer-activate=\"{default: true, lg: false}\" data-kt-drawer-overlay=\"true\" data-kt-drawer-width=\"{default:'280px', '300px': '300px'}\" data-kt-drawer-direction=\"start\" data-kt-drawer-toggle=\"#kt_aside_mobile_toggle\"> <!-- Logo Section Modernisée --> <div class=\"aside-logo-modern\" id=\"kt_aside_logo\"> <a href=\"/dashboard\" class=\"logo-container-modern\"> <span class=\"brand-text\">MAZEGO</span> </a> <div id=\"kt_aside_toggle\" class=\"btn-toggle-modern\" data-kt-toggle=\"true\" data-kt-toggle-state=\"active\" data-kt-toggle-target=\"body\" data-kt-toggle-name=\"aside-minimize\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m15 18-6-6 6-6\"/> </svg> </div> </div> <!-- Menu Navigation Moderne --> <div class=\"aside-menu-modern\"> <div class=\"menu-scroll-modern\" id=\"kt_aside_menu_wrapper\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"{default: false, lg: true}\" data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_aside_logo, #kt_aside_footer\" data-kt-scroll-wrappers=\"#kt_aside_menu\" data-kt-scroll-offset=\"0\"> <div class=\"menu-modern\" id=\"kt_aside_menu\" data-kt-menu=\"true\"><!-- 📄 FACTURE ÉLECTRONIQUE -->"; // line 203 yield "<!-- 📄 FACTURE ÉLECTRONIQUE --><div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"facture-electronique\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">FACTURE ÉLECTRONIQUE</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">NEW</span> </div> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-facture-electronique\"> "; // line 222 yield " "; $context["hasCertificate"] = (array_key_exists("user_certificate", $context) && (0 !== CoreExtension::compare((isset($context["user_certificate"]) || array_key_exists("user_certificate", $context) ? $context["user_certificate"] : (function () { throw new RuntimeError('Variable "user_certificate" does not exist.', 222, $this->source); })()), null))); // line 223 yield " "; $context["hasDigiGoEmail"] = (array_key_exists("digigo_email", $context) && !Twig\Extension\CoreExtension::testEmpty((isset($context["digigo_email"]) || array_key_exists("digigo_email", $context) ? $context["digigo_email"] : (function () { throw new RuntimeError('Variable "digigo_email" does not exist.', 223, $this->source); })()))); // line 224 yield " "; $context["hasTTNConfig"] = (array_key_exists("user_ttn_config", $context) && (1 === CoreExtension::compare(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["user_ttn_config"]) || array_key_exists("user_ttn_config", $context) ? $context["user_ttn_config"] : (function () { throw new RuntimeError('Variable "user_ttn_config" does not exist.', 224, $this->source); })())), 0))); // line 225 yield " "; $context["isActivated"] = (array_key_exists("user_activation", $context) && (0 !== CoreExtension::compare((isset($context["user_activation"]) || array_key_exists("user_activation", $context) ? $context["user_activation"] : (function () { throw new RuntimeError('Variable "user_activation" does not exist.', 225, $this->source); })()), null))); // line 226 yield " "; $context["signatures_remaining"] = ((array_key_exists("user_signatures_remaining", $context)) ? ((isset($context["user_signatures_remaining"]) || array_key_exists("user_signatures_remaining", $context) ? $context["user_signatures_remaining"] : (function () { throw new RuntimeError('Variable "user_signatures_remaining" does not exist.', 226, $this->source); })())) : (300)); // line 227 yield " "; $context["signatures_total"] = ((array_key_exists("user_signatures_total", $context)) ? ((isset($context["user_signatures_total"]) || array_key_exists("user_signatures_total", $context) ? $context["user_signatures_total"] : (function () { throw new RuntimeError('Variable "user_signatures_total" does not exist.', 227, $this->source); })())) : (300)); // line 228 yield " "; $context["has_factures"] = (array_key_exists("donnees_electroniques", $context) && (1 === CoreExtension::compare(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["donnees_electroniques"]) || array_key_exists("donnees_electroniques", $context) ? $context["donnees_electroniques"] : (function () { throw new RuntimeError('Variable "donnees_electroniques" does not exist.', 228, $this->source); })())), 0))); // line 229 yield " "; // line 231 yield " <!-- Configuration DigiGo / Email --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 233 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_setup"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"/> <path d=\"m22 7-10 7L2 7\"/> <circle cx=\"12\" cy=\"15\" r=\"2\"/> <path d=\"M12 15v-4\"/> <path d=\"M9 11h6\"/> </svg> </div> <span class=\"menu-title-modern\">1. Configuration DigiGo</span> "; // line 244 if ((isset($context["hasDigiGoEmail"]) || array_key_exists("hasDigiGoEmail", $context) ? $context["hasDigiGoEmail"] : (function () { throw new RuntimeError('Variable "hasDigiGoEmail" does not exist.', 244, $this->source); })())) { // line 245 yield " <div class=\"menu-badge-modern\"> <span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">✓ </span> </div> "; } else { // line 251 yield " "; } // line 258 yield " </a> </div> "; // line 262 yield " <!-- Certificat de signature --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 264 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_step1"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/> <circle cx=\"12\" cy=\"12\" r=\"2\"/> <path d=\"M12 6v2\"/> <path d=\"M12 16v2\"/> <path d=\"M6 12h2\"/> <path d=\"M16 12h2\"/> </svg> </div> <span class=\"menu-title-modern\">2. Certificat de signature</span> "; // line 276 if ((isset($context["hasCertificate"]) || array_key_exists("hasCertificate", $context) ? $context["hasCertificate"] : (function () { throw new RuntimeError('Variable "hasCertificate" does not exist.', 276, $this->source); })())) { // line 277 yield " <div class=\"menu-badge-modern\"> <span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span> </div> "; } else { // line 281 yield " <div class=\"menu-badge-modern\"> <span class=\"badge-dot-modern\"></span> </div> "; } // line 285 yield " </a> </div> "; // line 289 yield " <!-- Configuration TTN --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 291 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_step2"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <circle cx=\"12\" cy=\"12\" r=\"10\"/> <path d=\"M12 16v-4\"/> <circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"currentColor\"/> <path d=\"M8 12h8\"/> </svg> </div> <span class=\"menu-title-modern\">3. Configuration TTN</span> "; // line 301 if ((isset($context["hasTTNConfig"]) || array_key_exists("hasTTNConfig", $context) ? $context["hasTTNConfig"] : (function () { throw new RuntimeError('Variable "hasTTNConfig" does not exist.', 301, $this->source); })())) { // line 302 yield " <div class=\"menu-badge-modern\"> <span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span> </div> "; } else { // line 306 yield " <div class=\"menu-badge-modern\"> <span class=\"badge-dot-modern\"></span> </div> "; } // line 310 yield " </a> </div> "; // line 314 yield " <!-- Activation et paiement --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 316 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_step3"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"2\" y=\"5\" width=\"20\" height=\"14\" rx=\"2\"/> <line x1=\"2\" y1=\"10\" x2=\"22\" y2=\"10\"/> <circle cx=\"12\" cy=\"15\" r=\"2\"/> <path d=\"M12 15v-3\"/> <path d=\"M9 12h6\"/> </svg> </div> <span class=\"menu-title-modern\">4. Activation & paiement</span> "; // line 327 if ((isset($context["isActivated"]) || array_key_exists("isActivated", $context) ? $context["isActivated"] : (function () { throw new RuntimeError('Variable "isActivated" does not exist.', 327, $this->source); })())) { // line 328 yield " <div class=\"menu-badge-modern\"> <span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIVÉ</span> </div> "; } // line 332 yield " </a> </div> "; // line 336 yield " <div style=\"height: 1px; background: linear-gradient(90deg, transparent, #e2e8f0, transparent); margin: 0.5rem 1rem;\"></div> "; // line 339 yield " <!-- Gestion des certificats --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 341 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_certificate"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M4 7h16\"/> <path d=\"M7 7v10\"/> <path d=\"M17 7v10\"/> <rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"/> </svg> </div> <span class=\"menu-title-modern\">Gestion des certificats</span> "; // line 351 if ((isset($context["hasCertificate"]) || array_key_exists("hasCertificate", $context) ? $context["hasCertificate"] : (function () { throw new RuntimeError('Variable "hasCertificate" does not exist.', 351, $this->source); })())) { // line 352 yield " <div class=\"menu-badge-modern\"> <span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span> </div> "; } // line 356 yield " </a> </div> "; // line 360 yield " <!-- Liste des factures électroniques (accessible à tous) --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 362 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_liste"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/> <polyline points=\"14 2 14 8 20 8\"/> <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/> <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/> <path d=\"M10 9h4\"/> <path d=\"M8 9h.01\"/> </svg> </div> <span class=\"menu-title-modern\">factures électroniques</span> "; // line 374 if ((isset($context["has_factures"]) || array_key_exists("has_factures", $context) ? $context["has_factures"] : (function () { throw new RuntimeError('Variable "has_factures" does not exist.', 374, $this->source); })())) { // line 375 yield " <div class=\"menu-badge-modern\"> <span class=\"badge bg-primary rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\"> "; // line 377 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["donnees_electroniques"]) || array_key_exists("donnees_electroniques", $context) ? $context["donnees_electroniques"] : (function () { throw new RuntimeError('Variable "donnees_electroniques" does not exist.', 377, $this->source); })())), "html", null, true); yield " </span> </div> "; } // line 381 yield " </a> </div> "; // line 385 yield " "; if ((isset($context["isActivated"]) || array_key_exists("isActivated", $context) ? $context["isActivated"] : (function () { throw new RuntimeError('Variable "isActivated" does not exist.', 385, $this->source); })())) { // line 386 yield " <!-- Dashboard Facture Électronique --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 388 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("dashboard_facture_electronique"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/> <line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/> <line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/> <path d=\"M12 11v-4\"/> <circle cx=\"12\" cy=\"9\" r=\"1\" fill=\"currentColor\"/> </svg> </div> <span class=\"menu-title-modern\">Tableau de bord</span> </a> </div> <!-- Compteur de signatures --> <div class=\"menu-item-modern\"> <div class=\"menu-link-modern\" style=\"cursor: default;\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M4 7h16\"/> <path d=\"M7 7v10\"/> <path d=\"M17 7v10\"/> <rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"/> <path d=\"M9 11h6\"/> <path d=\"M12 14v-3\"/> </svg> </div> <span class=\"menu-title-modern\">Signatures restantes</span> <div class=\"menu-badge-modern\"> <span class=\"badge bg-info rounded-pill px-2 py-1\" style=\"font-size: 0.75rem; font-weight: 600;\"> "; // line 418 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["signatures_remaining"]) || array_key_exists("signatures_remaining", $context) ? $context["signatures_remaining"] : (function () { throw new RuntimeError('Variable "signatures_remaining" does not exist.', 418, $this->source); })()), "html", null, true); yield " / "; yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["signatures_total"]) || array_key_exists("signatures_total", $context) ? $context["signatures_total"] : (function () { throw new RuntimeError('Variable "signatures_total" does not exist.', 418, $this->source); })()), "html", null, true); yield " </span> </div> </div> </div> <!-- Historique et rapports (accordéon) --> <div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\"> <div class=\"menu-link-modern menu-accordion-trigger\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/> <polyline points=\"14 2 14 8 20 8\"/> <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/> <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/> <path d=\"M10 9h4\"/> <path d=\"M16 21v-4\"/> </svg> </div> <span class=\"menu-title-modern\">Historique & rapports</span> <div class=\"menu-arrow-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m9 18 6-6-6-6\"/> </svg> </div> </div> <div class=\"menu-sub-modern\"> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 446 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_historique_factures"); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Factures émises</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 452 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_historique_paiements"); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Paiements</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 458 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_electronique_rapports"); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Rapports mensuels</span> </a> </div> </div> </div> "; } // line 466 yield " "; // line 468 yield " <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"#\" onclick=\"openSupportModal(); return false;\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <circle cx=\"12\" cy=\"12\" r=\"10\"/> <path d=\"M12 16v-4\"/> <circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"currentColor\"/> </svg> </div> <span class=\"menu-title-modern\">Aide & support</span> </a> </div> </div></div> <!-- 📊 TABLEAU DE BORD --> <div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"dashboard\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">TABLEAU DE BORD</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-dashboard\"> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern active\" href=\"/dashboard\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"3\" y=\"3\" width=\"7\" height=\"7\"/> <rect x=\"14\" y=\"3\" width=\"7\" height=\"7\"/> <rect x=\"14\" y=\"14\" width=\"7\" height=\"7\"/> <rect x=\"3\" y=\"14\" width=\"7\" height=\"7\"/> </svg> </div> <span class=\"menu-title-modern\">Tableau de Bord</span> </a> </div> </div> </div> "; // line 609 yield " <!-- 💼 VENTES (CLIENTS) --><div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"ventes\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">VENTES (CLIENTS)</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-ventes\"> <!-- Devis & Propositions --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/devis/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/> <polyline points=\"14,2 14,8 20,8\"/> <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/> <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/> <path d=\"M10 9h4\"/> </svg> </div> <span class=\"menu-title-modern\">Devis & Propositions</span> </a> </div> <!-- Bons de Livraison --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 641 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("devis_index_bon_livraison"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M12 2v8l4-4\"/> <path d=\"M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0z\"/> <path d=\"M16 12l-4 4-4-4\"/> <path d=\"M12 16V8\"/> </svg> </div> <span class=\"menu-title-modern\">Bons de Livraison</span> </a> </div> <!-- Bons de Réparation --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 656 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("reparation_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"/> </svg> </div> <span class=\"menu-title-modern\">Bons de Réparation</span> </a> </div> <!-- Factures Clients --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/facture/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/> <polyline points=\"14,2 14,8 20,8\"/> <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/> <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/> <path d=\"M10 9h4\"/> <path d=\"M12 21v-4\"/> </svg> </div> <span class=\"menu-title-modern\">Factures Clients</span> </a> </div> <!-- Retours Clients --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 685 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("retour_client_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m3 3 3 9h12l3-9H3z\"/> <path d=\"M6 12h12\"/> <path d=\"M12 3v18\"/> <path d=\"M15 6l-3 3 3 3\"/> <path d=\"M9 6l3-3-3-3\"/> </svg> </div> <span class=\"menu-title-modern\">Retours Clients</span> </a> </div> <!-- Point de Vente PRO --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/caisse/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/> <line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/> <line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/> <circle cx=\"12\" cy=\"10\" r=\"2\"/> <path d=\"M12 14v-4\"/> <path d=\"M16 10h4\"/> </svg> </div> <span class=\"menu-title-modern\">Point de Vente PRO</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">PRO</span> </div> </a> </div> <!-- Rapports de vente (par salarié) --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 721 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("caisse_rapports_vendeurs"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M3 3v18h18\"/> <path d=\"M18 17V9\"/> <path d=\"M13 17V5\"/> <path d=\"M8 17v-3\"/> </svg> </div> <span class=\"menu-title-modern\">Rapports de vente</span> </a> </div> <!-- Clôtures de caisse --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 736 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("caisse_cloture_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"3\" y=\"11\" width=\"18\" height=\"10\" rx=\"2\"/> <path d=\"M7 11V7a5 5 0 0 1 10 0v4\"/> </svg> </div> <span class=\"menu-title-modern\">Clôtures de caisse</span> </a> </div> </div></div>"; // line 847 yield "<!-- 🏪 ACHATS (FOURNISSEURS) --><div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"achats\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">ACHATS (FOURNISSEURS)</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-achats\"> <!-- Fournisseurs --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/fournisseur/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/> <circle cx=\"9\" cy=\"7\" r=\"4\"/> <path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"/> <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/> </svg> </div> <span class=\"menu-title-modern\">Fournisseurs</span> </a> </div> <!-- Bons de Commande Achat --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 877 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("devis_index_bon_commande"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\"/> <path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"/> <path d=\"M8 11h8\"/> <path d=\"M8 15h8\"/> <circle cx=\"12\" cy=\"4\" r=\"1\"/> </svg> </div> <span class=\"menu-title-modern\">Bons de Commande Achat</span> </a> </div> <!-- Réceptions (Entrées Stock) --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/entrees/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M5 12h14\"/> <path d=\"M12 5v14\"/> <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/> <path d=\"M8 8h8v8H8z\"/> </svg> </div> <span class=\"menu-title-modern\">Réceptions (Entrées Stock)</span> </a> </div> <!-- Retours Fournisseurs --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 908 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("retour_fournisseur_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"/> <polyline points=\"9 22 9 12 15 12 15 22\"/> <path d=\"m9 12 3-3 3 3\"/> <path d=\"M12 16v-4\"/> </svg> </div> <span class=\"menu-title-modern\">Retours Fournisseurs</span> </a> </div> <!-- Factures Fournisseurs --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 923 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("facture_fournisseur_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/> <polyline points=\"14,2 14,8 20,8\"/> <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/> <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/> <path d=\"M8 9h8\"/> <path d=\"M12 21v-4\"/> </svg> </div> <span class=\"menu-title-modern\">Factures Fournisseurs</span> </a> </div> </div></div> <!-- 📦 STOCK & LOGISTIQUE --> <div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"stock\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">STOCK & LOGISTIQUE</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-stock\"> <!-- Stock Global --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/stock/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M3 9h18v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V9Z\"/> <path d=\"m3 9 2.45-4.9A2 2 0 0 1 7.24 3h9.52a2 2 0 0 1 1.8 1.1L21 9\"/> <path d=\"M12 3v6\"/> <path d=\"M9 12l3 3 3-3\"/> <path d=\"M12 15v6\"/> </svg> </div> <span class=\"menu-title-modern\">Stock Global</span> </a> </div> <!-- Expéditions (Sorties) --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/sorties/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M5 12h14\"/> <path d=\"M12 5l7 7-7 7\"/> <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/> <path d=\"M8 8h8v8H8z\"/> </svg> </div> <span class=\"menu-title-modern\">Expéditions (Sorties)</span> </a> </div> <!-- Réceptions (Entrées) --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/entrees/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M5 12h14\"/> <path d=\"M12 5v14\"/> <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/> <path d=\"M8 8h8v8H8z\"/> </svg> </div> <span class=\"menu-title-modern\">Réceptions (Entrées)</span> </a> </div> <!-- Inventaire --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 1000 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("inventaire_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/> <path d=\"M3 9h18\"/> <path d=\"M9 21V9\"/> <path d=\"M15 21V9\"/> <path d=\"M12 9v12\"/> </svg> </div> <span class=\"menu-title-modern\">Inventaire</span> </a> </div> </div> </div> <!-- 👥 CONTACTS & DONNÉES --> <div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"contacts\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">CONTACTS & DONNÉES</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-contacts\"> <!-- Clients --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/client/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/> <circle cx=\"12\" cy=\"7\" r=\"4\"/> <path d=\"M16 21v-2a4 4 0 0 0-4-4H8\"/> </svg> </div> <span class=\"menu-title-modern\">Clients</span> </a> </div> <!-- Fournisseurs --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/fournisseur/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/> <circle cx=\"9\" cy=\"7\" r=\"4\"/> <path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"/> <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/> </svg> </div> <span class=\"menu-title-modern\">Fournisseurs</span> </a> </div> <!-- Produits & Services --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/produit/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m7.5 4.27 9 5.15\"/> <path d=\"M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z\"/> <path d=\"m3.3 7 8.7 5 8.7-5\"/> <path d=\"M12 22V12\"/> <circle cx=\"12\" cy=\"12\" r=\"2\"/> </svg> </div> <span class=\"menu-title-modern\">Produits & Services</span> </a> </div> </div> </div> <!-- 📈 MARKETING (PRO) --> <div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"marketing\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">MARKETING (PRO)</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-marketing\"> <!-- Prospection Email PRO --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/prospect/email\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z\"/> <polyline points=\"22,6 12,13 2,6\"/> <path d=\"M12 13l10-7\"/> <path d=\"M2 6l10 7 10-7\"/> </svg> </div> <span class=\"menu-title-modern\">Prospection Email PRO</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">PRO</span> </div> </a> </div> <!-- Prospection IA PRO --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/prospect/centres\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z\"/> <path d=\"M12 2.5v19\"/> <path d=\"M2 8l10 6 10-6\"/> <path d=\"M12 22V12\"/> <circle cx=\"12\" cy=\"12\" r=\"2\"/> </svg> </div> <span class=\"menu-title-modern\">Prospection IA PRO</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">PRO</span> </div> </a> </div> <!-- Dashboard Prospect PRO --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/dashboard-prospect\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"10\"/> <line x1=\"18\" y1=\"20\" x2=\"18\" y2=\"4\"/> <line x1=\"6\" y1=\"20\" x2=\"6\" y2=\"16\"/> <circle cx=\"12\" cy=\"10\" r=\"2\"/> <circle cx=\"18\" cy=\"4\" r=\"2\"/> <circle cx=\"6\" cy=\"16\" r=\"2\"/> <path d=\"M12 10v10\"/> <path d=\"M18 4v16\"/> <path d=\"M6 16v4\"/> </svg> </div> <span class=\"menu-title-modern\">Dashboard Prospect PRO</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">PRO</span> </div> </a> </div> <!-- Site Web Pro --> <div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\"> <div class=\"menu-link-modern menu-accordion-trigger\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <circle cx=\"12\" cy=\"12\" r=\"10\"/> <path d=\"m4.93 4.93 4.24 4.24\"/> <path d=\"m14.83 9.17 4.24-4.24\"/> <path d=\"m14.83 14.83 4.24 4.24\"/> <path d=\"m9.17 14.83-4.24 4.24\"/> <path d=\"M12 2v20\"/> <path d=\"M2 12h20\"/> </svg> </div> <span class=\"menu-title-modern\">Site Web Pro</span> <div class=\"menu-arrow-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m9 18 6-6-6-6\"/> </svg> </div> </div> <div class=\"menu-sub-modern\"> <div class=\"menu-sub-item-modern\"> <a href=\"/frontend\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Créer Mon Site</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\"/voir-mon-site\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Voir Mon Site</span> </a> </div> </div> </div> </div> </div> <!-- ⚙️ PARAMÈTRES --> <div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"parametres\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">PARAMÈTRES</span> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-parametres\"> <!-- Mon Entreprise --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/entreprise/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M3 21h18\"/> <path d=\"M5 21V7l8-4v18\"/> <path d=\"M19 21V11l-6-4\"/> <path d=\"M9 9h6\"/> <path d=\"M9 13h6\"/> <path d=\"M9 17h6\"/> </svg> </div> <span class=\"menu-title-modern\">Mon Entreprise</span> </a> </div> <!-- Salariés --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 1220 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("salarie_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/> <circle cx=\"9\" cy=\"7\" r=\"4\"/> <path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"/> <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/> </svg> </div> <span class=\"menu-title-modern\">Salariés</span> </a> </div> <!-- Mon Compte --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/> <circle cx=\"12\" cy=\"7\" r=\"4\"/> <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/> <path d=\"M12 12v4\"/> </svg> </div> <span class=\"menu-title-modern\">Mon Compte</span> </a> </div> <!-- Intégrations --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M12 2v8l4-4\"/> <path d=\"M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0z\"/> <path d=\"M8 12h8\"/> <path d=\"m12 16 4-4-4-4\"/> <circle cx=\"12\" cy=\"12\" r=\"2\"/> </svg> </div> <span class=\"menu-title-modern\">Intégrations</span> </a> </div> <!-- Équipe & Utilisateurs (Admin seulement) --> "; // line 1265 if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_ADMIN")) { // line 1266 yield " <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"/utilisateurs/\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/> <circle cx=\"9\" cy=\"7\" r=\"4\"/> <path d=\"m22 21-3-3m0 0a5.5 5.5 0 1 0-7.78-7.78 5.5 5.5 0 0 0 7.78 7.78Z\"/> <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/> </svg> </div> <span class=\"menu-title-modern\">Équipe & Utilisateurs</span> <div class=\"menu-badge-modern\"> <span class=\"badge-admin-modern\">ADMIN</span> </div> </a> </div> "; } // line 1283 yield " </div> </div><!-- 🎫 TICKETS & SUPPORT --><div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"tickets\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">TICKETS & SUPPORT</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">NEW</span> </div> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-tickets\"> <!-- ✅ LIEN PRINCIPAL - DYNAMIQUE SELON LE RÔLE --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 1308 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ticket_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/> <path d=\"M8 10h.01\"/> <path d=\"M12 10h.01\"/> <path d=\"M16 10h.01\"/> </svg> </div> <span class=\"menu-title-modern\"> "; // line 1318 if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_ADMIN")) { // line 1319 yield " Gestion des tickets "; } else { // line 1321 yield " Mes tickets "; } // line 1323 yield " </span> <!-- BADGE AVEC NOMBRE DE TICKETS --> <div class=\"menu-badge-modern\"> "; // line 1327 $context["ticket_count"] = (($context["tickets_count"]) ?? (0)); // line 1328 yield " "; if ((1 === CoreExtension::compare((isset($context["ticket_count"]) || array_key_exists("ticket_count", $context) ? $context["ticket_count"] : (function () { throw new RuntimeError('Variable "ticket_count" does not exist.', 1328, $this->source); })()), 0))) { // line 1329 yield " <span class=\"badge bg-"; if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_ADMIN")) { yield "primary"; } else { yield "info"; } yield " rounded-pill px-2 py-1\" style=\"font-size: 0.7rem; background: "; // line 1330 if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_ADMIN")) { yield "#3b82f6"; } else { yield "#0ea5e9"; } yield "; color: white;\"> "; // line 1331 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["ticket_count"]) || array_key_exists("ticket_count", $context) ? $context["ticket_count"] : (function () { throw new RuntimeError('Variable "ticket_count" does not exist.', 1331, $this->source); })()), "html", null, true); yield " </span> "; } else { // line 1334 yield " <span class=\"badge-dot-modern\"></span> "; } // line 1336 yield " </div> </a> </div> <!-- LIEN RAPIDE: CRÉER UN TICKET (OPTIONNEL) --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"#\" onclick=\"openTicketModal(); return false;\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/> <line x1=\"9\" y1=\"10\" x2=\"15\" y2=\"10\"/> <line x1=\"12\" y1=\"7\" x2=\"12\" y2=\"13\"/> </svg> </div> <span class=\"menu-title-modern\">Nouveau ticket</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\" style=\"background: #10b981;\">+</span> </div> </a> </div> </div></div><!-- 🎓 FORMATION & TUTORIELS --><div class=\"menu-section-modern\"> <div class=\"menu-section-header-modern\" data-section=\"formation\"> <div class=\"menu-section-title-modern\"> <span class=\"section-title-text\">FORMATION & TUTORIELS</span> <div class=\"menu-badge-modern\"> <span class=\"badge-new-modern\">NEW</span> </div> </div> <div class=\"menu-section-arrow\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m6 9 6 6 6-6\"/> </svg> </div> </div> <div class=\"menu-section-content\" id=\"section-formation\"> <!-- Centre de formation --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 1378 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_index"); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z\"/> <polyline points=\"3.27 6.96 12 12.01 20.73 6.96\"/> <line x1=\"12\" y1=\"22.08\" x2=\"12\" y2=\"12\"/> <circle cx=\"12\" cy=\"12\" r=\"2\"/> </svg> </div> <span class=\"menu-title-modern\">Centre de formation</span> <div class=\"menu-badge-modern\"> <span class=\"badge bg-primary rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\"> 6 </span> </div> </a> </div> <!-- Séparateur --> <div style=\"height: 1px; background: linear-gradient(90deg, transparent, #e2e8f0, transparent); margin: 0.5rem 1rem;\"></div> <!-- Démo générale --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\""; // line 1401 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_video", ["id" => 1]); yield "\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <polygon points=\"5 3 19 12 5 21 5 3\"/> <circle cx=\"12\" cy=\"12\" r=\"10\"/> </svg> </div> <span class=\"menu-title-modern\">Démo Mazego complète</span> <div class=\"menu-badge-modern\"> <span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.65rem;\">15 min</span> </div> </a> </div> <!-- Tutoriels par catégorie (accordéon) --> <div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\"> <div class=\"menu-link-modern menu-accordion-trigger\"> <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/> <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"9\"/> <line x1=\"9\" y1=\"13\" x2=\"15\" y2=\"13\"/> <line x1=\"9\" y1=\"17\" x2=\"15\" y2=\"17\"/> <circle cx=\"6\" cy=\"9\" r=\"1\"/> <circle cx=\"6\" cy=\"13\" r=\"1\"/> <circle cx=\"6\" cy=\"17\" r=\"1\"/> </svg> </div> <span class=\"menu-title-modern\">Tutoriels par module</span> <div class=\"menu-arrow-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"m9 18 6-6-6-6\"/> </svg> </div> </div> <div class=\"menu-sub-modern\"> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 1438 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_video", ["id" => 2]); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Créer un devis</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 1444 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_video", ["id" => 3]); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Créer une facture</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 1450 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_video", ["id" => 4]); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Bon de commande</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 1456 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_video", ["id" => 5]); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Bon de livraison</span> </a> </div> <div class=\"menu-sub-item-modern\"> <a href=\""; // line 1462 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("formation_video", ["id" => 6]); yield "\" class=\"menu-sub-link-modern\"> <span class=\"menu-bullet-modern\"></span> <span>Prospection BtoB</span> </a> </div> </div> </div> <!-- Documentation --> <div class=\"menu-item-modern\"> <a class=\"menu-link-modern\" href=\"https://www.canva.com/design/DAGsM4IzHX4/-xVezdK8KNcDQowJgMm6Xw/view?utm_content=DAGsM4IzHX4&utm_campaign=designshare&utm_medium=link2&utm_source=uniquelinks&utlId=hab518c912f\" > <div class=\"menu-icon-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M4 19.5A2.5 2.5 0 0 1 6.5 17H20\"/> <path d=\"M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z\"/> <path d=\"M8 7h8\"/> <path d=\"M8 11h8\"/> <path d=\"M8 15h6\"/> </svg> </div> <span class=\"menu-title-modern\">Documentation</span> <div class=\"menu-badge-modern\"> <span class=\"badge-dev-modern\">SOON</span> </div> </a> </div> </div></div> </div> </div> </div> <!-- Footer moderne avec nouveaux boutons --><div class=\"aside-footer-modern\" id=\"kt_aside_footer\"> <!-- Support & Ticket Buttons --> <div class=\"support-actions-modern\"> <!-- Bouton Créer un ticket --> <button class=\"support-btn-modern ticket-btn\" onclick=\"openTicketModal()\"> <div class=\"support-icon\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/> <path d=\"M8 10h.01\"/> <path d=\"M12 10h.01\"/> <path d=\"M16 10h.01\"/> </svg> </div> <span class=\"support-text\">Créer un ticket</span> <span class=\"badge-new-ticket\">NEW</span> </button> <!-- Bouton Support --> <button class=\"support-btn-modern\" onclick=\"openSupportModal()\"> <div class=\"support-icon\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <circle cx=\"12\" cy=\"12\" r=\"10\"/> <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\"/> <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\"/> </svg> </div> <span class=\"support-text\">Support</span> </button> <!-- Dans le aside-footer-modern, après les boutons support --> "; // line 1567 yield " </div> <!-- User panel existant --> <div class=\"user-panel-modern\"> <div class=\"user-avatar-modern\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/> <circle cx=\"12\" cy=\"7\" r=\"4\"/> </svg> </div> <div class=\"user-info-modern\"> <div class=\"user-name-modern\"> "; // line 1582 if ((CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1582, $this->source); })()), "user", [], "any", false, false, false, 1582) && CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, ($context["app"] ?? null), "user", [], "any", false, true, false, 1582), "firstname", [], "any", true, true, false, 1582))) { // line 1583 yield " "; yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1583, $this->source); })()), "user", [], "any", false, false, false, 1583), "firstname", [], "any", false, false, false, 1583) . " ") . CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1583, $this->source); })()), "user", [], "any", false, false, false, 1583), "lastname", [], "any", false, false, false, 1583)), "html", null, true); yield " "; } elseif ((CoreExtension::getAttribute($this->env, $this->source, // line 1584(isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1584, $this->source); })()), "user", [], "any", false, false, false, 1584) && CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, ($context["app"] ?? null), "user", [], "any", false, true, false, 1584), "nomComplet", [], "any", true, true, false, 1584))) { // line 1585 yield " "; yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1585, $this->source); })()), "user", [], "any", false, false, false, 1585), "nomComplet", [], "any", false, false, false, 1585), "html", null, true); yield " "; } else { // line 1587 yield " Utilisateur "; } // line 1589 yield " </div> <div class=\"user-role-modern\">"; // line 1590 yield (($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_ADMIN")) ? ("Administrateur") : ((($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_SALARIE")) ? ("Salarié") : ("Utilisateur")))); yield "</div> </div> <a href=\"/deconnexion\" class=\"logout-btn-modern\" title=\"Déconnexion\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"> <path d=\"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4\"/> <polyline points=\"16,17 21,12 16,7\"/> <line x1=\"21\" y1=\"12\" x2=\"9\" y2=\"12\"/> </svg> </a> </div> "; // line 1601 if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_PREVIOUS_ADMIN")) { // line 1602 yield " <div class=\"alert alert-warning text-center mt-2\"> Vous êtes connecté en tant que "; // line 1603 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1603, $this->source); })()), "user", [], "any", false, false, false, 1603), "email", [], "any", false, false, false, 1603), "html", null, true); yield " <a href=\""; // line 1604 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("user_index", ["_switch_user" => "_exit"]); yield "\" class=\"btn btn-sm btn-danger ms-3\"> <i class=\"fas fa-sign-out-alt\"></i> Revenir </a> </div> "; } // line 1609 yield "</div></div><!-- MODAL CRÉER UN TICKET --><div id=\"ticketModal\" class=\"modal-modern\" style=\"display: none;\"> <div class=\"modal-overlay\" onclick=\"closeTicketModal()\"></div> <div class=\"modal-container\"> <div class=\"modal-header\"> <div class=\"modal-title\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"2\"> <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/> </svg> <span>Créer un nouveau ticket</span> </div> <button class=\"modal-close\" onclick=\"closeTicketModal()\">×</button> </div> <div class=\"modal-body\"> <form id=\"ticketForm\" action=\""; // line 1632 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ticket_create"); yield "\" method=\"POST\" enctype=\"multipart/form-data\"> <div class=\"form-group\"> <label class=\"form-label\">Sujet</label> <input type=\"text\" name=\"subject\" class=\"form-control\" placeholder=\"Ex: Problème d'impression de facture\" required> </div> <div class=\"form-group\"> <label class=\"form-label\">Message</label> <textarea name=\"message\" class=\"form-control\" rows=\"5\" placeholder=\"Décrivez votre problème en détail...\" required></textarea> </div> <div class=\"form-group\"> <label class=\"form-label\">Pièces jointes</label> <div class=\"file-upload-area\"> <input type=\"file\" name=\"attachments[]\" id=\"fileInput\" multiple style=\"display: none;\"> <button type=\"button\" class=\"file-upload-btn\" onclick=\"document.getElementById('fileInput').click()\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"> <path d=\"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\"/> </svg> Ajouter des fichiers </button> <span class=\"file-hint\">PNG, JPG, PDF (max 10MB)</span> </div> <div id=\"fileList\" class=\"file-list\"></div> </div> </form> </div> <div class=\"modal-footer\"> <button class=\"btn-secondary\" onclick=\"closeTicketModal()\">Annuler</button> <button type=\"submit\" form=\"ticketForm\" class=\"btn-primary\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"> <path d=\"M20 6L9 17l-5-5\"/> </svg> Valider </button> </div> </div></div><!-- MODAL SUPPORT --><div id=\"supportModal\" class=\"modal-modern\" style=\"display: none;\"> <div class=\"modal-overlay\" onclick=\"closeSupportModal()\"></div> <div class=\"modal-container support-modal\"> <div class=\"modal-header\"> <div class=\"modal-title\"> <div class=\"support-logo\"> <span class=\"brand-text-modal\">MAZEGO</span> </div> </div> <button class=\"modal-close\" onclick=\"closeSupportModal()\">×</button> </div> <div class=\"modal-body text-center\"> <div class=\"support-avatar\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"1.5\"> <circle cx=\"12\" cy=\"12\" r=\"10\"/> <path d=\"M12 16v-4\"/> <circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"#3b82f6\"/> </svg> </div> <h3 class=\"support-title\">Équipe de support</h3> <div class=\"support-info-list\"> <div class=\"support-info-item\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\"> <rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"/> <path d=\"m22 7-10 7L2 7\"/> </svg> <span>support@mazego.fr</span> </div> <div class=\"support-info-item\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\"> <rect x=\"5\" y=\"2\" width=\"14\" height=\"20\" rx=\"2\"/> <line x1=\"12\" y1=\"18\" x2=\"12.01\" y2=\"18\"/> </svg> "; // line 1710 yield " <span>+33605669926</span> </div> <div class=\"support-info-item\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\"> <circle cx=\"12\" cy=\"12\" r=\"10\"/> <polyline points=\"12 6 12 12 16 14\"/> </svg> <span>Lun-Ven: 8h30 - 18h00</span> </div> <div class=\"support-info-item summer-schedule\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#f59e0b\"> <circle cx=\"12\" cy=\"12\" r=\"5\"/> <line x1=\"12\" y1=\"1\" x2=\"12\" y2=\"3\"/> <line x1=\"12\" y1=\"21\" x2=\"12\" y2=\"23\"/> <line x1=\"4.22\" y1=\"4.22\" x2=\"5.64\" y2=\"5.64\"/> <line x1=\"18.36\" y1=\"18.36\" x2=\"19.78\" y2=\"19.78\"/> <line x1=\"1\" y1=\"12\" x2=\"3\" y2=\"12\"/> <line x1=\"21\" y1=\"12\" x2=\"23\" y2=\"12\"/> <line x1=\"4.22\" y1=\"19.78\" x2=\"5.64\" y2=\"18.36\"/> <line x1=\"18.36\" y1=\"5.64\" x2=\"19.78\" y2=\"4.22\"/> </svg> <span>Horaires été: 8h00 - 17h00</span> </div> </div> <div class=\"support-response-time\"> <div class=\"response-badge\"> ⚡ Temps de réponse moyen: 2h </div> </div> </div> <div class=\"modal-footer\"> <button class=\"btn-primary\" onclick=\"closeSupportModal()\">Fermer</button> </div> </div></div><!-- BOUTON FLOATING DEMANDER UNE DÉMO --><button id=\"demoButton\" class=\"demo-floating-btn\" onclick=\"openDemoScheduler()\"> <div class=\"demo-icon\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" stroke-width=\"2\"> <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/> <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"/> <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"/> <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"/> <path d=\"M8 14h.01\"/> <path d=\"M12 14h.01\"/> <path d=\"M16 14h.01\"/> <path d=\"M8 18h.01\"/> <path d=\"M12 18h.01\"/> <path d=\"M16 18h.01\"/> </svg> </div> <span class=\"demo-text\">Demander une démo</span> <span class=\"demo-pulse\"></span></button><!-- MODAL DÉMO KOALENDAR --><div id=\"demoModal\" class=\"modal-modern\" style=\"display: none; \"> <div class=\"modal-overlay\" onclick=\"closeDemoModal()\"></div> <div class=\"modal-container demo-modal-container\"> <div class=\"modal-header\"> <div class=\"modal-title\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"2\"> <path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/> <circle cx=\"12\" cy=\"7\" r=\"4\"/> </svg> <span>Programmer une démo personnalisée</span> </div> <button class=\"modal-close\" onclick=\"closeDemoModal()\">×</button> </div> <div class=\"modal-body p-0\"> <!-- ICI : IFRAME KOALENDAR / CALENDLY --> <!-- Remplacez par votre lien Koalendar ou Calendly --> <iframe id=\"koalendarIframe\" src=\"https://koalendar.com/e/demo-mazego\" width=\"100%\" height=\"600px\" frameborder=\"0\" allowfullscreen> </iframe> <!-- Message d'info --> <div class=\"demo-info-bar\"> <span class=\"demo-duration\">⏱️ 45 minutes</span> <span class=\"demo-spots\">🎯 3 places restantes aujourd'hui</span> </div> </div> </div></div><script> document.addEventListener('DOMContentLoaded', function() { const demoButton = document.getElementById('demoButton'); demoButton.addEventListener('click', function() { // Attendre que la modal soit chargée setTimeout(function() { const modal = document.getElementById('demoModal'); if (modal && !document.getElementById('koalendar-overlay')) { // Créer un div overlay pour masquer le branding const overlay = document.createElement('div'); overlay.id = 'koalendar-overlay'; overlay.style.cssText = ` position: absolute; bottom: 0; left: 0; right: 0; height: 50px; background: white; z-index: 10000; pointer-events: none; `; modal.querySelector('.modal-body').style.position = 'relative'; modal.querySelector('.modal-body').appendChild(overlay); } }, 500); });});</script><style>#demoModal .modal-body { max-height: 680px; overflow: hidden !important;}#koalendarIframe { height: 700px !important;}/* ========== SUPPORT & TICKET BUTTONS ========== */.support-actions-modern { display: flex; gap: 8px; margin-bottom: 16px; padding: 0 8px;}.support-btn-modern { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 12px; background: white; border: 1px solid #e2e8f0; border-radius: 12px; color: #475569; font-size: 0.85rem; font-weight: 500; transition: all 0.2s ease; cursor: pointer; position: relative;}.support-btn-modern:hover { background: #f1f5f9; border-color: #3b82f6; color: #1e40af; transform: translateY(-1px);}.support-btn-modern .support-icon { display: flex; align-items: center; color: #64748b;}.support-btn-modern:hover .support-icon { color: #3b82f6;}.ticket-btn { background: linear-gradient(135deg, #3b82f6, #1d4ed8); border-color: transparent; color: white;}.ticket-btn .support-icon { color: white;}.ticket-btn:hover { background: linear-gradient(135deg, #2563eb, #1e40af); color: white;}.ticket-btn:hover .support-icon { color: white;}.badge-new-ticket { position: absolute; top: -6px; right: -6px; background: #ef4444; color: white; font-size: 0.65rem; font-weight: 700; padding: 2px 6px; border-radius: 12px; letter-spacing: 0.05em; box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3); animation: pulse-badge 2s infinite;}@keyframes pulse-badge { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); }}/* ========== MODALS MODERNES ========== */.modal-modern { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;}.modal-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(4px);}.modal-container { position: relative; width: 90%; max-width: 500px; background: white; border-radius: 20px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); z-index: 10000; animation: modalSlideIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);}.support-modal { max-width: 450px;}.demo-modal-container { max-width: 900px;}@keyframes modalSlideIn { from { opacity: 0; transform: translateY(30px) scale(0.95); } to { opacity: 1; transform: translateY(0) scale(1); }}.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid #e2e8f0;}.modal-title { display: flex; align-items: center; gap: 12px; font-size: 1.1rem; font-weight: 600; color: #1e293b;}.modal-close { background: none; border: none; font-size: 28px; line-height: 1; color: #94a3b8; cursor: pointer; transition: all 0.2s ease; padding: 4px 12px; border-radius: 8px;}.modal-close:hover { background: #f1f5f9; color: #475569;}.modal-body { padding: 24px;}.modal-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 20px 24px; border-top: 1px solid #e2e8f0;}/* ========== FORMULAIRES ========== */.form-group { margin-bottom: 20px;}.form-label { display: block; margin-bottom: 8px; font-weight: 500; font-size: 0.9rem; color: #475569;}.form-control { width: 100%; padding: 12px 16px; border: 1px solid #e2e8f0; border-radius: 12px; font-size: 0.95rem; transition: all 0.2s ease; background: #f8fafc;}.form-control:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1); background: white;}textarea.form-control { resize: vertical; min-height: 120px;}.file-upload-area { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;}.file-upload-btn { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: #f1f5f9; border: 1px dashed #94a3b8; border-radius: 10px; color: #475569; font-size: 0.9rem; cursor: pointer; transition: all 0.2s ease;}.file-upload-btn:hover { background: #e2e8f0; border-color: #3b82f6; color: #1e40af;}.file-hint { font-size: 0.8rem; color: #94a3b8;}.file-list { margin-top: 12px; display: flex; flex-direction: column; gap: 8px;}/* ========== BOUTONS ========== */.btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 24px; background: linear-gradient(135deg, #3b82f6, #2563eb); border: none; border-radius: 12px; color: white; font-weight: 600; font-size: 0.95rem; cursor: pointer; transition: all 0.2s ease;}.btn-primary:hover { background: linear-gradient(135deg, #2563eb, #1d4ed8); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);}.btn-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 24px; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 12px; color: #475569; font-weight: 600; font-size: 0.95rem; cursor: pointer; transition: all 0.2s ease;}.btn-secondary:hover { background: #e2e8f0; color: #1e293b;}/* ========== MODAL SUPPORT ========== */.support-logo { display: flex; align-items: center; gap: 8px;}.brand-text-modal { font-size: 1.4rem; font-weight: 700; color: #1e293b; letter-spacing: -0.02em;}.support-avatar { display: flex; justify-content: center; margin-bottom: 16px;}.support-title { font-size: 1.5rem; font-weight: 700; color: #1e293b; margin-bottom: 24px;}.support-info-list { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px;}.support-info-item { display: flex; align-items: center; justify-content: center; gap: 12px; color: #475569; font-size: 1rem;}.summer-schedule { color: #f59e0b; font-weight: 500;}.support-response-time { margin-top: 16px; padding-top: 16px; border-top: 1px solid #e2e8f0;}.response-badge { display: inline-flex; align-items: center; padding: 8px 16px; background: #e0f2fe; color: #0284c7; border-radius: 30px; font-size: 0.9rem; font-weight: 500;}/* ========== BOUTON FLOATING DÉMO ========== */.demo-floating-btn { position: fixed; /* bottom: 30px; */ top: 12px; right: 30px; display: flex; align-items: center; gap: 12px; padding: 16px 28px; background: linear-gradient(135deg, #8b5cf6, #6d28d9); border: none; border-radius: 50px; color: white; font-weight: 600; font-size: 1rem; cursor: pointer; box-shadow: 0 10px 25px rgba(109, 40, 217, 0.4); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); z-index: 9998; border: 1px solid rgba(255, 255, 255, 0.2);}.demo-floating-btn:hover { transform: scale(1.05); box-shadow: 0 20px 35px rgba(109, 40, 217, 0.5); background: linear-gradient(135deg, #7c3aed, #5b21b6);}.demo-icon { display: flex; align-items: center;}.demo-pulse { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 50px; box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.5); animation: pulse-demo 2s infinite;}@keyframes pulse-demo { 0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.5); } 70% { box-shadow: 0 0 0 15px rgba(139, 92, 246, 0); } 100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }}/* Mode réduit - adaptations */body[data-kt-aside-minimize=\"on\"] .support-actions-modern { flex-direction: column; padding: 0 4px;}body[data-kt-aside-minimize=\"on\"] .support-text { display: none;}body[data-kt-aside-minimize=\"on\"] .support-btn-modern { padding: 12px;}body[data-kt-aside-minimize=\"on\"] .support-icon { margin: 0;}body[data-kt-aside-minimize=\"on\"] .badge-new-ticket { top: -3px; right: -3px;}/* ========== DEMO INFO BAR ========== */.demo-info-bar { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; background: #f8fafc; border-top: 1px solid #e2e8f0; font-size: 0.9rem; color: #475569;}.demo-duration { display: flex; align-items: center; gap: 6px;}.demo-spots { display: flex; align-items: center; gap: 6px; color: #10b981; font-weight: 500;}/* ========== RESPONSIVE ========== */@media (max-width: 768px) { .demo-floating-btn { bottom: 20px; right: 20px; padding: 14px 20px; font-size: 0.9rem; } .demo-floating-btn .demo-text { display: none; } .demo-floating-btn { padding: 16px; border-radius: 50%; } .demo-floating-btn:hover { transform: scale(1.1); } .modal-container { width: 95%; max-height: 90vh; overflow-y: auto; } .demo-info-bar { flex-direction: column; gap: 8px; align-items: flex-start; }}/* Sidebar Moderne - Design épuré et contemporain */.aside-modern { background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%); border-right: 1px solid #e2e8f0; box-shadow: 0 4px 25px rgba(0, 0, 0, 0.08); width: 280px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);}/* Logo Section */.aside-logo-modern { padding: 2rem 1.5rem 1.5rem; border-bottom: 1px solid #f1f5f9; display: flex; align-items: center; justify-content: space-between; background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(10px);}.logo-container-modern { display: flex; align-items: center; text-decoration: none; transition: all 0.2s ease;}.logo-container-modern:hover { transform: scale(1.02);}.brand-text { font-size: 1.25rem; font-weight: 700; color: #1e293b; letter-spacing: -0.02em;}.btn-toggle-modern { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px; color: #64748b; transition: all 0.2s ease; cursor: pointer;}.btn-toggle-modern:hover { background: #e2e8f0; color: #475569; transform: scale(1.05);}/* Menu Principal */.aside-menu-modern { padding: 1rem 0; height: calc(100vh - 200px); overflow: hidden;}.menu-scroll-modern { height: 100%; overflow-y: auto; padding: 0 1rem; scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent;}.menu-scroll-modern::-webkit-scrollbar { width: 4px;}.menu-scroll-modern::-webkit-scrollbar-track { background: transparent;}.menu-scroll-modern::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 2px;}.menu-scroll-modern::-webkit-scrollbar-thumb:hover { background: #94a3b8;}/* Sections du Menu - STYLE ORIGINAL AMÉLIORÉ */.menu-section-modern { margin-bottom: 2rem;}/* En-tête de section cliquable */.menu-section-header-modern { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1rem; margin: 0 0.25rem 0.5rem; border-radius: 12px; cursor: pointer; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); border: 1px solid transparent; background: #f8fafc;}.menu-section-header-modern:hover { background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%); border-color: #e2e8f0;}.menu-section-header-modern.active { /*background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); */ color: white; box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3);}.menu-section-title-modern { display: flex; align-items: center; gap: 0.75rem; font-weight: 600; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em;}.section-title-text { color: #475569; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em;}"; // line 2487 yield ".menu-section-arrow { color: #94a3b8; transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);}"; // line 2497 yield "/* Contenu des sections */.menu-section-content { max-height: 1000px; overflow: hidden; transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);}.menu-section-modern.collapsed .menu-section-content { max-height: 0;}/* Items du Menu - STYLE ORIGINAL */.menu-item-modern { margin-bottom: 0.25rem;}.menu-link-modern { display: flex; align-items: center; padding: 0.875rem 1rem; border-radius: 12px; text-decoration: none; color: #475569; font-weight: 500; font-size: 0.95rem; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); position: relative; margin: 0 0.25rem;}.menu-link-modern:hover { background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%); color: #334155; text-decoration: none; transform: translateX(4px);}.menu-link-modern.active { /* background: linear-gradient(135deg, #e4e4f7 0%, #e4e5f7 100%); */ color: #6b7787; /* box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3); */ font-weight: 600;}.menu-link-modern.active:hover { transform: translateX(0);}/* Icônes */.menu-icon-modern { width: 22px; height: 22px; margin-right: 0.875rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #64748b; transition: all 0.2s ease;}.menu-link-modern:hover .menu-icon-modern { color: #475569; transform: scale(1.1);}.menu-link-modern.active .menu-icon-modern { color: white;}/* Titres */.menu-title-modern { flex: 1; font-size: 0.95rem; line-height: 1.4;}/* Badges - STYLE ORIGINAL AMÉLIORÉ */.menu-badge-modern { margin-left: auto; display: flex; align-items: center;}.badge-dot-modern { width: 6px; height: 6px; background: #10b981; border-radius: 50%; animation: pulse 2s infinite;}.badge-new-modern { background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); color: white; font-size: 0.7rem; font-weight: 600; padding: 2px 6px; border-radius: 8px; text-transform: uppercase; letter-spacing: 0.05em;}.badge-dev-modern { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); color: white; font-size: 0.65rem; font-weight: 600; padding: 2px 6px; border-radius: 8px; text-transform: uppercase; letter-spacing: 0.05em;}.badge-admin-modern { background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); color: white; font-size: 0.65rem; font-weight: 600; padding: 2px 6px; border-radius: 8px; text-transform: uppercase; letter-spacing: 0.05em;}@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; }}/* Accordéons */.menu-accordion-modern { margin-bottom: 0.25rem;}.menu-accordion-trigger { cursor: pointer;}.menu-arrow-modern { margin-left: auto; color: #94a3b8; transition: transform 0.2s ease;}.menu-accordion-modern.show .menu-arrow-modern { transform: rotate(90deg);}/* Sous-menus */.menu-sub-modern { max-height: 0; overflow: hidden; transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1); margin: 0.5rem 0 0 0; background: rgba(248, 250, 252, 0.5); border-radius: 8px; margin-left: 0.25rem; margin-right: 0.25rem;}.menu-accordion-modern.show .menu-sub-modern { max-height: 300px; padding: 0.5rem 0;}.menu-sub-item-modern { margin-bottom: 0.125rem;}.menu-sub-link-modern { display: flex; align-items: center; padding: 0.625rem 1rem 0.625rem 2.5rem; color: #64748b; text-decoration: none; font-size: 0.9rem; font-weight: 500; border-radius: 8px; transition: all 0.2s ease; margin: 0 0.5rem;}.menu-sub-link-modern:hover { background: rgba(59, 130, 246, 0.1); color: #3b82f6; text-decoration: none; transform: translateX(4px);}.menu-bullet-modern { width: 6px; height: 6px; background: #cbd5e1; border-radius: 50%; margin-right: 0.75rem; transition: all 0.2s ease;}.menu-sub-link-modern:hover .menu-bullet-modern { background: #3b82f6; transform: scale(1.2);}/* Footer */.aside-footer-modern { padding: 1.5rem; border-top: 1px solid #f1f5f9; background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(10px);}.user-panel-modern { display: flex; align-items: center; background: #f8fafc; padding: 1rem; border-radius: 12px; border: 1px solid #e2e8f0; transition: all 0.2s ease;}.user-panel-modern:hover { background: #f1f5f9; border-color: #cbd5e1;}.user-avatar-modern { width: 40px; height: 40px; background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-right: 0.75rem; color: white;}.user-info-modern { flex: 1;}.user-name-modern { font-weight: 600; font-size: 0.9rem; color: #1e293b; line-height: 1.2;}.user-role-modern { font-size: 0.8rem; color: #64748b; margin-top: 0.125rem;}.logout-btn-modern { background: #fee2e2; color: #dc2626; padding: 8px; border-radius: 8px; text-decoration: none; transition: all 0.2s ease; display: flex; align-items: center; justify-content: center;}.logout-btn-modern:hover { background: #fecaca; color: #b91c1c; text-decoration: none; transform: scale(1.05);}/* Responsive */@media (max-width: 1024px) { .aside-modern { transform: translateX(-100%); } .aside-modern.drawer-on { transform: translateX(0); }}/* États actifs pour les liens */.menu-link-modern.active::before { content: ''; position: absolute; left: -0.25rem; top: 50%; transform: translateY(-50%); width: 3px; height: 20px; background: #3b82f6; border-radius: 0 2px 2px 0;}/* Animation d'entrée */.menu-item-modern { animation: slideInLeft 0.3s ease-out;}@keyframes slideInLeft { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); }}/* Amélioration des focus pour l'accessibilité */.menu-link-modern:focus,.menu-sub-link-modern:focus { outline: 2px solid #3b82f6; outline-offset: 2px;}/* Mode réduit */body[data-kt-aside-minimize=\"on\"] .aside-modern { width: 80px; transition: all 0.3s ease;}body[data-kt-aside-minimize=\"on\"] .brand-text,body[data-kt-aside-minimize=\"on\"] .menu-title-modern,body[data-kt-aside-minimize=\"on\"] .menu-arrow-modern,body[data-kt-aside-minimize=\"on\"] .menu-section-title-modern,body[data-kt-aside-minimize=\"on\"] .section-title-text,body[data-kt-aside-minimize=\"on\"] .user-name-modern,body[data-kt-aside-minimize=\"on\"] .user-role-modern { display: none;}body[data-kt-aside-minimize=\"on\"] .aside-logo-modern { justify-content: center; padding: 1.5rem 0.5rem;}body[data-kt-aside-minimize=\"on\"] .btn-toggle-modern { transform: rotate(180deg); margin: 0 auto;}body[data-kt-aside-minimize=\"on\"] .menu-link-modern { justify-content: center; padding: 0.875rem 0.5rem; margin: 0 0.25rem;}body[data-kt-aside-minimize=\"on\"] .menu-icon-modern { margin-right: 0; transform: scale(1.2);}body[data-kt-aside-minimize=\"on\"] .menu-section-header-modern { padding: 0.5rem; justify-content: center;}body[data-kt-aside-minimize=\"on\"] .menu-section-arrow { display: none;}body[data-kt-aside-minimize=\"on\"] .user-panel-modern { justify-content: center; padding: 0.75rem 0.5rem;}body[data-kt-aside-minimize=\"on\"] .user-avatar-modern { margin-right: 0;}body[data-kt-aside-minimize=\"on\"] .logout-btn-modern { position: absolute; bottom: 1rem; right: 1rem;}/* Responsive mobile */@media (max-width: 1024px) { .aside-modern { position: fixed; left: -280px; top: 0; bottom: 0; z-index: 103; transition: all 0.3s ease; } .aside-modern.mobile-show { left: 0; box-shadow: 10px 0 30px rgba(0,0,0,0.1); } /* Overlay pour mobile */ .aside-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.3); z-index: 102; opacity: 0; visibility: hidden; transition: all 0.3s ease; } .aside-overlay.active { opacity: 1; visibility: visible; }}/* ========== AMÉLIORATIONS DU MENU ========== *//* 1. Style moderne pour les liens actifs */.menu-link-modern.active { background: linear-gradient(135deg, rgba(37, 99, 235, 0.15) 0%, rgba(59, 130, 246, 0.1) 100%); color: #1e40af; border-left: 3px solid #3b82f6; font-weight: 600; box-shadow: 0 2px 8px rgba(59, 130, 246, 0.12);}.menu-link-modern.active .menu-icon-modern { color: #3b82f6;}.menu-link-modern.active:hover { background: linear-gradient(135deg, rgba(37, 99, 235, 0.18) 0%, rgba(59, 130, 246, 0.12) 100%); transform: translateX(2px);}/* 2. Menu fermé par défaut */.menu-section-modern { margin-bottom: 1.5rem;}.menu-section-content { max-height: 0; overflow: hidden; transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);}.menu-section-modern.expanded .menu-section-content { max-height: 1000px;}/* 3. Flèche de section */.menu-section-arrow { transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transform: rotate(0deg);}.menu-section-modern.expanded .menu-section-arrow { transform: rotate(180deg);}/* 4. Style d'en-tête de section */.menu-section-header-modern { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 0.75rem 1rem; margin-bottom: 0.5rem; cursor: pointer; transition: all 0.2s ease;}.menu-section-header-modern:hover { background: #f1f5f9; border-color: #cbd5e1;}.menu-section-modern.expanded .menu-section-header-modern { background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%); border-color: #cbd5e1;}/* 5. Maintien de la position de défilement */.menu-scroll-modern { scroll-behavior: auto; /* Désactiver le scroll automatique */}/* 6. Indicateur pour sections avec contenu actif */.menu-section-header-modern.has-active-child { border-left: 3px solid #3b82f6; background: rgba(59, 130, 246, 0.05);}/* 7. Style pour sous-menus actifs */.menu-sub-link-modern.active { background: rgba(59, 130, 246, 0.1); color: #1e40af; font-weight: 500; border-left: 2px solid #3b82f6;}.menu-sub-link-modern.active .menu-bullet-modern { background: #3b82f6; transform: scale(1.1);}/* 8. Animation subtile */.menu-item-modern { animation: fadeIn 0.2s ease-out;}@keyframes fadeIn { from { opacity: 0; transform: translateX(-5px); } to { opacity: 1; transform: translateX(0); }}/* 9. Indicateur visuel pour liens actifs */.menu-link-modern.active::after { content: ''; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 6px; height: 6px; background: #10b981; border-radius: 50%; animation: pulse-active 2s infinite;}@keyframes pulse-active { 0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); } 70% { box-shadow: 0 0 0 4px rgba(16, 185, 129, 0); }}</style><script> document.addEventListener('DOMContentLoaded', function() { // ========== CONFIGURATION ========== const CONFIG = { localStorageKey: 'menuState_v1', autoExpandActive: true, defaultCollapsed: true, saveScrollPosition: true }; // ========== FONCTIONS UTILITAIRES ========== // Sauvegarder l'état du menu function saveMenuState() { const menuState = { sections: {}, scrollPosition: CONFIG.saveScrollPosition ? getScrollPosition() : 0, timestamp: Date.now() }; document.querySelectorAll('.menu-section-modern').forEach(section => { const sectionId = section.querySelector('.menu-section-header-modern')?.dataset?.section; if (sectionId) { menuState.sections[sectionId] = section.classList.contains('expanded') ? 'expanded' : 'collapsed'; } }); localStorage.setItem(CONFIG.localStorageKey, JSON.stringify(menuState)); } // Restaurer l'état du menu function loadMenuState() { try { const saved = localStorage.getItem(CONFIG.localStorageKey); if (!saved) return null; return JSON.parse(saved); } catch (e) { console.warn('Impossible de charger l\\'état du menu:', e); return null; } } // Obtenir la position de défilement function getScrollPosition() { const scrollElement = document.querySelector('.menu-scroll-modern'); return scrollElement ? scrollElement.scrollTop : 0; } // Restaurer la position de défilement function restoreScrollPosition(position) { if (!CONFIG.saveScrollPosition) return; const scrollElement = document.querySelector('.menu-scroll-modern'); if (scrollElement) { // Attendre que le DOM soit complètement chargé setTimeout(() => { scrollElement.scrollTop = position; }, 100); } } // Trouver la section active function findActiveSection() { const currentPath = window.location.pathname; const allLinks = document.querySelectorAll('.menu-link-modern[href], .menu-sub-link-modern[href]'); let activeSectionId = null; allLinks.forEach(link => { const href = link.getAttribute('href'); if (!href) return; // Vérifier si ce lien correspond à la page actuelle if (href === currentPath || (href !== '/' && currentPath.startsWith(href))) { link.classList.add('active'); // Trouver la section parente const section = link.closest('.menu-section-modern'); if (section) { const sectionId = section.querySelector('.menu-section-header-modern')?.dataset?.section; if (sectionId) { activeSectionId = sectionId; } } // Gérer les sous-menus d'accordéon const accordion = link.closest('.menu-accordion-modern'); if (accordion) { accordion.classList.add('show'); } } }); return activeSectionId; } // Initialiser les sections function initializeSections() { const savedState = loadMenuState(); const activeSectionId = findActiveSection(); document.querySelectorAll('.menu-section-modern').forEach(section => { const header = section.querySelector('.menu-section-header-modern'); const sectionId = header.dataset.section; // Vérifier si cette section a un enfant actif const hasActiveChild = section.querySelector('.menu-link-modern.active, .menu-sub-link-modern.active'); if (hasActiveChild) { header.classList.add('has-active-child'); } // Déterminer l'état initial let shouldExpand = false; if (savedState?.sections?.[sectionId]) { // Restaurer l'état sauvegardé shouldExpand = savedState.sections[sectionId] === 'expanded'; } else if (CONFIG.defaultCollapsed) { // Par défaut, toutes les sections sont fermées shouldExpand = false; } else { // Sinon, ouvrir uniquement la section active shouldExpand = sectionId === activeSectionId && CONFIG.autoExpandActive; } // Appliquer l'état if (shouldExpand) { section.classList.add('expanded'); header.classList.add('active'); } else { section.classList.remove('expanded'); header.classList.remove('active'); } // Gestionnaire de clic pour l'en-tête de section header.addEventListener('click', function(e) { e.preventDefault(); e.stopPropagation(); const isExpanded = section.classList.contains('expanded'); const newState = !isExpanded; // Mettre à jour l'état section.classList.toggle('expanded', newState); header.classList.toggle('active', newState); // Sauvegarder l'état saveMenuState(); }); }); // Restaurer la position de défilement if (savedState?.scrollPosition) { restoreScrollPosition(savedState.scrollPosition); } // Sauvegarder l'état initial setTimeout(() => saveMenuState(), 500); } // Gestion des accordéons function initializeAccordions() { const accordions = document.querySelectorAll('.menu-accordion-modern'); accordions.forEach(accordion => { const trigger = accordion.querySelector('.menu-accordion-trigger'); const arrow = accordion.querySelector('.menu-arrow-modern'); if (trigger) { trigger.addEventListener('click', function(e) { e.preventDefault(); e.stopPropagation(); const isActive = accordion.classList.contains('show'); // Fermer tous les autres accordéons (optionnel) // document.querySelectorAll('.menu-accordion-modern.show').forEach(acc => { // if (acc !== accordion) { // acc.classList.remove('show'); // } // }); // Basculer l'état accordion.classList.toggle('show', !isActive); // Animer la flèche if (arrow) { arrow.style.transform = !isActive ? 'rotate(90deg)' : 'rotate(0deg)'; } }); } }); } // Prévenir la perte de position lors des clics function preventScrollReset() { const menuLinks = document.querySelectorAll('.menu-link-modern[href]:not([href^=\"#\"]):not([href^=\"http\"])'); menuLinks.forEach(link => { link.addEventListener('click', function() { // Sauvegarder la position actuelle avant navigation if (CONFIG.saveScrollPosition) { const scrollPos = getScrollPosition(); const currentState = loadMenuState() || {}; currentState.scrollPosition = scrollPos; localStorage.setItem(CONFIG.localStorageKey, JSON.stringify(currentState)); } // Marquer ce lien comme actif immédiatement document.querySelectorAll('.menu-link-modern.active, .menu-sub-link-modern.active').forEach(el => { el.classList.remove('active'); }); this.classList.add('active'); // Mettre à jour l'état de la section parente const parentSection = this.closest('.menu-section-modern'); if (parentSection) { const header = parentSection.querySelector('.menu-section-header-modern'); if (header && !parentSection.classList.contains('expanded')) { parentSection.classList.add('expanded'); header.classList.add('active'); header.classList.add('has-active-child'); } } // Sauvegarder l'état du menu saveMenuState(); }); }); } // Initialiser les effets de survol function initializeHoverEffects() { const menuItems = document.querySelectorAll('.menu-link-modern'); menuItems.forEach(item => { item.addEventListener('mouseenter', function() { if (!this.classList.contains('active')) { this.style.transform = 'translateX(3px)'; } }); item.addEventListener('mouseleave', function() { this.style.transform = 'translateX(0)'; }); }); } // ========== INITIALISATION ========== function initializeMenu() { initializeSections(); initializeAccordions(); preventScrollReset(); initializeHoverEffects(); // Sauvegarder l'état quand l'utilisateur quitte la page window.addEventListener('beforeunload', saveMenuState); // Sauvegarder périodiquement (au cas où) setInterval(saveMenuState, 30000); // Toutes les 30 secondes } // Démarrer l'initialisation initializeMenu();});</script><script>// ========== GESTION DES MODALS ==========document.addEventListener('DOMContentLoaded', function() { // Initialisation des gestionnaires de fichiers initFileUpload();});// MODAL TICKETfunction openTicketModal() { document.getElementById('ticketModal').style.display = 'flex'; document.body.style.overflow = 'hidden';}function closeTicketModal() { document.getElementById('ticketModal').style.display = 'none'; document.body.style.overflow = ''; // Réinitialiser le formulaire const form = document.getElementById('ticketForm'); if (form) form.reset(); document.getElementById('fileList').innerHTML = '';}// MODAL SUPPORTfunction openSupportModal() { document.getElementById('supportModal').style.display = 'flex'; document.body.style.overflow = 'hidden';}function closeSupportModal() { document.getElementById('supportModal').style.display = 'none'; document.body.style.overflow = '';}// MODAL DÉMOfunction openDemoScheduler() { document.getElementById('demoModal').style.display = 'flex'; document.body.style.overflow = 'hidden';}function closeDemoModal() { document.getElementById('demoModal').style.display = 'none'; document.body.style.overflow = '';}// Upload de fichiersfunction initFileUpload() { const fileInput = document.getElementById('fileInput'); if (!fileInput) return; fileInput.addEventListener('change', function(e) { const fileList = document.getElementById('fileList'); fileList.innerHTML = ''; Array.from(this.files).forEach((file, index) => { const fileItem = document.createElement('div'); fileItem.className = 'file-item'; fileItem.style.cssText = ` display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; background: #f8fafc; border-radius: 8px; font-size: 0.85rem; `; fileItem.innerHTML = ` <div style=\"display: flex; align-items: center; gap: 8px;\"> <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\"> <path d=\"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z\"/> <polyline points=\"13 2 13 9 20 9\"/> </svg> <span style=\"color: #1e293b;\">\${file.name}</span> <span style=\"color: #94a3b8; font-size: 0.75rem;\">(\${(file.size / 1024).toFixed(1)} KB)</span> </div> <button type=\"button\" onclick=\"this.parentElement.remove()\" style=\"background: none; border: none; color: #ef4444; cursor: pointer;\"> <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\"> <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"/> <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"/> </svg> </button> `; fileList.appendChild(fileItem); }); });}// Fermeture avec touche Echapdocument.addEventListener('keydown', function(e) { if (e.key === 'Escape') { closeTicketModal(); closeSupportModal(); closeDemoModal(); }});// Empêcher la propagation des clics dans les modalsdocument.querySelectorAll('.modal-container').forEach(modal => { modal.addEventListener('click', function(e) { e.stopPropagation(); });});</script> <div class=\"wrapper d-flex flex-column flex-row-fluid\" id=\"kt_wrapper\"> <div id=\"kt_header\" style=\"\" class=\"header align-items-stretch\"> <div class=\"container d-flex align-items-stretch justify-content-between\"> <div class=\"d-flex align-items-center d-lg-none ms-n3 me-1\" title=\"Show aside menu\"> <div class=\"btn btn-icon btn-active-light-primary\" id=\"kt_aside_mobile_toggle\"> <span class=\"svg-icon svg-icon-2x mt-1\"> <svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"24px\" height=\"24px\" viewBox=\"0 0 24 24\" version=\"1.1\"> <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\"> <rect x=\"0\" y=\"0\" width=\"24\" height=\"24\" /> <rect fill=\"#000000\" x=\"4\" y=\"5\" width=\"16\" height=\"3\" rx=\"1.5\" /> <path d=\"M5.5,15 L18.5,15 C19.3284271,15 20,15.6715729 20,16.5 C20,17.3284271 19.3284271,18 18.5,18 L5.5,18 C4.67157288,18 4,17.3284271 4,16.5 C4,15.6715729 4.67157288,15 5.5,15 Z M5.5,10 L18.5,10 C19.3284271,10 20,10.6715729 20,11.5 C20,12.3284271 19.3284271,13 18.5,13 L5.5,13 C4.67157288,13 4,12.3284271 4,11.5 C4,10.6715729 4.67157288,10 5.5,10 Z\" fill=\"#000000\" opacity=\"0.3\" /> </g> </svg> </span> </div> </div> </div> </div>"; $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof); $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof); return; yield ''; } /** * @codeCoverageIgnore */ public function getTemplateName() { return "Base/_sidebar_admin.html.twig"; } /** * @codeCoverageIgnore */ public function isTraitable() { return false; } /** * @codeCoverageIgnore */ public function getDebugInfo() { return array ( 2353 => 2497, 2345 => 2487, 1569 => 1710, 1489 => 1632, 1464 => 1609, 1456 => 1604, 1452 => 1603, 1449 => 1602, 1447 => 1601, 1433 => 1590, 1430 => 1589, 1426 => 1587, 1420 => 1585, 1418 => 1584, 1413 => 1583, 1411 => 1582, 1394 => 1567, 1325 => 1462, 1316 => 1456, 1307 => 1450, 1298 => 1444, 1289 => 1438, 1249 => 1401, 1223 => 1378, 1179 => 1336, 1175 => 1334, 1169 => 1331, 1161 => 1330, 1152 => 1329, 1149 => 1328, 1147 => 1327, 1141 => 1323, 1137 => 1321, 1133 => 1319, 1131 => 1318, 1118 => 1308, 1091 => 1283, 1072 => 1266, 1070 => 1265, 1022 => 1220, 799 => 1000, 719 => 923, 701 => 908, 667 => 877, 635 => 847, 620 => 736, 602 => 721, 563 => 685, 531 => 656, 513 => 641, 479 => 609, 432 => 468, 429 => 466, 418 => 458, 409 => 452, 400 => 446, 367 => 418, 334 => 388, 330 => 386, 327 => 385, 322 => 381, 315 => 377, 311 => 375, 309 => 374, 294 => 362, 290 => 360, 285 => 356, 279 => 352, 277 => 351, 264 => 341, 260 => 339, 256 => 336, 251 => 332, 245 => 328, 243 => 327, 229 => 316, 225 => 314, 220 => 310, 214 => 306, 208 => 302, 206 => 301, 193 => 291, 189 => 289, 184 => 285, 178 => 281, 172 => 277, 170 => 276, 155 => 264, 151 => 262, 146 => 258, 143 => 251, 136 => 245, 134 => 244, 120 => 233, 116 => 231, 113 => 229, 110 => 228, 107 => 227, 104 => 226, 101 => 225, 98 => 224, 95 => 223, 92 => 222, 72 => 203, 44 => 1,); } public function getSourceContext() { return new Source("<div class=\"d-flex flex-column flex-root\">
<div class=\"page d-flex flex-row flex-column-fluid\">
<div id=\"kt_aside\" class=\"aside aside-modern\" data-kt-drawer=\"true\" data-kt-drawer-name=\"aside\" data-kt-drawer-activate=\"{default: true, lg: false}\" data-kt-drawer-overlay=\"true\" data-kt-drawer-width=\"{default:'280px', '300px': '300px'}\" data-kt-drawer-direction=\"start\" data-kt-drawer-toggle=\"#kt_aside_mobile_toggle\">
<!-- Logo Section Modernisée -->
<div class=\"aside-logo-modern\" id=\"kt_aside_logo\">
<a href=\"/dashboard\" class=\"logo-container-modern\">
<span class=\"brand-text\">MAZEGO</span>
</a>
<div id=\"kt_aside_toggle\" class=\"btn-toggle-modern\" data-kt-toggle=\"true\" data-kt-toggle-state=\"active\" data-kt-toggle-target=\"body\" data-kt-toggle-name=\"aside-minimize\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m15 18-6-6 6-6\"/>
</svg>
</div>
</div>
<!-- Menu Navigation Moderne -->
<div class=\"aside-menu-modern\">
<div class=\"menu-scroll-modern\" id=\"kt_aside_menu_wrapper\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"{default: false, lg: true}\" data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_aside_logo, #kt_aside_footer\" data-kt-scroll-wrappers=\"#kt_aside_menu\" data-kt-scroll-offset=\"0\">
<div class=\"menu-modern\" id=\"kt_aside_menu\" data-kt-menu=\"true\">
<!-- 📄 FACTURE ÉLECTRONIQUE -->
{# <div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"facture-electronique\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">FACTURE ÉLECTRONIQUE</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">NEW</span>
</div>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-facture-electronique\">
{% set hasCertificate = user_certificate is defined and user_certificate != null %}
{% set hasTTNConfig = user_ttn_config is defined and user_ttn_config|length > 0 %}
{% set isActivated = user_activation is defined and user_activation != null %}
{% if not isActivated %}
<!-- Activer la facture électronique -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_step1') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
<line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/>
<line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/>
<path d=\"M12 7v6\"/>
<path d=\"M9 10h6\"/>
<circle cx=\"12\" cy=\"10\" r=\"2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Activer la facture électronique</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">NEW</span>
</div>
</a>
</div>
{% else %}
<!-- Dashboard Facture Électronique -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('dashboard_facture_electronique') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
<line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/>
<line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/>
<path d=\"M12 11v-4\"/>
<circle cx=\"12\" cy=\"9\" r=\"1\" fill=\"currentColor\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Tableau de bord</span>
</a>
</div>
{% endif %}
{% if isActivated or (hasCertificate and not hasTTNConfig) %}
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_step2') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"M12 16v-4\"/>
<circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"currentColor\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Configuration TTN</span>
{% if not hasTTNConfig %}
<div class=\"menu-badge-modern\">
<span class=\"badge-dot-modern\"></span>
</div>
{% endif %}
</a>
</div>
{% endif %}
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_certificate') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/>
<circle cx=\"12\" cy=\"12\" r=\"2\"/>
<path d=\"M12 6v2\"/>
<path d=\"M12 16v2\"/>
<path d=\"M6 12h2\"/>
<path d=\"M16 12h2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Certificat de signature</span>
<span class=\"badge-new-modern\">NEW</span>
{% if hasCertificate %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span>
</div>
{% endif %}
</a>
</div>
{% if isActivated %}
<div class=\"menu-item-modern\">
<div class=\"menu-link-modern\" style=\"cursor: default;\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M4 7h16\"/>
<path d=\"M7 7v10\"/>
<path d=\"M17 7v10\"/>
<rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"/>
<path d=\"M9 11h6\"/>
<path d=\"M12 14v-3\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Signatures restantes</span>
<div class=\"menu-badge-modern\">
<span class=\"badge bg-info rounded-pill px-2 py-1\" style=\"font-size: 0.75rem; font-weight: 600;\">
{{ user_signatures_remaining ?? 300 }} / {{ user_signatures_total ?? 300 }}
</span>
</div>
</div>
</div>
{% endif %}
{% if isActivated %}
<div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\">
<div class=\"menu-link-modern menu-accordion-trigger\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
<path d=\"M8 9h.01\"/>
<path d=\"M16 21v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Historique</span>
<div class=\"menu-arrow-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m9 18 6-6-6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-sub-modern\">
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('facture_electronique_historique_factures') }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Factures émises</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('facture_electronique_historique_paiements') }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Paiements</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('facture_electronique_rapports') }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Rapports</span>
</a>
</div>
</div>
</div>
{% endif %}
</div>
</div> #}
<!-- 📄 FACTURE ÉLECTRONIQUE -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"facture-electronique\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">FACTURE ÉLECTRONIQUE</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">NEW</span>
</div>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-facture-electronique\">
{# État du service - À définir dans votre contrôleur #}
{% set hasCertificate = user_certificate is defined and user_certificate != null %}
{% set hasDigiGoEmail = digigo_email is defined and digigo_email is not empty %}
{% set hasTTNConfig = user_ttn_config is defined and user_ttn_config|length > 0 %}
{% set isActivated = user_activation is defined and user_activation != null %}
{% set signatures_remaining = user_signatures_remaining is defined ? user_signatures_remaining : 300 %}
{% set signatures_total = user_signatures_total is defined ? user_signatures_total : 300 %}
{% set has_factures = donnees_electroniques is defined and donnees_electroniques|length > 0 %}
{# ===== ÉTAPE 1 : CONFIGURATION DIGIGO ===== #}
<!-- Configuration DigiGo / Email -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_setup') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"/>
<path d=\"m22 7-10 7L2 7\"/>
<circle cx=\"12\" cy=\"15\" r=\"2\"/>
<path d=\"M12 15v-4\"/>
<path d=\"M9 11h6\"/>
</svg>
</div>
<span class=\"menu-title-modern\">1. Configuration DigiGo</span>
{% if hasDigiGoEmail %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">✓
{# {{ digigo_email }} #}
</span>
</div>
{% else %}
{# <div class=\"menu-badge-modern\">
<span class=\"badge-dot-modern\"></span>
</div> #}
{# <div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">*</span>
</div> #}
{% endif %}
</a>
</div>
{# ===== ÉTAPE 2 : CERTIFICAT DE SIGNATURE ===== #}
<!-- Certificat de signature -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_step1') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/>
<circle cx=\"12\" cy=\"12\" r=\"2\"/>
<path d=\"M12 6v2\"/>
<path d=\"M12 16v2\"/>
<path d=\"M6 12h2\"/>
<path d=\"M16 12h2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">2. Certificat de signature</span>
{% if hasCertificate %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span>
</div>
{% else %}
<div class=\"menu-badge-modern\">
<span class=\"badge-dot-modern\"></span>
</div>
{% endif %}
</a>
</div>
{# ===== ÉTAPE 3 : CONFIGURATION TTN ===== #}
<!-- Configuration TTN -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_step2') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"M12 16v-4\"/>
<circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"currentColor\"/>
<path d=\"M8 12h8\"/>
</svg>
</div>
<span class=\"menu-title-modern\">3. Configuration TTN</span>
{% if hasTTNConfig %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span>
</div>
{% else %}
<div class=\"menu-badge-modern\">
<span class=\"badge-dot-modern\"></span>
</div>
{% endif %}
</a>
</div>
{# ===== ÉTAPE 4 : ACTIVATION & PAIEMENT ===== #}
<!-- Activation et paiement -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_step3') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"5\" width=\"20\" height=\"14\" rx=\"2\"/>
<line x1=\"2\" y1=\"10\" x2=\"22\" y2=\"10\"/>
<circle cx=\"12\" cy=\"15\" r=\"2\"/>
<path d=\"M12 15v-3\"/>
<path d=\"M9 12h6\"/>
</svg>
</div>
<span class=\"menu-title-modern\">4. Activation & paiement</span>
{% if isActivated %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIVÉ</span>
</div>
{% endif %}
</a>
</div>
{# ===== SÉPARATEUR ===== #}
<div style=\"height: 1px; background: linear-gradient(90deg, transparent, #e2e8f0, transparent); margin: 0.5rem 1rem;\"></div>
{# ===== LIEN RAPIDE VERS LE CERTIFICAT ===== #}
<!-- Gestion des certificats -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_certificate') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M4 7h16\"/>
<path d=\"M7 7v10\"/>
<path d=\"M17 7v10\"/>
<rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Gestion des certificats</span>
{% if hasCertificate %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">ACTIF</span>
</div>
{% endif %}
</a>
</div>
{# ===== NOUVEAU : LISTE DES FACTURES ÉLECTRONIQUES ===== #}
<!-- Liste des factures électroniques (accessible à tous) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_electronique_liste') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14 2 14 8 20 8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
<path d=\"M8 9h.01\"/>
</svg>
</div>
<span class=\"menu-title-modern\">factures électroniques</span>
{% if has_factures %}
<div class=\"menu-badge-modern\">
<span class=\"badge bg-primary rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">
{{ donnees_electroniques|length }}
</span>
</div>
{% endif %}
</a>
</div>
{# ===== SI SERVICE ACTIVÉ ===== #}
{% if isActivated %}
<!-- Dashboard Facture Électronique -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('dashboard_facture_electronique') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
<line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/>
<line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/>
<path d=\"M12 11v-4\"/>
<circle cx=\"12\" cy=\"9\" r=\"1\" fill=\"currentColor\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Tableau de bord</span>
</a>
</div>
<!-- Compteur de signatures -->
<div class=\"menu-item-modern\">
<div class=\"menu-link-modern\" style=\"cursor: default;\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M4 7h16\"/>
<path d=\"M7 7v10\"/>
<path d=\"M17 7v10\"/>
<rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"/>
<path d=\"M9 11h6\"/>
<path d=\"M12 14v-3\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Signatures restantes</span>
<div class=\"menu-badge-modern\">
<span class=\"badge bg-info rounded-pill px-2 py-1\" style=\"font-size: 0.75rem; font-weight: 600;\">
{{ signatures_remaining }} / {{ signatures_total }}
</span>
</div>
</div>
</div>
<!-- Historique et rapports (accordéon) -->
<div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\">
<div class=\"menu-link-modern menu-accordion-trigger\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14 2 14 8 20 8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
<path d=\"M16 21v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Historique & rapports</span>
<div class=\"menu-arrow-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m9 18 6-6-6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-sub-modern\">
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('facture_electronique_historique_factures') }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Factures émises</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('facture_electronique_historique_paiements') }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Paiements</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('facture_electronique_rapports') }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Rapports mensuels</span>
</a>
</div>
</div>
</div>
{% endif %}
{# ===== LIEN D'AIDE ===== #}
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"#\" onclick=\"openSupportModal(); return false;\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"M12 16v-4\"/>
<circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"currentColor\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Aide & support</span>
</a>
</div>
</div>
</div>
<!-- 📊 TABLEAU DE BORD -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"dashboard\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">TABLEAU DE BORD</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-dashboard\">
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern active\" href=\"/dashboard\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"3\" y=\"3\" width=\"7\" height=\"7\"/>
<rect x=\"14\" y=\"3\" width=\"7\" height=\"7\"/>
<rect x=\"14\" y=\"14\" width=\"7\" height=\"7\"/>
<rect x=\"3\" y=\"14\" width=\"7\" height=\"7\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Tableau de Bord</span>
</a>
</div>
</div>
</div>
{# <!-- 💼 VENTES (CLIENTS) -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"ventes\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">VENTES (CLIENTS)</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-ventes\">
<!-- Devis & Propositions -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/devis/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Devis & Propositions</span>
</a>
</div>
<!-- Bons de Livraison -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('devis_index_bon_livraison') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M12 2v8l4-4\"/>
<path d=\"M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0z\"/>
<path d=\"M16 12l-4 4-4-4\"/>
<path d=\"M12 16V8\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Bons de Livraison</span>
</a>
</div>
<!-- Bons de Réparation -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('reparation_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Bons de Réparation</span>
</a>
</div>
<!-- Factures Clients -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/facture/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
<path d=\"M12 21v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Factures Clients</span>
</a>
</div>
<!-- Point de Vente PRO -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/caisse/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
<line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/>
<line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/>
<circle cx=\"12\" cy=\"10\" r=\"2\"/>
<path d=\"M12 14v-4\"/>
<path d=\"M16 10h4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Point de Vente PRO</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">PRO</span>
</div>
</a>
</div>
</div>
</div> #}
<!-- 💼 VENTES (CLIENTS) -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"ventes\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">VENTES (CLIENTS)</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-ventes\">
<!-- Devis & Propositions -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/devis/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Devis & Propositions</span>
</a>
</div>
<!-- Bons de Livraison -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('devis_index_bon_livraison') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M12 2v8l4-4\"/>
<path d=\"M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0z\"/>
<path d=\"M16 12l-4 4-4-4\"/>
<path d=\"M12 16V8\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Bons de Livraison</span>
</a>
</div>
<!-- Bons de Réparation -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('reparation_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Bons de Réparation</span>
</a>
</div>
<!-- Factures Clients -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/facture/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M10 9h4\"/>
<path d=\"M12 21v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Factures Clients</span>
</a>
</div>
<!-- Retours Clients -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('retour_client_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m3 3 3 9h12l3-9H3z\"/>
<path d=\"M6 12h12\"/>
<path d=\"M12 3v18\"/>
<path d=\"M15 6l-3 3 3 3\"/>
<path d=\"M9 6l3-3-3-3\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Retours Clients</span>
</a>
</div>
<!-- Point de Vente PRO -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/caisse/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
<line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"/>
<line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"/>
<circle cx=\"12\" cy=\"10\" r=\"2\"/>
<path d=\"M12 14v-4\"/>
<path d=\"M16 10h4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Point de Vente PRO</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">PRO</span>
</div>
</a>
</div>
<!-- Rapports de vente (par salarié) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('caisse_rapports_vendeurs') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M3 3v18h18\"/>
<path d=\"M18 17V9\"/>
<path d=\"M13 17V5\"/>
<path d=\"M8 17v-3\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Rapports de vente</span>
</a>
</div>
<!-- Clôtures de caisse -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('caisse_cloture_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"3\" y=\"11\" width=\"18\" height=\"10\" rx=\"2\"/>
<path d=\"M7 11V7a5 5 0 0 1 10 0v4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Clôtures de caisse</span>
</a>
</div>
</div>
</div>
{#
<!-- 🏪 ACHATS (FOURNISSEURS) -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"achats\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">ACHATS (FOURNISSEURS)</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-achats\">
<!-- Fournisseurs -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/fournisseur/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/>
<circle cx=\"9\" cy=\"7\" r=\"4\"/>
<path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"/>
<path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Fournisseurs</span>
</a>
</div>
<!-- Bons de Commande -->
<!-- Bons de Commande Achat - À DÉVELOPPER -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('devis_index_bon_commande') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\"/>
<path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"/>
<path d=\"M8 11h8\"/>
<path d=\"M8 15h8\"/>
<circle cx=\"12\" cy=\"4\" r=\"1\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Bons de Commande Achat</span>
</a>
</div>
<!-- Réceptions (Entrées Stock) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/entrees/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M5 12h14\"/>
<path d=\"M12 5v14\"/>
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>
<path d=\"M8 8h8v8H8z\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Réceptions (Entrées Stock)</span>
</a>
</div>
<!-- Retours Fournisseurs -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"/>
<polyline points=\"9 22 9 12 15 12 15 22\"/>
<path d=\"m9 12 3-3 3 3\"/>
<path d=\"M12 16v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Retours Fournisseurs</span>
</a>
</div>
<!-- Factures Fournisseurs - À DÉVELOPPER -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M8 9h8\"/>
<path d=\"M12 21v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Factures Fournisseurs</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-dev-modern\">À DÉV</span>
</div>
</a>
</div>
</div>
</div> #}
<!-- 🏪 ACHATS (FOURNISSEURS) -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"achats\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">ACHATS (FOURNISSEURS)</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-achats\">
<!-- Fournisseurs -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/fournisseur/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/>
<circle cx=\"9\" cy=\"7\" r=\"4\"/>
<path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"/>
<path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Fournisseurs</span>
</a>
</div>
<!-- Bons de Commande Achat -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('devis_index_bon_commande') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\"/>
<path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"/>
<path d=\"M8 11h8\"/>
<path d=\"M8 15h8\"/>
<circle cx=\"12\" cy=\"4\" r=\"1\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Bons de Commande Achat</span>
</a>
</div>
<!-- Réceptions (Entrées Stock) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/entrees/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M5 12h14\"/>
<path d=\"M12 5v14\"/>
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>
<path d=\"M8 8h8v8H8z\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Réceptions (Entrées Stock)</span>
</a>
</div>
<!-- Retours Fournisseurs -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('retour_fournisseur_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"/>
<polyline points=\"9 22 9 12 15 12 15 22\"/>
<path d=\"m9 12 3-3 3 3\"/>
<path d=\"M12 16v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Retours Fournisseurs</span>
</a>
</div>
<!-- Factures Fournisseurs -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('facture_fournisseur_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"/>
<polyline points=\"14,2 14,8 20,8\"/>
<line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"/>
<line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"/>
<path d=\"M8 9h8\"/>
<path d=\"M12 21v-4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Factures Fournisseurs</span>
</a>
</div>
</div>
</div>
<!-- 📦 STOCK & LOGISTIQUE -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"stock\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">STOCK & LOGISTIQUE</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-stock\">
<!-- Stock Global -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/stock/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M3 9h18v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V9Z\"/>
<path d=\"m3 9 2.45-4.9A2 2 0 0 1 7.24 3h9.52a2 2 0 0 1 1.8 1.1L21 9\"/>
<path d=\"M12 3v6\"/>
<path d=\"M9 12l3 3 3-3\"/>
<path d=\"M12 15v6\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Stock Global</span>
</a>
</div>
<!-- Expéditions (Sorties) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/sorties/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M5 12h14\"/>
<path d=\"M12 5l7 7-7 7\"/>
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>
<path d=\"M8 8h8v8H8z\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Expéditions (Sorties)</span>
</a>
</div>
<!-- Réceptions (Entrées) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/entrees/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M5 12h14\"/>
<path d=\"M12 5v14\"/>
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>
<path d=\"M8 8h8v8H8z\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Réceptions (Entrées)</span>
</a>
</div>
<!-- Inventaire -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('inventaire_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"/>
<path d=\"M3 9h18\"/>
<path d=\"M9 21V9\"/>
<path d=\"M15 21V9\"/>
<path d=\"M12 9v12\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Inventaire</span>
</a>
</div>
</div>
</div>
<!-- 👥 CONTACTS & DONNÉES -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"contacts\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">CONTACTS & DONNÉES</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-contacts\">
<!-- Clients -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/client/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/>
<circle cx=\"12\" cy=\"7\" r=\"4\"/>
<path d=\"M16 21v-2a4 4 0 0 0-4-4H8\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Clients</span>
</a>
</div>
<!-- Fournisseurs -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/fournisseur/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/>
<circle cx=\"9\" cy=\"7\" r=\"4\"/>
<path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"/>
<path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Fournisseurs</span>
</a>
</div>
<!-- Produits & Services -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/produit/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m7.5 4.27 9 5.15\"/>
<path d=\"M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z\"/>
<path d=\"m3.3 7 8.7 5 8.7-5\"/>
<path d=\"M12 22V12\"/>
<circle cx=\"12\" cy=\"12\" r=\"2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Produits & Services</span>
</a>
</div>
</div>
</div>
<!-- 📈 MARKETING (PRO) -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"marketing\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">MARKETING (PRO)</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-marketing\">
<!-- Prospection Email PRO -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/prospect/email\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z\"/>
<polyline points=\"22,6 12,13 2,6\"/>
<path d=\"M12 13l10-7\"/>
<path d=\"M2 6l10 7 10-7\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Prospection Email PRO</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">PRO</span>
</div>
</a>
</div>
<!-- Prospection IA PRO -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/prospect/centres\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z\"/>
<path d=\"M12 2.5v19\"/>
<path d=\"M2 8l10 6 10-6\"/>
<path d=\"M12 22V12\"/>
<circle cx=\"12\" cy=\"12\" r=\"2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Prospection IA PRO</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">PRO</span>
</div>
</a>
</div>
<!-- Dashboard Prospect PRO -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/dashboard-prospect\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"10\"/>
<line x1=\"18\" y1=\"20\" x2=\"18\" y2=\"4\"/>
<line x1=\"6\" y1=\"20\" x2=\"6\" y2=\"16\"/>
<circle cx=\"12\" cy=\"10\" r=\"2\"/>
<circle cx=\"18\" cy=\"4\" r=\"2\"/>
<circle cx=\"6\" cy=\"16\" r=\"2\"/>
<path d=\"M12 10v10\"/>
<path d=\"M18 4v16\"/>
<path d=\"M6 16v4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Dashboard Prospect PRO</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">PRO</span>
</div>
</a>
</div>
<!-- Site Web Pro -->
<div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\">
<div class=\"menu-link-modern menu-accordion-trigger\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"m4.93 4.93 4.24 4.24\"/>
<path d=\"m14.83 9.17 4.24-4.24\"/>
<path d=\"m14.83 14.83 4.24 4.24\"/>
<path d=\"m9.17 14.83-4.24 4.24\"/>
<path d=\"M12 2v20\"/>
<path d=\"M2 12h20\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Site Web Pro</span>
<div class=\"menu-arrow-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m9 18 6-6-6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-sub-modern\">
<div class=\"menu-sub-item-modern\">
<a href=\"/frontend\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Créer Mon Site</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"/voir-mon-site\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Voir Mon Site</span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- ⚙️ PARAMÈTRES -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"parametres\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">PARAMÈTRES</span>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-parametres\">
<!-- Mon Entreprise -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/entreprise/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M3 21h18\"/>
<path d=\"M5 21V7l8-4v18\"/>
<path d=\"M19 21V11l-6-4\"/>
<path d=\"M9 9h6\"/>
<path d=\"M9 13h6\"/>
<path d=\"M9 17h6\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Mon Entreprise</span>
</a>
</div>
<!-- Salariés -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('salarie_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/>
<circle cx=\"9\" cy=\"7\" r=\"4\"/>
<path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"/>
<path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Salariés</span>
</a>
</div>
<!-- Mon Compte -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/>
<circle cx=\"12\" cy=\"7\" r=\"4\"/>
<path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>
<path d=\"M12 12v4\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Mon Compte</span>
</a>
</div>
<!-- Intégrations -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M12 2v8l4-4\"/>
<path d=\"M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0z\"/>
<path d=\"M8 12h8\"/>
<path d=\"m12 16 4-4-4-4\"/>
<circle cx=\"12\" cy=\"12\" r=\"2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Intégrations</span>
</a>
</div>
<!-- Équipe & Utilisateurs (Admin seulement) -->
{% if is_granted('ROLE_ADMIN') %}
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"/utilisateurs/\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/>
<circle cx=\"9\" cy=\"7\" r=\"4\"/>
<path d=\"m22 21-3-3m0 0a5.5 5.5 0 1 0-7.78-7.78 5.5 5.5 0 0 0 7.78 7.78Z\"/>
<path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Équipe & Utilisateurs</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-admin-modern\">ADMIN</span>
</div>
</a>
</div>
{% endif %}
</div>
</div>
<!-- 🎫 TICKETS & SUPPORT -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"tickets\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">TICKETS & SUPPORT</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">NEW</span>
</div>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-tickets\">
<!-- ✅ LIEN PRINCIPAL - DYNAMIQUE SELON LE RÔLE -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('ticket_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/>
<path d=\"M8 10h.01\"/>
<path d=\"M12 10h.01\"/>
<path d=\"M16 10h.01\"/>
</svg>
</div>
<span class=\"menu-title-modern\">
{% if is_granted('ROLE_ADMIN') %}
Gestion des tickets
{% else %}
Mes tickets
{% endif %}
</span>
<!-- BADGE AVEC NOMBRE DE TICKETS -->
<div class=\"menu-badge-modern\">
{% set ticket_count = tickets_count ?? 0 %}
{% if ticket_count > 0 %}
<span class=\"badge bg-{% if is_granted('ROLE_ADMIN') %}primary{% else %}info{% endif %} rounded-pill px-2 py-1\"
style=\"font-size: 0.7rem; background: {% if is_granted('ROLE_ADMIN') %}#3b82f6{% else %}#0ea5e9{% endif %}; color: white;\">
{{ ticket_count }}
</span>
{% else %}
<span class=\"badge-dot-modern\"></span>
{% endif %}
</div>
</a>
</div>
<!-- LIEN RAPIDE: CRÉER UN TICKET (OPTIONNEL) -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"#\" onclick=\"openTicketModal(); return false;\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/>
<line x1=\"9\" y1=\"10\" x2=\"15\" y2=\"10\"/>
<line x1=\"12\" y1=\"7\" x2=\"12\" y2=\"13\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Nouveau ticket</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\" style=\"background: #10b981;\">+</span>
</div>
</a>
</div>
</div>
</div>
<!-- 🎓 FORMATION & TUTORIELS -->
<div class=\"menu-section-modern\">
<div class=\"menu-section-header-modern\" data-section=\"formation\">
<div class=\"menu-section-title-modern\">
<span class=\"section-title-text\">FORMATION & TUTORIELS</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-new-modern\">NEW</span>
</div>
</div>
<div class=\"menu-section-arrow\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m6 9 6 6 6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-section-content\" id=\"section-formation\">
<!-- Centre de formation -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('formation_index') }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z\"/>
<polyline points=\"3.27 6.96 12 12.01 20.73 6.96\"/>
<line x1=\"12\" y1=\"22.08\" x2=\"12\" y2=\"12\"/>
<circle cx=\"12\" cy=\"12\" r=\"2\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Centre de formation</span>
<div class=\"menu-badge-modern\">
<span class=\"badge bg-primary rounded-pill px-2 py-1\" style=\"font-size: 0.7rem;\">
6
</span>
</div>
</a>
</div>
<!-- Séparateur -->
<div style=\"height: 1px; background: linear-gradient(90deg, transparent, #e2e8f0, transparent); margin: 0.5rem 1rem;\"></div>
<!-- Démo générale -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"{{ path('formation_video', {id: 1}) }}\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<polygon points=\"5 3 19 12 5 21 5 3\"/>
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Démo Mazego complète</span>
<div class=\"menu-badge-modern\">
<span class=\"badge bg-success rounded-pill px-2 py-1\" style=\"font-size: 0.65rem;\">15 min</span>
</div>
</a>
</div>
<!-- Tutoriels par catégorie (accordéon) -->
<div class=\"menu-accordion-modern\" data-kt-menu-trigger=\"click\">
<div class=\"menu-link-modern menu-accordion-trigger\">
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/>
<line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"9\"/>
<line x1=\"9\" y1=\"13\" x2=\"15\" y2=\"13\"/>
<line x1=\"9\" y1=\"17\" x2=\"15\" y2=\"17\"/>
<circle cx=\"6\" cy=\"9\" r=\"1\"/>
<circle cx=\"6\" cy=\"13\" r=\"1\"/>
<circle cx=\"6\" cy=\"17\" r=\"1\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Tutoriels par module</span>
<div class=\"menu-arrow-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"m9 18 6-6-6-6\"/>
</svg>
</div>
</div>
<div class=\"menu-sub-modern\">
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('formation_video', {id: 2}) }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Créer un devis</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('formation_video', {id: 3}) }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Créer une facture</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('formation_video', {id: 4}) }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Bon de commande</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('formation_video', {id: 5}) }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Bon de livraison</span>
</a>
</div>
<div class=\"menu-sub-item-modern\">
<a href=\"{{ path('formation_video', {id: 6}) }}\" class=\"menu-sub-link-modern\">
<span class=\"menu-bullet-modern\"></span>
<span>Prospection BtoB</span>
</a>
</div>
</div>
</div>
<!-- Documentation -->
<div class=\"menu-item-modern\">
<a class=\"menu-link-modern\" href=\"https://www.canva.com/design/DAGsM4IzHX4/-xVezdK8KNcDQowJgMm6Xw/view?utm_content=DAGsM4IzHX4&utm_campaign=designshare&utm_medium=link2&utm_source=uniquelinks&utlId=hab518c912f\" >
<div class=\"menu-icon-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M4 19.5A2.5 2.5 0 0 1 6.5 17H20\"/>
<path d=\"M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z\"/>
<path d=\"M8 7h8\"/>
<path d=\"M8 11h8\"/>
<path d=\"M8 15h6\"/>
</svg>
</div>
<span class=\"menu-title-modern\">Documentation</span>
<div class=\"menu-badge-modern\">
<span class=\"badge-dev-modern\">SOON</span>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer moderne avec nouveaux boutons -->
<div class=\"aside-footer-modern\" id=\"kt_aside_footer\">
<!-- Support & Ticket Buttons -->
<div class=\"support-actions-modern\">
<!-- Bouton Créer un ticket -->
<button class=\"support-btn-modern ticket-btn\" onclick=\"openTicketModal()\">
<div class=\"support-icon\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/>
<path d=\"M8 10h.01\"/>
<path d=\"M12 10h.01\"/>
<path d=\"M16 10h.01\"/>
</svg>
</div>
<span class=\"support-text\">Créer un ticket</span>
<span class=\"badge-new-ticket\">NEW</span>
</button>
<!-- Bouton Support -->
<button class=\"support-btn-modern\" onclick=\"openSupportModal()\">
<div class=\"support-icon\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\"/>
<line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\"/>
</svg>
</div>
<span class=\"support-text\">Support</span>
</button>
<!-- Dans le aside-footer-modern, après les boutons support -->
{# <div class=\"facture-electronique-status-modern mt-3\" id=\"facture-electronique-status\">
{% set hasCertificate = user_certificate is defined and user_certificate != null %}
{% set hasTTNConfig = user_ttn_config is defined and user_ttn_config|length > 0 %}
{% set isActivated = user_activation is defined and user_activation != null %}
{% if not isActivated %}
<div class=\"alert alert-warning mb-0 p-2\" style=\"border-radius: 10px; background: #fffbeb; border: 1px solid #fcd34d;\">
<div class=\"d-flex align-items-center gap-2\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#d97706\" stroke-width=\"2\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"/>
<line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"/>
</svg>
<span style=\"font-size: 0.75rem; color: #92400e;\">
<strong>Facture électronique</strong><br>
<a href=\"{{ path('facture_electronique_step1') }}\" style=\"color: #b45309; text-decoration: underline;\">
Activer maintenant
</a>
</span>
</div>
</div>
{% elseif not hasTTNConfig %}
<div class=\"alert alert-info mb-0 p-2\" style=\"border-radius: 10px; background: #e0f2fe; border: 1px solid #7dd3fc;\">
<div class=\"d-flex align-items-center gap-2\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#0284c7\" stroke-width=\"2\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"M12 16v-4\"/>
<circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"#0284c7\"/>
</svg>
<span style=\"font-size: 0.75rem; color: #075985;\">
<strong>Configuration TTN requise</strong><br>
<a href=\"{{ path('facture_electronique_step2') }}\" style=\"color: #0369a1; text-decoration: underline;\">
Configurer maintenant
</a>
</span>
</div>
</div>
{% endif %}
</div> #}
</div>
<!-- User panel existant -->
<div class=\"user-panel-modern\">
<div class=\"user-avatar-modern\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/>
<circle cx=\"12\" cy=\"7\" r=\"4\"/>
</svg>
</div>
<div class=\"user-info-modern\">
<div class=\"user-name-modern\">
{% if app.user and app.user.firstname is defined %}
{{ app.user.firstname ~ ' ' ~ app.user.lastname }}
{% elseif app.user and app.user.nomComplet is defined %}
{{ app.user.nomComplet }}
{% else %}
Utilisateur
{% endif %}
</div>
<div class=\"user-role-modern\">{{ is_granted('ROLE_ADMIN') ? 'Administrateur' : (is_granted('ROLE_SALARIE') ? 'Salarié' : 'Utilisateur') }}</div>
</div>
<a href=\"/deconnexion\" class=\"logout-btn-modern\" title=\"Déconnexion\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
<path d=\"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4\"/>
<polyline points=\"16,17 21,12 16,7\"/>
<line x1=\"21\" y1=\"12\" x2=\"9\" y2=\"12\"/>
</svg>
</a>
</div>
{% if is_granted('ROLE_PREVIOUS_ADMIN') %}
<div class=\"alert alert-warning text-center mt-2\">
Vous êtes connecté en tant que {{ app.user.email }}
<a href=\"{{ path('user_index', {'_switch_user': '_exit'}) }}\" class=\"btn btn-sm btn-danger ms-3\">
<i class=\"fas fa-sign-out-alt\"></i> Revenir
</a>
</div>
{% endif %}
</div>
</div>
<!-- MODAL CRÉER UN TICKET -->
<div id=\"ticketModal\" class=\"modal-modern\" style=\"display: none;\">
<div class=\"modal-overlay\" onclick=\"closeTicketModal()\"></div>
<div class=\"modal-container\">
<div class=\"modal-header\">
<div class=\"modal-title\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"2\">
<path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/>
</svg>
<span>Créer un nouveau ticket</span>
</div>
<button class=\"modal-close\" onclick=\"closeTicketModal()\">×</button>
</div>
<div class=\"modal-body\">
<form id=\"ticketForm\" action=\"{{ path('ticket_create') }}\" method=\"POST\" enctype=\"multipart/form-data\">
<div class=\"form-group\">
<label class=\"form-label\">Sujet</label>
<input type=\"text\" name=\"subject\" class=\"form-control\" placeholder=\"Ex: Problème d'impression de facture\" required>
</div>
<div class=\"form-group\">
<label class=\"form-label\">Message</label>
<textarea name=\"message\" class=\"form-control\" rows=\"5\" placeholder=\"Décrivez votre problème en détail...\" required></textarea>
</div>
<div class=\"form-group\">
<label class=\"form-label\">Pièces jointes</label>
<div class=\"file-upload-area\">
<input type=\"file\" name=\"attachments[]\" id=\"fileInput\" multiple style=\"display: none;\">
<button type=\"button\" class=\"file-upload-btn\" onclick=\"document.getElementById('fileInput').click()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">
<path d=\"M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48\"/>
</svg>
Ajouter des fichiers
</button>
<span class=\"file-hint\">PNG, JPG, PDF (max 10MB)</span>
</div>
<div id=\"fileList\" class=\"file-list\"></div>
</div>
</form>
</div>
<div class=\"modal-footer\">
<button class=\"btn-secondary\" onclick=\"closeTicketModal()\">Annuler</button>
<button type=\"submit\" form=\"ticketForm\" class=\"btn-primary\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">
<path d=\"M20 6L9 17l-5-5\"/>
</svg>
Valider
</button>
</div>
</div>
</div>
<!-- MODAL SUPPORT -->
<div id=\"supportModal\" class=\"modal-modern\" style=\"display: none;\">
<div class=\"modal-overlay\" onclick=\"closeSupportModal()\"></div>
<div class=\"modal-container support-modal\">
<div class=\"modal-header\">
<div class=\"modal-title\">
<div class=\"support-logo\">
<span class=\"brand-text-modal\">MAZEGO</span>
</div>
</div>
<button class=\"modal-close\" onclick=\"closeSupportModal()\">×</button>
</div>
<div class=\"modal-body text-center\">
<div class=\"support-avatar\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"1.5\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<path d=\"M12 16v-4\"/>
<circle cx=\"12\" cy=\"8\" r=\"1\" fill=\"#3b82f6\"/>
</svg>
</div>
<h3 class=\"support-title\">Équipe de support</h3>
<div class=\"support-info-list\">
<div class=\"support-info-item\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\">
<rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"/>
<path d=\"m22 7-10 7L2 7\"/>
</svg>
<span>support@mazego.fr</span>
</div>
<div class=\"support-info-item\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\">
<rect x=\"5\" y=\"2\" width=\"14\" height=\"20\" rx=\"2\"/>
<line x1=\"12\" y1=\"18\" x2=\"12.01\" y2=\"18\"/>
</svg>
{# <span>+216 51 950 201 / +33605669926</span> #}
<span>+33605669926</span>
</div>
<div class=\"support-info-item\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\">
<circle cx=\"12\" cy=\"12\" r=\"10\"/>
<polyline points=\"12 6 12 12 16 14\"/>
</svg>
<span>Lun-Ven: 8h30 - 18h00</span>
</div>
<div class=\"support-info-item summer-schedule\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#f59e0b\">
<circle cx=\"12\" cy=\"12\" r=\"5\"/>
<line x1=\"12\" y1=\"1\" x2=\"12\" y2=\"3\"/>
<line x1=\"12\" y1=\"21\" x2=\"12\" y2=\"23\"/>
<line x1=\"4.22\" y1=\"4.22\" x2=\"5.64\" y2=\"5.64\"/>
<line x1=\"18.36\" y1=\"18.36\" x2=\"19.78\" y2=\"19.78\"/>
<line x1=\"1\" y1=\"12\" x2=\"3\" y2=\"12\"/>
<line x1=\"21\" y1=\"12\" x2=\"23\" y2=\"12\"/>
<line x1=\"4.22\" y1=\"19.78\" x2=\"5.64\" y2=\"18.36\"/>
<line x1=\"18.36\" y1=\"5.64\" x2=\"19.78\" y2=\"4.22\"/>
</svg>
<span>Horaires été: 8h00 - 17h00</span>
</div>
</div>
<div class=\"support-response-time\">
<div class=\"response-badge\">
⚡ Temps de réponse moyen: 2h
</div>
</div>
</div>
<div class=\"modal-footer\">
<button class=\"btn-primary\" onclick=\"closeSupportModal()\">Fermer</button>
</div>
</div>
</div>
<!-- BOUTON FLOATING DEMANDER UNE DÉMO -->
<button id=\"demoButton\" class=\"demo-floating-btn\" onclick=\"openDemoScheduler()\">
<div class=\"demo-icon\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" stroke-width=\"2\">
<rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"/>
<line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"/>
<line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"/>
<line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"/>
<path d=\"M8 14h.01\"/>
<path d=\"M12 14h.01\"/>
<path d=\"M16 14h.01\"/>
<path d=\"M8 18h.01\"/>
<path d=\"M12 18h.01\"/>
<path d=\"M16 18h.01\"/>
</svg>
</div>
<span class=\"demo-text\">Demander une démo</span>
<span class=\"demo-pulse\"></span>
</button>
<!-- MODAL DÉMO KOALENDAR -->
<div id=\"demoModal\" class=\"modal-modern\" style=\"display: none; \">
<div class=\"modal-overlay\" onclick=\"closeDemoModal()\"></div>
<div class=\"modal-container demo-modal-container\">
<div class=\"modal-header\">
<div class=\"modal-title\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"2\">
<path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/>
<circle cx=\"12\" cy=\"7\" r=\"4\"/>
</svg>
<span>Programmer une démo personnalisée</span>
</div>
<button class=\"modal-close\" onclick=\"closeDemoModal()\">×</button>
</div>
<div class=\"modal-body p-0\">
<!-- ICI : IFRAME KOALENDAR / CALENDLY -->
<!-- Remplacez par votre lien Koalendar ou Calendly -->
<iframe
id=\"koalendarIframe\"
src=\"https://koalendar.com/e/demo-mazego\"
width=\"100%\"
height=\"600px\"
frameborder=\"0\"
allowfullscreen>
</iframe>
<!-- Message d'info -->
<div class=\"demo-info-bar\">
<span class=\"demo-duration\">⏱️ 45 minutes</span>
<span class=\"demo-spots\">🎯 3 places restantes aujourd'hui</span>
</div>
</div>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const demoButton = document.getElementById('demoButton');
demoButton.addEventListener('click', function() {
// Attendre que la modal soit chargée
setTimeout(function() {
const modal = document.getElementById('demoModal');
if (modal && !document.getElementById('koalendar-overlay')) {
// Créer un div overlay pour masquer le branding
const overlay = document.createElement('div');
overlay.id = 'koalendar-overlay';
overlay.style.cssText = `
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 50px;
background: white;
z-index: 10000;
pointer-events: none;
`;
modal.querySelector('.modal-body').style.position = 'relative';
modal.querySelector('.modal-body').appendChild(overlay);
}
}, 500);
});
});
</script>
<style>
#demoModal .modal-body {
max-height: 680px;
overflow: hidden !important;
}
#koalendarIframe {
height: 700px !important;
}
/* ========== SUPPORT & TICKET BUTTONS ========== */
.support-actions-modern {
display: flex;
gap: 8px;
margin-bottom: 16px;
padding: 0 8px;
}
.support-btn-modern {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 10px 12px;
background: white;
border: 1px solid #e2e8f0;
border-radius: 12px;
color: #475569;
font-size: 0.85rem;
font-weight: 500;
transition: all 0.2s ease;
cursor: pointer;
position: relative;
}
.support-btn-modern:hover {
background: #f1f5f9;
border-color: #3b82f6;
color: #1e40af;
transform: translateY(-1px);
}
.support-btn-modern .support-icon {
display: flex;
align-items: center;
color: #64748b;
}
.support-btn-modern:hover .support-icon {
color: #3b82f6;
}
.ticket-btn {
background: linear-gradient(135deg, #3b82f6, #1d4ed8);
border-color: transparent;
color: white;
}
.ticket-btn .support-icon {
color: white;
}
.ticket-btn:hover {
background: linear-gradient(135deg, #2563eb, #1e40af);
color: white;
}
.ticket-btn:hover .support-icon {
color: white;
}
.badge-new-ticket {
position: absolute;
top: -6px;
right: -6px;
background: #ef4444;
color: white;
font-size: 0.65rem;
font-weight: 700;
padding: 2px 6px;
border-radius: 12px;
letter-spacing: 0.05em;
box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3);
animation: pulse-badge 2s infinite;
}
@keyframes pulse-badge {
0%, 100% { transform: scale(1); }
50% { transform: scale(1.1); }
}
/* ========== MODALS MODERNES ========== */
.modal-modern {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.modal-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(4px);
}
.modal-container {
position: relative;
width: 90%;
max-width: 500px;
background: white;
border-radius: 20px;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
z-index: 10000;
animation: modalSlideIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.support-modal {
max-width: 450px;
}
.demo-modal-container {
max-width: 900px;
}
@keyframes modalSlideIn {
from {
opacity: 0;
transform: translateY(30px) scale(0.95);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
.modal-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px 24px;
border-bottom: 1px solid #e2e8f0;
}
.modal-title {
display: flex;
align-items: center;
gap: 12px;
font-size: 1.1rem;
font-weight: 600;
color: #1e293b;
}
.modal-close {
background: none;
border: none;
font-size: 28px;
line-height: 1;
color: #94a3b8;
cursor: pointer;
transition: all 0.2s ease;
padding: 4px 12px;
border-radius: 8px;
}
.modal-close:hover {
background: #f1f5f9;
color: #475569;
}
.modal-body {
padding: 24px;
}
.modal-footer {
display: flex;
justify-content: flex-end;
gap: 12px;
padding: 20px 24px;
border-top: 1px solid #e2e8f0;
}
/* ========== FORMULAIRES ========== */
.form-group {
margin-bottom: 20px;
}
.form-label {
display: block;
margin-bottom: 8px;
font-weight: 500;
font-size: 0.9rem;
color: #475569;
}
.form-control {
width: 100%;
padding: 12px 16px;
border: 1px solid #e2e8f0;
border-radius: 12px;
font-size: 0.95rem;
transition: all 0.2s ease;
background: #f8fafc;
}
.form-control:focus {
outline: none;
border-color: #3b82f6;
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
background: white;
}
textarea.form-control {
resize: vertical;
min-height: 120px;
}
.file-upload-area {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.file-upload-btn {
display: flex;
align-items: center;
gap: 8px;
padding: 10px 16px;
background: #f1f5f9;
border: 1px dashed #94a3b8;
border-radius: 10px;
color: #475569;
font-size: 0.9rem;
cursor: pointer;
transition: all 0.2s ease;
}
.file-upload-btn:hover {
background: #e2e8f0;
border-color: #3b82f6;
color: #1e40af;
}
.file-hint {
font-size: 0.8rem;
color: #94a3b8;
}
.file-list {
margin-top: 12px;
display: flex;
flex-direction: column;
gap: 8px;
}
/* ========== BOUTONS ========== */
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 24px;
background: linear-gradient(135deg, #3b82f6, #2563eb);
border: none;
border-radius: 12px;
color: white;
font-weight: 600;
font-size: 0.95rem;
cursor: pointer;
transition: all 0.2s ease;
}
.btn-primary:hover {
background: linear-gradient(135deg, #2563eb, #1d4ed8);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}
.btn-secondary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 24px;
background: #f1f5f9;
border: 1px solid #e2e8f0;
border-radius: 12px;
color: #475569;
font-weight: 600;
font-size: 0.95rem;
cursor: pointer;
transition: all 0.2s ease;
}
.btn-secondary:hover {
background: #e2e8f0;
color: #1e293b;
}
/* ========== MODAL SUPPORT ========== */
.support-logo {
display: flex;
align-items: center;
gap: 8px;
}
.brand-text-modal {
font-size: 1.4rem;
font-weight: 700;
color: #1e293b;
letter-spacing: -0.02em;
}
.support-avatar {
display: flex;
justify-content: center;
margin-bottom: 16px;
}
.support-title {
font-size: 1.5rem;
font-weight: 700;
color: #1e293b;
margin-bottom: 24px;
}
.support-info-list {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 24px;
}
.support-info-item {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
color: #475569;
font-size: 1rem;
}
.summer-schedule {
color: #f59e0b;
font-weight: 500;
}
.support-response-time {
margin-top: 16px;
padding-top: 16px;
border-top: 1px solid #e2e8f0;
}
.response-badge {
display: inline-flex;
align-items: center;
padding: 8px 16px;
background: #e0f2fe;
color: #0284c7;
border-radius: 30px;
font-size: 0.9rem;
font-weight: 500;
}
/* ========== BOUTON FLOATING DÉMO ========== */
.demo-floating-btn {
position: fixed;
/* bottom: 30px; */
top: 12px;
right: 30px;
display: flex;
align-items: center;
gap: 12px;
padding: 16px 28px;
background: linear-gradient(135deg, #8b5cf6, #6d28d9);
border: none;
border-radius: 50px;
color: white;
font-weight: 600;
font-size: 1rem;
cursor: pointer;
box-shadow: 0 10px 25px rgba(109, 40, 217, 0.4);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 9998;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.demo-floating-btn:hover {
transform: scale(1.05);
box-shadow: 0 20px 35px rgba(109, 40, 217, 0.5);
background: linear-gradient(135deg, #7c3aed, #5b21b6);
}
.demo-icon {
display: flex;
align-items: center;
}
.demo-pulse {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 50px;
box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.5);
animation: pulse-demo 2s infinite;
}
@keyframes pulse-demo {
0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.5); }
70% { box-shadow: 0 0 0 15px rgba(139, 92, 246, 0); }
100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}
/* Mode réduit - adaptations */
body[data-kt-aside-minimize=\"on\"] .support-actions-modern {
flex-direction: column;
padding: 0 4px;
}
body[data-kt-aside-minimize=\"on\"] .support-text {
display: none;
}
body[data-kt-aside-minimize=\"on\"] .support-btn-modern {
padding: 12px;
}
body[data-kt-aside-minimize=\"on\"] .support-icon {
margin: 0;
}
body[data-kt-aside-minimize=\"on\"] .badge-new-ticket {
top: -3px;
right: -3px;
}
/* ========== DEMO INFO BAR ========== */
.demo-info-bar {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 24px;
background: #f8fafc;
border-top: 1px solid #e2e8f0;
font-size: 0.9rem;
color: #475569;
}
.demo-duration {
display: flex;
align-items: center;
gap: 6px;
}
.demo-spots {
display: flex;
align-items: center;
gap: 6px;
color: #10b981;
font-weight: 500;
}
/* ========== RESPONSIVE ========== */
@media (max-width: 768px) {
.demo-floating-btn {
bottom: 20px;
right: 20px;
padding: 14px 20px;
font-size: 0.9rem;
}
.demo-floating-btn .demo-text {
display: none;
}
.demo-floating-btn {
padding: 16px;
border-radius: 50%;
}
.demo-floating-btn:hover {
transform: scale(1.1);
}
.modal-container {
width: 95%;
max-height: 90vh;
overflow-y: auto;
}
.demo-info-bar {
flex-direction: column;
gap: 8px;
align-items: flex-start;
}
}
/* Sidebar Moderne - Design épuré et contemporain */
.aside-modern {
background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
border-right: 1px solid #e2e8f0;
box-shadow: 0 4px 25px rgba(0, 0, 0, 0.08);
width: 280px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
/* Logo Section */
.aside-logo-modern {
padding: 2rem 1.5rem 1.5rem;
border-bottom: 1px solid #f1f5f9;
display: flex;
align-items: center;
justify-content: space-between;
background: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
}
.logo-container-modern {
display: flex;
align-items: center;
text-decoration: none;
transition: all 0.2s ease;
}
.logo-container-modern:hover {
transform: scale(1.02);
}
.brand-text {
font-size: 1.25rem;
font-weight: 700;
color: #1e293b;
letter-spacing: -0.02em;
}
.btn-toggle-modern {
background: #f8fafc;
border: 1px solid #e2e8f0;
border-radius: 8px;
padding: 8px;
color: #64748b;
transition: all 0.2s ease;
cursor: pointer;
}
.btn-toggle-modern:hover {
background: #e2e8f0;
color: #475569;
transform: scale(1.05);
}
/* Menu Principal */
.aside-menu-modern {
padding: 1rem 0;
height: calc(100vh - 200px);
overflow: hidden;
}
.menu-scroll-modern {
height: 100%;
overflow-y: auto;
padding: 0 1rem;
scrollbar-width: thin;
scrollbar-color: #cbd5e1 transparent;
}
.menu-scroll-modern::-webkit-scrollbar {
width: 4px;
}
.menu-scroll-modern::-webkit-scrollbar-track {
background: transparent;
}
.menu-scroll-modern::-webkit-scrollbar-thumb {
background: #cbd5e1;
border-radius: 2px;
}
.menu-scroll-modern::-webkit-scrollbar-thumb:hover {
background: #94a3b8;
}
/* Sections du Menu - STYLE ORIGINAL AMÉLIORÉ */
.menu-section-modern {
margin-bottom: 2rem;
}
/* En-tête de section cliquable */
.menu-section-header-modern {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.75rem 1rem;
margin: 0 0.25rem 0.5rem;
border-radius: 12px;
cursor: pointer;
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
border: 1px solid transparent;
background: #f8fafc;
}
.menu-section-header-modern:hover {
background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
border-color: #e2e8f0;
}
.menu-section-header-modern.active {
/*background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); */
color: white;
box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3);
}
.menu-section-title-modern {
display: flex;
align-items: center;
gap: 0.75rem;
font-weight: 600;
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.section-title-text {
color: #475569;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.1em;
}
{# .menu-section-header-modern.active .section-title-text {
color: white;
} #}
.menu-section-arrow {
color: #94a3b8;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
{# .menu-section-header-modern.active .menu-section-arrow {
color: white;
transform: rotate(180deg);
} #}
/* Contenu des sections */
.menu-section-content {
max-height: 1000px;
overflow: hidden;
transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.menu-section-modern.collapsed .menu-section-content {
max-height: 0;
}
/* Items du Menu - STYLE ORIGINAL */
.menu-item-modern {
margin-bottom: 0.25rem;
}
.menu-link-modern {
display: flex;
align-items: center;
padding: 0.875rem 1rem;
border-radius: 12px;
text-decoration: none;
color: #475569;
font-weight: 500;
font-size: 0.95rem;
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
margin: 0 0.25rem;
}
.menu-link-modern:hover {
background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
color: #334155;
text-decoration: none;
transform: translateX(4px);
}
.menu-link-modern.active {
/* background: linear-gradient(135deg, #e4e4f7 0%, #e4e5f7 100%); */
color: #6b7787;
/* box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3); */
font-weight: 600;
}
.menu-link-modern.active:hover {
transform: translateX(0);
}
/* Icônes */
.menu-icon-modern {
width: 22px;
height: 22px;
margin-right: 0.875rem;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
color: #64748b;
transition: all 0.2s ease;
}
.menu-link-modern:hover .menu-icon-modern {
color: #475569;
transform: scale(1.1);
}
.menu-link-modern.active .menu-icon-modern {
color: white;
}
/* Titres */
.menu-title-modern {
flex: 1;
font-size: 0.95rem;
line-height: 1.4;
}
/* Badges - STYLE ORIGINAL AMÉLIORÉ */
.menu-badge-modern {
margin-left: auto;
display: flex;
align-items: center;
}
.badge-dot-modern {
width: 6px;
height: 6px;
background: #10b981;
border-radius: 50%;
animation: pulse 2s infinite;
}
.badge-new-modern {
background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
color: white;
font-size: 0.7rem;
font-weight: 600;
padding: 2px 6px;
border-radius: 8px;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.badge-dev-modern {
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
color: white;
font-size: 0.65rem;
font-weight: 600;
padding: 2px 6px;
border-radius: 8px;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.badge-admin-modern {
background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
color: white;
font-size: 0.65rem;
font-weight: 600;
padding: 2px 6px;
border-radius: 8px;
text-transform: uppercase;
letter-spacing: 0.05em;
}
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
/* Accordéons */
.menu-accordion-modern {
margin-bottom: 0.25rem;
}
.menu-accordion-trigger {
cursor: pointer;
}
.menu-arrow-modern {
margin-left: auto;
color: #94a3b8;
transition: transform 0.2s ease;
}
.menu-accordion-modern.show .menu-arrow-modern {
transform: rotate(90deg);
}
/* Sous-menus */
.menu-sub-modern {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
margin: 0.5rem 0 0 0;
background: rgba(248, 250, 252, 0.5);
border-radius: 8px;
margin-left: 0.25rem;
margin-right: 0.25rem;
}
.menu-accordion-modern.show .menu-sub-modern {
max-height: 300px;
padding: 0.5rem 0;
}
.menu-sub-item-modern {
margin-bottom: 0.125rem;
}
.menu-sub-link-modern {
display: flex;
align-items: center;
padding: 0.625rem 1rem 0.625rem 2.5rem;
color: #64748b;
text-decoration: none;
font-size: 0.9rem;
font-weight: 500;
border-radius: 8px;
transition: all 0.2s ease;
margin: 0 0.5rem;
}
.menu-sub-link-modern:hover {
background: rgba(59, 130, 246, 0.1);
color: #3b82f6;
text-decoration: none;
transform: translateX(4px);
}
.menu-bullet-modern {
width: 6px;
height: 6px;
background: #cbd5e1;
border-radius: 50%;
margin-right: 0.75rem;
transition: all 0.2s ease;
}
.menu-sub-link-modern:hover .menu-bullet-modern {
background: #3b82f6;
transform: scale(1.2);
}
/* Footer */
.aside-footer-modern {
padding: 1.5rem;
border-top: 1px solid #f1f5f9;
background: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
}
.user-panel-modern {
display: flex;
align-items: center;
background: #f8fafc;
padding: 1rem;
border-radius: 12px;
border: 1px solid #e2e8f0;
transition: all 0.2s ease;
}
.user-panel-modern:hover {
background: #f1f5f9;
border-color: #cbd5e1;
}
.user-avatar-modern {
width: 40px;
height: 40px;
background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 0.75rem;
color: white;
}
.user-info-modern {
flex: 1;
}
.user-name-modern {
font-weight: 600;
font-size: 0.9rem;
color: #1e293b;
line-height: 1.2;
}
.user-role-modern {
font-size: 0.8rem;
color: #64748b;
margin-top: 0.125rem;
}
.logout-btn-modern {
background: #fee2e2;
color: #dc2626;
padding: 8px;
border-radius: 8px;
text-decoration: none;
transition: all 0.2s ease;
display: flex;
align-items: center;
justify-content: center;
}
.logout-btn-modern:hover {
background: #fecaca;
color: #b91c1c;
text-decoration: none;
transform: scale(1.05);
}
/* Responsive */
@media (max-width: 1024px) {
.aside-modern {
transform: translateX(-100%);
}
.aside-modern.drawer-on {
transform: translateX(0);
}
}
/* États actifs pour les liens */
.menu-link-modern.active::before {
content: '';
position: absolute;
left: -0.25rem;
top: 50%;
transform: translateY(-50%);
width: 3px;
height: 20px;
background: #3b82f6;
border-radius: 0 2px 2px 0;
}
/* Animation d'entrée */
.menu-item-modern {
animation: slideInLeft 0.3s ease-out;
}
@keyframes slideInLeft {
from {
opacity: 0;
transform: translateX(-20px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
/* Amélioration des focus pour l'accessibilité */
.menu-link-modern:focus,
.menu-sub-link-modern:focus {
outline: 2px solid #3b82f6;
outline-offset: 2px;
}
/* Mode réduit */
body[data-kt-aside-minimize=\"on\"] .aside-modern {
width: 80px;
transition: all 0.3s ease;
}
body[data-kt-aside-minimize=\"on\"] .brand-text,
body[data-kt-aside-minimize=\"on\"] .menu-title-modern,
body[data-kt-aside-minimize=\"on\"] .menu-arrow-modern,
body[data-kt-aside-minimize=\"on\"] .menu-section-title-modern,
body[data-kt-aside-minimize=\"on\"] .section-title-text,
body[data-kt-aside-minimize=\"on\"] .user-name-modern,
body[data-kt-aside-minimize=\"on\"] .user-role-modern {
display: none;
}
body[data-kt-aside-minimize=\"on\"] .aside-logo-modern {
justify-content: center;
padding: 1.5rem 0.5rem;
}
body[data-kt-aside-minimize=\"on\"] .btn-toggle-modern {
transform: rotate(180deg);
margin: 0 auto;
}
body[data-kt-aside-minimize=\"on\"] .menu-link-modern {
justify-content: center;
padding: 0.875rem 0.5rem;
margin: 0 0.25rem;
}
body[data-kt-aside-minimize=\"on\"] .menu-icon-modern {
margin-right: 0;
transform: scale(1.2);
}
body[data-kt-aside-minimize=\"on\"] .menu-section-header-modern {
padding: 0.5rem;
justify-content: center;
}
body[data-kt-aside-minimize=\"on\"] .menu-section-arrow {
display: none;
}
body[data-kt-aside-minimize=\"on\"] .user-panel-modern {
justify-content: center;
padding: 0.75rem 0.5rem;
}
body[data-kt-aside-minimize=\"on\"] .user-avatar-modern {
margin-right: 0;
}
body[data-kt-aside-minimize=\"on\"] .logout-btn-modern {
position: absolute;
bottom: 1rem;
right: 1rem;
}
/* Responsive mobile */
@media (max-width: 1024px) {
.aside-modern {
position: fixed;
left: -280px;
top: 0;
bottom: 0;
z-index: 103;
transition: all 0.3s ease;
}
.aside-modern.mobile-show {
left: 0;
box-shadow: 10px 0 30px rgba(0,0,0,0.1);
}
/* Overlay pour mobile */
.aside-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.3);
z-index: 102;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
}
.aside-overlay.active {
opacity: 1;
visibility: visible;
}
}
/* ========== AMÉLIORATIONS DU MENU ========== */
/* 1. Style moderne pour les liens actifs */
.menu-link-modern.active {
background: linear-gradient(135deg, rgba(37, 99, 235, 0.15) 0%, rgba(59, 130, 246, 0.1) 100%);
color: #1e40af;
border-left: 3px solid #3b82f6;
font-weight: 600;
box-shadow: 0 2px 8px rgba(59, 130, 246, 0.12);
}
.menu-link-modern.active .menu-icon-modern {
color: #3b82f6;
}
.menu-link-modern.active:hover {
background: linear-gradient(135deg, rgba(37, 99, 235, 0.18) 0%, rgba(59, 130, 246, 0.12) 100%);
transform: translateX(2px);
}
/* 2. Menu fermé par défaut */
.menu-section-modern {
margin-bottom: 1.5rem;
}
.menu-section-content {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.menu-section-modern.expanded .menu-section-content {
max-height: 1000px;
}
/* 3. Flèche de section */
.menu-section-arrow {
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
transform: rotate(0deg);
}
.menu-section-modern.expanded .menu-section-arrow {
transform: rotate(180deg);
}
/* 4. Style d'en-tête de section */
.menu-section-header-modern {
background: #f8fafc;
border: 1px solid #e2e8f0;
border-radius: 10px;
padding: 0.75rem 1rem;
margin-bottom: 0.5rem;
cursor: pointer;
transition: all 0.2s ease;
}
.menu-section-header-modern:hover {
background: #f1f5f9;
border-color: #cbd5e1;
}
.menu-section-modern.expanded .menu-section-header-modern {
background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
border-color: #cbd5e1;
}
/* 5. Maintien de la position de défilement */
.menu-scroll-modern {
scroll-behavior: auto; /* Désactiver le scroll automatique */
}
/* 6. Indicateur pour sections avec contenu actif */
.menu-section-header-modern.has-active-child {
border-left: 3px solid #3b82f6;
background: rgba(59, 130, 246, 0.05);
}
/* 7. Style pour sous-menus actifs */
.menu-sub-link-modern.active {
background: rgba(59, 130, 246, 0.1);
color: #1e40af;
font-weight: 500;
border-left: 2px solid #3b82f6;
}
.menu-sub-link-modern.active .menu-bullet-modern {
background: #3b82f6;
transform: scale(1.1);
}
/* 8. Animation subtile */
.menu-item-modern {
animation: fadeIn 0.2s ease-out;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateX(-5px); }
to { opacity: 1; transform: translateX(0); }
}
/* 9. Indicateur visuel pour liens actifs */
.menu-link-modern.active::after {
content: '';
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
width: 6px;
height: 6px;
background: #10b981;
border-radius: 50%;
animation: pulse-active 2s infinite;
}
@keyframes pulse-active {
0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
70% { box-shadow: 0 0 0 4px rgba(16, 185, 129, 0); }
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
// ========== CONFIGURATION ==========
const CONFIG = {
localStorageKey: 'menuState_v1',
autoExpandActive: true,
defaultCollapsed: true,
saveScrollPosition: true
};
// ========== FONCTIONS UTILITAIRES ==========
// Sauvegarder l'état du menu
function saveMenuState() {
const menuState = {
sections: {},
scrollPosition: CONFIG.saveScrollPosition ? getScrollPosition() : 0,
timestamp: Date.now()
};
document.querySelectorAll('.menu-section-modern').forEach(section => {
const sectionId = section.querySelector('.menu-section-header-modern')?.dataset?.section;
if (sectionId) {
menuState.sections[sectionId] = section.classList.contains('expanded') ? 'expanded' : 'collapsed';
}
});
localStorage.setItem(CONFIG.localStorageKey, JSON.stringify(menuState));
}
// Restaurer l'état du menu
function loadMenuState() {
try {
const saved = localStorage.getItem(CONFIG.localStorageKey);
if (!saved) return null;
return JSON.parse(saved);
} catch (e) {
console.warn('Impossible de charger l\\'état du menu:', e);
return null;
}
}
// Obtenir la position de défilement
function getScrollPosition() {
const scrollElement = document.querySelector('.menu-scroll-modern');
return scrollElement ? scrollElement.scrollTop : 0;
}
// Restaurer la position de défilement
function restoreScrollPosition(position) {
if (!CONFIG.saveScrollPosition) return;
const scrollElement = document.querySelector('.menu-scroll-modern');
if (scrollElement) {
// Attendre que le DOM soit complètement chargé
setTimeout(() => {
scrollElement.scrollTop = position;
}, 100);
}
}
// Trouver la section active
function findActiveSection() {
const currentPath = window.location.pathname;
const allLinks = document.querySelectorAll('.menu-link-modern[href], .menu-sub-link-modern[href]');
let activeSectionId = null;
allLinks.forEach(link => {
const href = link.getAttribute('href');
if (!href) return;
// Vérifier si ce lien correspond à la page actuelle
if (href === currentPath ||
(href !== '/' && currentPath.startsWith(href))) {
link.classList.add('active');
// Trouver la section parente
const section = link.closest('.menu-section-modern');
if (section) {
const sectionId = section.querySelector('.menu-section-header-modern')?.dataset?.section;
if (sectionId) {
activeSectionId = sectionId;
}
}
// Gérer les sous-menus d'accordéon
const accordion = link.closest('.menu-accordion-modern');
if (accordion) {
accordion.classList.add('show');
}
}
});
return activeSectionId;
}
// Initialiser les sections
function initializeSections() {
const savedState = loadMenuState();
const activeSectionId = findActiveSection();
document.querySelectorAll('.menu-section-modern').forEach(section => {
const header = section.querySelector('.menu-section-header-modern');
const sectionId = header.dataset.section;
// Vérifier si cette section a un enfant actif
const hasActiveChild = section.querySelector('.menu-link-modern.active, .menu-sub-link-modern.active');
if (hasActiveChild) {
header.classList.add('has-active-child');
}
// Déterminer l'état initial
let shouldExpand = false;
if (savedState?.sections?.[sectionId]) {
// Restaurer l'état sauvegardé
shouldExpand = savedState.sections[sectionId] === 'expanded';
} else if (CONFIG.defaultCollapsed) {
// Par défaut, toutes les sections sont fermées
shouldExpand = false;
} else {
// Sinon, ouvrir uniquement la section active
shouldExpand = sectionId === activeSectionId && CONFIG.autoExpandActive;
}
// Appliquer l'état
if (shouldExpand) {
section.classList.add('expanded');
header.classList.add('active');
} else {
section.classList.remove('expanded');
header.classList.remove('active');
}
// Gestionnaire de clic pour l'en-tête de section
header.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
const isExpanded = section.classList.contains('expanded');
const newState = !isExpanded;
// Mettre à jour l'état
section.classList.toggle('expanded', newState);
header.classList.toggle('active', newState);
// Sauvegarder l'état
saveMenuState();
});
});
// Restaurer la position de défilement
if (savedState?.scrollPosition) {
restoreScrollPosition(savedState.scrollPosition);
}
// Sauvegarder l'état initial
setTimeout(() => saveMenuState(), 500);
}
// Gestion des accordéons
function initializeAccordions() {
const accordions = document.querySelectorAll('.menu-accordion-modern');
accordions.forEach(accordion => {
const trigger = accordion.querySelector('.menu-accordion-trigger');
const arrow = accordion.querySelector('.menu-arrow-modern');
if (trigger) {
trigger.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
const isActive = accordion.classList.contains('show');
// Fermer tous les autres accordéons (optionnel)
// document.querySelectorAll('.menu-accordion-modern.show').forEach(acc => {
// if (acc !== accordion) {
// acc.classList.remove('show');
// }
// });
// Basculer l'état
accordion.classList.toggle('show', !isActive);
// Animer la flèche
if (arrow) {
arrow.style.transform = !isActive ? 'rotate(90deg)' : 'rotate(0deg)';
}
});
}
});
}
// Prévenir la perte de position lors des clics
function preventScrollReset() {
const menuLinks = document.querySelectorAll('.menu-link-modern[href]:not([href^=\"#\"]):not([href^=\"http\"])');
menuLinks.forEach(link => {
link.addEventListener('click', function() {
// Sauvegarder la position actuelle avant navigation
if (CONFIG.saveScrollPosition) {
const scrollPos = getScrollPosition();
const currentState = loadMenuState() || {};
currentState.scrollPosition = scrollPos;
localStorage.setItem(CONFIG.localStorageKey, JSON.stringify(currentState));
}
// Marquer ce lien comme actif immédiatement
document.querySelectorAll('.menu-link-modern.active, .menu-sub-link-modern.active').forEach(el => {
el.classList.remove('active');
});
this.classList.add('active');
// Mettre à jour l'état de la section parente
const parentSection = this.closest('.menu-section-modern');
if (parentSection) {
const header = parentSection.querySelector('.menu-section-header-modern');
if (header && !parentSection.classList.contains('expanded')) {
parentSection.classList.add('expanded');
header.classList.add('active');
header.classList.add('has-active-child');
}
}
// Sauvegarder l'état du menu
saveMenuState();
});
});
}
// Initialiser les effets de survol
function initializeHoverEffects() {
const menuItems = document.querySelectorAll('.menu-link-modern');
menuItems.forEach(item => {
item.addEventListener('mouseenter', function() {
if (!this.classList.contains('active')) {
this.style.transform = 'translateX(3px)';
}
});
item.addEventListener('mouseleave', function() {
this.style.transform = 'translateX(0)';
});
});
}
// ========== INITIALISATION ==========
function initializeMenu() {
initializeSections();
initializeAccordions();
preventScrollReset();
initializeHoverEffects();
// Sauvegarder l'état quand l'utilisateur quitte la page
window.addEventListener('beforeunload', saveMenuState);
// Sauvegarder périodiquement (au cas où)
setInterval(saveMenuState, 30000); // Toutes les 30 secondes
}
// Démarrer l'initialisation
initializeMenu();
});
</script>
<script>
// ========== GESTION DES MODALS ==========
document.addEventListener('DOMContentLoaded', function() {
// Initialisation des gestionnaires de fichiers
initFileUpload();
});
// MODAL TICKET
function openTicketModal() {
document.getElementById('ticketModal').style.display = 'flex';
document.body.style.overflow = 'hidden';
}
function closeTicketModal() {
document.getElementById('ticketModal').style.display = 'none';
document.body.style.overflow = '';
// Réinitialiser le formulaire
const form = document.getElementById('ticketForm');
if (form) form.reset();
document.getElementById('fileList').innerHTML = '';
}
// MODAL SUPPORT
function openSupportModal() {
document.getElementById('supportModal').style.display = 'flex';
document.body.style.overflow = 'hidden';
}
function closeSupportModal() {
document.getElementById('supportModal').style.display = 'none';
document.body.style.overflow = '';
}
// MODAL DÉMO
function openDemoScheduler() {
document.getElementById('demoModal').style.display = 'flex';
document.body.style.overflow = 'hidden';
}
function closeDemoModal() {
document.getElementById('demoModal').style.display = 'none';
document.body.style.overflow = '';
}
// Upload de fichiers
function initFileUpload() {
const fileInput = document.getElementById('fileInput');
if (!fileInput) return;
fileInput.addEventListener('change', function(e) {
const fileList = document.getElementById('fileList');
fileList.innerHTML = '';
Array.from(this.files).forEach((file, index) => {
const fileItem = document.createElement('div');
fileItem.className = 'file-item';
fileItem.style.cssText = `
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 12px;
background: #f8fafc;
border-radius: 8px;
font-size: 0.85rem;
`;
fileItem.innerHTML = `
<div style=\"display: flex; align-items: center; gap: 8px;\">
<svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#64748b\">
<path d=\"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z\"/>
<polyline points=\"13 2 13 9 20 9\"/>
</svg>
<span style=\"color: #1e293b;\">\${file.name}</span>
<span style=\"color: #94a3b8; font-size: 0.75rem;\">(\${(file.size / 1024).toFixed(1)} KB)</span>
</div>
<button type=\"button\" onclick=\"this.parentElement.remove()\" style=\"background: none; border: none; color: #ef4444; cursor: pointer;\">
<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">
<line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"/>
<line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"/>
</svg>
</button>
`;
fileList.appendChild(fileItem);
});
});
}
// Fermeture avec touche Echap
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape') {
closeTicketModal();
closeSupportModal();
closeDemoModal();
}
});
// Empêcher la propagation des clics dans les modals
document.querySelectorAll('.modal-container').forEach(modal => {
modal.addEventListener('click', function(e) {
e.stopPropagation();
});
});
</script>
<div class=\"wrapper d-flex flex-column flex-row-fluid\" id=\"kt_wrapper\">
<div id=\"kt_header\" style=\"\" class=\"header align-items-stretch\">
<div class=\"container d-flex align-items-stretch justify-content-between\">
<div class=\"d-flex align-items-center d-lg-none ms-n3 me-1\" title=\"Show aside menu\">
<div class=\"btn btn-icon btn-active-light-primary\" id=\"kt_aside_mobile_toggle\">
<span class=\"svg-icon svg-icon-2x mt-1\">
<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"
width=\"24px\" height=\"24px\" viewBox=\"0 0 24 24\" version=\"1.1\">
<g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">
<rect x=\"0\" y=\"0\" width=\"24\" height=\"24\" />
<rect fill=\"#000000\" x=\"4\" y=\"5\" width=\"16\" height=\"3\" rx=\"1.5\" />
<path
d=\"M5.5,15 L18.5,15 C19.3284271,15 20,15.6715729 20,16.5 C20,17.3284271 19.3284271,18 18.5,18 L5.5,18 C4.67157288,18 4,17.3284271 4,16.5 C4,15.6715729 4.67157288,15 5.5,15 Z M5.5,10 L18.5,10 C19.3284271,10 20,10.6715729 20,11.5 C20,12.3284271 19.3284271,13 18.5,13 L5.5,13 C4.67157288,13 4,12.3284271 4,11.5 C4,10.6715729 4.67157288,10 5.5,10 Z\"
fill=\"#000000\" opacity=\"0.3\" />
</g>
</svg>
</span>
</div>
</div>
</div>
</div>", "Base/_sidebar_admin.html.twig", "/htdocs/templates/Base/_sidebar_admin.html.twig"); }}