var/cache/dev/twig/19/19c60142ae547a4c8ac1317bc3f67b97.php line 55

Open in your IDE?
  1. <?php
  3. use Twig\Environment;
  4. use Twig\Error\LoaderError;
  5. use Twig\Error\RuntimeError;
  6. use Twig\Extension\CoreExtension;
  7. use Twig\Extension\SandboxExtension;
  8. use Twig\Markup;
  9. use Twig\Sandbox\SecurityError;
  10. use Twig\Sandbox\SecurityNotAllowedTagError;
  11. use Twig\Sandbox\SecurityNotAllowedFilterError;
  12. use Twig\Sandbox\SecurityNotAllowedFunctionError;
  13. use Twig\Source;
  14. use Twig\Template;
  15. use Twig\TemplateWrapper;
  17. /* home/faq.html.twig */
  18. class __TwigTemplate_fae8cb5b663b493ef4409bafa1005ede extends Template
  19. {
  20.     private Source $source;
  21.     /**
  22.      * @var array<string, Template>
  23.      */
  24.     private array $macros = [];
  26.     public function __construct(Environment $env)
  27.     {
  28.         parent::__construct($env);
  30.         $this->source = $this->getSourceContext();
  32.         $this->blocks = [
  33.             'title' => [$this, 'block_title'],
  34.             'stylesheets' => [$this, 'block_stylesheets'],
  35.             'body' => [$this, 'block_body'],
  36.         ];
  37.     }
  39.     protected function doGetParent(array $context): bool|string|Template|TemplateWrapper
  40.     {
  41.         // line 1
  42.         return "base_home.html.twig";
  43.     }
  45.     protected function doDisplay(array $context, array $blocks = []): iterable
  46.     {
  47.         $macros = $this->macros;
  48.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  49.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "home/faq.html.twig"));
  51.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  52.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "home/faq.html.twig"));
  54.         $this->parent = $this->load("base_home.html.twig", 1);
  55.         yield from $this->parent->unwrap()->yield($context, array_merge($this->blocks, $blocks));
  56.         
  57.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  59.         
  60.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  62.     }
  64.     // line 3
  65.     /**
  66.      * @return iterable<null|scalar|\Stringable>
  67.      */
  68.     public function block_title(array $context, array $blocks = []): iterable
  69.     {
  70.         $macros = $this->macros;
  71.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  72.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  74.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  75.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  77.         yield "FAQ | MaketOu";
  78.         
  79.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  81.         
  82.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  84.         yield from [];
  85.     }
  87.     // line 5
  88.     /**
  89.      * @return iterable<null|scalar|\Stringable>
  90.      */
  91.     public function block_stylesheets(array $context, array $blocks = []): iterable
  92.     {
  93.         $macros = $this->macros;
  94.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  95.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheets"));
  97.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  98.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheets"));
  100.         // line 6
  101.         yield "    <style>
  102.         /* Styles spécifiques à la page FAQ - isolés pour ne pas affecter le navbar */
  103.         .faq-page {
  104.             /* Wrapper pour isoler les styles de cette page */
  105.         }
  106.         
  107.         /* Banner amélioré */
  108.         .faq-page .banner-area {
  109.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  110.             padding: 80px 0 60px;
  111.             position: relative;
  112.             overflow: hidden;
  113.         }
  114.         
  115.         .faq-page .banner-area::before {
  116.             content: '';
  117.             position: absolute;
  118.             top: 0;
  119.             left: 0;
  120.             right: 0;
  121.             bottom: 0;
  122.             background: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><circle cx=\"20\" cy=\"20\" r=\"2\" fill=\"rgba(255,255,255,0.1)\"/><circle cx=\"80\" cy=\"80\" r=\"2\" fill=\"rgba(255,255,255,0.1)\"/><circle cx=\"50\" cy=\"50\" r=\"1\" fill=\"rgba(255,255,255,0.1)\"/></svg>');
  123.             opacity: 0.3;
  124.         }
  125.         
  126.         .faq-page .banner-area h1 {
  127.             color: white;
  128.             font-size: 2.5rem;
  129.             font-weight: 700;
  130.             margin-bottom: 15px;
  131.             position: relative;
  132.             z-index: 2;
  133.         }
  134.         
  135.         .faq-page .banner-area nav a {
  136.             color: rgba(255, 255, 255, 0.9);
  137.             font-size: 1rem;
  138.             transition: color 0.3s ease;
  139.         }
  140.         
  141.         .faq-page .banner-area nav a:hover {
  142.             color: white;
  143.         }
  144.         
  145.         /* Section principale */
  146.         .faq-page .section_gap {
  147.             padding: 80px 0;
  148.             background: #f8f9fa;
  149.         }
  150.         
  151.         /* Titre de section */
  152.         .faq-page .faq-section-title {
  153.             text-align: center;
  154.             margin-bottom: 60px;
  155.         }
  156.         
  157.         .faq-page .faq-section-title h2 {
  158.             font-size: 2.5rem;
  159.             font-weight: 700;
  160.             color: #2c3e50;
  161.             margin-bottom: 15px;
  162.             position: relative;
  163.             display: inline-block;
  164.         }
  165.         
  166.         .faq-page .faq-section-title h2::after {
  167.             content: '';
  168.             position: absolute;
  169.             bottom: -10px;
  170.             left: 50%;
  171.             transform: translateX(-50%);
  172.             width: 60px;
  173.             height: 4px;
  174.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  175.             border-radius: 2px;
  176.         }
  177.         
  178.         .faq-page .faq-section-title p {
  179.             color: #666;
  180.             font-size: 1.1rem;
  181.             margin-top: 25px;
  182.         }
  183.         
  184.         /* Accordion moderne */
  185.         .faq-page .faq-accordion {
  186.             max-width: 900px;
  187.             margin: 0 auto;
  188.         }
  189.         
  190.         .faq-page .accordion-item {
  191.             border: none;
  192.             margin-bottom: 20px;
  193.             border-radius: 12px;
  194.             overflow: hidden;
  195.             box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  196.             background: white;
  197.             transition: all 0.3s ease;
  198.         }
  199.         
  200.         .faq-page .accordion-item:hover {
  201.             box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
  202.             transform: translateY(-2px);
  203.         }
  204.         
  205.         .faq-page .accordion-header {
  206.             border: none;
  207.         }
  208.         
  209.         .faq-page .accordion-button {
  210.             background: white;
  211.             border: none;
  212.             padding: 25px 30px;
  213.             font-size: 1.1rem;
  214.             font-weight: 600;
  215.             color: #2c3e50;
  216.             box-shadow: none;
  217.             position: relative;
  218.             transition: all 0.3s ease;
  219.         }
  220.         
  221.         .faq-page .accordion-button::before {
  222.             content: '';
  223.             position: absolute;
  224.             left: 0;
  225.             top: 0;
  226.             bottom: 0;
  227.             width: 4px;
  228.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  229.             opacity: 0;
  230.             transition: opacity 0.3s ease;
  231.         }
  232.         
  233.         .faq-page .accordion-button:not(.collapsed) {
  234.             background: linear-gradient(135deg, rgba(255, 162, 0, 0.1) 0%, rgba(232, 145, 10, 0.1) 100%);
  235.             color: #ffa200;
  236.         }
  237.         
  238.         .faq-page .accordion-button:not(.collapsed)::before {
  239.             opacity: 1;
  240.         }
  241.         
  242.         .faq-page .accordion-button:focus {
  243.             box-shadow: none;
  244.             border: none;
  245.         }
  246.         
  247.         .faq-page .accordion-button::after {
  248.             background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffa200'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e\");
  249.             width: 1.5rem;
  250.             height: 1.5rem;
  251.             transition: transform 0.3s ease;
  252.         }
  253.         
  254.         .faq-page .accordion-button:not(.collapsed)::after {
  255.             transform: rotate(180deg);
  256.         }
  257.         
  258.         /* Icônes pour chaque question */
  259.         .faq-page .accordion-button .faq-icon {
  260.             margin-right: 15px;
  261.             font-size: 1.3rem;
  262.             color: #ffa200;
  263.             transition: transform 0.3s ease;
  264.         }
  265.         
  266.         .faq-page .accordion-button:not(.collapsed) .faq-icon {
  267.             transform: scale(1.1);
  268.         }
  269.         
  270.         .faq-page .accordion-body {
  271.             padding: 25px 30px;
  272.             color: #555;
  273.             font-size: 1rem;
  274.             line-height: 1.8;
  275.             background: white;
  276.         }
  277.         
  278.         .faq-page .accordion-collapse {
  279.             transition: all 0.3s ease;
  280.         }
  281.         
  282.         /* Section contact améliorée */
  283.         .faq-page .faq-contact-section {
  284.             margin-top: 80px;
  285.             padding: 50px;
  286.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  287.             border-radius: 20px;
  288.             text-align: center;
  289.             color: white;
  290.             box-shadow: 0 10px 40px rgba(255, 162, 0, 0.3);
  291.             position: relative;
  292.             overflow: hidden;
  293.         }
  294.         
  295.         .faq-page .faq-contact-section::before {
  296.             content: '';
  297.             position: absolute;
  298.             top: -50%;
  299.             right: -50%;
  300.             width: 200%;
  301.             height: 200%;
  302.             background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
  303.             animation: pulse 3s ease-in-out infinite;
  304.         }
  305.         
  306.         @keyframes pulse {
  307.             0%, 100% {
  308.                 transform: scale(1);
  309.                 opacity: 0.5;
  310.             }
  311.             50% {
  312.                 transform: scale(1.1);
  313.                 opacity: 0.3;
  314.             }
  315.         }
  316.         
  317.         .faq-page .faq-contact-section h3 {
  318.             font-size: 2rem;
  319.             font-weight: 700;
  320.             margin-bottom: 15px;
  321.             position: relative;
  322.             z-index: 2;
  323.         }
  324.         
  325.         .faq-page .faq-contact-section p {
  326.             font-size: 1.1rem;
  327.             margin-bottom: 30px;
  328.             opacity: 0.95;
  329.             position: relative;
  330.             z-index: 2;
  331.         }
  332.         
  333.         .faq-page .faq-contact-btn {
  334.             display: inline-block;
  335.             padding: 15px 40px;
  336.             background: white;
  337.             color: #ffa200;
  338.             font-weight: 600;
  339.             font-size: 1.1rem;
  340.             border-radius: 50px;
  341.             text-decoration: none;
  342.             transition: all 0.3s ease;
  343.             box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
  344.             position: relative;
  345.             z-index: 2;
  346.         }
  347.         
  348.         .faq-page .faq-contact-btn:hover {
  349.             transform: translateY(-3px);
  350.             box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
  351.             color: #e8910a;
  352.         }
  353.         
  354.         /* Statistiques FAQ */
  355.         .faq-page .faq-stats {
  356.             display: flex;
  357.             justify-content: center;
  358.             gap: 40px;
  359.             margin-bottom: 50px;
  360.             flex-wrap: wrap;
  361.         }
  362.         
  363.         .faq-page .faq-stat-item {
  364.             text-align: center;
  365.             padding: 20px;
  366.         }
  367.         
  368.         .faq-page .faq-stat-number {
  369.             font-size: 2.5rem;
  370.             font-weight: 700;
  371.             color: #ffa200;
  372.             display: block;
  373.             margin-bottom: 5px;
  374.         }
  375.         
  376.         .faq-page .faq-stat-label {
  377.             color: #666;
  378.             font-size: 0.95rem;
  379.         }
  380.         
  381.         /* Responsive */
  382.         @media(max-width: 991.98px) {
  383.             .faq-page .banner-area h1 {
  384.                 font-size: 2rem;
  385.             }
  386.             
  387.             .faq-page .faq-section-title h2 {
  388.                 font-size: 2rem;
  389.             }
  390.             
  391.             .faq-page .section_gap {
  392.                 padding: 60px 0;
  393.             }
  394.         }
  395.         
  396.         @media(max-width: 767.98px) {
  397.             .faq-page .banner-area {
  398.                 padding: 60px 0 40px;
  399.             }
  400.             
  401.             .faq-page .banner-area h1 {
  402.                 font-size: 1.75rem;
  403.             }
  404.             
  405.             .faq-page .faq-section-title h2 {
  406.                 font-size: 1.75rem;
  407.             }
  408.             
  409.             .faq-page .accordion-button {
  410.                 padding: 20px;
  411.                 font-size: 1rem;
  412.             }
  413.             
  414.             .faq-page .accordion-body {
  415.                 padding: 20px;
  416.             }
  417.             
  418.             .faq-page .faq-contact-section {
  419.                 padding: 30px 20px;
  420.             }
  421.             
  422.             .faq-page .faq-contact-section h3 {
  423.                 font-size: 1.5rem;
  424.             }
  425.             
  426.             .faq-page .faq-stats {
  427.                 gap: 20px;
  428.             }
  429.             
  430.             .faq-page .faq-stat-number {
  431.                 font-size: 2rem;
  432.             }
  433.         }
  434.         
  435.         @media(max-width: 575.98px) {
  436.             .faq-page .banner-area h1 {
  437.                 font-size: 1.5rem;
  438.             }
  439.             
  440.             .faq-page .faq-section-title h2 {
  441.                 font-size: 1.5rem;
  442.             }
  443.             
  444.             .faq-page .accordion-button {
  445.                 padding: 15px;
  446.                 font-size: 0.95rem;
  447.             }
  448.             
  449.             .faq-page .accordion-button .faq-icon {
  450.                 font-size: 1.1rem;
  451.                 margin-right: 10px;
  452.             }
  453.         }
  454.     </style>
  455. ";
  456.         
  457.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  459.         
  460.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  462.         yield from [];
  463.     }
  465.     // line 362
  466.     /**
  467.      * @return iterable<null|scalar|\Stringable>
  468.      */
  469.     public function block_body(array $context, array $blocks = []): iterable
  470.     {
  471.         $macros = $this->macros;
  472.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  473.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  475.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  476.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  478.         // line 363
  479.         yield "    <div class=\"faq-page\">
  480.         <!-- Start Banner Area -->
  481.         <section class=\"banner-area organic-breadcrumb\">
  482.             <div class=\"container\">
  483.                 <div class=\"breadcrumb-banner d-flex flex-wrap align-items-center justify-content-end\">
  484.                     <div class=\"col-first\">
  485.                         <h1>Questions fréquemment posées</h1>
  486.                         <nav class=\"d-flex align-items-center\">
  487.                             <a href=\"";
  488.         // line 371
  489.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ui_home");
  490.         yield "\">Accueil<span class=\"lnr lnr-arrow-right\"></span></a>
  491.                             <a href=\"javascript:void(0)\">FAQ</a>
  492.                         </nav>
  493.                     </div>
  494.                 </div>
  495.             </div>
  496.         </section>
  497.         <!-- End Banner Area -->
  499.         <section class=\"section_gap\">
  500.             <div class=\"container\">
  501.                 <div class=\"row\">
  502.                     <div class=\"col-lg-12\">
  503.                         <div class=\"faq-section-title\">
  504.                             <h2>Comment pouvons-nous vous aider ?</h2>
  505.                             <p>Trouvez rapidement les réponses à vos questions les plus fréquentes</p>
  506.                         </div>
  507.                         
  508.                         <div class=\"faq-stats\">
  509.                             <div class=\"faq-stat-item\">
  510.                                 <span class=\"faq-stat-number\">5+</span>
  511.                                 <span class=\"faq-stat-label\">Questions principales</span>
  512.                             </div>
  513.                             <div class=\"faq-stat-item\">
  514.                                 <span class=\"faq-stat-number\">24/7</span>
  515.                                 <span class=\"faq-stat-label\">Support disponible</span>
  516.                             </div>
  517.                             <div class=\"faq-stat-item\">
  518.                                 <span class=\"faq-stat-number\">100%</span>
  519.                                 <span class=\"faq-stat-label\">Satisfaction client</span>
  520.                             </div>
  521.                         </div>
  522.                         
  523.                         <div class=\"faq-accordion\">
  524.                             <div class=\"accordion\" id=\"faqAccordion\">
  525.                                 <div class=\"accordion-item\">
  526.                                     <h2 class=\"accordion-header\">
  527.                                         <button class=\"accordion-button\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq1\">
  528.                                             <i class=\"fa fa-user-plus faq-icon\"></i>
  529.                                             Comment créer un compte sur MaketOu ?
  530.                                         </button>
  531.                                     </h2>
  532.                                     <div id=\"faq1\" class=\"accordion-collapse collapse show\" data-bs-parent=\"#faqAccordion\">
  533.                                         <div class=\"accordion-body\">
  534.                                             Pour créer un compte, cliquez sur \"S'inscrire\" en haut à droite de la page, remplissez le formulaire avec vos informations et validez votre email. C'est simple, rapide et gratuit !
  535.                                         </div>
  536.                                     </div>
  537.                                 </div>
  539.                                 <div class=\"accordion-item\">
  540.                                     <h2 class=\"accordion-header\">
  541.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq2\">
  542.                                             <i class=\"fa fa-shopping-cart faq-icon\"></i>
  543.                                             Comment passer une commande ?
  544.                                         </button>
  545.                                     </h2>
  546.                                     <div id=\"faq2\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  547.                                         <div class=\"accordion-body\">
  548.                                             Ajoutez les produits souhaités à votre panier, puis cliquez sur \"Finaliser la commande\". Suivez les étapes pour compléter votre commande : sélectionnez votre adresse de livraison, choisissez votre mode de paiement et confirmez votre commande.
  549.                                         </div>
  550.                                     </div>
  551.                                 </div>
  553.                                 <div class=\"accordion-item\">
  554.                                     <h2 class=\"accordion-header\">
  555.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq3\">
  556.                                             <i class=\"fa fa-credit-card faq-icon\"></i>
  557.                                             Quels sont les modes de paiement acceptés ?
  558.                                         </button>
  559.                                     </h2>
  560.                                     <div id=\"faq3\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  561.                                         <div class=\"accordion-body\">
  562.                                             Nous acceptons plusieurs modes de paiement pour votre commodité : MonCash, NatCash, les cartes bancaires (Visa, Mastercard) et les paiements en espèces à la livraison. Tous les paiements sont sécurisés et cryptés.
  563.                                         </div>
  564.                                     </div>
  565.                                 </div>
  567.                                 <div class=\"accordion-item\">
  568.                                     <h2 class=\"accordion-header\">
  569.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq4\">
  570.                                             <i class=\"fa fa-truck faq-icon\"></i>
  571.                                             Comment suivre ma commande ?
  572.                                         </button>
  573.                                     </h2>
  574.                                     <div id=\"faq4\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  575.                                         <div class=\"accordion-body\">
  576.                                             Une fois votre commande passée, vous recevrez un email de confirmation avec un numéro de suivi. Vous pouvez également suivre votre commande en temps réel depuis votre compte dans la section \"Mes commandes\". Vous serez informé à chaque étape de l'expédition.
  577.                                         </div>
  578.                                     </div>
  579.                                 </div>
  581.                                 <div class=\"accordion-item\">
  582.                                     <h2 class=\"accordion-header\">
  583.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq5\">
  584.                                             <i class=\"fa fa-undo faq-icon\"></i>
  585.                                             Puis-je retourner un produit ?
  586.                                         </button>
  587.                                     </h2>
  588.                                     <div id=\"faq5\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  589.                                         <div class=\"accordion-body\">
  590.                                             Oui, vous pouvez retourner un produit dans les 7 jours suivant la réception, à condition qu'il soit dans son état d'origine avec tous les accessoires et l'emballage. Consultez la politique de retour de chaque vendeur pour plus de détails. Le remboursement sera effectué selon les modalités du vendeur.
  591.                                         </div>
  592.                                     </div>
  593.                                 </div>
  594.                             </div>
  595.                         </div>
  597.                         <div class=\"faq-contact-section\">
  598.                             <h3 class=\"text-white\">Vous ne trouvez pas la réponse à votre question ?</h3>
  599.                             <p class=\"text-white\">Notre équipe est là pour vous aider ! Contactez-nous et nous vous répondrons dans les plus brefs délais.</p>
  600.                             <a href=\"";
  601.         // line 481
  602.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ui_contact");
  603.         yield "\" class=\"faq-contact-btn\">
  604.                                 <i class=\"fa fa-envelope me-2\"></i> Contactez-nous
  605.                             </a>
  606.                         </div>
  607.                     </div>
  608.                 </div>
  609.             </div>
  610.         </section>
  611.     </div>
  612. ";
  613.         
  614.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  616.         
  617.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  619.         yield from [];
  620.     }
  622.     /**
  623.      * @codeCoverageIgnore
  624.      */
  625.     public function getTemplateName(): string
  626.     {
  627.         return "home/faq.html.twig";
  628.     }
  630.     /**
  631.      * @codeCoverageIgnore
  632.      */
  633.     public function isTraitable(): bool
  634.     {
  635.         return false;
  636.     }
  638.     /**
  639.      * @codeCoverageIgnore
  640.      */
  641.     public function getDebugInfo(): array
  642.     {
  643.         return array (  602 => 481,  489 => 371,  479 => 363,  466 => 362,  101 => 6,  88 => 5,  65 => 3,  42 => 1,);
  644.     }
  646.     public function getSourceContext(): Source
  647.     {
  648.         return new Source("{% extends 'base_home.html.twig' %}
  650. {% block title %}FAQ | MaketOu{% endblock %}
  652. {% block stylesheets %}
  653.     <style>
  654.         /* Styles spécifiques à la page FAQ - isolés pour ne pas affecter le navbar */
  655.         .faq-page {
  656.             /* Wrapper pour isoler les styles de cette page */
  657.         }
  658.         
  659.         /* Banner amélioré */
  660.         .faq-page .banner-area {
  661.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  662.             padding: 80px 0 60px;
  663.             position: relative;
  664.             overflow: hidden;
  665.         }
  666.         
  667.         .faq-page .banner-area::before {
  668.             content: '';
  669.             position: absolute;
  670.             top: 0;
  671.             left: 0;
  672.             right: 0;
  673.             bottom: 0;
  674.             background: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><circle cx=\"20\" cy=\"20\" r=\"2\" fill=\"rgba(255,255,255,0.1)\"/><circle cx=\"80\" cy=\"80\" r=\"2\" fill=\"rgba(255,255,255,0.1)\"/><circle cx=\"50\" cy=\"50\" r=\"1\" fill=\"rgba(255,255,255,0.1)\"/></svg>');
  675.             opacity: 0.3;
  676.         }
  677.         
  678.         .faq-page .banner-area h1 {
  679.             color: white;
  680.             font-size: 2.5rem;
  681.             font-weight: 700;
  682.             margin-bottom: 15px;
  683.             position: relative;
  684.             z-index: 2;
  685.         }
  686.         
  687.         .faq-page .banner-area nav a {
  688.             color: rgba(255, 255, 255, 0.9);
  689.             font-size: 1rem;
  690.             transition: color 0.3s ease;
  691.         }
  692.         
  693.         .faq-page .banner-area nav a:hover {
  694.             color: white;
  695.         }
  696.         
  697.         /* Section principale */
  698.         .faq-page .section_gap {
  699.             padding: 80px 0;
  700.             background: #f8f9fa;
  701.         }
  702.         
  703.         /* Titre de section */
  704.         .faq-page .faq-section-title {
  705.             text-align: center;
  706.             margin-bottom: 60px;
  707.         }
  708.         
  709.         .faq-page .faq-section-title h2 {
  710.             font-size: 2.5rem;
  711.             font-weight: 700;
  712.             color: #2c3e50;
  713.             margin-bottom: 15px;
  714.             position: relative;
  715.             display: inline-block;
  716.         }
  717.         
  718.         .faq-page .faq-section-title h2::after {
  719.             content: '';
  720.             position: absolute;
  721.             bottom: -10px;
  722.             left: 50%;
  723.             transform: translateX(-50%);
  724.             width: 60px;
  725.             height: 4px;
  726.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  727.             border-radius: 2px;
  728.         }
  729.         
  730.         .faq-page .faq-section-title p {
  731.             color: #666;
  732.             font-size: 1.1rem;
  733.             margin-top: 25px;
  734.         }
  735.         
  736.         /* Accordion moderne */
  737.         .faq-page .faq-accordion {
  738.             max-width: 900px;
  739.             margin: 0 auto;
  740.         }
  741.         
  742.         .faq-page .accordion-item {
  743.             border: none;
  744.             margin-bottom: 20px;
  745.             border-radius: 12px;
  746.             overflow: hidden;
  747.             box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  748.             background: white;
  749.             transition: all 0.3s ease;
  750.         }
  751.         
  752.         .faq-page .accordion-item:hover {
  753.             box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
  754.             transform: translateY(-2px);
  755.         }
  756.         
  757.         .faq-page .accordion-header {
  758.             border: none;
  759.         }
  760.         
  761.         .faq-page .accordion-button {
  762.             background: white;
  763.             border: none;
  764.             padding: 25px 30px;
  765.             font-size: 1.1rem;
  766.             font-weight: 600;
  767.             color: #2c3e50;
  768.             box-shadow: none;
  769.             position: relative;
  770.             transition: all 0.3s ease;
  771.         }
  772.         
  773.         .faq-page .accordion-button::before {
  774.             content: '';
  775.             position: absolute;
  776.             left: 0;
  777.             top: 0;
  778.             bottom: 0;
  779.             width: 4px;
  780.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  781.             opacity: 0;
  782.             transition: opacity 0.3s ease;
  783.         }
  784.         
  785.         .faq-page .accordion-button:not(.collapsed) {
  786.             background: linear-gradient(135deg, rgba(255, 162, 0, 0.1) 0%, rgba(232, 145, 10, 0.1) 100%);
  787.             color: #ffa200;
  788.         }
  789.         
  790.         .faq-page .accordion-button:not(.collapsed)::before {
  791.             opacity: 1;
  792.         }
  793.         
  794.         .faq-page .accordion-button:focus {
  795.             box-shadow: none;
  796.             border: none;
  797.         }
  798.         
  799.         .faq-page .accordion-button::after {
  800.             background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffa200'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e\");
  801.             width: 1.5rem;
  802.             height: 1.5rem;
  803.             transition: transform 0.3s ease;
  804.         }
  805.         
  806.         .faq-page .accordion-button:not(.collapsed)::after {
  807.             transform: rotate(180deg);
  808.         }
  809.         
  810.         /* Icônes pour chaque question */
  811.         .faq-page .accordion-button .faq-icon {
  812.             margin-right: 15px;
  813.             font-size: 1.3rem;
  814.             color: #ffa200;
  815.             transition: transform 0.3s ease;
  816.         }
  817.         
  818.         .faq-page .accordion-button:not(.collapsed) .faq-icon {
  819.             transform: scale(1.1);
  820.         }
  821.         
  822.         .faq-page .accordion-body {
  823.             padding: 25px 30px;
  824.             color: #555;
  825.             font-size: 1rem;
  826.             line-height: 1.8;
  827.             background: white;
  828.         }
  829.         
  830.         .faq-page .accordion-collapse {
  831.             transition: all 0.3s ease;
  832.         }
  833.         
  834.         /* Section contact améliorée */
  835.         .faq-page .faq-contact-section {
  836.             margin-top: 80px;
  837.             padding: 50px;
  838.             background: linear-gradient(135deg, #ffa200 0%, #e8910a 100%);
  839.             border-radius: 20px;
  840.             text-align: center;
  841.             color: white;
  842.             box-shadow: 0 10px 40px rgba(255, 162, 0, 0.3);
  843.             position: relative;
  844.             overflow: hidden;
  845.         }
  846.         
  847.         .faq-page .faq-contact-section::before {
  848.             content: '';
  849.             position: absolute;
  850.             top: -50%;
  851.             right: -50%;
  852.             width: 200%;
  853.             height: 200%;
  854.             background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
  855.             animation: pulse 3s ease-in-out infinite;
  856.         }
  857.         
  858.         @keyframes pulse {
  859.             0%, 100% {
  860.                 transform: scale(1);
  861.                 opacity: 0.5;
  862.             }
  863.             50% {
  864.                 transform: scale(1.1);
  865.                 opacity: 0.3;
  866.             }
  867.         }
  868.         
  869.         .faq-page .faq-contact-section h3 {
  870.             font-size: 2rem;
  871.             font-weight: 700;
  872.             margin-bottom: 15px;
  873.             position: relative;
  874.             z-index: 2;
  875.         }
  876.         
  877.         .faq-page .faq-contact-section p {
  878.             font-size: 1.1rem;
  879.             margin-bottom: 30px;
  880.             opacity: 0.95;
  881.             position: relative;
  882.             z-index: 2;
  883.         }
  884.         
  885.         .faq-page .faq-contact-btn {
  886.             display: inline-block;
  887.             padding: 15px 40px;
  888.             background: white;
  889.             color: #ffa200;
  890.             font-weight: 600;
  891.             font-size: 1.1rem;
  892.             border-radius: 50px;
  893.             text-decoration: none;
  894.             transition: all 0.3s ease;
  895.             box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
  896.             position: relative;
  897.             z-index: 2;
  898.         }
  899.         
  900.         .faq-page .faq-contact-btn:hover {
  901.             transform: translateY(-3px);
  902.             box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
  903.             color: #e8910a;
  904.         }
  905.         
  906.         /* Statistiques FAQ */
  907.         .faq-page .faq-stats {
  908.             display: flex;
  909.             justify-content: center;
  910.             gap: 40px;
  911.             margin-bottom: 50px;
  912.             flex-wrap: wrap;
  913.         }
  914.         
  915.         .faq-page .faq-stat-item {
  916.             text-align: center;
  917.             padding: 20px;
  918.         }
  919.         
  920.         .faq-page .faq-stat-number {
  921.             font-size: 2.5rem;
  922.             font-weight: 700;
  923.             color: #ffa200;
  924.             display: block;
  925.             margin-bottom: 5px;
  926.         }
  927.         
  928.         .faq-page .faq-stat-label {
  929.             color: #666;
  930.             font-size: 0.95rem;
  931.         }
  932.         
  933.         /* Responsive */
  934.         @media(max-width: 991.98px) {
  935.             .faq-page .banner-area h1 {
  936.                 font-size: 2rem;
  937.             }
  938.             
  939.             .faq-page .faq-section-title h2 {
  940.                 font-size: 2rem;
  941.             }
  942.             
  943.             .faq-page .section_gap {
  944.                 padding: 60px 0;
  945.             }
  946.         }
  947.         
  948.         @media(max-width: 767.98px) {
  949.             .faq-page .banner-area {
  950.                 padding: 60px 0 40px;
  951.             }
  952.             
  953.             .faq-page .banner-area h1 {
  954.                 font-size: 1.75rem;
  955.             }
  956.             
  957.             .faq-page .faq-section-title h2 {
  958.                 font-size: 1.75rem;
  959.             }
  960.             
  961.             .faq-page .accordion-button {
  962.                 padding: 20px;
  963.                 font-size: 1rem;
  964.             }
  965.             
  966.             .faq-page .accordion-body {
  967.                 padding: 20px;
  968.             }
  969.             
  970.             .faq-page .faq-contact-section {
  971.                 padding: 30px 20px;
  972.             }
  973.             
  974.             .faq-page .faq-contact-section h3 {
  975.                 font-size: 1.5rem;
  976.             }
  977.             
  978.             .faq-page .faq-stats {
  979.                 gap: 20px;
  980.             }
  981.             
  982.             .faq-page .faq-stat-number {
  983.                 font-size: 2rem;
  984.             }
  985.         }
  986.         
  987.         @media(max-width: 575.98px) {
  988.             .faq-page .banner-area h1 {
  989.                 font-size: 1.5rem;
  990.             }
  991.             
  992.             .faq-page .faq-section-title h2 {
  993.                 font-size: 1.5rem;
  994.             }
  995.             
  996.             .faq-page .accordion-button {
  997.                 padding: 15px;
  998.                 font-size: 0.95rem;
  999.             }
  1000.             
  1001.             .faq-page .accordion-button .faq-icon {
  1002.                 font-size: 1.1rem;
  1003.                 margin-right: 10px;
  1004.             }
  1005.         }
  1006.     </style>
  1007. {% endblock %}
  1009. {% block body %}
  1010.     <div class=\"faq-page\">
  1011.         <!-- Start Banner Area -->
  1012.         <section class=\"banner-area organic-breadcrumb\">
  1013.             <div class=\"container\">
  1014.                 <div class=\"breadcrumb-banner d-flex flex-wrap align-items-center justify-content-end\">
  1015.                     <div class=\"col-first\">
  1016.                         <h1>Questions fréquemment posées</h1>
  1017.                         <nav class=\"d-flex align-items-center\">
  1018.                             <a href=\"{{ path('ui_home') }}\">Accueil<span class=\"lnr lnr-arrow-right\"></span></a>
  1019.                             <a href=\"javascript:void(0)\">FAQ</a>
  1020.                         </nav>
  1021.                     </div>
  1022.                 </div>
  1023.             </div>
  1024.         </section>
  1025.         <!-- End Banner Area -->
  1027.         <section class=\"section_gap\">
  1028.             <div class=\"container\">
  1029.                 <div class=\"row\">
  1030.                     <div class=\"col-lg-12\">
  1031.                         <div class=\"faq-section-title\">
  1032.                             <h2>Comment pouvons-nous vous aider ?</h2>
  1033.                             <p>Trouvez rapidement les réponses à vos questions les plus fréquentes</p>
  1034.                         </div>
  1035.                         
  1036.                         <div class=\"faq-stats\">
  1037.                             <div class=\"faq-stat-item\">
  1038.                                 <span class=\"faq-stat-number\">5+</span>
  1039.                                 <span class=\"faq-stat-label\">Questions principales</span>
  1040.                             </div>
  1041.                             <div class=\"faq-stat-item\">
  1042.                                 <span class=\"faq-stat-number\">24/7</span>
  1043.                                 <span class=\"faq-stat-label\">Support disponible</span>
  1044.                             </div>
  1045.                             <div class=\"faq-stat-item\">
  1046.                                 <span class=\"faq-stat-number\">100%</span>
  1047.                                 <span class=\"faq-stat-label\">Satisfaction client</span>
  1048.                             </div>
  1049.                         </div>
  1050.                         
  1051.                         <div class=\"faq-accordion\">
  1052.                             <div class=\"accordion\" id=\"faqAccordion\">
  1053.                                 <div class=\"accordion-item\">
  1054.                                     <h2 class=\"accordion-header\">
  1055.                                         <button class=\"accordion-button\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq1\">
  1056.                                             <i class=\"fa fa-user-plus faq-icon\"></i>
  1057.                                             Comment créer un compte sur MaketOu ?
  1058.                                         </button>
  1059.                                     </h2>
  1060.                                     <div id=\"faq1\" class=\"accordion-collapse collapse show\" data-bs-parent=\"#faqAccordion\">
  1061.                                         <div class=\"accordion-body\">
  1062.                                             Pour créer un compte, cliquez sur \"S'inscrire\" en haut à droite de la page, remplissez le formulaire avec vos informations et validez votre email. C'est simple, rapide et gratuit !
  1063.                                         </div>
  1064.                                     </div>
  1065.                                 </div>
  1067.                                 <div class=\"accordion-item\">
  1068.                                     <h2 class=\"accordion-header\">
  1069.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq2\">
  1070.                                             <i class=\"fa fa-shopping-cart faq-icon\"></i>
  1071.                                             Comment passer une commande ?
  1072.                                         </button>
  1073.                                     </h2>
  1074.                                     <div id=\"faq2\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  1075.                                         <div class=\"accordion-body\">
  1076.                                             Ajoutez les produits souhaités à votre panier, puis cliquez sur \"Finaliser la commande\". Suivez les étapes pour compléter votre commande : sélectionnez votre adresse de livraison, choisissez votre mode de paiement et confirmez votre commande.
  1077.                                         </div>
  1078.                                     </div>
  1079.                                 </div>
  1081.                                 <div class=\"accordion-item\">
  1082.                                     <h2 class=\"accordion-header\">
  1083.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq3\">
  1084.                                             <i class=\"fa fa-credit-card faq-icon\"></i>
  1085.                                             Quels sont les modes de paiement acceptés ?
  1086.                                         </button>
  1087.                                     </h2>
  1088.                                     <div id=\"faq3\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  1089.                                         <div class=\"accordion-body\">
  1090.                                             Nous acceptons plusieurs modes de paiement pour votre commodité : MonCash, NatCash, les cartes bancaires (Visa, Mastercard) et les paiements en espèces à la livraison. Tous les paiements sont sécurisés et cryptés.
  1091.                                         </div>
  1092.                                     </div>
  1093.                                 </div>
  1095.                                 <div class=\"accordion-item\">
  1096.                                     <h2 class=\"accordion-header\">
  1097.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq4\">
  1098.                                             <i class=\"fa fa-truck faq-icon\"></i>
  1099.                                             Comment suivre ma commande ?
  1100.                                         </button>
  1101.                                     </h2>
  1102.                                     <div id=\"faq4\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  1103.                                         <div class=\"accordion-body\">
  1104.                                             Une fois votre commande passée, vous recevrez un email de confirmation avec un numéro de suivi. Vous pouvez également suivre votre commande en temps réel depuis votre compte dans la section \"Mes commandes\". Vous serez informé à chaque étape de l'expédition.
  1105.                                         </div>
  1106.                                     </div>
  1107.                                 </div>
  1109.                                 <div class=\"accordion-item\">
  1110.                                     <h2 class=\"accordion-header\">
  1111.                                         <button class=\"accordion-button collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#faq5\">
  1112.                                             <i class=\"fa fa-undo faq-icon\"></i>
  1113.                                             Puis-je retourner un produit ?
  1114.                                         </button>
  1115.                                     </h2>
  1116.                                     <div id=\"faq5\" class=\"accordion-collapse collapse\" data-bs-parent=\"#faqAccordion\">
  1117.                                         <div class=\"accordion-body\">
  1118.                                             Oui, vous pouvez retourner un produit dans les 7 jours suivant la réception, à condition qu'il soit dans son état d'origine avec tous les accessoires et l'emballage. Consultez la politique de retour de chaque vendeur pour plus de détails. Le remboursement sera effectué selon les modalités du vendeur.
  1119.                                         </div>
  1120.                                     </div>
  1121.                                 </div>
  1122.                             </div>
  1123.                         </div>
  1125.                         <div class=\"faq-contact-section\">
  1126.                             <h3 class=\"text-white\">Vous ne trouvez pas la réponse à votre question ?</h3>
  1127.                             <p class=\"text-white\">Notre équipe est là pour vous aider ! Contactez-nous et nous vous répondrons dans les plus brefs délais.</p>
  1128.                             <a href=\"{{ path('ui_contact') }}\" class=\"faq-contact-btn\">
  1129.                                 <i class=\"fa fa-envelope me-2\"></i> Contactez-nous
  1130.                             </a>
  1131.                         </div>
  1132.                     </div>
  1133.                 </div>
  1134.             </div>
  1135.         </section>
  1136.     </div>
  1137. {% endblock %}
  1138. ", "home/faq.html.twig", "/home/u540977899/domains/maketou-ht.com/public_html/templates/home/faq.html.twig");
  1139.     }
  1140. }