var/cache/dev/twig/da/daff4eb8b16e38bc70dc63bd1e391365.php line 56

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/shop.html.twig */
  18. class __TwigTemplate_c912687df9963faf4cc570ddc8831a9d 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.             'javascripts' => [$this, 'block_javascripts'],
  37.         ];
  38.     }
  40.     protected function doGetParent(array $context): bool|string|Template|TemplateWrapper
  41.     {
  42.         // line 1
  43.         return "base_home.html.twig";
  44.     }
  46.     protected function doDisplay(array $context, array $blocks = []): iterable
  47.     {
  48.         $macros = $this->macros;
  49.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  50.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "home/shop.html.twig"));
  52.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  53.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "home/shop.html.twig"));
  55.         $this->parent = $this->load("base_home.html.twig", 1);
  56.         yield from $this->parent->unwrap()->yield($context, array_merge($this->blocks, $blocks));
  57.         
  58.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  60.         
  61.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  63.     }
  65.     // line 3
  66.     /**
  67.      * @return iterable<null|scalar|\Stringable>
  68.      */
  69.     public function block_title(array $context, array $blocks = []): iterable
  70.     {
  71.         $macros = $this->macros;
  72.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  73.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  75.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  76.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  78.         // line 4
  79.         yield "\t";
  80.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 4), "html", null, true);
  81.         yield "
  82. \t| MaketOu
  83. ";
  84.         
  85.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  87.         
  88.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  90.         yield from [];
  91.     }
  93.     // line 8
  94.     /**
  95.      * @return iterable<null|scalar|\Stringable>
  96.      */
  97.     public function block_stylesheets(array $context, array $blocks = []): iterable
  98.     {
  99.         $macros = $this->macros;
  100.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  101.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheets"));
  103.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  104.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheets"));
  106.         // line 9
  107.         yield "\t<style>
  108. \t\t/* Design eBay-like intégré avec Karma - Pleine largeur */
  109. \t\t.shop-header {
  110. \t\t\tbackground: #f7f7f7;
  111. \t\t\tborder-bottom: 1px solid #e1e1e1;
  112. \t\t\tpadding: 0;
  113. \t\t\tmargin-bottom: 0;
  114. \t\t\twidth: 100%;
  115. \t\t\tposition: relative;
  116. \t\t}
  118. \t\t.shop-banner {
  119. \t\t\twidth: 100%;
  120. \t\t\theight: 350px;
  121. \t\t\tbackground-size: cover;
  122. \t\t\tbackground-position: center;
  123. \t\t\tbackground-repeat: no-repeat;
  124. \t\t\tposition: relative;
  125. \t\t\tdisplay: flex;
  126. \t\t\talign-items: center;
  127. \t\t\tjustify-content: center;
  128. \t\t}
  130. \t\t/* Carrousel eBay-style - même largeur que shop-header-content */
  131. \t\t.shop-carousel-ebay {
  132. \t\t\twidth: 100%;
  133. \t\t\theight: 400px;
  134. \t\t\tposition: relative;
  135. \t\t\toverflow: hidden;
  136. \t\t\tbackground: #f8f9fa;
  137. \t\t\tmargin: 0 20px 0 20px;
  138. \t\t\tborder-radius: 8px;
  139. \t\t\tbox-sizing: border-box;
  140. \t\t}
  142. \t\t.carousel-container {
  143. \t\t\tposition: relative;
  144. \t\t\twidth: 100%;
  145. \t\t\theight: 100%;
  146. \t\t}
  148. \t\t.carousel-slide {
  149. \t\t\tposition: absolute;
  150. \t\t\ttop: 0;
  151. \t\t\tleft: 0;
  152. \t\t\twidth: 100%;
  153. \t\t\theight: 100%;
  154. \t\t\tbackground-size: cover;
  155. \t\t\tbackground-position: center;
  156. \t\t\tbackground-repeat: no-repeat;
  157. \t\t\topacity: 0;
  158. \t\t\ttransition: opacity 0.5s ease-in-out;
  159. \t\t}
  161. \t\t.carousel-slide.active {
  162. \t\t\topacity: 1;
  163. \t\t}
  165. \t\t.carousel-controls {
  166. \t\t\tposition: absolute;
  167. \t\t\tbottom: 20px;
  168. \t\t\tleft: 50%;
  169. \t\t\ttransform: translateX(-50%);
  170. \t\t\tdisplay: flex;
  171. \t\t\tgap: 10px;
  172. \t\t\tz-index: 10;
  173. \t\t}
  175. \t\t.carousel-btn {
  176. \t\t\twidth: 40px;
  177. \t\t\theight: 40px;
  178. \t\t\tborder: none;
  179. \t\t\tborder-radius: 50%;
  180. \t\t\tbackground: rgba(255, 255, 255, 0.9);
  181. \t\t\tcolor: #333;
  182. \t\t\tfont-size: 16px;
  183. \t\t\tcursor: pointer;
  184. \t\t\tdisplay: flex;
  185. \t\t\talign-items: center;
  186. \t\t\tjustify-content: center;
  187. \t\t\ttransition: all 0.3s ease;
  188. \t\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  189. \t\t}
  191. \t\t.carousel-btn:hover {
  192. \t\t\tbackground: white;
  193. \t\t\ttransform: scale(1.1);
  194. \t\t}
  196. \t\t.carousel-btn:disabled {
  197. \t\t\topacity: 0.5;
  198. \t\t\tcursor: not-allowed;
  199. \t\t\ttransform: none;
  200. \t\t}
  202. \t\t.carousel-pause {
  203. \t\t\tbackground: #dc3545;
  204. \t\t\tcolor: white;
  205. \t\t}
  207. \t\t.carousel-pause:hover {
  208. \t\t\tbackground: #c82333;
  209. \t\t}
  211. \t\t.carousel-indicators {
  212. \t\t\tposition: absolute;
  213. \t\t\tbottom: 70px;
  214. \t\t\tleft: 50%;
  215. \t\t\ttransform: translateX(-50%);
  216. \t\t\tdisplay: flex;
  217. \t\t\tgap: 8px;
  218. \t\t\tz-index: 10;
  219. \t\t}
  221. \t\t.carousel-indicator {
  222. \t\t\twidth: 12px;
  223. \t\t\theight: 12px;
  224. \t\t\tborder-radius: 50%;
  225. \t\t\tbackground: rgba(255, 255, 255, 0.5);
  226. \t\t\tborder: none;
  227. \t\t\tcursor: pointer;
  228. \t\t\ttransition: all 0.3s ease;
  229. \t\t}
  231. \t\t.carousel-indicator.active {
  232. \t\t\tbackground: white;
  233. \t\t\ttransform: scale(1.2);
  234. \t\t}
  236. \t\t/* Contrôles eBay-style intégrés */
  237. \t\t.carousel-controls-ebay {
  238. \t\t\tposition: absolute;
  239. \t\t\ttop: 50%;
  240. \t\t\tleft: 0;
  241. \t\t\tright: 0;
  242. \t\t\ttransform: translateY(-50%);
  243. \t\t\tdisplay: flex;
  244. \t\t\tjustify-content: space-between;
  245. \t\t\tpadding: 0 20px;
  246. \t\t\tz-index: 10;
  247. \t\t}
  249. \t\t.carousel-btn-ebay {
  250. \t\t\twidth: 50px;
  251. \t\t\theight: 50px;
  252. \t\t\tborder: none;
  253. \t\t\tborder-radius: 50%;
  254. \t\t\tbackground: rgba(0, 0, 0, 0.7);
  255. \t\t\tcolor: white;
  256. \t\t\tfont-size: 18px;
  257. \t\t\tcursor: pointer;
  258. \t\t\tdisplay: flex;
  259. \t\t\talign-items: center;
  260. \t\t\tjustify-content: center;
  261. \t\t\ttransition: all 0.3s ease;
  262. \t\t\topacity: 0;
  263. \t\t}
  265. \t\t.shop-carousel-ebay:hover .carousel-btn-ebay {
  266. \t\t\topacity: 1;
  267. \t\t}
  269. \t\t.carousel-btn-ebay:hover {
  270. \t\t\tbackground: rgba(0, 0, 0, 0.9);
  271. \t\t\ttransform: scale(1.1);
  272. \t\t}
  274. \t\t.carousel-btn-ebay:disabled {
  275. \t\t\topacity: 0.3;
  276. \t\t\tcursor: not-allowed;
  277. \t\t\ttransform: none;
  278. \t\t}
  280. \t\t.carousel-btn-ebay.pause-btn {
  281. \t\t\tbackground: rgba(220, 53, 69, 0.8);
  282. \t\t}
  284. \t\t.carousel-btn-ebay.pause-btn:hover {
  285. \t\t\tbackground: rgba(220, 53, 69, 1);
  286. \t\t}
  288. \t\t/* Indicateurs eBay-style */
  289. \t\t.carousel-indicators-ebay {
  290. \t\t\tposition: absolute;
  291. \t\t\tbottom: 20px;
  292. \t\t\tleft: 50%;
  293. \t\t\ttransform: translateX(-50%);
  294. \t\t\tdisplay: flex;
  295. \t\t\tgap: 8px;
  296. \t\t\tz-index: 10;
  297. \t\t}
  299. \t\t.carousel-indicator-ebay {
  300. \t\t\twidth: 12px;
  301. \t\t\theight: 12px;
  302. \t\t\tborder-radius: 50%;
  303. \t\t\tbackground: rgba(255, 255, 255, 0.5);
  304. \t\t\tborder: 2px solid rgba(255, 255, 255, 0.8);
  305. \t\t\tcursor: pointer;
  306. \t\t\ttransition: all 0.3s ease;
  307. \t\t}
  309. \t\t.carousel-indicator-ebay.active {
  310. \t\t\tbackground: white;
  311. \t\t\tborder-color: white;
  312. \t\t\ttransform: scale(1.2);
  313. \t\t}
  315. \t\t.carousel-indicator-ebay:hover {
  316. \t\t\tbackground: rgba(255, 255, 255, 0.8);
  317. \t\t\ttransform: scale(1.1);
  318. \t\t}
  320. \t\t/* Styles eBay-style pour les détails de boutique */
  321. \t\t.shop-avatar-container-ebay {
  322. \t\t\tposition: relative;
  323. \t\t\tmargin-right: 20px;
  324. \t\t}
  326. \t\t.shop-avatar-ebay {
  327. \t\t\twidth: 80px;
  328. \t\t\theight: 80px;
  329. \t\t\tborder-radius: 8px;
  330. \t\t\tobject-fit: cover;
  331. \t\t\tborder: 3px solid white;
  332. \t\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  333. \t\t}
  335. \t\t.verified-badge-ebay {
  336. \t\t\tposition: absolute;
  337. \t\t\tbottom: -5px;
  338. \t\t\tright: -5px;
  339. \t\t\tbackground: #28a745;
  340. \t\t\tcolor: white;
  341. \t\t\twidth: 24px;
  342. \t\t\theight: 24px;
  343. \t\t\tborder-radius: 50%;
  344. \t\t\tdisplay: flex;
  345. \t\t\talign-items: center;
  346. \t\t\tjustify-content: center;
  347. \t\t\tfont-size: 12px;
  348. \t\t\tborder: 2px solid white;
  349. \t\t}
  351. \t\t.shop-info-ebay {
  352. \t\t\tpadding: 10px 0;
  353. \t\t}
  355. \t\t.shop-name-section {
  356. \t\t\tmargin-bottom: 8px;
  357. \t\t}
  359. \t\t.shop-name-ebay {
  360. \t\t\tfont-size: 1.8rem;
  361. \t\t\tfont-weight: 600;
  362. \t\t\tcolor: #333;
  363. \t\t\tmargin: 0 15px 0 0;
  364. \t\t\tdisplay: inline-block;
  365. \t\t}
  367. \t\t.verified-text {
  368. \t\t\tcolor: #28a745;
  369. \t\t\tfont-size: 0.9rem;
  370. \t\t\tfont-weight: 500;
  371. \t\t}
  373. \t\t.shop-category-section {
  374. \t\t\tmargin-bottom: 12px;
  375. \t\t}
  377. \t\t.shop-category-ebay {
  378. \t\t\tbackground: #f8f9fa;
  379. \t\t\tcolor: #666;
  380. \t\t\tpadding: 4px 12px;
  381. \t\t\tborder-radius: 16px;
  382. \t\t\tfont-size: 0.85rem;
  383. \t\t\tfont-weight: 500;
  384. \t\t}
  386. \t\t.shop-stats-ebay {
  387. \t\t\tmargin-top: 15px;
  388. \t\t}
  390. \t\t.stat-row {
  391. \t\t\tdisplay: flex;
  392. \t\t\tgap: 30px;
  393. \t\t\tmargin-bottom: 10px;
  394. \t\t}
  396. \t\t.stat-item-ebay {
  397. \t\t\tdisplay: flex;
  398. \t\t\tflex-direction: column;
  399. \t\t\talign-items: flex-start;
  400. \t\t}
  402. \t\t.stat-percentage {
  403. \t\t\tfont-size: 1.2rem;
  404. \t\t\tfont-weight: 700;
  405. \t\t\tcolor: #28a745;
  406. \t\t\tline-height: 1;
  407. \t\t}
  409. \t\t.stat-number-ebay {
  410. \t\t\tfont-size: 1.2rem;
  411. \t\t\tfont-weight: 700;
  412. \t\t\tcolor: #333;
  413. \t\t\tline-height: 1;
  414. \t\t}
  416. \t\t.stat-label-ebay {
  417. \t\t\tfont-size: 0.8rem;
  418. \t\t\tcolor: #666;
  419. \t\t\ttext-transform: uppercase;
  420. \t\t\tletter-spacing: 0.5px;
  421. \t\t\tmargin-top: 2px;
  422. \t\t}
  424. \t\t.shop-additional-info {
  425. \t\t\tdisplay: flex;
  426. \t\t\tgap: 20px;
  427. \t\t\tfont-size: 0.85rem;
  428. \t\t\tcolor: #666;
  429. \t\t}
  431. \t\t.member-since {
  432. \t\t\tfont-weight: 400;
  433. \t\t}
  435. \t\t.location {
  436. \t\t\tdisplay: flex;
  437. \t\t\talign-items: center;
  438. \t\t}
  440. \t\t.shop-actions-ebay {
  441. \t\t\tdisplay: flex;
  442. \t\t\tflex-direction: column;
  443. \t\t\tgap: 10px;
  444. \t\t\tmin-width: 140px;
  445. \t\t}
  447. \t\t.btn-ebay {
  448. \t\t\tpadding: 8px 16px;
  449. \t\t\tfont-size: 0.9rem;
  450. \t\t\tfont-weight: 500;
  451. \t\t\tborder-radius: 4px;
  452. \t\t\ttext-align: center;
  453. \t\t\ttransition: all 0.3s ease;
  454. \t\t\tborder-width: 1px;
  455. \t\t}
  457. \t\t.btn-ebay:hover {
  458. \t\t\ttransform: translateY(-1px);
  459. \t\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  460. \t\t}
  462. \t\t.btn-ebay.following {
  463. \t\t\tbackground: #28a745;
  464. \t\t\tborder-color: #28a745;
  465. \t\t\tcolor: white;
  466. \t\t}
  468. \t\t/* Styles pour les avis */
  469. \t\t.review-stats {
  470. \t\t\tbackground: white;
  471. \t\t\tborder-radius: 12px;
  472. \t\t\tpadding: 20px;
  473. \t\t\tbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  474. \t\t\tmargin-bottom: 20px;
  475. \t\t}
  477. \t\t.stat-card {
  478. \t\t\tpadding: 15px;
  479. \t\t}
  481. \t\t.stat-number {
  482. \t\t\tfont-size: 2.5rem;
  483. \t\t\tfont-weight: 700;
  484. \t\t\tcolor: #333;
  485. \t\t\tmargin: 0;
  486. \t\t}
  488. \t\t.stat-label {
  489. \t\t\tcolor: #666;
  490. \t\t\tfont-size: 0.9rem;
  491. \t\t\tmargin: 5px 0 0;
  492. \t\t}
  494. \t\t.rating-stars {
  495. \t\t\tcolor: #ffc107;
  496. \t\t\tfont-size: 1.2rem;
  497. \t\t\tmargin: 10px 0;
  498. \t\t}
  500. \t\t.reviews-preview {
  501. \t\t\tbackground: white;
  502. \t\t\tborder-radius: 12px;
  503. \t\t\tpadding: 20px;
  504. \t\t\tbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  505. \t\t}
  507. \t\t.review-item {
  508. \t\t\tborder-bottom: 1px solid #f0f0f0;
  509. \t\t\tpadding: 15px 0;
  510. \t\t}
  512. \t\t.review-item:last-child {
  513. \t\t\tborder-bottom: none;
  514. \t\t}
  516. \t\t.review-header {
  517. \t\t\tdisplay: flex;
  518. \t\t\tjustify-content: space-between;
  519. \t\t\talign-items: flex-start;
  520. \t\t\tmargin-bottom: 10px;
  521. \t\t}
  523. \t\t.reviewer-info {
  524. \t\t\tdisplay: flex;
  525. \t\t\talign-items: center;
  526. \t\t\tgap: 10px;
  527. \t\t}
  529. \t\t.reviewer-avatar {
  530. \t\t\twidth: 40px;
  531. \t\t\theight: 40px;
  532. \t\t\tborder-radius: 50%;
  533. \t\t\tbackground: #f8f9fa;
  534. \t\t\tdisplay: flex;
  535. \t\t\talign-items: center;
  536. \t\t\tjustify-content: center;
  537. \t\t\tcolor: #666;
  538. \t\t}
  540. \t\t.reviewer-name {
  541. \t\t\tmargin: 0;
  542. \t\t\tfont-size: 1rem;
  543. \t\t\tfont-weight: 600;
  544. \t\t}
  546. \t\t.review-rating {
  547. \t\t\tcolor: #ffc107;
  548. \t\t\tfont-size: 0.9rem;
  549. \t\t}
  551. \t\t.review-meta {
  552. \t\t\ttext-align: right;
  553. \t\t}
  555. \t\t.review-date {
  556. \t\t\tcolor: #666;
  557. \t\t\tfont-size: 0.8rem;
  558. \t\t}
  560. \t\t.verified-badge {
  561. \t\t\tdisplay: inline-block;
  562. \t\t\tbackground: #28a745;
  563. \t\t\tcolor: white;
  564. \t\t\tpadding: 2px 8px;
  565. \t\t\tborder-radius: 12px;
  566. \t\t\tfont-size: 0.7rem;
  567. \t\t\tmargin-left: 10px;
  568. \t\t}
  570. \t\t.review-comment {
  571. \t\t\tmargin: 10px 0 0;
  572. \t\t\tline-height: 1.5;
  573. \t\t\tcolor: #333;
  574. \t\t}
  576. \t\t.review-actions-card {
  577. \t\t\tbackground: white;
  578. \t\t\tborder-radius: 12px;
  579. \t\t\tpadding: 20px;
  580. \t\t\tbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  581. \t\t\ttext-align: center;
  582. \t\t}
  584. \t\t.shop-banner-overlay {
  585. \t\t\tposition: absolute;
  586. \t\t\ttop: 0;
  587. \t\t\tleft: 0;
  588. \t\t\tright: 0;
  589. \t\t\tbottom: 0;
  590. \t\t\tbackground: rgba(0, 0, 0, 0.3);
  591. \t\t\tz-index: 1;
  592. \t\t}
  594. \t\t.shop-header-content {
  595. \t\t\tbackground: white;
  596. \t\t\tborder: 1px solid #e1e1e1;
  597. \t\t\tborder-radius: 4px;
  598. \t\t\tpadding: 20px;
  599. \t\t\tmargin: 0 20px 20px;
  600. \t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  601. \t\t\tposition: relative;
  602. \t\t\tz-index: 2;
  603. \t\t}
  605. \t\t.shop-avatar {
  606. \t\t\twidth: 80px;
  607. \t\t\theight: 80px;
  608. \t\t\tborder-radius: 4px;
  609. \t\t\tborder: 1px solid #e1e1e1;
  610. \t\t\tobject-fit: cover;
  611. \t\t\tposition: relative;
  612. \t\t\tz-index: 3;
  613. \t\t}
  615. \t\t.shop-title {
  616. \t\t\tfont-size: 1.5rem;
  617. \t\t\tfont-weight: 600;
  618. \t\t\tcolor: #333;
  619. \t\t\tmargin-bottom: 8px;
  620. \t\t}
  622. \t\t.shop-subtitle {
  623. \t\t\tcolor: #666;
  624. \t\t\tfont-size: 0.9rem;
  625. \t\t\tmargin-bottom: 15px;
  626. \t\t}
  628. \t\t.shop-stats-row {
  629. \t\t\tdisplay: flex;
  630. \t\t\talign-items: center;
  631. \t\t\tgap: 20px;
  632. \t\t\tflex-wrap: wrap;
  633. \t\t\tmargin-bottom: 15px;
  634. \t\t}
  636. \t\t.shop-stat-item {
  637. \t\t\tdisplay: flex;
  638. \t\t\talign-items: center;
  639. \t\t\tgap: 5px;
  640. \t\t\tfont-size: 0.9rem;
  641. \t\t}
  643. \t\t.positive-feedback {
  644. \t\t\tcolor: #007bff;
  645. \t\t\tfont-weight: 600;
  646. \t\t}
  648. \t\t.items-sold {
  649. \t\t\tcolor: #666;
  650. \t\t}
  652. \t\t.followers-count {
  653. \t\t\tcolor: #666;
  654. \t\t}
  656. \t\t.shop-badges {
  657. \t\t\tdisplay: flex;
  658. \t\t\tgap: 10px;
  659. \t\t\tmargin-bottom: 15px;
  660. \t\t}
  662. \t\t.shop-badge {
  663. \t\t\tbackground: #f0f0f0;
  664. \t\t\tcolor: #333;
  665. \t\t\tpadding: 4px 8px;
  666. \t\t\tborder-radius: 3px;
  667. \t\t\tfont-size: 0.8rem;
  668. \t\t\tfont-weight: 500;
  669. \t\t}
  671. \t\t.shop-badge.verified {
  672. \t\t\tbackground: #d4edda;
  673. \t\t\tcolor: #155724;
  674. \t\t}
  676. \t\t.shop-badge.premium {
  677. \t\t\tbackground: #fff3cd;
  678. \t\t\tcolor: #856404;
  679. \t\t}
  681. \t\t.shop-actions-row {
  682. \t\t\tdisplay: flex;
  683. \t\t\talign-items: center;
  684. \t\t\tgap: 15px;
  685. \t\t\tflex-wrap: wrap;
  686. \t\t}
  688. \t\t.shop-action-btn {
  689. \t\t\tbackground: #007bff;
  690. \t\t\tcolor: white;
  691. \t\t\tborder: none;
  692. \t\t\tpadding: 8px 16px;
  693. \t\t\tborder-radius: 3px;
  694. \t\t\tfont-size: 0.9rem;
  695. \t\t\tfont-weight: 500;
  696. \t\t\tcursor: pointer;
  697. \t\t\ttransition: background-color 0.2s;
  698. \t\t\ttext-decoration: none;
  699. \t\t\tdisplay: inline-flex;
  700. \t\t\talign-items: center;
  701. \t\t\tgap: 5px;
  702. \t\t}
  704. \t\t.shop-action-btn:hover {
  705. \t\t\tbackground: #0056b3;
  706. \t\t\tcolor: white;
  707. \t\t}
  709. \t\t.shop-action-btn.following {
  710. \t\t\tbackground: #28a745;
  711. \t\t}
  713. \t\t.shop-action-btn.following:hover {
  714. \t\t\tbackground: #1e7e34;
  715. \t\t}
  717. \t\t.shop-action-btn.secondary {
  718. \t\t\tbackground: #6c757d;
  719. \t\t}
  721. \t\t.shop-action-btn.secondary:hover {
  722. \t\t\tbackground: #545b62;
  723. \t\t}
  725. \t\t/* Onglets eBay-style avec classes Karma */
  726. \t\t.shop-tabs {
  727. \t\t\tbackground: white;
  728. \t\t\tborder: 1px solid #e1e1e1;
  729. \t\t\tborder-top: none;
  730. \t\t\tborder-radius: 0 0 4px 4px;
  731. \t\t\tmargin-top: 0;
  732. \t\t}
  734. \t\t.shop-tabs-nav {
  735. \t\t\tdisplay: flex;
  736. \t\t\tborder-bottom: 1px solid #e1e1e1;
  737. \t\t\tmargin: 0;
  738. \t\t\tpadding: 0;
  739. \t\t\tlist-style: none;
  740. \t\t\tbackground: #f8f9fa;
  741. \t\t}
  743. \t\t.shop-tab {
  744. \t\t\tmargin: 0;
  745. \t\t}
  747. \t\t.shop-tab-link {
  748. \t\t\tdisplay: block;
  749. \t\t\tpadding: 12px 20px;
  750. \t\t\tcolor: #000000;
  751. \t\t\ttext-decoration: none;
  752. \t\t\tborder-bottom: 2px solid transparent;
  753. \t\t\ttransition: all 0.2s;
  754. \t\t\tfont-weight: 500;
  755. \t\t\tfont-size: 1rem;
  756. \t\t}
  758. \t\t.shop-tab-link:hover,
  759. \t\t.shop-tab-link.active {
  760. \t\t\tcolor: #095ad3;
  761. \t\t\tborder-bottom-color: #095ad3;
  762. \t\t\tbackground: #ffa200;
  763. \t\t}
  765. \t\t.shop-tab-content {
  766. \t\t\tpadding: 30px;
  767. \t\t\tmin-height: 400px;
  768. \t\t}
  770. \t\t.shop-tab-content:not(.active) {
  771. \t\t\tdisplay: none;
  772. \t\t}
  774. \t\t.shop-tab-content.active {
  775. \t\t\tdisplay: block;
  776. \t\t}
  778. \t\t/* Cards d'information avec style Karma */
  779. \t\t.shop-info-card {
  780. \t\t\tbackground: #f8f9fa;
  781. \t\t\tborder: 1px solid #e1e1e1;
  782. \t\t\tborder-radius: 4px;
  783. \t\t\tpadding: 20px;
  784. \t\t\tmargin-bottom: 20px;
  785. \t\t}
  787. \t\t.shop-info-card h6 {
  788. \t\t\tcolor: #333;
  789. \t\t\tfont-weight: 600;
  790. \t\t\tmargin-bottom: 15px;
  791. \t\t\tfont-size: 1.1rem;
  792. \t\t}
  794. \t\t.shop-info-card p {
  795. \t\t\tcolor: #666;
  796. \t\t\tfont-size: 0.9rem;
  797. \t\t\tmargin: 0;
  798. \t\t\tline-height: 1.5;
  799. \t\t}
  801. \t\t.shop-contact-info {
  802. \t\t\tdisplay: flex;
  803. \t\t\tflex-direction: column;
  804. \t\t\tgap: 10px;
  805. \t\t}
  807. \t\t.shop-contact-item {
  808. \t\t\tdisplay: flex;
  809. \t\t\talign-items: center;
  810. \t\t\tgap: 10px;
  811. \t\t\tfont-size: 0.9rem;
  812. \t\t\tcolor: #666;
  813. \t\t\tpadding: 5px 0;
  814. \t\t}
  816. \t\t.shop-contact-item i {
  817. \t\t\twidth: 16px;
  818. \t\t\tcolor: #007bff;
  819. \t\t\ttext-align: center;
  820. \t\t}
  822. \t\t.shop-social-links {
  823. \t\t\tdisplay: flex;
  824. \t\t\tgap: 10px;
  825. \t\t\tmargin-top: 15px;
  826. \t\t\tflex-wrap: wrap;
  827. \t\t}
  829. \t\t.shop-social-link {
  830. \t\t\tdisplay: inline-flex;
  831. \t\t\talign-items: center;
  832. \t\t\tjustify-content: center;
  833. \t\t\twidth: 36px;
  834. \t\t\theight: 36px;
  835. \t\t\tbackground: #f0f0f0;
  836. \t\t\tcolor: #666;
  837. \t\t\tborder-radius: 4px;
  838. \t\t\ttext-decoration: none;
  839. \t\t\ttransition: all 0.2s;
  840. \t\t\tfont-size: 1.1rem;
  841. \t\t}
  843. \t\t.shop-social-link:hover {
  844. \t\t\tbackground: #007bff;
  845. \t\t\tcolor: white;
  846. \t\t\ttransform: translateY(-2px);
  847. \t\t}
  849. \t\t/* Produits avec style Karma */
  850. \t\t.product-card {
  851. \t\t\tbackground: white;
  852. \t\t\tborder: 1px solid #e1e1e1;
  853. \t\t\tborder-radius: 4px;
  854. \t\t\toverflow: hidden;
  855. \t\t\ttransition: all 0.3s ease;
  856. \t\t\tmargin-bottom: 20px;
  857. \t\t}
  859. \t\t.product-card:hover {
  860. \t\t\ttransform: translateY(-2px);
  861. \t\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  862. \t\t}
  864. \t\t/* Animation de tri des produits */
  865. \t\t.product-item {
  866. \t\t\ttransition: all 0.3s ease;
  867. \t\t}
  869. \t\t.product-item.sorting {
  870. \t\t\topacity: 0;
  871. \t\t\ttransform: translateY(20px);
  872. \t\t}
  874. \t\t.product-item.sorted {
  875. \t\t\topacity: 1;
  876. \t\t\ttransform: translateY(0);
  877. \t\t}
  879. \t\t.product-image {
  880. \t\t\theight: 200px;
  881. \t\t\tbackground-size: cover;
  882. \t\t\tbackground-position: center;
  883. \t\t\tposition: relative;
  884. \t\t\toverflow: hidden;
  885. \t\t}
  887. \t\t.product-info {
  888. \t\t\tpadding: 15px;
  889. \t\t}
  891. \t\t.product-title {
  892. \t\t\tfont-size: 1rem;
  893. \t\t\tfont-weight: 600;
  894. \t\t\tmargin-bottom: 8px;
  895. \t\t\tcolor: #333;
  896. \t\t\tline-height: 1.3;
  897. \t\t}
  899. \t\t.product-title a {
  900. \t\t\tcolor: #333;
  901. \t\t\ttext-decoration: none;
  902. \t\t}
  904. \t\t.product-title a:hover {
  905. \t\t\tcolor: #007bff;
  906. \t\t}
  908. \t\t.product-price {
  909. \t\t\tfont-size: 1.2rem;
  910. \t\t\tfont-weight: bold;
  911. \t\t\tcolor: #ff6b35;
  912. \t\t\tmargin-bottom: 10px;
  913. \t\t}
  915. \t\t.product-meta {
  916. \t\t\tdisplay: flex;
  917. \t\t\tjustify-content: space-between;
  918. \t\t\talign-items: center;
  919. \t\t\tfont-size: 0.85rem;
  920. \t\t\tcolor: #666;
  921. \t\t}
  923. \t\t.rating {
  924. \t\t\tcolor: #ffc107;
  925. \t\t}
  927. \t\t/* Responsive avec classes Karma */
  928. \t\t/* Responsive amélioré pour la page shop */
  929. \t\t@media(max-width: 991.98px) {
  930. \t\t\t.shop-carousel-ebay {
  931. \t\t\t\tmargin: 0 10px;
  932. \t\t\t\theight: 300px;
  933. \t\t\t}
  934. \t\t\t
  935. \t\t\t.shop-header-content {
  936. \t\t\t\tpadding: 15px;
  937. \t\t\t\tmargin: 0 10px 20px;
  938. \t\t\t}
  939. \t\t\t
  940. \t\t\t.shop-header-content .row {
  941. \t\t\t\tflex-wrap: wrap;
  942. \t\t\t}
  943. \t\t\t
  944. \t\t\t.shop-info-ebay {
  945. \t\t\t\tmargin-top: 15px;
  946. \t\t\t}
  947. \t\t}
  948. \t\t
  949. \t\t@media(max-width: 768px) {
  950. \t\t\t.shop-banner,
  951. \t\t\t.shop-carousel-ebay {
  952. \t\t\t\theight: 250px;
  953. \t\t\t\tmargin: 0;
  954. \t\t\t\tborder-radius: 0;
  955. \t\t\t}
  956. \t\t\t
  957. \t\t\t.shop-carousel-ebay .carousel-container {
  958. \t\t\t\tborder-radius: 0;
  959. \t\t\t}
  961. \t\t\t.carousel-controls-ebay {
  962. \t\t\t\tpadding: 0 10px;
  963. \t\t\t\tbottom: 15px;
  964. \t\t\t}
  966. \t\t\t.carousel-btn-ebay {
  967. \t\t\t\twidth: 35px;
  968. \t\t\t\theight: 35px;
  969. \t\t\t\tfont-size: 14px;
  970. \t\t\t}
  972. \t\t\t.carousel-indicators-ebay {
  973. \t\t\t\tbottom: 10px;
  974. \t\t\t\tgap: 6px;
  975. \t\t\t}
  976. \t\t\t
  977. \t\t\t.carousel-indicator-ebay {
  978. \t\t\t\twidth: 10px;
  979. \t\t\t\theight: 10px;
  980. \t\t\t}
  982. \t\t\t.shop-header-content {
  983. \t\t\t\tpadding: 15px;
  984. \t\t\t\tmargin: 0;
  985. \t\t\t}
  986. \t\t\t
  987. \t\t\t.shop-header-content .container {
  988. \t\t\t\tpadding-left: 15px;
  989. \t\t\t\tpadding-right: 15px;
  990. \t\t\t}
  992. \t\t\t.shop-avatar {
  993. \t\t\t\twidth: 60px;
  994. \t\t\t\theight: 60px;
  995. \t\t\t}
  997. \t\t\t.shop-title {
  998. \t\t\t\tfont-size: 1.2rem;
  999. \t\t\t}
  1001. \t\t\t.shop-actions-row {
  1002. \t\t\t\tflex-direction: column;
  1003. \t\t\t\tgap: 10px;
  1004. \t\t\t}
  1006. \t\t\t/* Styles eBay-style responsive */
  1007. \t\t\t.shop-header-content .row {
  1008. \t\t\t\tflex-direction: column;
  1009. \t\t\t\ttext-align: center;
  1010. \t\t\t}
  1012. \t\t\t.shop-avatar-container-ebay {
  1013. \t\t\t\tmargin-right: 0;
  1014. \t\t\t\tmargin-bottom: 15px;
  1015. \t\t\t\talign-self: center;
  1016. \t\t\t}
  1018. \t\t\t.shop-avatar-ebay {
  1019. \t\t\t\twidth: 80px;
  1020. \t\t\t\theight: 80px;
  1021. \t\t\t}
  1023. \t\t\t.shop-name-ebay {
  1024. \t\t\t\tfont-size: 1.5rem;
  1025. \t\t\t\tmargin-right: 0;
  1026. \t\t\t\tmargin-bottom: 10px;
  1027. \t\t\t}
  1029. \t\t\t.stat-row {
  1030. \t\t\t\tjustify-content: center;
  1031. \t\t\t\tgap: 15px;
  1032. \t\t\t\tflex-wrap: wrap;
  1033. \t\t\t}
  1034. \t\t\t
  1035. \t\t\t.stat-item-ebay {
  1036. \t\t\t\tfont-size: 0.9rem;
  1037. \t\t\t\tmin-width: 100px;
  1038. \t\t\t}
  1040. \t\t\t.shop-additional-info {
  1041. \t\t\t\tjustify-content: center;
  1042. \t\t\t\tflex-wrap: wrap;
  1043. \t\t\t}
  1045. \t\t\t.shop-actions-ebay {
  1046. \t\t\t\tflex-direction: column;
  1047. \t\t\t\tjustify-content: center;
  1048. \t\t\t\tmin-width: auto;
  1049. \t\t\t\tmargin-top: 15px;
  1050. \t\t\t\twidth: 100%;
  1051. \t\t\t}
  1053. \t\t\t.btn-ebay {
  1054. \t\t\t\twidth: 100%;
  1055. \t\t\t\tmin-width: auto;
  1056. \t\t\t\tmargin-bottom: 10px;
  1057. \t\t\t}
  1059. \t\t\t.btn-shop,
  1060. \t\t\t.shop-action-btn {
  1061. \t\t\t\twidth: 100%;
  1062. \t\t\t\tmin-width: auto;
  1063. \t\t\t\theight: 45px;
  1064. \t\t\t\tfont-size: 0.9rem;
  1065. \t\t\t\tpadding: 12px 20px;
  1066. \t\t\t}
  1068. \t\t\t.shop-tabs-nav {
  1069. \t\t\t\tflex-wrap: wrap;
  1070. \t\t\t\tjustify-content: center;
  1071. \t\t\t}
  1072. \t\t\t
  1073. \t\t\t.shop-tab-link {
  1074. \t\t\t\tfont-size: 0.85rem;
  1075. \t\t\t\tpadding: 0.5rem 0.75rem;
  1076. \t\t\t\tflex: 1;
  1077. \t\t\t\tmin-width: auto;
  1078. \t\t\t}
  1079. \t\t\t
  1080. \t\t\t/* Produits responsive */
  1081. \t\t\t#products-container .product-item {
  1082. \t\t\t\tmargin-bottom: 20px;
  1083. \t\t\t}
  1084. \t\t\t
  1085. \t\t\t.product-card {
  1086. \t\t\t\tpadding: 15px;
  1087. \t\t\t}
  1088. \t\t\t
  1089. \t\t\t.product-title {
  1090. \t\t\t\tfont-size: 0.95rem;
  1091. \t\t\t}
  1092. \t\t\t
  1093. \t\t\t.product-price {
  1094. \t\t\t\tfont-size: 1.1rem;
  1095. \t\t\t}
  1096. \t\t\t
  1097. \t\t\t/* Détails de la boutique responsive */
  1098. \t\t\t.shop-info-ebay {
  1099. \t\t\t\ttext-align: center;
  1100. \t\t\t}
  1101. \t\t}
  1102. \t\t
  1103. \t\t@media(max-width: 575.98px) {
  1104. \t\t\t.shop-banner,
  1105. \t\t\t.shop-carousel-ebay {
  1106. \t\t\t\theight: 200px;
  1107. \t\t\t\tmargin: 0;
  1108. \t\t\t}
  1109. \t\t\t
  1110. \t\t\t.shop-header-content {
  1111. \t\t\t\tmargin: 0;
  1112. \t\t\t\tpadding: 15px;
  1113. \t\t\t}
  1114. \t\t\t
  1115. \t\t\t.shop-name-ebay {
  1116. \t\t\t\tfont-size: 1.3rem;
  1117. \t\t\t}
  1118. \t\t\t
  1119. \t\t\t.stat-row {
  1120. \t\t\t\tgap: 10px;
  1121. \t\t\t\tflex-direction: column;
  1122. \t\t\t}
  1123. \t\t\t
  1124. \t\t\t.stat-item-ebay {
  1125. \t\t\t\tfont-size: 0.85rem;
  1126. \t\t\t\twidth: 100%;
  1127. \t\t\t}
  1128. \t\t\t
  1129. \t\t\t.carousel-btn-ebay {
  1130. \t\t\t\twidth: 25px;
  1131. \t\t\t\theight: 25px;
  1132. \t\t\t\tfont-size: 10px;
  1133. \t\t\t}
  1134. \t\t\t
  1135. \t\t\t.carousel-indicators-ebay {
  1136. \t\t\t\tbottom: 8px;
  1137. \t\t\t}
  1138. \t\t\t
  1139. \t\t\t.carousel-indicator-ebay {
  1140. \t\t\t\twidth: 6px;
  1141. \t\t\t\theight: 6px;
  1142. \t\t\t}
  1143. \t\t\t
  1144. \t\t\t.shop-tab-content {
  1145. \t\t\t\tpadding: 15px 10px;
  1146. \t\t\t}
  1148. \t\t\t.shop-stats-row {
  1149. \t\t\t\tflex-direction: column;
  1150. \t\t\t\tgap: 10px;
  1151. \t\t\t\talign-items: flex-start;
  1152. \t\t\t}
  1153. \t\t}
  1155. \t\t.follow-button {
  1156. \t\t\tbackground: #ffa200;
  1157. \t\t\tborder: none;
  1158. \t\t\tcolor: white;
  1159. \t\t\tpadding: 12px 30px;
  1160. \t\t\tborder-radius: 25px;
  1161. \t\t\tfont-weight: 600;
  1162. \t\t\ttransition: all 0.3s ease;
  1163. \t\t\tcursor: pointer;
  1164. \t\t\tdisplay: inline-flex;
  1165. \t\t\talign-items: center;
  1166. \t\t\tgap: 8px;
  1167. \t\t}
  1169. \t\t.follow-button:hover {
  1170. \t\t\tbackground: #e8910a;
  1171. \t\t\ttransform: translateY(-2px);
  1172. \t\t\tbox-shadow: 0 5px 15px rgba(255, 162, 0, 0.3);
  1173. \t\t}
  1175. \t\t.follow-button.following {
  1176. \t\t\tbackground: #28a745;
  1177. \t\t}
  1179. \t\t.follow-button.following:hover {
  1180. \t\t\tbackground: #218838;
  1181. \t\t}
  1183. \t\t.follow-button:disabled {
  1184. \t\t\topacity: 0.6;
  1185. \t\t\tcursor: not-allowed;
  1186. \t\t\ttransform: none;
  1187. \t\t}
  1189. \t\t.follow-stats {
  1190. \t\t\tdisplay: flex;
  1191. \t\t\tgap: 30px;
  1192. \t\t\tmargin-top: 20px;
  1193. \t\t\tflex-wrap: wrap;
  1194. \t\t}
  1196. \t\t.follow-stat {
  1197. \t\t\ttext-align: center;
  1198. \t\t\tpadding: 15px;
  1199. \t\t\tbackground: #f8f9fa;
  1200. \t\t\tborder-radius: 10px;
  1201. \t\t\tmin-width: 120px;
  1202. \t\t}
  1204. \t\t.follow-stat-number {
  1205. \t\t\tfont-size: 1.8rem;
  1206. \t\t\tfont-weight: bold;
  1207. \t\t\tcolor: #ffa200;
  1208. \t\t\tdisplay: block;
  1209. \t\t}
  1211. \t\t.follow-stat-label {
  1212. \t\t\tcolor: #666;
  1213. \t\t\tfont-size: 0.9rem;
  1214. \t\t\ttext-transform: uppercase;
  1215. \t\t\tletter-spacing: 0.5px;
  1216. \t\t}
  1218. \t\t.shop-actions {
  1219. \t\t\tdisplay: flex;
  1220. \t\t\tgap: 15px;
  1221. \t\t\talign-items: center;
  1222. \t\t\tflex-wrap: wrap;
  1223. \t\t\tmargin-top: 20px;
  1224. \t\t}
  1226. \t\t.action-button {
  1227. \t\t\tbackground: white;
  1228. \t\t\tborder: 2px solid #ffa200;
  1229. \t\t\tcolor: #ffa200;
  1230. \t\t\tpadding: 10px 20px;
  1231. \t\t\tborder-radius: 20px;
  1232. \t\t\ttext-decoration: none;
  1233. \t\t\tfont-weight: 500;
  1234. \t\t\ttransition: all 0.3s ease;
  1235. \t\t\tdisplay: inline-flex;
  1236. \t\t\talign-items: center;
  1237. \t\t\tgap: 8px;
  1238. \t\t}
  1240. \t\t.action-button:hover {
  1241. \t\t\tbackground: #ffa200;
  1242. \t\t\tcolor: white;
  1243. \t\t\ttransform: translateY(-2px);
  1244. \t\t\tbox-shadow: 0 5px 15px rgba(255, 162, 0, 0.3);
  1245. \t\t}
  1247. \t\t.positive-feedback {
  1248. \t\t\tcolor: #28a745;
  1249. \t\t\tfont-weight: bold;
  1250. \t\t}
  1252. \t\t.items-sold {
  1253. \t\t\tcolor: #666;
  1254. \t\t\tfont-size: 0.9rem;
  1255. \t\t}
  1257. \t\t.followers-count {
  1258. \t\t\tcolor: #666;
  1259. \t\t\tfont-size: 0.9rem;
  1260. \t\t}
  1262. \t\t.shop-avatar {
  1263. \t\t\twidth: 120px;
  1264. \t\t\theight: 120px;
  1265. \t\t\tborder-radius: 50%;
  1266. \t\t\tborder: 4px solid white;
  1267. \t\t\tobject-fit: cover;
  1268. \t\t\tmargin-bottom: 20px;
  1269. \t\t}
  1271. \t\t.shop-stats {
  1272. \t\t\tbackground: white;
  1273. \t\t\tborder-radius: 10px;
  1274. \t\t\tpadding: 30px;
  1275. \t\t\tbox-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  1276. \t\t\tmargin-top: -50px;
  1277. \t\t\tposition: relative;
  1278. \t\t\tz-index: 10;
  1279. \t\t}
  1281. \t\t.stat-item {
  1282. \t\t\ttext-align: center;
  1283. \t\t\tpadding: 20px;
  1284. \t\t}
  1286. \t\t.stat-number {
  1287. \t\t\tfont-size: 2.5rem;
  1288. \t\t\tfont-weight: bold;
  1289. \t\t\tcolor: #ffa200;
  1290. \t\t\tdisplay: block;
  1291. \t\t}
  1293. \t\t.stat-label {
  1294. \t\t\tcolor: #666;
  1295. \t\t\tfont-size: 0.9rem;
  1296. \t\t\ttext-transform: uppercase;
  1297. \t\t\tletter-spacing: 1px;
  1298. \t\t}
  1300. \t\t.shop-description {
  1301. \t\t\tbackground: #f8f9fa;
  1302. \t\t\tpadding: 30px;
  1303. \t\t\tborder-radius: 10px;
  1304. \t\t\tmargin-bottom: 40px;
  1305. \t\t}
  1307. \t\t.shop-contact {
  1308. \t\t\tbackground: white;
  1309. \t\t\tborder: 1px solid #e9ecef;
  1310. \t\t\tborder-radius: 10px;
  1311. \t\t\tpadding: 25px;
  1312. \t\t\tmargin-bottom: 40px;
  1313. \t\t}
  1315. \t\t.contact-item {
  1316. \t\t\tdisplay: flex;
  1317. \t\t\talign-items: center;
  1318. \t\t\tmargin-bottom: 15px;
  1319. \t\t}
  1321. \t\t.contact-item i {
  1322. \t\t\tcolor: #ffa200;
  1323. \t\t\tmargin-right: 15px;
  1324. \t\t\twidth: 20px;
  1325. \t\t}
  1327. \t\t.product-card {
  1328. \t\t\tbackground: white;
  1329. \t\t\tborder-radius: 10px;
  1330. \t\t\toverflow: hidden;
  1331. \t\t\tbox-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
  1332. \t\t\ttransition: transform 0.3s ease, box-shadow 0.3s ease;
  1333. \t\t\tmargin-bottom: 30px;
  1334. \t\t}
  1336. \t\t.product-card:hover {
  1337. \t\t\ttransform: translateY(-5px);
  1338. \t\t\tbox-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  1339. \t\t}
  1341. \t\t.product-image {
  1342. \t\t\theight: 200px;
  1343. \t\t\tbackground-size: cover;
  1344. \t\t\tbackground-position: center;
  1345. \t\t\tposition: relative;
  1346. \t\t}
  1348. \t\t.product-info {
  1349. \t\t\tpadding: 20px;
  1350. \t\t}
  1352. \t\t.product-title {
  1353. \t\t\tfont-size: 1.1rem;
  1354. \t\t\tfont-weight: 600;
  1355. \t\t\tmargin-bottom: 10px;
  1356. \t\t\tcolor: #333;
  1357. \t\t}
  1359. \t\t.product-price {
  1360. \t\t\tfont-size: 1.3rem;
  1361. \t\t\tfont-weight: bold;
  1362. \t\t\tcolor: #ffa200;
  1363. \t\t\tmargin-bottom: 15px;
  1364. \t\t}
  1366. \t\t.product-meta {
  1367. \t\t\tdisplay: flex;
  1368. \t\t\tjustify-content: space-between;
  1369. \t\t\talign-items: center;
  1370. \t\t\tfont-size: 0.9rem;
  1371. \t\t\tcolor: #666;
  1372. \t\t}
  1374. \t\t.rating {
  1375. \t\t\tcolor: #ffa200;
  1376. \t\t}
  1378. \t\t/* Boutons d'action uniformes */
  1379. \t\t.btn-shop,
  1380. \t\t.shop-action-btn {
  1381. \t\t\tbackground: #ffa200;
  1382. \t\t\tborder: 1px solid #ffa200;
  1383. \t\t\tcolor: white;
  1384. \t\t\tpadding: 12px 24px;
  1385. \t\t\tborder-radius: 6px;
  1386. \t\t\tfont-weight: 500;
  1387. \t\t\tfont-size: 0.9rem;
  1388. \t\t\ttransition: all 0.3s ease;
  1389. \t\t\ttext-decoration: none;
  1390. \t\t\tdisplay: inline-flex;
  1391. \t\t\talign-items: center;
  1392. \t\t\tjustify-content: center;
  1393. \t\t\tgap: 8px;
  1394. \t\t\tmin-width: 120px;
  1395. \t\t\theight: 44px;
  1396. \t\t\twhite-space: nowrap;
  1397. \t\t}
  1399. \t\t.btn-shop:hover,
  1400. \t\t.shop-action-btn:hover {
  1401. \t\t\tbackground: #e8910a;
  1402. \t\t\tborder-color: #e8910a;
  1403. \t\t\tcolor: white;
  1404. \t\t\ttransform: translateY(-1px);
  1405. \t\t\tbox-shadow: 0 4px 12px rgba(255, 162, 0, 0.3);
  1406. \t\t}
  1408. \t\t/* Boutons secondaires */
  1409. \t\t.shop-action-btn.secondary {
  1410. \t\t\tbackground: transparent;
  1411. \t\t\tborder: 1px solid #6c757d;
  1412. \t\t\tcolor: #6c757d;
  1413. \t\t}
  1415. \t\t.shop-action-btn.secondary:hover {
  1416. \t\t\tbackground: #6c757d;
  1417. \t\t\tborder-color: #6c757d;
  1418. \t\t\tcolor: white;
  1419. \t\t\ttransform: translateY(-1px);
  1420. \t\t\tbox-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
  1421. \t\t}
  1423. \t\t/* Responsive */
  1424. \t\t@media(max-width: 768px) {
  1425. \t\t\t.shop-header {
  1426. \t\t\t\tpadding: 100px 0 40px;
  1427. \t\t\t}
  1429. \t\t\t.shop-avatar {
  1430. \t\t\t\twidth: 80px;
  1431. \t\t\t\theight: 80px;
  1432. \t\t\t}
  1434. \t\t\t.shop-stats {
  1435. \t\t\t\tmargin-top: -30px;
  1436. \t\t\t\tpadding: 20px;
  1437. \t\t\t}
  1439. \t\t\t.stat-number {
  1440. \t\t\t\tfont-size: 2rem;
  1441. \t\t\t}
  1442. \t\t}
  1444. \t\t/* Très petits écrans */
  1445. \t\t@media(max-width: 480px) {
  1446. \t\t\t.btn-shop,
  1447. \t\t\t.shop-action-btn {
  1448. \t\t\t\tmin-width: 90px;
  1449. \t\t\t\theight: 38px;
  1450. \t\t\t\tfont-size: 0.8rem;
  1451. \t\t\t\tpadding: 8px 16px;
  1452. \t\t\t}
  1454. \t\t\t.shop-actions-row {
  1455. \t\t\t\tgap: 8px;
  1456. \t\t\t}
  1457. \t\t}
  1459. \t\t/* Styles pour la section des avis */
  1460. \t\t.review-stats-card {
  1461. \t\t\tbackground: white;
  1462. \t\t\tborder-radius: 10px;
  1463. \t\t\tpadding: 20px;
  1464. \t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  1465. \t\t\tmargin-bottom: 20px;
  1466. \t\t}
  1468. \t\t.stats-header {
  1469. \t\t\tdisplay: flex;
  1470. \t\t\talign-items: center;
  1471. \t\t\tmargin-bottom: 20px;
  1472. \t\t}
  1474. \t\t.overall-rating {
  1475. \t\t\ttext-align: center;
  1476. \t\t\tmargin-right: 20px;
  1477. \t\t}
  1479. \t\t.rating-number {
  1480. \t\t\tfont-size: 36px;
  1481. \t\t\tfont-weight: bold;
  1482. \t\t\tcolor: #333;
  1483. \t\t\tdisplay: block;
  1484. \t\t}
  1486. \t\t.stars {
  1487. \t\t\tcolor: #ffc107;
  1488. \t\t\tfont-size: 18px;
  1489. \t\t\tmargin-top: 5px;
  1490. \t\t}
  1492. \t\t.rating-summary p {
  1493. \t\t\tmargin: 0;
  1494. \t\t\tcolor: #666;
  1495. \t\t}
  1497. \t\t.rating-breakdown {
  1498. \t\t\tmargin-top: 15px;
  1499. \t\t}
  1501. \t\t.rating-bar {
  1502. \t\t\tdisplay: flex;
  1503. \t\t\talign-items: center;
  1504. \t\t\tmargin-bottom: 8px;
  1505. \t\t}
  1507. \t\t.rating-label {
  1508. \t\t\twidth: 40px;
  1509. \t\t\tfont-size: 14px;
  1510. \t\t\tcolor: #666;
  1511. \t\t}
  1513. \t\t.rating-progress {
  1514. \t\t\tflex: 1;
  1515. \t\t\theight: 6px;
  1516. \t\t\tbackground: #e9ecef;
  1517. \t\t\tborder-radius: 3px;
  1518. \t\t\tmargin: 0 10px;
  1519. \t\t\toverflow: hidden;
  1520. \t\t}
  1522. \t\t.rating-fill {
  1523. \t\t\theight: 100%;
  1524. \t\t\tbackground: linear-gradient(45deg, #ffc107, #ff8c00);
  1525. \t\t\ttransition: width 0.3s ease;
  1526. \t\t}
  1528. \t\t.rating-count {
  1529. \t\t\twidth: 30px;
  1530. \t\t\ttext-align: right;
  1531. \t\t\tfont-size: 14px;
  1532. \t\t\tcolor: #666;
  1533. \t\t}
  1535. \t\t.reviews-preview {
  1536. \t\t\tbackground: white;
  1537. \t\t\tborder-radius: 10px;
  1538. \t\t\tpadding: 20px;
  1539. \t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  1540. \t\t}
  1542. \t\t.review-card-preview {
  1543. \t\t\tborder-bottom: 1px solid #f0f0f0;
  1544. \t\t\tpadding-bottom: 15px;
  1545. \t\t\tmargin-bottom: 15px;
  1546. \t\t}
  1548. \t\t.review-card-preview:last-child {
  1549. \t\t\tborder-bottom: none;
  1550. \t\t\tmargin-bottom: 0;
  1551. \t\t}
  1553. \t\t.review-header {
  1554. \t\t\tdisplay: flex;
  1555. \t\t\tjustify-content: space-between;
  1556. \t\t\talign-items: center;
  1557. \t\t\tmargin-bottom: 10px;
  1558. \t\t}
  1560. \t\t.review-user {
  1561. \t\t\tdisplay: flex;
  1562. \t\t\talign-items: center;
  1563. \t\t}
  1565. \t\t.user-avatar {
  1566. \t\t\twidth: 35px;
  1567. \t\t\theight: 35px;
  1568. \t\t\tborder-radius: 50%;
  1569. \t\t\tbackground: linear-gradient(45deg, #667eea, #764ba2);
  1570. \t\t\tdisplay: flex;
  1571. \t\t\talign-items: center;
  1572. \t\t\tjustify-content: center;
  1573. \t\t\tcolor: white;
  1574. \t\t\tfont-weight: bold;
  1575. \t\t\tmargin-right: 10px;
  1576. \t\t}
  1578. \t\t.user-info h6 {
  1579. \t\t\tmargin: 0;
  1580. \t\t\tfont-size: 14px;
  1581. \t\t\tfont-weight: 600;
  1582. \t\t\tcolor: #333;
  1583. \t\t}
  1585. \t\t.user-info small {
  1586. \t\t\tcolor: #666;
  1587. \t\t\tfont-size: 12px;
  1588. \t\t}
  1590. \t\t.review-rating {
  1591. \t\t\tdisplay: flex;
  1592. \t\t\talign-items: center;
  1593. \t\t\tgap: 5px;
  1594. \t\t}
  1596. \t\t.verified-badge {
  1597. \t\t\tbackground: #28a745;
  1598. \t\t\tcolor: white;
  1599. \t\t\tpadding: 2px 4px;
  1600. \t\t\tborder-radius: 3px;
  1601. \t\t\tfont-size: 10px;
  1602. \t\t\tfont-weight: bold;
  1603. \t\t}
  1605. \t\t.review-content {
  1606. \t\t\tcolor: #666;
  1607. \t\t\tfont-size: 14px;
  1608. \t\t\tline-height: 1.5;
  1609. \t\t}
  1611. \t\t.empty-reviews {
  1612. \t\t\ttext-align: center;
  1613. \t\t\tpadding: 40px 20px;
  1614. \t\t\tcolor: #666;
  1615. \t\t}
  1617. \t\t.empty-reviews i {
  1618. \t\t\tfont-size: 48px;
  1619. \t\t\tcolor: #ddd;
  1620. \t\t\tmargin-bottom: 15px;
  1621. \t\t}
  1623. \t\t.empty-reviews h4 {
  1624. \t\t\tcolor: #333;
  1625. \t\t\tmargin-bottom: 10px;
  1626. \t\t}
  1628. \t\t.section-title h2 {
  1629. \t\t\tcolor: #333;
  1630. \t\t\tmargin-bottom: 10px;
  1631. \t\t}
  1633. \t\t.section-title p {
  1634. \t\t\tcolor: #666;
  1635. \t\t\tmargin-bottom: 30px;
  1636. \t\t}
  1638. \t\t@media(max-width: 768px) {
  1639. \t\t\t.stats-header {
  1640. \t\t\t\tflex-direction: column;
  1641. \t\t\t\ttext-align: center;
  1642. \t\t\t}
  1644. \t\t\t.overall-rating {
  1645. \t\t\t\tmargin-right: 0;
  1646. \t\t\t\tmargin-bottom: 15px;
  1647. \t\t\t}
  1649. \t\t\t.review-header {
  1650. \t\t\t\tflex-direction: column;
  1651. \t\t\t\talign-items: flex-start;
  1652. \t\t\t}
  1654. \t\t\t.review-rating {
  1655. \t\t\t\tmargin-top: 5px;
  1656. \t\t\t}
  1657. \t\t}
  1658. \t</style>
  1659. ";
  1660.         
  1661.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  1663.         
  1664.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  1666.         yield from [];
  1667.     }
  1669.     // line 1563
  1670.     /**
  1671.      * @return iterable<null|scalar|\Stringable>
  1672.      */
  1673.     public function block_body(array $context, array $blocks = []): iterable
  1674.     {
  1675.         $macros = $this->macros;
  1676.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  1677.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  1679.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  1680.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  1682.         // line 1564
  1683.         yield "
  1684. \t<!-- Shop Header eBay-style avec Karma - Pleine largeur -->
  1685. \t<section
  1686. \t\tclass=\"shop-header\">
  1687. \t\t<!-- Carrousel eBay-style -->
  1688. \t\t<div class=\"shop-carousel-ebay\">
  1689. \t\t\t<div class=\"carousel-container\">
  1690. \t\t\t\t";
  1691.         // line 1571
  1692.         $context["allBannerImages"] = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "getAllBannerImages", [], "method", false, false, false, 1571);
  1693.         // line 1572
  1694.         yield "\t\t\t\t";
  1695.         if ((Twig\Extension\CoreExtension::length($this->env->getCharset(), ($context["allBannerImages"] ?? null)) > 0)) {
  1696.             // line 1573
  1697.             yield "\t\t\t\t\t";
  1698.             $context['_parent'] = $context;
  1699.             $context['_seq'] = CoreExtension::ensureTraversable(($context["allBannerImages"] ?? null));
  1700.             $context['loop'] = [
  1701.               'parent' => $context['_parent'],
  1702.               'index0' => 0,
  1703.               'index'  => 1,
  1704.               'first'  => true,
  1705.             ];
  1706.             if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
  1707.                 $length = count($context['_seq']);
  1708.                 $context['loop']['revindex0'] = $length - 1;
  1709.                 $context['loop']['revindex'] = $length;
  1710.                 $context['loop']['length'] = $length;
  1711.                 $context['loop']['last'] = 1 === $length;
  1712.             }
  1713.             foreach ($context['_seq'] as $context["_key"] => $context["image"]) {
  1714.                 // line 1574
  1715.                 yield "\t\t\t\t\t\t<div class=\"carousel-slide ";
  1716.                 if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["loop"], "first", [], "any", false, false, false, 1574)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1717.                     yield "active";
  1718.                 }
  1719.                 yield "\" style=\"background-image: url('";
  1720.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl($context["image"]), "html", null, true);
  1721.                 yield "')\">
  1722. \t\t\t\t\t\t\t<div class=\"shop-banner-overlay\"></div>
  1723. \t\t\t\t\t\t</div>
  1724. \t\t\t\t\t";
  1725.                 ++$context['loop']['index0'];
  1726.                 ++$context['loop']['index'];
  1727.                 $context['loop']['first'] = false;
  1728.                 if (isset($context['loop']['revindex0'], $context['loop']['revindex'])) {
  1729.                     --$context['loop']['revindex0'];
  1730.                     --$context['loop']['revindex'];
  1731.                     $context['loop']['last'] = 0 === $context['loop']['revindex0'];
  1732.                 }
  1733.             }
  1734.             $_parent = $context['_parent'];
  1735.             unset($context['_seq'], $context['_key'], $context['image'], $context['_parent'], $context['loop']);
  1736.             $context = array_intersect_key($context, $_parent) + $_parent;
  1737.             // line 1578
  1738.             yield "\t\t\t\t";
  1739.         } else {
  1740.             // line 1579
  1741.             yield "\t\t\t\t\t<!-- Slide par défaut avec dégradé si aucune image de bannière -->
  1742. \t\t\t\t\t<div class=\"carousel-slide active\" style=\"background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);\">
  1743. \t\t\t\t\t\t<div class=\"shop-banner-overlay\"></div>
  1744. \t\t\t\t\t</div>
  1745. \t\t\t\t";
  1746.         }
  1747.         // line 1584
  1748.         yield "\t\t\t</div>
  1750. \t\t\t<!-- Contrôles eBay-style intégrés - uniquement si plusieurs images de bannière -->
  1751. \t\t\t";
  1752.         // line 1587
  1753.         $context["totalBannerImages"] = Twig\Extension\CoreExtension::length($this->env->getCharset(), ($context["allBannerImages"] ?? null));
  1754.         // line 1588
  1755.         yield "\t\t\t";
  1756.         if ((($context["totalBannerImages"] ?? null) > 1)) {
  1757.             // line 1589
  1758.             yield "\t\t\t\t<div class=\"carousel-controls-ebay\">
  1759. \t\t\t\t\t<button class=\"carousel-btn-ebay prev-btn\" onclick=\"previousSlide()\" id=\"prevBtn\">
  1760. \t\t\t\t\t\t<i class=\"lnr lnr-chevron-left\"></i>
  1761. \t\t\t\t\t</button>
  1762. \t\t\t\t\t<button class=\"carousel-btn-ebay pause-btn\" onclick=\"toggleCarousel()\" id=\"pauseBtn\">
  1763. \t\t\t\t\t\t<i class=\"lnr lnr-pause\" id=\"pauseIcon\"></i>
  1764. \t\t\t\t\t</button>
  1765. \t\t\t\t\t<button class=\"carousel-btn-ebay next-btn\" onclick=\"nextSlide()\" id=\"nextBtn\">
  1766. \t\t\t\t\t\t<i class=\"lnr lnr-chevron-right\"></i>
  1767. \t\t\t\t\t</button>
  1768. \t\t\t\t</div>
  1770. \t\t\t\t<!-- Indicateurs eBay-style - uniquement pour les images de bannière -->
  1771. \t\t\t\t<div class=\"carousel-indicators-ebay\">
  1772. \t\t\t\t\t";
  1773.             // line 1603
  1774.             $context['_parent'] = $context;
  1775.             $context['_seq'] = CoreExtension::ensureTraversable(($context["allBannerImages"] ?? null));
  1776.             $context['loop'] = [
  1777.               'parent' => $context['_parent'],
  1778.               'index0' => 0,
  1779.               'index'  => 1,
  1780.               'first'  => true,
  1781.             ];
  1782.             if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
  1783.                 $length = count($context['_seq']);
  1784.                 $context['loop']['revindex0'] = $length - 1;
  1785.                 $context['loop']['revindex'] = $length;
  1786.                 $context['loop']['length'] = $length;
  1787.                 $context['loop']['last'] = 1 === $length;
  1788.             }
  1789.             foreach ($context['_seq'] as $context["_key"] => $context["image"]) {
  1790.                 // line 1604
  1791.                 yield "\t\t\t\t\t\t<button class=\"carousel-indicator-ebay ";
  1792.                 if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["loop"], "first", [], "any", false, false, false, 1604)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1793.                     yield "active";
  1794.                 }
  1795.                 yield "\" onclick=\"goToSlide(";
  1796.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["loop"], "index0", [], "any", false, false, false, 1604), "html", null, true);
  1797.                 yield ")\"></button>
  1798. \t\t\t\t\t";
  1799.                 ++$context['loop']['index0'];
  1800.                 ++$context['loop']['index'];
  1801.                 $context['loop']['first'] = false;
  1802.                 if (isset($context['loop']['revindex0'], $context['loop']['revindex'])) {
  1803.                     --$context['loop']['revindex0'];
  1804.                     --$context['loop']['revindex'];
  1805.                     $context['loop']['last'] = 0 === $context['loop']['revindex0'];
  1806.                 }
  1807.             }
  1808.             $_parent = $context['_parent'];
  1809.             unset($context['_seq'], $context['_key'], $context['image'], $context['_parent'], $context['loop']);
  1810.             $context = array_intersect_key($context, $_parent) + $_parent;
  1811.             // line 1606
  1812.             yield "\t\t\t\t</div>
  1813. \t\t\t";
  1814.         }
  1815.         // line 1608
  1816.         yield "\t\t</div>
  1818. \t\t<!-- Contenu de la boutique eBay-style -->
  1819. \t\t<div class=\"shop-header-content\">
  1820. \t\t\t<div
  1821. \t\t\t\tclass=\"row align-items-center\">
  1822. \t\t\t\t<!-- Logo de la boutique -->
  1823. \t\t\t\t<div class=\"col-auto\">
  1824. \t\t\t\t\t<div class=\"shop-avatar-container-ebay\">
  1825. \t\t\t\t\t\t";
  1826.         // line 1617
  1827.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "logo", [], "any", false, false, false, 1617)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1828.             // line 1618
  1829.             yield "\t\t\t\t\t\t\t<img src=\"";
  1830.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "logo", [], "any", false, false, false, 1618)), "html", null, true);
  1831.             yield "\" alt=\"";
  1832.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 1618), "html", null, true);
  1833.             yield "\" class=\"shop-avatar-ebay\">
  1834. \t\t\t\t\t\t";
  1835.         } else {
  1836.             // line 1620
  1837.             yield "\t\t\t\t\t\t\t<div class=\"shop-avatar-ebay\" style=\"background: #f0f0f0; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: #666;\">
  1838. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-store\"></i>
  1839. \t\t\t\t\t\t\t</div>
  1840. \t\t\t\t\t\t";
  1841.         }
  1842.         // line 1624
  1843.         yield "\t\t\t\t\t\t";
  1844.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "isVerified", [], "any", false, false, false, 1624)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1845.             // line 1625
  1846.             yield "\t\t\t\t\t\t\t<div class=\"verified-badge-ebay\">
  1847. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle\"></i>
  1848. \t\t\t\t\t\t\t</div>
  1849. \t\t\t\t\t\t";
  1850.         }
  1851.         // line 1629
  1852.         yield "\t\t\t\t\t</div>
  1853. \t\t\t\t</div>
  1855. \t\t\t\t<!-- Informations principales -->
  1856. \t\t\t\t<div class=\"col\">
  1857. \t\t\t\t\t<div
  1858. \t\t\t\t\t\tclass=\"shop-info-ebay\">
  1859. \t\t\t\t\t\t<!-- Nom de la boutique -->
  1860. \t\t\t\t\t\t<div class=\"shop-name-section\">
  1861. \t\t\t\t\t\t\t<h1 class=\"shop-name-ebay\">";
  1862.         // line 1638
  1863.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 1638), "html", null, true);
  1864.         yield "</h1>
  1865. \t\t\t\t\t\t\t";
  1866.         // line 1639
  1867.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "isVerified", [], "any", false, false, false, 1639)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1868.             // line 1640
  1869.             yield "\t\t\t\t\t\t\t\t<span class=\"verified-text\">
  1870. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle me-1\"></i>Vendeur vérifié
  1871. \t\t\t\t\t\t\t\t</span>
  1872. \t\t\t\t\t\t\t";
  1873.         }
  1874.         // line 1644
  1875.         yield "\t\t\t\t\t\t</div>
  1877. \t\t\t\t\t\t<!-- Catégorie -->
  1878. \t\t\t\t\t\t";
  1879.         // line 1647
  1880.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "shopCategory", [], "any", false, false, false, 1647)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1881.             // line 1648
  1882.             yield "\t\t\t\t\t\t\t<div class=\"shop-category-section\">
  1883. \t\t\t\t\t\t\t\t<span class=\"shop-category-ebay\">";
  1884.             // line 1649
  1885.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "shopCategory", [], "any", false, false, false, 1649), "name", [], "any", false, false, false, 1649), "html", null, true);
  1886.             yield "</span>
  1887. \t\t\t\t\t\t\t</div>
  1888. \t\t\t\t\t\t";
  1889.         }
  1890.         // line 1652
  1891.         yield "
  1892. \t\t\t\t\t\t<!-- Statistiques eBay-style -->
  1893. \t\t\t\t\t\t<div class=\"shop-stats-ebay\">
  1894. \t\t\t\t\t\t\t<div class=\"stat-row\">
  1895. \t\t\t\t\t\t\t\t";
  1896.         // line 1656
  1897.         if ((CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "averageRating", [], "any", false, false, false, 1656) > 0)) {
  1898.             // line 1657
  1899.             yield "\t\t\t\t\t\t\t\t\t<div class=\"stat-item-ebay\">
  1900. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-percentage\">";
  1901.             // line 1658
  1902.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatNumber(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "averageRating", [], "any", false, false, false, 1658), 1), "html", null, true);
  1903.             yield "%</span>
  1904. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-label-ebay\">Évaluations positives</span>
  1905. \t\t\t\t\t\t\t\t\t</div>
  1906. \t\t\t\t\t\t\t\t";
  1907.         }
  1908.         // line 1662
  1909.         yield "
  1910. \t\t\t\t\t\t\t\t";
  1911.         // line 1663
  1912.         if ((CoreExtension::getAttribute($this->env, $this->source, ($context["stats"] ?? null), "totalProductSales", [], "any", false, false, false, 1663) > 0)) {
  1913.             // line 1664
  1914.             yield "\t\t\t\t\t\t\t\t\t<div class=\"stat-item-ebay\">
  1915. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-number-ebay\">";
  1916.             // line 1665
  1917.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatNumber(CoreExtension::getAttribute($this->env, $this->source, ($context["stats"] ?? null), "totalProductSales", [], "any", false, false, false, 1665)), "html", null, true);
  1918.             yield "</span>
  1919. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-label-ebay\">Articles vendus</span>
  1920. \t\t\t\t\t\t\t\t\t</div>
  1921. \t\t\t\t\t\t\t\t";
  1922.         }
  1923.         // line 1669
  1924.         yield "
  1925. \t\t\t\t\t\t\t\t";
  1926.         // line 1670
  1927.         if ((CoreExtension::getAttribute($this->env, $this->source, ($context["followStats"] ?? null), "active_follows", [], "any", false, false, false, 1670) > 0)) {
  1928.             // line 1671
  1929.             yield "\t\t\t\t\t\t\t\t\t<div class=\"stat-item-ebay\">
  1930. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-number-ebay\">";
  1931.             // line 1672
  1932.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatNumber(CoreExtension::getAttribute($this->env, $this->source, ($context["followStats"] ?? null), "active_follows", [], "any", false, false, false, 1672)), "html", null, true);
  1933.             yield "</span>
  1934. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-label-ebay\">Suiveurs</span>
  1935. \t\t\t\t\t\t\t\t\t</div>
  1936. \t\t\t\t\t\t\t\t";
  1937.         }
  1938.         // line 1676
  1939.         yield "\t\t\t\t\t\t\t</div>
  1941. \t\t\t\t\t\t\t<!-- Informations supplémentaires -->
  1942. \t\t\t\t\t\t\t<div class=\"shop-additional-info\">
  1943. \t\t\t\t\t\t\t\t<div class=\"row\">
  1944. \t\t\t\t\t\t\t\t\t<div class=\"col-12\">
  1945. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 col-sm-6 w-100\">
  1946. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-thumbs-up\"></i>
  1947. \t\t\t\t\t\t\t\t\t\t\t7% positive feedback</span>
  1948. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 col-sm-6 w-100\">
  1949. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-cart\"></i>
  1950. \t\t\t\t\t\t\t\t\t\t\t29 produits vendus</span>
  1951. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 col-sm-6 w-100\">
  1952. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star\"></i>
  1953. \t\t\t\t\t\t\t\t\t\t\t150 followers</span>
  1954. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 w-100\">
  1955. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-history\"></i>
  1956. \t\t\t\t\t\t\t\t\t\t\tCréé depuis
  1957. \t\t\t\t\t\t\t\t\t\t\t";
  1958.         // line 1694
  1959.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatDate(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "createdAt", [], "any", false, false, false, 1694), "M Y"), "html", null, true);
  1960.         yield "</span>
  1961. \t\t\t\t\t\t\t\t\t</div>
  1962. \t\t\t\t\t\t\t\t</div>
  1963. \t\t\t\t\t\t\t</div>
  1964. \t\t\t\t\t\t</div>
  1965. \t\t\t\t\t</div>
  1966. \t\t\t\t</div>
  1968. \t\t\t\t<!-- Actions eBay-style -->
  1969. \t\t\t\t<div class=\"col-auto\">
  1970. \t\t\t\t\t<div class=\"shop-actions-ebay\">
  1971. \t\t\t\t\t\t";
  1972.         // line 1705
  1973.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["app"] ?? null), "user", [], "any", false, false, false, 1705)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1974.             // line 1706
  1975.             yield "\t\t\t\t\t\t\t<button id=\"follow-button\" class=\"btn btn-primary btn-ebay ";
  1976.             if ((($tmp = ($context["isFollowing"] ?? null)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1977.                 yield "following";
  1978.             }
  1979.             yield "\" data-shop-id=\"";
  1980.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "id", [], "any", false, false, false, 1706), "html", null, true);
  1981.             yield "\" data-following=\"";
  1982.             yield (((($tmp = ($context["isFollowing"] ?? null)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) ? ("true") : ("false"));
  1983.             yield "\">
  1984. \t\t\t\t\t\t\t\t<span id=\"follow-text\">
  1985. \t\t\t\t\t\t\t\t\t";
  1986.             // line 1708
  1987.             if ((($tmp = ($context["isFollowing"] ?? null)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1988.                 // line 1709
  1989.                 yield "\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle me-1\"></i> Suivi
  1990. \t\t\t\t\t\t\t\t\t";
  1991.             } else {
  1992.                 // line 1711
  1993.                 yield "\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-plus me-1\"></i> Suivre
  1994. \t\t\t\t\t\t\t\t\t";
  1995.             }
  1996.             // line 1713
  1997.             yield "\t\t\t\t\t\t\t\t</span>
  1998. \t\t\t\t\t\t\t</button>
  1999. \t\t\t\t\t\t";
  2000.         } else {
  2001.             // line 1716
  2002.             yield "\t\t\t\t\t\t\t<a href=\"";
  2003.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ui_app_login");
  2004.             yield "\" class=\"btn btn-primary btn-ebay\">
  2005. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-user me-1\"></i> Se connecter pour suivre
  2006. \t\t\t\t\t\t\t</a>
  2007. \t\t\t\t\t\t";
  2008.         }
  2009.         // line 1720
  2010.         yield "
  2011. \t\t\t\t\t\t<button class=\"btn btn-outline-secondary btn-ebay\" onclick=\"shareShop()\">
  2012. \t\t\t\t\t\t\t<i class=\"lnr lnr-bubble me-1\"></i> Partager
  2013. \t\t\t\t\t\t</button>
  2015. \t\t\t\t\t\t<button class=\"btn btn-outline-danger btn-ebay\" onclick=\"reportShop()\">
  2016. \t\t\t\t\t\t\t<i class=\"lnr lnr-flag me-1\"></i> Signaler
  2017. \t\t\t\t\t\t</button>
  2019. \t\t\t\t\t\t";
  2020.         // line 1729
  2021.         if ((($tmp = ($context["canEdit"] ?? null)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2022.             // line 1730
  2023.             yield "\t\t\t\t\t\t\t<a href=\"";
  2024.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("seller_shop_edit", ["slug" => CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "slug", [], "any", false, false, false, 1730)]), "html", null, true);
  2025.             yield "\" class=\"btn btn-outline-primary btn-ebay\">
  2026. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-pencil me-1\"></i> Modifier la boutique
  2027. \t\t\t\t\t\t\t</a>
  2028. \t\t\t\t\t\t";
  2029.         }
  2030.         // line 1734
  2031.         yield "\t\t\t\t\t</div>
  2032. \t\t\t\t</div>
  2033. \t\t\t</div>
  2034. \t\t</div>
  2035. \t</section>
  2037. \t<!-- Shop Tabs eBay-style avec Karma -->
  2038. \t<section class=\"container\">
  2039. \t\t<div class=\"shop-tabs\">
  2040. \t\t\t<ul class=\"nav nav-tabs shop-tabs-nav\" role=\"tablist\">
  2041. \t\t\t\t<li class=\"nav-item shop-tab\">
  2042. \t\t\t\t\t<a href=\"#shop-items\" class=\"nav-link shop-tab-link active\" data-tab=\"items\" role=\"tab\">
  2043. \t\t\t\t\t\tBoutique
  2044. \t\t\t\t\t</a>
  2045. \t\t\t\t</li>
  2046. \t\t\t\t<li class=\"nav-item shop-tab\">
  2047. \t\t\t\t\t<a href=\"#shop-sale\" class=\"nav-link shop-tab-link\" data-tab=\"sale\" role=\"tab\">
  2048. \t\t\t\t\t\tPromotions
  2049. \t\t\t\t\t</a>
  2050. \t\t\t\t</li>
  2051. \t\t\t\t<li class=\"nav-item shop-tab\">
  2052. \t\t\t\t\t<a href=\"#shop-about\" class=\"nav-link shop-tab-link\" data-tab=\"about\" role=\"tab\">
  2053. \t\t\t\t\t\tÀ propos
  2054. \t\t\t\t\t</a>
  2055. \t\t\t\t</li>
  2056. \t\t\t\t<li class=\"nav-item shop-tab\">
  2057. \t\t\t\t\t<a href=\"#shop-feedback\" class=\"nav-link shop-tab-link\" data-tab=\"feedback\" role=\"tab\">
  2058. \t\t\t\t\t\tAvis (";
  2059.         // line 1761
  2060.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "getVisibleReviewsCount", [], "method", false, false, false, 1761), "html", null, true);
  2061.         yield ")
  2062. \t\t\t\t\t</a>
  2063. \t\t\t\t</li>
  2064. \t\t\t</ul>
  2066. \t\t\t<!-- Tab Content: Shop Items avec Karma -->
  2067. \t\t\t<div id=\"shop-items\" class=\"tab-content shop-tab-content active\">
  2068. \t\t\t\t<div class=\"row\">
  2069. \t\t\t\t\t<div class=\"col-lg-12\">
  2070. \t\t\t\t\t\t<div class=\"d-flex justify-content-between align-items-center mb-4\">
  2071. \t\t\t\t\t\t\t<h4 class=\"mb-0\">Produits de
  2072. \t\t\t\t\t\t\t\t";
  2073.         // line 1772
  2074.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 1772), "html", null, true);
  2075.         yield "</h4>
  2076. \t\t\t\t\t\t\t<div class=\"d-flex align-items-center gap-3\">
  2077. \t\t\t\t\t\t\t\t<span style=\"font-size: 2rem; font-weight: 600; min-width: 100px; display: inline-block; text-align: center;\">
  2078. \t\t\t\t\t\t\t\t\t<span class=\"product-count\">";
  2079.         // line 1775
  2080.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatNumber(Twig\Extension\CoreExtension::length($this->env->getCharset(), ($context["products"] ?? null))), "html", null, true);
  2081.         yield "</span>
  2083. \t\t\t\t\t\t\t\t\t<span style=\"font-size: 1rem; font-weight: 400;\">produits</span>
  2084. \t\t\t\t\t\t\t\t</span>
  2085. \t\t\t\t\t\t\t\t<select class=\"form-select\" id=\"product-sort\" style=\"width: auto;\" onchange=\"if(window.sortProducts) window.sortProducts(this.value);\">
  2086. \t\t\t\t\t\t\t\t\t<option value=\"\">Trier par</option>
  2087. \t\t\t\t\t\t\t\t\t<option value=\"price_asc\">Prix : Croissant</option>
  2088. \t\t\t\t\t\t\t\t\t<option value=\"price_desc\">Prix : Décroissant</option>
  2089. \t\t\t\t\t\t\t\t\t<option value=\"newest\">Plus récents</option>
  2090. \t\t\t\t\t\t\t\t\t<option value=\"popular\">Plus populaires</option>
  2091. \t\t\t\t\t\t\t\t\t<option value=\"name_asc\">Nom : A-Z</option>
  2092. \t\t\t\t\t\t\t\t\t<option value=\"name_desc\">Nom : Z-A</option>
  2093. \t\t\t\t\t\t\t\t</select>
  2094. \t\t\t\t\t\t\t</div>
  2095. \t\t\t\t\t\t</div>
  2097. \t\t\t\t\t\t";
  2098.         // line 1791
  2099.         if ((Twig\Extension\CoreExtension::length($this->env->getCharset(), ($context["products"] ?? null)) > 0)) {
  2100.             // line 1792
  2101.             yield "\t\t\t\t\t\t\t<div class=\"row\" id=\"products-container\">
  2102. \t\t\t\t\t\t\t\t";
  2103.             // line 1793
  2104.             $context['_parent'] = $context;
  2105.             $context['_seq'] = CoreExtension::ensureTraversable(($context["products"] ?? null));
  2106.             $context['loop'] = [
  2107.               'parent' => $context['_parent'],
  2108.               'index0' => 0,
  2109.               'index'  => 1,
  2110.               'first'  => true,
  2111.             ];
  2112.             if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
  2113.                 $length = count($context['_seq']);
  2114.                 $context['loop']['revindex0'] = $length - 1;
  2115.                 $context['loop']['revindex'] = $length;
  2116.                 $context['loop']['length'] = $length;
  2117.                 $context['loop']['last'] = 1 === $length;
  2118.             }
  2119.             foreach ($context['_seq'] as $context["_key"] => $context["product"]) {
  2120.                 // line 1794
  2121.                 yield "\t\t\t\t\t\t\t\t\t<div class=\"col-xl-3 col-lg-4 col-md-6 col-sm-6 mb-4 d-flex align-items-stretch product-item\" data-price=\"";
  2122.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["product"], "price", [], "any", false, false, false, 1794), "html", null, true);
  2123.                 yield "\" data-name=\"";
  2124.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::lower($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["product"], "name", [], "any", false, false, false, 1794)), "html", null, true);
  2125.                 yield "\" data-views=\"";
  2126.                 yield (((CoreExtension::getAttribute($this->env, $this->source, $context["product"], "viewCount", [], "any", true, true, false, 1794) &&  !(null === CoreExtension::getAttribute($this->env, $this->source, $context["product"], "viewCount", [], "any", false, false, false, 1794)))) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["product"], "viewCount", [], "any", false, false, false, 1794), "html", null, true)) : (0));
  2127.                 yield "\" data-created=\"";
  2128.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatDate(CoreExtension::getAttribute($this->env, $this->source, $context["product"], "publishedAt", [], "any", false, false, false, 1794), "Y-m-d"), "html", null, true);
  2129.                 yield "\">
  2130. \t\t\t\t\t\t\t\t\t\t";
  2131.                 // line 1795
  2132.                 yield from $this->load("home/_single_product_card.html.twig", 1795)->unwrap()->yield(CoreExtension::merge($context, ["product" => $context["product"]]));
  2133.                 // line 1796
  2134.                 yield "\t\t\t\t\t\t\t\t\t</div>
  2135. \t\t\t\t\t\t\t\t";
  2136.                 ++$context['loop']['index0'];
  2137.                 ++$context['loop']['index'];
  2138.                 $context['loop']['first'] = false;
  2139.                 if (isset($context['loop']['revindex0'], $context['loop']['revindex'])) {
  2140.                     --$context['loop']['revindex0'];
  2141.                     --$context['loop']['revindex'];
  2142.                     $context['loop']['last'] = 0 === $context['loop']['revindex0'];
  2143.                 }
  2144.             }
  2145.             $_parent = $context['_parent'];
  2146.             unset($context['_seq'], $context['_key'], $context['product'], $context['_parent'], $context['loop']);
  2147.             $context = array_intersect_key($context, $_parent) + $_parent;
  2148.             // line 1798
  2149.             yield "\t\t\t\t\t\t\t</div>
  2150. \t\t\t\t\t\t";
  2151.         } else {
  2152.             // line 1800
  2153.             yield "\t\t\t\t\t\t\t<div class=\"text-center py-5\">
  2154. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-package\" style=\"font-size: 4rem; color: #ccc;\"></i>
  2155. \t\t\t\t\t\t\t\t<h4 class=\"mt-3\">Aucun produit disponible</h4>
  2156. \t\t\t\t\t\t\t\t<p class=\"text-muted\">Cette boutique n'a pas encore de produits en vente.</p>
  2157. \t\t\t\t\t\t\t</div>
  2158. \t\t\t\t\t\t";
  2159.         }
  2160.         // line 1806
  2161.         yield "\t\t\t\t\t</div>
  2163. \t\t\t\t</div>
  2164. \t\t\t</div>
  2166. \t\t\t<!-- Tab Content: Sale avec Karma -->
  2167. \t\t\t<div id=\"shop-sale\" class=\"tab-content shop-tab-content\">
  2168. \t\t\t\t<div class=\"text-center py-5\">
  2169. \t\t\t\t\t<i class=\"lnr lnr-tag\" style=\"font-size: 4rem; color: #ccc;\"></i>
  2170. \t\t\t\t\t<h4 class=\"mt-3\">Aucune promotion actuellement</h4>
  2171. \t\t\t\t\t<p class=\"text-muted\">Cette boutique n'a pas de promotions actives pour le moment.</p>
  2172. \t\t\t\t</div>
  2173. \t\t\t</div>
  2175. \t\t\t<!-- Tab Content: About avec Karma -->
  2176. \t\t\t<div id=\"shop-about\" class=\"tab-content shop-tab-content\">
  2177. \t\t\t\t<div class=\"row\">
  2178. \t\t\t\t\t<div class=\"col-lg-8\">
  2179. \t\t\t\t\t\t<div class=\"card\">
  2180. \t\t\t\t\t\t\t<div class=\"card-header\">
  2181. \t\t\t\t\t\t\t\t<h5 class=\"mb-0\">
  2182. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-user me-2\"></i>À propos de
  2183. \t\t\t\t\t\t\t\t\t";
  2184.         // line 1828
  2185.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 1828), "html", null, true);
  2186.         yield "
  2187. \t\t\t\t\t\t\t\t</h5>
  2188. \t\t\t\t\t\t\t</div>
  2189. \t\t\t\t\t\t\t<div class=\"card-body\">
  2190. \t\t\t\t\t\t\t\t";
  2191.         // line 1832
  2192.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "description", [], "any", false, false, false, 1832)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2193.             // line 1833
  2194.             yield "\t\t\t\t\t\t\t\t\t<p class=\"card-text\">";
  2195.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "description", [], "any", false, false, false, 1833), "html", null, true);
  2196.             yield "</p>
  2197. \t\t\t\t\t\t\t\t";
  2198.         } else {
  2199.             // line 1835
  2200.             yield "\t\t\t\t\t\t\t\t\t<p class=\"text-muted\">Aucune description disponible.</p>
  2201. \t\t\t\t\t\t\t\t";
  2202.         }
  2203.         // line 1837
  2204.         yield "
  2205. \t\t\t\t\t\t\t\t";
  2206.         // line 1838
  2207.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "businessHours", [], "any", false, false, false, 1838)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2208.             // line 1839
  2209.             yield "\t\t\t\t\t\t\t\t\t<h6 class=\"mt-4\">
  2210. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-clock me-2\"></i>Heures d'ouverture
  2211. \t\t\t\t\t\t\t\t\t</h6>
  2212. \t\t\t\t\t\t\t\t\t<p>";
  2213.             // line 1842
  2214.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "businessHours", [], "any", false, false, false, 1842), "html", null, true);
  2215.             yield "</p>
  2216. \t\t\t\t\t\t\t\t";
  2217.         }
  2218.         // line 1844
  2219.         yield "
  2220. \t\t\t\t\t\t\t\t";
  2221.         // line 1845
  2222.         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "returnPolicy", [], "any", false, false, false, 1845)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2223.             // line 1846
  2224.             yield "\t\t\t\t\t\t\t\t\t<h6 class=\"mt-4\">
  2225. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-undo me-2\"></i>Politique de retour
  2226. \t\t\t\t\t\t\t\t\t</h6>
  2227. \t\t\t\t\t\t\t\t\t<p>";
  2228.             // line 1849
  2229.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "returnPolicy", [], "any", false, false, false, 1849), "html", null, true);
  2230.             yield "</p>
  2231. \t\t\t\t\t\t\t\t";
  2232.         }
  2233.         // line 1851
  2234.         yield "\t\t\t\t\t\t\t</div>
  2235. \t\t\t\t\t\t</div>
  2236. \t\t\t\t\t</div>
  2237. \t\t\t\t\t<div class=\"col-lg-4\">
  2238. \t\t\t\t\t\t<div class=\"card shop-info-card\">
  2239. \t\t\t\t\t\t\t<div class=\"card-header\">
  2240. \t\t\t\t\t\t\t\t<h6 class=\"mb-0\">
  2241. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-chart me-2\"></i>Statistiques de la boutique
  2242. \t\t\t\t\t\t\t\t</h6>
  2243. \t\t\t\t\t\t\t</div>
  2244. \t\t\t\t\t\t\t<div class=\"card-body\">
  2245. \t\t\t\t\t\t\t\t<div class=\"row text-center\">
  2246. \t\t\t\t\t\t\t\t\t<div class=\"col-6\">
  2247. \t\t\t\t\t\t\t\t\t\t<div class=\"shop-stat-item\">
  2248. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-number h4 text-primary\">";
  2249.         // line 1865
  2250.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["stats"] ?? null), "activeProducts", [], "any", false, false, false, 1865), "html", null, true);
  2251.         yield "</span>
  2252. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-label d-block\">Produits actifs</span>
  2253. \t\t\t\t\t\t\t\t\t\t</div>
  2254. \t\t\t\t\t\t\t\t\t</div>
  2255. \t\t\t\t\t\t\t\t\t<div class=\"col-6\">
  2256. \t\t\t\t\t\t\t\t\t\t<div class=\"shop-stat-item\">
  2257. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-number h4 text-info\">";
  2258.         // line 1871
  2259.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["stats"] ?? null), "shopViews", [], "any", false, false, false, 1871), "html", null, true);
  2260.         yield "</span>
  2261. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-label d-block\">Vues boutique</span>
  2262. \t\t\t\t\t\t\t\t\t\t</div>
  2263. \t\t\t\t\t\t\t\t\t</div>
  2264. \t\t\t\t\t\t\t\t</div>
  2265. \t\t\t\t\t\t\t</div>
  2266. \t\t\t\t\t\t</div>
  2267. \t\t\t\t\t</div>
  2268. \t\t\t\t</div>
  2269. \t\t\t</div>
  2271. \t\t\t<!-- Tab Content: Feedback avec Karma -->
  2272. \t\t\t<div id=\"shop-feedback\" class=\"tab-content shop-tab-content\">
  2273. \t\t\t\t<div class=\"row\">
  2274. \t\t\t\t\t<div
  2275. \t\t\t\t\t\tclass=\"col-lg-8\">
  2276. \t\t\t\t\t\t<!-- Statistiques des avis -->
  2277. \t\t\t\t\t\t<div class=\"review-stats mb-4\">
  2278. \t\t\t\t\t\t\t<div class=\"row\">
  2279. \t\t\t\t\t\t\t\t<div class=\"col-md-4\">
  2280. \t\t\t\t\t\t\t\t\t<div class=\"stat-card text-center\">
  2281. \t\t\t\t\t\t\t\t\t\t<h3 class=\"stat-number\">";
  2282.         // line 1892
  2283.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "getAverageRating", [], "method", false, false, false, 1892), "html", null, true);
  2284.         yield "</h3>
  2285. \t\t\t\t\t\t\t\t\t\t<div class=\"rating-stars\">
  2286. \t\t\t\t\t\t\t\t\t\t\t";
  2287.         // line 1894
  2288.         $context['_parent'] = $context;
  2289.         $context['_seq'] = CoreExtension::ensureTraversable(range(1, 5));
  2290.         foreach ($context['_seq'] as $context["_key"] => $context["i"]) {
  2291.             // line 1895
  2292.             yield "\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star";
  2293.             if (($context["i"] <= CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "getAverageRating", [], "method", false, false, false, 1895))) {
  2294.             } else {
  2295.                 yield "-empty";
  2296.             }
  2297.             yield "\"></i>
  2298. \t\t\t\t\t\t\t\t\t\t\t";
  2299.         }
  2300.         $_parent = $context['_parent'];
  2301.         unset($context['_seq'], $context['_key'], $context['i'], $context['_parent']);
  2302.         $context = array_intersect_key($context, $_parent) + $_parent;
  2303.         // line 1897
  2304.         yield "\t\t\t\t\t\t\t\t\t\t</div>
  2305. \t\t\t\t\t\t\t\t\t\t<p class=\"stat-label\">Note moyenne</p>
  2306. \t\t\t\t\t\t\t\t\t</div>
  2307. \t\t\t\t\t\t\t\t</div>
  2308. \t\t\t\t\t\t\t\t<div class=\"col-md-4\">
  2309. \t\t\t\t\t\t\t\t\t<div class=\"stat-card text-center\">
  2310. \t\t\t\t\t\t\t\t\t\t<h3 class=\"stat-number\">";
  2311.         // line 1903
  2312.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "getVisibleReviewsCount", [], "method", false, false, false, 1903), "html", null, true);
  2313.         yield "</h3>
  2314. \t\t\t\t\t\t\t\t\t\t<p class=\"stat-label\">Avis clients</p>
  2315. \t\t\t\t\t\t\t\t\t</div>
  2316. \t\t\t\t\t\t\t\t</div>
  2317. \t\t\t\t\t\t\t\t<div class=\"col-md-4\">
  2318. \t\t\t\t\t\t\t\t\t<div class=\"stat-card text-center\">
  2319. \t\t\t\t\t\t\t\t\t\t<h3 class=\"stat-number\">";
  2320.         // line 1909
  2321.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::round(((CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "getVisibleReviewsCount", [], "method", false, false, false, 1909) / 100) * 100)), "html", null, true);
  2322.         yield "%</h3>
  2323. \t\t\t\t\t\t\t\t\t\t<p class=\"stat-label\">Satisfaction</p>
  2324. \t\t\t\t\t\t\t\t\t</div>
  2325. \t\t\t\t\t\t\t\t</div>
  2326. \t\t\t\t\t\t\t</div>
  2327. \t\t\t\t\t\t</div>
  2329. \t\t\t\t\t\t<!-- Liste des avis récents -->
  2330. \t\t\t\t\t\t<div class=\"reviews-preview\">
  2331. \t\t\t\t\t\t\t<h5 class=\"mb-3\">Avis récents</h5>
  2332. \t\t\t\t\t\t\t";
  2333.         // line 1919
  2334.         if ((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 1919)) > 0)) {
  2335.             // line 1920
  2336.             yield "\t\t\t\t\t\t\t\t<div class=\"reviews-list\">
  2337. \t\t\t\t\t\t\t\t\t";
  2338.             // line 1921
  2339.             $context['_parent'] = $context;
  2340.             $context['_seq'] = CoreExtension::ensureTraversable(Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 1921), 0, 5));
  2341.             foreach ($context['_seq'] as $context["_key"] => $context["review"]) {
  2342.                 // line 1922
  2343.                 yield "\t\t\t\t\t\t\t\t\t\t";
  2344.                 if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["review"], "isVisible", [], "any", false, false, false, 1922)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2345.                     // line 1923
  2346.                     yield "\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-item\">
  2347. \t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-header\">
  2348. \t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"reviewer-info\">
  2349. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"reviewer-avatar\">
  2350. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-user\"></i>
  2351. \t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  2352. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"reviewer-details\">
  2353. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h6 class=\"reviewer-name\">";
  2354.                     // line 1930
  2355.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, $context["review"], "user", [], "any", false, false, false, 1930), "userIdentifier", [], "any", false, false, false, 1930), "html", null, true);
  2356.                     yield "</h6>
  2357. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-rating\">
  2358. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t";
  2359.                     // line 1932
  2360.                     $context['_parent'] = $context;
  2361.                     $context['_seq'] = CoreExtension::ensureTraversable(range(1, 5));
  2362.                     foreach ($context['_seq'] as $context["_key"] => $context["i"]) {
  2363.                         // line 1933
  2364.                         yield "\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star";
  2365.                         if (($context["i"] <= CoreExtension::getAttribute($this->env, $this->source, $context["review"], "rating", [], "any", false, false, false, 1933))) {
  2366.                         } else {
  2367.                             yield "-empty";
  2368.                         }
  2369.                         yield "\"></i>
  2370. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t";
  2371.                     }
  2372.                     $_parent = $context['_parent'];
  2373.                     unset($context['_seq'], $context['_key'], $context['i'], $context['_parent']);
  2374.                     $context = array_intersect_key($context, $_parent) + $_parent;
  2375.                     // line 1935
  2376.                     yield "\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  2377. \t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  2378. \t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  2379. \t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-meta\">
  2380. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"review-date\">";
  2381.                     // line 1939
  2382.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatDate(CoreExtension::getAttribute($this->env, $this->source, $context["review"], "createdAt", [], "any", false, false, false, 1939), "d/m/Y"), "html", null, true);
  2383.                     yield "</span>
  2384. \t\t\t\t\t\t\t\t\t\t\t\t\t\t";
  2385.                     // line 1940
  2386.                     if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["review"], "isVerified", [], "any", false, false, false, 1940)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2387.                         // line 1941
  2388.                         yield "\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"verified-badge\">
  2389. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle\"></i>
  2390. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tVérifié
  2391. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>
  2392. \t\t\t\t\t\t\t\t\t\t\t\t\t\t";
  2393.                     }
  2394.                     // line 1946
  2395.                     yield "\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  2396. \t\t\t\t\t\t\t\t\t\t\t\t</div>
  2398. \t\t\t\t\t\t\t\t\t\t\t\t";
  2399.                     // line 1949
  2400.                     if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["review"], "comment", [], "any", false, false, false, 1949)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2401.                         // line 1950
  2402.                         yield "\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-comment\">
  2403. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>";
  2404.                         // line 1951
  2405.                         yield (((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["review"], "comment", [], "any", false, false, false, 1951)) > 150)) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["review"], "comment", [], "any", false, false, false, 1951), 0, 150) . "..."), "html", null, true)) : ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["review"], "comment", [], "any", false, false, false, 1951), "html", null, true)));
  2406.                         yield "</p>
  2407. \t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  2408. \t\t\t\t\t\t\t\t\t\t\t\t";
  2409.                     }
  2410.                     // line 1954
  2411.                     yield "\t\t\t\t\t\t\t\t\t\t\t</div>
  2412. \t\t\t\t\t\t\t\t\t\t";
  2413.                 }
  2414.                 // line 1956
  2415.                 yield "\t\t\t\t\t\t\t\t\t";
  2416.             }
  2417.             $_parent = $context['_parent'];
  2418.             unset($context['_seq'], $context['_key'], $context['review'], $context['_parent']);
  2419.             $context = array_intersect_key($context, $_parent) + $_parent;
  2420.             // line 1957
  2421.             yield "\t\t\t\t\t\t\t\t</div>
  2423. \t\t\t\t\t\t\t\t<div class=\"text-center mt-4\">
  2424. \t\t\t\t\t\t\t\t\t<a href=\"";
  2425.             // line 1960
  2426.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("shop_reviews_index", ["slug" => CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "slug", [], "any", false, false, false, 1960)]), "html", null, true);
  2427.             yield "\" class=\"btn btn-primary\">
  2428. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star me-1\"></i>Voir tous les avis
  2429. \t\t\t\t\t\t\t\t\t</a>
  2430. \t\t\t\t\t\t\t\t</div>
  2431. \t\t\t\t\t\t\t";
  2432.         } else {
  2433.             // line 1965
  2434.             yield "\t\t\t\t\t\t\t\t<div class=\"text-center py-4\">
  2435. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star\" style=\"font-size: 3rem; color: #ccc;\"></i>
  2436. \t\t\t\t\t\t\t\t\t<h5 class=\"mt-3\">Aucun avis pour le moment</h5>
  2437. \t\t\t\t\t\t\t\t\t<p class=\"text-muted\">Cette boutique n'a pas encore reçu d'avis clients.</p>
  2438. \t\t\t\t\t\t\t\t</div>
  2439. \t\t\t\t\t\t\t";
  2440.         }
  2441.         // line 1971
  2442.         yield "\t\t\t\t\t\t</div>
  2443. \t\t\t\t\t</div>
  2445. \t\t\t\t\t<div
  2446. \t\t\t\t\t\tclass=\"col-lg-4\">
  2447. \t\t\t\t\t\t<!-- Lien vers la page complète des avis -->
  2448. \t\t\t\t\t\t<div class=\"review-actions-card\">
  2449. \t\t\t\t\t\t\t<h5>Évaluer cette boutique</h5>
  2450. \t\t\t\t\t\t\t<p class=\"text-muted\">Partagez votre expérience avec cette boutique.</p>
  2451. \t\t\t\t\t\t\t<a href=\"";
  2452.         // line 1980
  2453.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("shop_reviews_new", ["slug" => CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "slug", [], "any", false, false, false, 1980)]), "html", null, true);
  2454.         yield "\" class=\"btn btn-primary w-100\">
  2455. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-star me-1\"></i>Laisser un avis
  2456. \t\t\t\t\t\t\t</a>
  2457. \t\t\t\t\t\t</div>
  2458. \t\t\t\t\t</div>
  2459. \t\t\t\t</div>
  2460. \t\t\t</div>
  2461. \t\t</div>
  2462. \t</section>
  2464. \t<!-- Modal de signalement -->
  2465. \t<div class=\"modal fade\" id=\"reportModal\" tabindex=\"-1\" aria-labelledby=\"reportModalLabel\" aria-hidden=\"true\">
  2466. \t\t<div class=\"modal-dialog\">
  2467. \t\t\t<div class=\"modal-content\">
  2468. \t\t\t\t<div class=\"modal-header\">
  2469. \t\t\t\t\t<h5 class=\"modal-title\" id=\"reportModalLabel\">
  2470. \t\t\t\t\t\t<i class=\"lnr lnr-flag me-2\"></i>&nbsp;Signaler cette boutique
  2471. \t\t\t\t\t</h5>
  2472. \t\t\t\t\t<button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>
  2473. \t\t\t\t</div>
  2474. \t\t\t\t<div class=\"modal-body\">
  2475. \t\t\t\t\t<form id=\"reportForm\">
  2476. \t\t\t\t\t\t<div class=\"mb-3\">
  2477. \t\t\t\t\t\t\t<label for=\"reportReason\" class=\"form-label\">Motif du signalement *</label>
  2478. \t\t\t\t\t\t\t<select class=\"form-select\" id=\"reportReason\" required>
  2479. \t\t\t\t\t\t\t\t<option value=\"\">Sélectionnez un motif</option>
  2480. \t\t\t\t\t\t\t\t<option value=\"fake_products\">Produits contrefaits</option>
  2481. \t\t\t\t\t\t\t\t<option value=\"inappropriate_content\">Contenu inapproprié</option>
  2482. \t\t\t\t\t\t\t\t<option value=\"spam\">Spam ou publicité abusive</option>
  2483. \t\t\t\t\t\t\t\t<option value=\"fraud\">Fraude ou escroquerie</option>
  2484. \t\t\t\t\t\t\t\t<option value=\"harassment\">Harcèlement</option>
  2485. \t\t\t\t\t\t\t\t<option value=\"other\">Autre</option>
  2486. \t\t\t\t\t\t\t</select>
  2487. \t\t\t\t\t\t</div>
  2488. \t\t\t\t\t\t<div class=\"mb-3\">
  2489. \t\t\t\t\t\t\t<label for=\"reportDescription\" class=\"form-label\">Description détaillée *</label>
  2490. \t\t\t\t\t\t\t<textarea class=\"form-control\" id=\"reportDescription\" rows=\"4\" placeholder=\"Décrivez le problème rencontré...\" required></textarea>
  2491. \t\t\t\t\t\t</div>
  2492. \t\t\t\t\t\t<div class=\"mb-3\">
  2493. \t\t\t\t\t\t\t<label for=\"reportEmail\" class=\"form-label\">Votre email (optionnel)</label>
  2494. \t\t\t\t\t\t\t<input type=\"email\" class=\"form-control\" id=\"reportEmail\" placeholder=\"votre@email.com\">
  2495. \t\t\t\t\t\t\t<div class=\"form-text\">Nous pourrons vous contacter pour plus d'informations</div>
  2496. \t\t\t\t\t\t</div>
  2497. \t\t\t\t\t</form>
  2498. \t\t\t\t</div>
  2499. \t\t\t\t<div class=\"modal-footer\">
  2500. \t\t\t\t\t<button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Annuler</button>
  2501. \t\t\t\t\t<button type=\"button\" class=\"btn btn-danger\" onclick=\"submitReport()\">
  2502. \t\t\t\t\t\t<i class=\"lnr lnr-flag  me-2\"></i>Envoyer le signalement
  2503. \t\t\t\t\t</button>
  2504. \t\t\t\t</div>
  2505. \t\t\t</div>
  2506. \t\t</div>
  2507. \t</div>
  2509. \t<!-- Section des avis -->
  2510. \t<div class=\"container my-5\">
  2511. \t\t<div class=\"row\">
  2512. \t\t\t<div class=\"col-12\">
  2513. \t\t\t\t<div class=\"section-title text-center\">
  2514. \t\t\t\t\t<h2>Avis clients</h2>
  2515. \t\t\t\t\t<p>Découvrez ce que pensent nos clients de cette boutique</p>
  2516. \t\t\t\t</div>
  2517. \t\t\t</div>
  2518. \t\t</div>
  2520. \t\t<div
  2521. \t\t\tclass=\"row\">
  2522. \t\t\t<!-- Statistiques des avis -->
  2523. \t\t\t<div class=\"col-md-4\">
  2524. \t\t\t\t<div class=\"review-stats-card\">
  2525. \t\t\t\t\t<div class=\"stats-header\">
  2526. \t\t\t\t\t\t<div class=\"overall-rating\">
  2527. \t\t\t\t\t\t\t<span class=\"rating-number\">";
  2528.         // line 2053
  2529.         yield (((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2053)) > 0)) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Twig\Extension\CoreExtension']->formatNumber((Twig\Extension\CoreExtension::reduce($this->env, Twig\Extension\CoreExtension::map($this->env, CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2053), function ($__r__) use ($context, $macros) { $context["r"] = $__r__; return CoreExtension::getAttribute($this->env, $this->source, ($context["r"] ?? null), "rating", [], "any", false, false, false, 2053); }), function ($__a__, $__b__) use ($context, $macros) { $context["a"] = $__a__; $context["b"] = $__b__; return (($context["a"] ?? null) + ($context["b"] ?? null)); }) / Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2053))), 1), "html", null, true)) : ("0.0"));
  2530.         yield "</span>
  2531. \t\t\t\t\t\t\t<div class=\"stars\">
  2532. \t\t\t\t\t\t\t\t";
  2533.         // line 2055
  2534.         $context["avgRating"] = (((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2055)) > 0)) ? ((Twig\Extension\CoreExtension::reduce($this->env, Twig\Extension\CoreExtension::map($this->env, CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2055), function ($__r__) use ($context, $macros) { $context["r"] = $__r__; return CoreExtension::getAttribute($this->env, $this->source, ($context["r"] ?? null), "rating", [], "any", false, false, false, 2055); }), function ($__a__, $__b__) use ($context, $macros) { $context["a"] = $__a__; $context["b"] = $__b__; return (($context["a"] ?? null) + ($context["b"] ?? null)); }) / Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2055)))) : (0));
  2535.         // line 2056
  2536.         yield "\t\t\t\t\t\t\t\t";
  2537.         $context['_parent'] = $context;
  2538.         $context['_seq'] = CoreExtension::ensureTraversable(range(1, 5));
  2539.         foreach ($context['_seq'] as $context["_key"] => $context["i"]) {
  2540.             // line 2057
  2541.             yield "\t\t\t\t\t\t\t\t\t";
  2542.             if (($context["i"] <= ($context["avgRating"] ?? null))) {
  2543.                 // line 2058
  2544.                 yield "\t\t\t\t\t\t\t\t\t\t★
  2545. \t\t\t\t\t\t\t\t\t";
  2546.             } elseif (((            // line 2059
  2547. $context["i"] - ($context["avgRating"] ?? null)) < 1)) {
  2548.                 // line 2060
  2549.                 yield "\t\t\t\t\t\t\t\t\t\t☆
  2550. \t\t\t\t\t\t\t\t\t";
  2551.             } else {
  2552.                 // line 2062
  2553.                 yield "\t\t\t\t\t\t\t\t\t\t☆
  2554. \t\t\t\t\t\t\t\t\t";
  2555.             }
  2556.             // line 2064
  2557.             yield "\t\t\t\t\t\t\t\t";
  2558.         }
  2559.         $_parent = $context['_parent'];
  2560.         unset($context['_seq'], $context['_key'], $context['i'], $context['_parent']);
  2561.         $context = array_intersect_key($context, $_parent) + $_parent;
  2562.         // line 2065
  2563.         yield "\t\t\t\t\t\t\t</div>
  2564. \t\t\t\t\t\t</div>
  2565. \t\t\t\t\t\t<div class=\"rating-summary\">
  2566. \t\t\t\t\t\t\t<p class=\"mb-1\">";
  2567.         // line 2068
  2568.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2068)), "html", null, true);
  2569.         yield "
  2570. \t\t\t\t\t\t\t\tavis</p>
  2571. \t\t\t\t\t\t\t<p class=\"text-muted small\">Basé sur
  2572. \t\t\t\t\t\t\t\t";
  2573.         // line 2071
  2574.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), Twig\Extension\CoreExtension::filter($this->env, CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2071), function ($__r__) use ($context, $macros) { $context["r"] = $__r__; return CoreExtension::getAttribute($this->env, $this->source, ($context["r"] ?? null), "isVerified", [], "any", false, false, false, 2071); })), "html", null, true);
  2575.         yield "
  2576. \t\t\t\t\t\t\t\tavis vérifiés</p>
  2577. \t\t\t\t\t\t</div>
  2578. \t\t\t\t\t</div>
  2580. \t\t\t\t\t<div class=\"rating-breakdown\">
  2581. \t\t\t\t\t\t";
  2582.         // line 2077
  2583.         $context['_parent'] = $context;
  2584.         $context['_seq'] = CoreExtension::ensureTraversable(range(5, 1));
  2585.         foreach ($context['_seq'] as $context["_key"] => $context["rating"]) {
  2586.             // line 2078
  2587.             yield "\t\t\t\t\t\t\t";
  2588.             $context["count"] = Twig\Extension\CoreExtension::length($this->env->getCharset(), Twig\Extension\CoreExtension::filter($this->env, CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2078), function ($__r__) use ($context, $macros) { $context["r"] = $__r__; return (CoreExtension::getAttribute($this->env, $this->source, ($context["r"] ?? null), "rating", [], "any", false, false, false, 2078) == $context["rating"]); }));
  2589.             // line 2079
  2590.             yield "\t\t\t\t\t\t\t";
  2591.             $context["percentage"] = (((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2079)) > 0)) ? (((($context["count"] ?? null) / Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2079))) * 100)) : (0));
  2592.             // line 2080
  2593.             yield "\t\t\t\t\t\t\t<div class=\"rating-bar\">
  2594. \t\t\t\t\t\t\t\t<span class=\"rating-label\">";
  2595.             // line 2081
  2596.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($context["rating"], "html", null, true);
  2597.             yield "★</span>
  2598. \t\t\t\t\t\t\t\t<div class=\"rating-progress\">
  2599. \t\t\t\t\t\t\t\t\t<div class=\"rating-fill\" style=\"width: ";
  2600.             // line 2083
  2601.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(($context["percentage"] ?? null), "html", null, true);
  2602.             yield "%\"></div>
  2603. \t\t\t\t\t\t\t\t</div>
  2604. \t\t\t\t\t\t\t\t<span class=\"rating-count\">";
  2605.             // line 2085
  2606.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(($context["count"] ?? null), "html", null, true);
  2607.             yield "</span>
  2608. \t\t\t\t\t\t\t</div>
  2609. \t\t\t\t\t\t";
  2610.         }
  2611.         $_parent = $context['_parent'];
  2612.         unset($context['_seq'], $context['_key'], $context['rating'], $context['_parent']);
  2613.         $context = array_intersect_key($context, $_parent) + $_parent;
  2614.         // line 2088
  2615.         yield "\t\t\t\t\t</div>
  2616. \t\t\t\t</div>
  2617. \t\t\t</div>
  2619. \t\t\t<!-- Aperçu des avis -->
  2620. \t\t\t<div class=\"col-md-8\">
  2621. \t\t\t\t<div class=\"reviews-preview\">
  2622. \t\t\t\t\t";
  2623.         // line 2095
  2624.         if ((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2095)) > 0)) {
  2625.             // line 2096
  2626.             yield "\t\t\t\t\t\t";
  2627.             $context['_parent'] = $context;
  2628.             $context['_seq'] = CoreExtension::ensureTraversable(Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2096), 0, 3));
  2629.             foreach ($context['_seq'] as $context["_key"] => $context["review"]) {
  2630.                 // line 2097
  2631.                 yield "\t\t\t\t\t\t\t<div class=\"review-card-preview\">
  2632. \t\t\t\t\t\t\t\t<div class=\"review-header\">
  2633. \t\t\t\t\t\t\t\t\t<div class=\"review-user\">
  2634. \t\t\t\t\t\t\t\t\t\t<div class=\"user-avatar\">
  2635. \t\t\t\t\t\t\t\t\t\t\t";
  2636.                 // line 2101
  2637.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::default(Twig\Extension\CoreExtension::upper($this->env->getCharset(), Twig\Extension\CoreExtension::first($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, $context["review"], "user", [], "any", false, false, false, 2101), "firstName", [], "any", false, false, false, 2101))), Twig\Extension\CoreExtension::upper($this->env->getCharset(), Twig\Extension\CoreExtension::first($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, $context["review"], "user", [], "any", false, false, false, 2101), "email", [], "any", false, false, false, 2101)))), "html", null, true);
  2638.                 yield "
  2639. \t\t\t\t\t\t\t\t\t\t</div>
  2640. \t\t\t\t\t\t\t\t\t\t<div class=\"user-info\">
  2641. \t\t\t\t\t\t\t\t\t\t\t<h6>";
  2642.                 // line 2104
  2643.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, $context["review"], "user", [], "any", false, true, false, 2104), "firstName", [], "any", true, true, false, 2104)) ? (Twig\Extension\CoreExtension::default(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, $context["review"], "user", [], "any", false, false, false, 2104), "firstName", [], "any", false, false, false, 2104), "Utilisateur")) : ("Utilisateur")), "html", null, true);
  2644.                 yield "</h6>
  2645. \t\t\t\t\t\t\t\t\t\t\t<small>";
  2646.                 // line 2105
  2647.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["review"], "getTimeAgo", [], "method", false, false, false, 2105), "html", null, true);
  2648.                 yield "</small>
  2649. \t\t\t\t\t\t\t\t\t\t</div>
  2650. \t\t\t\t\t\t\t\t\t</div>
  2651. \t\t\t\t\t\t\t\t\t<div class=\"review-rating\">
  2652. \t\t\t\t\t\t\t\t\t\t<div class=\"stars\">";
  2653.                 // line 2109
  2654.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["review"], "getRatingStars", [], "method", false, false, false, 2109), "html", null, true);
  2655.                 yield "</div>
  2656. \t\t\t\t\t\t\t\t\t\t";
  2657.                 // line 2110
  2658.                 if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["review"], "isVerified", [], "any", false, false, false, 2110)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2659.                     // line 2111
  2660.                     yield "\t\t\t\t\t\t\t\t\t\t\t<span class=\"verified-badge\">✓</span>
  2661. \t\t\t\t\t\t\t\t\t\t";
  2662.                 }
  2663.                 // line 2113
  2664.                 yield "\t\t\t\t\t\t\t\t\t</div>
  2665. \t\t\t\t\t\t\t\t</div>
  2666. \t\t\t\t\t\t\t\t<div class=\"review-content\">
  2667. \t\t\t\t\t\t\t\t\t";
  2668.                 // line 2116
  2669.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["review"], "comment", [], "any", false, false, false, 2116), 0, 150), "html", null, true);
  2670.                 yield "
  2671. \t\t\t\t\t\t\t\t\t";
  2672.                 // line 2117
  2673.                 if ((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["review"], "comment", [], "any", false, false, false, 2117)) > 150)) {
  2674.                     yield "...
  2675. \t\t\t\t\t\t\t\t\t";
  2676.                 }
  2677.                 // line 2119
  2678.                 yield "\t\t\t\t\t\t\t\t</div>
  2679. \t\t\t\t\t\t\t</div>
  2680. \t\t\t\t\t\t";
  2681.             }
  2682.             $_parent = $context['_parent'];
  2683.             unset($context['_seq'], $context['_key'], $context['review'], $context['_parent']);
  2684.             $context = array_intersect_key($context, $_parent) + $_parent;
  2685.             // line 2122
  2686.             yield "
  2687. \t\t\t\t\t\t<div class=\"text-center mt-3\">
  2688. \t\t\t\t\t\t\t<a href=\"";
  2689.             // line 2124
  2690.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("shop_reviews_index", ["slug" => CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "slug", [], "any", false, false, false, 2124)]), "html", null, true);
  2691.             yield "\" class=\"btn btn-outline-primary\">
  2692. \t\t\t\t\t\t\t\tVoir tous les avis (";
  2693.             // line 2125
  2694.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "reviews", [], "any", false, false, false, 2125)), "html", null, true);
  2695.             yield ")
  2696. \t\t\t\t\t\t\t</a>
  2697. \t\t\t\t\t\t</div>
  2698. \t\t\t\t\t";
  2699.         } else {
  2700.             // line 2129
  2701.             yield "\t\t\t\t\t\t<div class=\"empty-reviews\">
  2702. \t\t\t\t\t\t\t<i class=\"lnr lnr-star\"></i>
  2703. \t\t\t\t\t\t\t<h4>Aucun avis pour le moment</h4>
  2704. \t\t\t\t\t\t\t<p>Soyez le premier à laisser un avis sur cette boutique !</p>
  2705. \t\t\t\t\t\t\t";
  2706.             // line 2133
  2707.             if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, ($context["app"] ?? null), "user", [], "any", false, false, false, 2133)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2708.                 // line 2134
  2709.                 yield "\t\t\t\t\t\t\t\t<a href=\"";
  2710.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("shop_reviews_new", ["slug" => CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "slug", [], "any", false, false, false, 2134)]), "html", null, true);
  2711.                 yield "\" class=\"btn btn-primary\">
  2712. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnraccount_recently_viewed-star\"></i>
  2713. \t\t\t\t\t\t\t\t\tLaisser un avis
  2714. \t\t\t\t\t\t\t\t</a>
  2715. \t\t\t\t\t\t\t";
  2716.             }
  2717.             // line 2139
  2718.             yield "\t\t\t\t\t\t</div>
  2719. \t\t\t\t\t";
  2720.         }
  2721.         // line 2141
  2722.         yield "\t\t\t\t</div>
  2723. \t\t\t</div>
  2724. \t\t</div>
  2725. \t</div>
  2727. ";
  2728.         
  2729.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  2731.         
  2732.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  2734.         yield from [];
  2735.     }
  2737.     // line 2148
  2738.     /**
  2739.      * @return iterable<null|scalar|\Stringable>
  2740.      */
  2741.     public function block_javascripts(array $context, array $blocks = []): iterable
  2742.     {
  2743.         $macros = $this->macros;
  2744.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  2745.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "javascripts"));
  2747.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  2748.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "javascripts"));
  2750.         // line 2149
  2751.         yield "\t<script>
  2752. \t\tdocument.addEventListener('DOMContentLoaded', function () { // Initialisation du carrousel
  2753. initCarousel();
  2755. // Gestion des onglets eBay-style avec Bootstrap
  2756. const tabLinks = document.querySelectorAll('.shop-tab-link');
  2757. const tabContents = document.querySelectorAll('.shop-tab-content');
  2759. tabLinks.forEach(link => {
  2760. link.addEventListener('click', function (e) {
  2761. e.preventDefault();
  2763. // Retirer la classe active de tous les liens et contenus
  2764. tabLinks.forEach(l => {
  2765. l.classList.remove('active');
  2766. l.setAttribute('aria-selected', 'false');
  2767. });
  2768. tabContents.forEach(c => c.classList.remove('active'));
  2770. // Ajouter la classe active au lien cliqué
  2771. this.classList.add('active');
  2772. this.setAttribute('aria-selected', 'true');
  2774. // Afficher le contenu correspondant
  2775. const targetTab = this.dataset.tab;
  2776. const targetContent = document.getElementById (`shop-\${targetTab}`);
  2777. if (targetContent) {
  2778. targetContent.classList.add('active');
  2779. }
  2780. });
  2781. });
  2783. // Gestion du système de follow
  2784. const followButton = document.getElementById('follow-button');
  2786. if (followButton) {
  2787. followButton.addEventListener('click', function () {
  2788. const shopId = this.dataset.shopId;
  2789. const isFollowing = this.dataset.following === 'true';
  2791. // Désactiver le bouton pendant la requête
  2792. this.disabled = true;
  2793. const originalText = this.innerHTML;
  2794. this.innerHTML = '<i class=\"lnr lnr-spinner\"></i> Loading...';
  2796. // Envoyer la requête
  2797. fetch(\"";
  2798.         // line 2195
  2799.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ui_api_shop_toggle_follow", ["id" => "__SHOP_ID__"]);
  2800.         yield "\".replace('__SHOP_ID__', shopId), {
  2801. method: 'POST',
  2802. headers: {
  2803. 'Content-Type': 'application/json',
  2804. 'X-Requested-With': 'XMLHttpRequest'
  2805. }
  2806. }).then(response => response.json()).then(data => {
  2807. if (data.success) { // Mettre à jour l'interface
  2808. this.dataset.following = data.isFollowing;
  2810. if (data.isFollowing) {
  2811. this.classList.add('following');
  2812. this.innerHTML = '<i class=\"lnr lnr-checkmark\"></i> Suivi';
  2813. } else {
  2814. this.classList.remove('following');
  2815. this.innerHTML = '<i class=\"lnr lnr-plus\"></i> Suivre';
  2816. }
  2818. // Mettre à jour le compteur de followers
  2819. if (followersCount && data.followersCount !== undefined) {
  2820. followersCount.textContent = data.followersCount.toLocaleString();
  2821. }
  2823. // Afficher un message de confirmation
  2824. showNotification(data.message, 'success');
  2825. } else {
  2826. showNotification(data.message, 'error');
  2827. }
  2828. }).catch(error => {
  2829. console.error('Erreur:', error);
  2830. showNotification('Une erreur est survenue', 'error');
  2831. }). finally(() => {
  2832. this.disabled = false;
  2833. });
  2834. });
  2835. }
  2837. // Fonction pour afficher les notifications
  2838. function showNotification(message, type = 'info') { // Créer l'élément de notification
  2839. const notification = document.createElement('div');
  2840. notification.className = `alert alert-\${
  2841. type === 'success' ? 'success' : type === 'error' ? 'danger' : 'info'
  2842. } alert-dismissible fade show position-fixed`;
  2843. notification.style.cssText = 'top: 20px; right: 20px; z-index: 9999; min-width: 300px;';
  2844. notification.innerHTML = `
  2845.             \${message}
  2846.             <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\"></button>
  2847.         `;
  2849. document.body.appendChild(notification);
  2851. // Supprimer automatiquement après 5 secondes
  2852. setTimeout(() => {
  2853. if (notification.parentNode) {
  2854. notification.remove();
  2855. }
  2856. }, 5000);
  2857. }
  2859. // Fonctions pour les actions de boutique
  2860. window.shareShop = function () { // Vérifier si l'API Web Share est disponible et si on est sur mobile
  2861. if (navigator.share && /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
  2862. navigator.share({title: '";
  2863.         // line 2257
  2864.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 2257), "html", null, true);
  2865.         yield "- Boutique sur MaketOu', text: 'Découvrez cette boutique et ses produits sur MaketOu', url: window.location.href}).then(() => {
  2866. console.log('Partage réussi');
  2867. showNotification('Lien partagé avec succès !', 'success');
  2868. }).catch((error) => {
  2869. console.log('Erreur lors du partage:', error);
  2870. // Fallback vers la copie
  2871. copyToClipboard();
  2872. });
  2873. } else { // Sur desktop ou si Web Share n'est pas disponible, copier directement
  2874. copyToClipboard();
  2875. }
  2876. };
  2878. // Fonction pour copier le lien dans le presse-papiers
  2879. function copyToClipboard() {
  2880. const shopUrl = window.location.href;
  2881. const shopName = '";
  2882.         // line 2273
  2883.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "name", [], "any", false, false, false, 2273), "html", null, true);
  2884.         yield "';
  2885. const shareText = `Découvrez la boutique \"\${shopName}\" sur MaketOu : \${shopUrl}`;
  2887. // Utiliser directement le fallback pour éviter les conflits
  2888. fallbackCopyToClipboard(shareText);
  2889. }
  2891. // Fallback pour copier le texte
  2892. function fallbackCopyToClipboard(text) {
  2893. const textArea = document.createElement('textarea');
  2894. textArea.value = text;
  2895. textArea.style.position = 'fixed';
  2896. textArea.style.left = '-999999px';
  2897. textArea.style.top = '-999999px';
  2898. document.body.appendChild(textArea);
  2899. textArea.focus();
  2900. textArea.select();
  2902. try {
  2903. document.execCommand('copy');
  2904. showNotification('Lien copié dans le presse-papiers !', 'success');
  2905. } catch (err) {
  2906. console.error('Impossible de copier:', err);
  2907. showNotification('Impossible de copier le lien', 'error');
  2908. }
  2910. document.body.removeChild(textArea);
  2911. }
  2913. window.contactShop = function () { // Ouvrir un modal de signalement
  2914. openReportModal();
  2915. };
  2917. window.saveShop = function () { // Sauvegarder la boutique dans les favoris
  2918. showNotification('Boutique sauvegardée dans vos favoris', 'success');
  2919. };
  2921. // Fonction pour ouvrir le modal de signalement
  2922. window.openReportModal = function () {
  2923. const modal = new bootstrap.Modal(document.getElementById('reportModal'));
  2924. modal.show();
  2925. };
  2927. // Fonction pour soumettre le signalement
  2928. window.submitReport = function () {
  2929. const reason = document.getElementById('reportReason').value;
  2930. const description = document.getElementById('reportDescription').value;
  2931. const email = document.getElementById('reportEmail').value;
  2933. if (! reason || ! description) {
  2934. showNotification('Veuillez remplir tous les champs obligatoires', 'error');
  2935. return;
  2936. }
  2938. // Simuler l'envoi du signalement
  2939. const reportData = {
  2940. shopId: ";
  2941.         // line 2329
  2942.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "id", [], "any", false, false, false, 2329), "html", null, true);
  2943.         yield ",
  2944. reason: reason,
  2945. description: description,
  2946. email: email,
  2947. reportedAt: new Date().toISOString()
  2948. };
  2950. console.log('Signalement envoyé:', reportData);
  2952. // Fermer le modal
  2953. const modal = bootstrap.Modal.getInstance(document.getElementById('reportModal'));
  2954. modal.hide();
  2956. // Réinitialiser le formulaire
  2957. document.getElementById('reportForm').reset();
  2959. // Afficher la confirmation
  2960. showNotification('Signalement envoyé avec succès. Nous examinerons votre demande.', 'success');
  2961. };
  2963. // Gestion du carrousel eBay-style
  2964. let currentSlide = 0;
  2965. let carouselInterval;
  2966. let isPaused = false;
  2967. let slides = [];
  2968. let indicators = [];
  2970. function initCarousel() {
  2971.     // Réinitialiser les variables
  2972.     currentSlide = 0;
  2973.     isPaused = false;
  2974.     
  2975.     // Récupérer les slides et indicateurs à nouveau
  2976.     const carouselContainer = document.querySelector('.shop-carousel-ebay');
  2977.     if (!carouselContainer) {
  2978.         console.log('Carousel container not found');
  2979.         return;
  2980.     }
  2981.     
  2982.     const allSlides = carouselContainer.querySelectorAll('.carousel-slide');
  2983.     const allIndicators = carouselContainer.querySelectorAll('.carousel-indicator-ebay');
  2984.     
  2985.     if (allSlides.length === 0) {
  2986.         // Masquer les contrôles si aucune image
  2987.         const controls = carouselContainer.querySelector('.carousel-controls-ebay');
  2988.         const indicators = carouselContainer.querySelector('.carousel-indicators-ebay');
  2989.         if (controls) controls.style.display = 'none';
  2990.         if (indicators) indicators.style.display = 'none';
  2991.         return;
  2992.     }
  2993.     
  2994.     // Si une seule image, masquer les contrôles
  2995.     if (allSlides.length <= 1) {
  2996.         const controls = carouselContainer.querySelector('.carousel-controls-ebay');
  2997.         const indicators = carouselContainer.querySelector('.carousel-indicators-ebay');
  2998.         if (controls) controls.style.display = 'none';
  2999.         if (indicators) indicators.style.display = 'none';
  3000.         // S'assurer que la slide unique est active
  3001.         allSlides[0].classList.add('active');
  3002.         return;
  3003.     }
  3004.     
  3005.     // Afficher les contrôles si plusieurs images
  3006.     const controls = carouselContainer.querySelector('.carousel-controls-ebay');
  3007.     const indicators = carouselContainer.querySelector('.carousel-indicators-ebay');
  3008.     if (controls) controls.style.display = 'flex';
  3009.     if (indicators) indicators.style.display = 'flex';
  3010.     
  3011.     // Mettre à jour les références globales
  3012.     slides = allSlides;
  3013.     indicators = allIndicators;
  3014.     
  3015.     // S'assurer que la première slide est active
  3016.     updateCarousel();
  3017.     
  3018.     // Démarrer le carrousel automatique
  3019.     startCarousel();
  3020.     
  3021.     // Gérer les événements de survol
  3022.     carouselContainer.addEventListener('mouseenter', pauseCarousel);
  3023.     carouselContainer.addEventListener('mouseleave', () => {
  3024.             if (!isPaused) startCarousel();
  3025.         });
  3026. }
  3028. function startCarousel() {
  3029.     // Nettoyer l'intervalle existant
  3030.     clearInterval(carouselInterval);
  3031.     
  3032.     if (slides.length <= 1) return;
  3033.     
  3034.     carouselInterval = setInterval(() => {
  3035.         if (!isPaused && slides.length > 0) {
  3036.             nextSlide();
  3037.         }
  3038.     }, 4000); // Change toutes les 4 secondes
  3044. }
  3046. function pauseCarousel() {
  3047. isPaused = true;
  3048. clearInterval(carouselInterval);
  3049. const pauseIcon = document.getElementById('pauseIcon');
  3050. if (pauseIcon) {
  3051.     pauseIcon.className = 'lnr lnr-play';
  3052. }
  3053. }
  3055. function resumeCarousel() {
  3056. isPaused = false;
  3057. const pauseIcon = document.getElementById('pauseIcon');
  3058. if (pauseIcon) {
  3059.     pauseIcon.className = 'lnr lnr-pause';
  3060. }
  3061. startCarousel();
  3062. }
  3064. function toggleCarousel() {
  3065. if (isPaused) {
  3066. resumeCarousel();
  3067. } else {
  3068. pauseCarousel();
  3069. }
  3070. }
  3072. function nextSlide() {
  3073. if (slides.length === 0) return;
  3074. currentSlide = (currentSlide + 1) % slides.length;
  3075. updateCarousel();
  3076. }
  3078. function previousSlide() {
  3079. if (slides.length === 0) return;
  3080. currentSlide = (currentSlide - 1 + slides.length) % slides.length;
  3081. updateCarousel();
  3082. }
  3084. function goToSlide(index) {
  3085. if (slides.length === 0) return;
  3086. if (index < 0 || index >= slides.length) return;
  3087. currentSlide = index;
  3088. updateCarousel();
  3089. }
  3091. function updateCarousel() {
  3092.     if (slides.length === 0 || indicators.length === 0) return;
  3093.     
  3094.     // Masquer toutes les slides
  3095.     slides.forEach(slide => slide.classList.remove('active'));
  3096.     indicators.forEach(indicator => indicator.classList.remove('active'));
  3097.     
  3098.     // Afficher la slide active
  3099.     if (slides[currentSlide]) {
  3100.         slides[currentSlide].classList.add('active');
  3101.     }
  3102.     if (indicators[currentSlide]) {
  3103.         indicators[currentSlide].classList.add('active');
  3104.     }
  3105. }
  3107. // Fonctions globales pour les boutons
  3108. window.nextSlide = nextSlide;
  3109. window.previousSlide = previousSlide;
  3110. window.goToSlide = goToSlide;
  3111. window.toggleCarousel = toggleCarousel;
  3113. // Gestion du tri des produits via API Symfony
  3114. console.log('=== INITIALIZING PRODUCT SORTING ===');
  3115. console.log('Shop ID:', ";
  3116.         // line 2501
  3117.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "id", [], "any", false, false, false, 2501), "html", null, true);
  3118.         yield ");
  3120. // Fonction de tri via AJAX - RENDUE GLOBALE
  3121. window.sortProducts = function (sortValue) {
  3122. console.log('=== SORT PRODUCTS CALLED ===');
  3123. console.log('Sort value:', sortValue);
  3125. const productsContainer = document.getElementById('products-container');
  3126. console.log('Products container:', productsContainer);
  3128. if (! productsContainer) {
  3129. console.error('Products container not found!');
  3130. return;
  3131. }
  3133. if (! sortValue) {
  3134. console.log('Resetting to original order');
  3135. // Recharger la page pour revenir à l'ordre original
  3136. window.location.reload();
  3137. return;
  3138. }
  3140. console.log('Showing loading spinner...');
  3141. // Afficher un indicateur de chargement
  3142. productsContainer.innerHTML = '<div class=\"col-12 text-center py-5\"><div class=\"spinner-border text-primary\" role=\"status\"><span class=\"visually-hidden\">Chargement...</span></div><p class=\"mt-3\">Tri des produits en cours...</p></div>';
  3144. // Récupérer l'ID de la boutique
  3145. const shopId = ";
  3146.         // line 2528
  3147.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, ($context["shop"] ?? null), "id", [], "any", false, false, false, 2528), "html", null, true);
  3148.         yield ";
  3149. console.log('Shop ID for request:', shopId);
  3151. const url = \"";
  3152.         // line 2531
  3153.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ui_api_shop_products_sort", ["id" => "__SHOP_ID__"]);
  3154.         yield "\".replace('__SHOP_ID__', shopId);
  3155. console.log('Request URL:', url);
  3157. const requestData = {
  3158. sortBy: sortValue
  3159. };
  3160. console.log('Request data:', requestData);
  3162. // Envoyer la requête AJAX
  3163. console.log('Sending AJAX request...');
  3164. fetch(url, {
  3165. method: 'POST',
  3166. headers: {
  3167. 'Content-Type': 'application/json',
  3168. 'X-Requested-With': 'XMLHttpRequest'
  3169. },
  3170. body: JSON.stringify(requestData)
  3171. }).then(response => {
  3172. console.log('Response received:', response);
  3173. console.log('Response status:', response.status);
  3174. return response.json();
  3175. }).then(data => {
  3176. console.log('Sort response data:', data);
  3178. if (data.success) {
  3179. console.log('Sort successful, updating content...');
  3180. // Mettre à jour le contenu avec le HTML retourné
  3181. productsContainer.innerHTML = data.html;
  3183. // Mettre à jour le compteur de produits
  3184. const productCount = document.querySelector('.product-count');
  3185. if (productCount) {
  3186. productCount.textContent = data.count;
  3187. }
  3189. console.log('Products sorted successfully!');
  3190. } else {
  3191. console.error('Sort failed:', data.message);
  3192. showNotification('Erreur lors du tri: ' + data.message, 'error');
  3194. // Recharger la page en cas d'erreur
  3195. window.location.reload();
  3196. }
  3197. }).catch(error => {
  3198. console.error('Sort request failed:', error);
  3199. showNotification('Erreur de connexion lors du tri', 'error');
  3201. // Recharger la page en cas d'erreur
  3202. window.location.reload();
  3203. });
  3204. };
  3206. // Attendre que le DOM soit chargé
  3207. console.log('Setting up event listeners...');
  3208. setTimeout(() => {
  3209. const sortSelect = document.getElementById('product-sort');
  3210. console.log('Sort select element:', sortSelect);
  3212. if (sortSelect) {
  3213. console.log('Adding change event listener...');
  3215. // Ecouter l'événement change avec jQuery (nécessaire à cause de nice-select)
  3216. if (typeof \$ !== 'undefined') {
  3217.     \$('#product-sort').on('change', function() {
  3218.         console.log('=== SELECT CHANGE EVENT TRIGGERED (jQuery) ===');
  3219.         if(window.sortProducts) window.sortProducts(this.value);
  3220.     });
  3221. }
  3223. sortSelect.addEventListener('change', function () {
  3224. console.log('=== SELECT CHANGE EVENT TRIGGERED ===');
  3225. console.log('Selected value:', this.value);
  3226. console.log('Calling sortProducts...');
  3227. window.sortProducts(this.value);
  3228. });
  3230. console.log('Event listener added successfully');
  3231. } else {
  3232. console.error('Sort select element not found!');
  3233. console.log('Available elements with ID containing \"sort\":', document.querySelectorAll('[id*=\"sort\"]'));
  3234. console.log('Available elements with class containing \"form-select\":', document.querySelectorAll('.form-select'));
  3235. }
  3236. }, 100);
  3238. // Gestion du bouton \"Suivre\"
  3239. const followBtn = document.querySelector('.btn-shop');
  3240. if (followBtn) {
  3241. followBtn.addEventListener('click', function () {
  3242. if (this.innerHTML.includes('Suivre')) {
  3243. this.innerHTML = '<i class=\"lnr lnr-heart me-1\"></i> Suivi';
  3244. this.classList.remove('btn-shop');
  3245. this.classList.add('btn-success');
  3246. } else {
  3247. this.innerHTML = '<i class=\"lnr lnr-heart me-1\"></i> Suivre';
  3248. this.classList.remove('btn-success');
  3249. this.classList.add('btn-shop');
  3250. }
  3251. });
  3252. }
  3253. });
  3254. \t</script>
  3255. ";
  3256.         
  3257.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  3259.         
  3260.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  3262.         yield from [];
  3263.     }
  3265.     /**
  3266.      * @codeCoverageIgnore
  3267.      */
  3268.     public function getTemplateName(): string
  3269.     {
  3270.         return "home/shop.html.twig";
  3271.     }
  3273.     /**
  3274.      * @codeCoverageIgnore
  3275.      */
  3276.     public function isTraitable(): bool
  3277.     {
  3278.         return false;
  3279.     }
  3281.     /**
  3282.      * @codeCoverageIgnore
  3283.      */
  3284.     public function getDebugInfo(): array
  3285.     {
  3286.         return array (  3153 => 2531,  3147 => 2528,  3117 => 2501,  2942 => 2329,  2883 => 2273,  2864 => 2257,  2799 => 2195,  2751 => 2149,  2738 => 2148,  2722 => 2141,  2718 => 2139,  2709 => 2134,  2707 => 2133,  2701 => 2129,  2694 => 2125,  2690 => 2124,  2686 => 2122,  2678 => 2119,  2673 => 2117,  2669 => 2116,  2664 => 2113,  2660 => 2111,  2658 => 2110,  2654 => 2109,  2647 => 2105,  2643 => 2104,  2637 => 2101,  2631 => 2097,  2626 => 2096,  2624 => 2095,  2615 => 2088,  2606 => 2085,  2601 => 2083,  2596 => 2081,  2593 => 2080,  2590 => 2079,  2587 => 2078,  2583 => 2077,  2574 => 2071,  2568 => 2068,  2563 => 2065,  2557 => 2064,  2553 => 2062,  2549 => 2060,  2547 => 2059,  2544 => 2058,  2541 => 2057,  2536 => 2056,  2534 => 2055,  2529 => 2053,  2453 => 1980,  2442 => 1971,  2434 => 1965,  2426 => 1960,  2421 => 1957,  2415 => 1956,  2411 => 1954,  2405 => 1951,  2402 => 1950,  2400 => 1949,  2395 => 1946,  2388 => 1941,  2386 => 1940,  2382 => 1939,  2376 => 1935,  2364 => 1933,  2360 => 1932,  2355 => 1930,  2346 => 1923,  2343 => 1922,  2339 => 1921,  2336 => 1920,  2334 => 1919,  2321 => 1909,  2312 => 1903,  2304 => 1897,  2292 => 1895,  2288 => 1894,  2283 => 1892,  2259 => 1871,  2250 => 1865,  2234 => 1851,  2229 => 1849,  2224 => 1846,  2222 => 1845,  2219 => 1844,  2214 => 1842,  2209 => 1839,  2207 => 1838,  2204 => 1837,  2200 => 1835,  2194 => 1833,  2192 => 1832,  2185 => 1828,  2161 => 1806,  2153 => 1800,  2149 => 1798,  2134 => 1796,  2132 => 1795,  2121 => 1794,  2104 => 1793,  2101 => 1792,  2099 => 1791,  2080 => 1775,  2074 => 1772,  2060 => 1761,  2031 => 1734,  2023 => 1730,  2021 => 1729,  2010 => 1720,  2002 => 1716,  1997 => 1713,  1993 => 1711,  1989 => 1709,  1987 => 1708,  1975 => 1706,  1973 => 1705,  1959 => 1694,  1939 => 1676,  1932 => 1672,  1929 => 1671,  1927 => 1670,  1924 => 1669,  1917 => 1665,  1914 => 1664,  1912 => 1663,  1909 => 1662,  1902 => 1658,  1899 => 1657,  1897 => 1656,  1891 => 1652,  1885 => 1649,  1882 => 1648,  1880 => 1647,  1875 => 1644,  1869 => 1640,  1867 => 1639,  1863 => 1638,  1852 => 1629,  1846 => 1625,  1843 => 1624,  1837 => 1620,  1829 => 1618,  1827 => 1617,  1816 => 1608,  1812 => 1606,  1791 => 1604,  1774 => 1603,  1758 => 1589,  1755 => 1588,  1753 => 1587,  1748 => 1584,  1741 => 1579,  1738 => 1578,  1715 => 1574,  1697 => 1573,  1694 => 1572,  1692 => 1571,  1683 => 1564,  1670 => 1563,  107 => 9,  94 => 8,  79 => 4,  66 => 3,  43 => 1,);
  3287.     }
  3289.     public function getSourceContext(): Source
  3290.     {
  3291.         return new Source("{% extends 'base_home.html.twig' %}
  3293. {% block title %}
  3294. \t{{ shop.name }}
  3295. \t| MaketOu
  3296. {% endblock %}
  3298. {% block stylesheets %}
  3299. \t<style>
  3300. \t\t/* Design eBay-like intégré avec Karma - Pleine largeur */
  3301. \t\t.shop-header {
  3302. \t\t\tbackground: #f7f7f7;
  3303. \t\t\tborder-bottom: 1px solid #e1e1e1;
  3304. \t\t\tpadding: 0;
  3305. \t\t\tmargin-bottom: 0;
  3306. \t\t\twidth: 100%;
  3307. \t\t\tposition: relative;
  3308. \t\t}
  3310. \t\t.shop-banner {
  3311. \t\t\twidth: 100%;
  3312. \t\t\theight: 350px;
  3313. \t\t\tbackground-size: cover;
  3314. \t\t\tbackground-position: center;
  3315. \t\t\tbackground-repeat: no-repeat;
  3316. \t\t\tposition: relative;
  3317. \t\t\tdisplay: flex;
  3318. \t\t\talign-items: center;
  3319. \t\t\tjustify-content: center;
  3320. \t\t}
  3322. \t\t/* Carrousel eBay-style - même largeur que shop-header-content */
  3323. \t\t.shop-carousel-ebay {
  3324. \t\t\twidth: 100%;
  3325. \t\t\theight: 400px;
  3326. \t\t\tposition: relative;
  3327. \t\t\toverflow: hidden;
  3328. \t\t\tbackground: #f8f9fa;
  3329. \t\t\tmargin: 0 20px 0 20px;
  3330. \t\t\tborder-radius: 8px;
  3331. \t\t\tbox-sizing: border-box;
  3332. \t\t}
  3334. \t\t.carousel-container {
  3335. \t\t\tposition: relative;
  3336. \t\t\twidth: 100%;
  3337. \t\t\theight: 100%;
  3338. \t\t}
  3340. \t\t.carousel-slide {
  3341. \t\t\tposition: absolute;
  3342. \t\t\ttop: 0;
  3343. \t\t\tleft: 0;
  3344. \t\t\twidth: 100%;
  3345. \t\t\theight: 100%;
  3346. \t\t\tbackground-size: cover;
  3347. \t\t\tbackground-position: center;
  3348. \t\t\tbackground-repeat: no-repeat;
  3349. \t\t\topacity: 0;
  3350. \t\t\ttransition: opacity 0.5s ease-in-out;
  3351. \t\t}
  3353. \t\t.carousel-slide.active {
  3354. \t\t\topacity: 1;
  3355. \t\t}
  3357. \t\t.carousel-controls {
  3358. \t\t\tposition: absolute;
  3359. \t\t\tbottom: 20px;
  3360. \t\t\tleft: 50%;
  3361. \t\t\ttransform: translateX(-50%);
  3362. \t\t\tdisplay: flex;
  3363. \t\t\tgap: 10px;
  3364. \t\t\tz-index: 10;
  3365. \t\t}
  3367. \t\t.carousel-btn {
  3368. \t\t\twidth: 40px;
  3369. \t\t\theight: 40px;
  3370. \t\t\tborder: none;
  3371. \t\t\tborder-radius: 50%;
  3372. \t\t\tbackground: rgba(255, 255, 255, 0.9);
  3373. \t\t\tcolor: #333;
  3374. \t\t\tfont-size: 16px;
  3375. \t\t\tcursor: pointer;
  3376. \t\t\tdisplay: flex;
  3377. \t\t\talign-items: center;
  3378. \t\t\tjustify-content: center;
  3379. \t\t\ttransition: all 0.3s ease;
  3380. \t\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  3381. \t\t}
  3383. \t\t.carousel-btn:hover {
  3384. \t\t\tbackground: white;
  3385. \t\t\ttransform: scale(1.1);
  3386. \t\t}
  3388. \t\t.carousel-btn:disabled {
  3389. \t\t\topacity: 0.5;
  3390. \t\t\tcursor: not-allowed;
  3391. \t\t\ttransform: none;
  3392. \t\t}
  3394. \t\t.carousel-pause {
  3395. \t\t\tbackground: #dc3545;
  3396. \t\t\tcolor: white;
  3397. \t\t}
  3399. \t\t.carousel-pause:hover {
  3400. \t\t\tbackground: #c82333;
  3401. \t\t}
  3403. \t\t.carousel-indicators {
  3404. \t\t\tposition: absolute;
  3405. \t\t\tbottom: 70px;
  3406. \t\t\tleft: 50%;
  3407. \t\t\ttransform: translateX(-50%);
  3408. \t\t\tdisplay: flex;
  3409. \t\t\tgap: 8px;
  3410. \t\t\tz-index: 10;
  3411. \t\t}
  3413. \t\t.carousel-indicator {
  3414. \t\t\twidth: 12px;
  3415. \t\t\theight: 12px;
  3416. \t\t\tborder-radius: 50%;
  3417. \t\t\tbackground: rgba(255, 255, 255, 0.5);
  3418. \t\t\tborder: none;
  3419. \t\t\tcursor: pointer;
  3420. \t\t\ttransition: all 0.3s ease;
  3421. \t\t}
  3423. \t\t.carousel-indicator.active {
  3424. \t\t\tbackground: white;
  3425. \t\t\ttransform: scale(1.2);
  3426. \t\t}
  3428. \t\t/* Contrôles eBay-style intégrés */
  3429. \t\t.carousel-controls-ebay {
  3430. \t\t\tposition: absolute;
  3431. \t\t\ttop: 50%;
  3432. \t\t\tleft: 0;
  3433. \t\t\tright: 0;
  3434. \t\t\ttransform: translateY(-50%);
  3435. \t\t\tdisplay: flex;
  3436. \t\t\tjustify-content: space-between;
  3437. \t\t\tpadding: 0 20px;
  3438. \t\t\tz-index: 10;
  3439. \t\t}
  3441. \t\t.carousel-btn-ebay {
  3442. \t\t\twidth: 50px;
  3443. \t\t\theight: 50px;
  3444. \t\t\tborder: none;
  3445. \t\t\tborder-radius: 50%;
  3446. \t\t\tbackground: rgba(0, 0, 0, 0.7);
  3447. \t\t\tcolor: white;
  3448. \t\t\tfont-size: 18px;
  3449. \t\t\tcursor: pointer;
  3450. \t\t\tdisplay: flex;
  3451. \t\t\talign-items: center;
  3452. \t\t\tjustify-content: center;
  3453. \t\t\ttransition: all 0.3s ease;
  3454. \t\t\topacity: 0;
  3455. \t\t}
  3457. \t\t.shop-carousel-ebay:hover .carousel-btn-ebay {
  3458. \t\t\topacity: 1;
  3459. \t\t}
  3461. \t\t.carousel-btn-ebay:hover {
  3462. \t\t\tbackground: rgba(0, 0, 0, 0.9);
  3463. \t\t\ttransform: scale(1.1);
  3464. \t\t}
  3466. \t\t.carousel-btn-ebay:disabled {
  3467. \t\t\topacity: 0.3;
  3468. \t\t\tcursor: not-allowed;
  3469. \t\t\ttransform: none;
  3470. \t\t}
  3472. \t\t.carousel-btn-ebay.pause-btn {
  3473. \t\t\tbackground: rgba(220, 53, 69, 0.8);
  3474. \t\t}
  3476. \t\t.carousel-btn-ebay.pause-btn:hover {
  3477. \t\t\tbackground: rgba(220, 53, 69, 1);
  3478. \t\t}
  3480. \t\t/* Indicateurs eBay-style */
  3481. \t\t.carousel-indicators-ebay {
  3482. \t\t\tposition: absolute;
  3483. \t\t\tbottom: 20px;
  3484. \t\t\tleft: 50%;
  3485. \t\t\ttransform: translateX(-50%);
  3486. \t\t\tdisplay: flex;
  3487. \t\t\tgap: 8px;
  3488. \t\t\tz-index: 10;
  3489. \t\t}
  3491. \t\t.carousel-indicator-ebay {
  3492. \t\t\twidth: 12px;
  3493. \t\t\theight: 12px;
  3494. \t\t\tborder-radius: 50%;
  3495. \t\t\tbackground: rgba(255, 255, 255, 0.5);
  3496. \t\t\tborder: 2px solid rgba(255, 255, 255, 0.8);
  3497. \t\t\tcursor: pointer;
  3498. \t\t\ttransition: all 0.3s ease;
  3499. \t\t}
  3501. \t\t.carousel-indicator-ebay.active {
  3502. \t\t\tbackground: white;
  3503. \t\t\tborder-color: white;
  3504. \t\t\ttransform: scale(1.2);
  3505. \t\t}
  3507. \t\t.carousel-indicator-ebay:hover {
  3508. \t\t\tbackground: rgba(255, 255, 255, 0.8);
  3509. \t\t\ttransform: scale(1.1);
  3510. \t\t}
  3512. \t\t/* Styles eBay-style pour les détails de boutique */
  3513. \t\t.shop-avatar-container-ebay {
  3514. \t\t\tposition: relative;
  3515. \t\t\tmargin-right: 20px;
  3516. \t\t}
  3518. \t\t.shop-avatar-ebay {
  3519. \t\t\twidth: 80px;
  3520. \t\t\theight: 80px;
  3521. \t\t\tborder-radius: 8px;
  3522. \t\t\tobject-fit: cover;
  3523. \t\t\tborder: 3px solid white;
  3524. \t\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  3525. \t\t}
  3527. \t\t.verified-badge-ebay {
  3528. \t\t\tposition: absolute;
  3529. \t\t\tbottom: -5px;
  3530. \t\t\tright: -5px;
  3531. \t\t\tbackground: #28a745;
  3532. \t\t\tcolor: white;
  3533. \t\t\twidth: 24px;
  3534. \t\t\theight: 24px;
  3535. \t\t\tborder-radius: 50%;
  3536. \t\t\tdisplay: flex;
  3537. \t\t\talign-items: center;
  3538. \t\t\tjustify-content: center;
  3539. \t\t\tfont-size: 12px;
  3540. \t\t\tborder: 2px solid white;
  3541. \t\t}
  3543. \t\t.shop-info-ebay {
  3544. \t\t\tpadding: 10px 0;
  3545. \t\t}
  3547. \t\t.shop-name-section {
  3548. \t\t\tmargin-bottom: 8px;
  3549. \t\t}
  3551. \t\t.shop-name-ebay {
  3552. \t\t\tfont-size: 1.8rem;
  3553. \t\t\tfont-weight: 600;
  3554. \t\t\tcolor: #333;
  3555. \t\t\tmargin: 0 15px 0 0;
  3556. \t\t\tdisplay: inline-block;
  3557. \t\t}
  3559. \t\t.verified-text {
  3560. \t\t\tcolor: #28a745;
  3561. \t\t\tfont-size: 0.9rem;
  3562. \t\t\tfont-weight: 500;
  3563. \t\t}
  3565. \t\t.shop-category-section {
  3566. \t\t\tmargin-bottom: 12px;
  3567. \t\t}
  3569. \t\t.shop-category-ebay {
  3570. \t\t\tbackground: #f8f9fa;
  3571. \t\t\tcolor: #666;
  3572. \t\t\tpadding: 4px 12px;
  3573. \t\t\tborder-radius: 16px;
  3574. \t\t\tfont-size: 0.85rem;
  3575. \t\t\tfont-weight: 500;
  3576. \t\t}
  3578. \t\t.shop-stats-ebay {
  3579. \t\t\tmargin-top: 15px;
  3580. \t\t}
  3582. \t\t.stat-row {
  3583. \t\t\tdisplay: flex;
  3584. \t\t\tgap: 30px;
  3585. \t\t\tmargin-bottom: 10px;
  3586. \t\t}
  3588. \t\t.stat-item-ebay {
  3589. \t\t\tdisplay: flex;
  3590. \t\t\tflex-direction: column;
  3591. \t\t\talign-items: flex-start;
  3592. \t\t}
  3594. \t\t.stat-percentage {
  3595. \t\t\tfont-size: 1.2rem;
  3596. \t\t\tfont-weight: 700;
  3597. \t\t\tcolor: #28a745;
  3598. \t\t\tline-height: 1;
  3599. \t\t}
  3601. \t\t.stat-number-ebay {
  3602. \t\t\tfont-size: 1.2rem;
  3603. \t\t\tfont-weight: 700;
  3604. \t\t\tcolor: #333;
  3605. \t\t\tline-height: 1;
  3606. \t\t}
  3608. \t\t.stat-label-ebay {
  3609. \t\t\tfont-size: 0.8rem;
  3610. \t\t\tcolor: #666;
  3611. \t\t\ttext-transform: uppercase;
  3612. \t\t\tletter-spacing: 0.5px;
  3613. \t\t\tmargin-top: 2px;
  3614. \t\t}
  3616. \t\t.shop-additional-info {
  3617. \t\t\tdisplay: flex;
  3618. \t\t\tgap: 20px;
  3619. \t\t\tfont-size: 0.85rem;
  3620. \t\t\tcolor: #666;
  3621. \t\t}
  3623. \t\t.member-since {
  3624. \t\t\tfont-weight: 400;
  3625. \t\t}
  3627. \t\t.location {
  3628. \t\t\tdisplay: flex;
  3629. \t\t\talign-items: center;
  3630. \t\t}
  3632. \t\t.shop-actions-ebay {
  3633. \t\t\tdisplay: flex;
  3634. \t\t\tflex-direction: column;
  3635. \t\t\tgap: 10px;
  3636. \t\t\tmin-width: 140px;
  3637. \t\t}
  3639. \t\t.btn-ebay {
  3640. \t\t\tpadding: 8px 16px;
  3641. \t\t\tfont-size: 0.9rem;
  3642. \t\t\tfont-weight: 500;
  3643. \t\t\tborder-radius: 4px;
  3644. \t\t\ttext-align: center;
  3645. \t\t\ttransition: all 0.3s ease;
  3646. \t\t\tborder-width: 1px;
  3647. \t\t}
  3649. \t\t.btn-ebay:hover {
  3650. \t\t\ttransform: translateY(-1px);
  3651. \t\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  3652. \t\t}
  3654. \t\t.btn-ebay.following {
  3655. \t\t\tbackground: #28a745;
  3656. \t\t\tborder-color: #28a745;
  3657. \t\t\tcolor: white;
  3658. \t\t}
  3660. \t\t/* Styles pour les avis */
  3661. \t\t.review-stats {
  3662. \t\t\tbackground: white;
  3663. \t\t\tborder-radius: 12px;
  3664. \t\t\tpadding: 20px;
  3665. \t\t\tbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  3666. \t\t\tmargin-bottom: 20px;
  3667. \t\t}
  3669. \t\t.stat-card {
  3670. \t\t\tpadding: 15px;
  3671. \t\t}
  3673. \t\t.stat-number {
  3674. \t\t\tfont-size: 2.5rem;
  3675. \t\t\tfont-weight: 700;
  3676. \t\t\tcolor: #333;
  3677. \t\t\tmargin: 0;
  3678. \t\t}
  3680. \t\t.stat-label {
  3681. \t\t\tcolor: #666;
  3682. \t\t\tfont-size: 0.9rem;
  3683. \t\t\tmargin: 5px 0 0;
  3684. \t\t}
  3686. \t\t.rating-stars {
  3687. \t\t\tcolor: #ffc107;
  3688. \t\t\tfont-size: 1.2rem;
  3689. \t\t\tmargin: 10px 0;
  3690. \t\t}
  3692. \t\t.reviews-preview {
  3693. \t\t\tbackground: white;
  3694. \t\t\tborder-radius: 12px;
  3695. \t\t\tpadding: 20px;
  3696. \t\t\tbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  3697. \t\t}
  3699. \t\t.review-item {
  3700. \t\t\tborder-bottom: 1px solid #f0f0f0;
  3701. \t\t\tpadding: 15px 0;
  3702. \t\t}
  3704. \t\t.review-item:last-child {
  3705. \t\t\tborder-bottom: none;
  3706. \t\t}
  3708. \t\t.review-header {
  3709. \t\t\tdisplay: flex;
  3710. \t\t\tjustify-content: space-between;
  3711. \t\t\talign-items: flex-start;
  3712. \t\t\tmargin-bottom: 10px;
  3713. \t\t}
  3715. \t\t.reviewer-info {
  3716. \t\t\tdisplay: flex;
  3717. \t\t\talign-items: center;
  3718. \t\t\tgap: 10px;
  3719. \t\t}
  3721. \t\t.reviewer-avatar {
  3722. \t\t\twidth: 40px;
  3723. \t\t\theight: 40px;
  3724. \t\t\tborder-radius: 50%;
  3725. \t\t\tbackground: #f8f9fa;
  3726. \t\t\tdisplay: flex;
  3727. \t\t\talign-items: center;
  3728. \t\t\tjustify-content: center;
  3729. \t\t\tcolor: #666;
  3730. \t\t}
  3732. \t\t.reviewer-name {
  3733. \t\t\tmargin: 0;
  3734. \t\t\tfont-size: 1rem;
  3735. \t\t\tfont-weight: 600;
  3736. \t\t}
  3738. \t\t.review-rating {
  3739. \t\t\tcolor: #ffc107;
  3740. \t\t\tfont-size: 0.9rem;
  3741. \t\t}
  3743. \t\t.review-meta {
  3744. \t\t\ttext-align: right;
  3745. \t\t}
  3747. \t\t.review-date {
  3748. \t\t\tcolor: #666;
  3749. \t\t\tfont-size: 0.8rem;
  3750. \t\t}
  3752. \t\t.verified-badge {
  3753. \t\t\tdisplay: inline-block;
  3754. \t\t\tbackground: #28a745;
  3755. \t\t\tcolor: white;
  3756. \t\t\tpadding: 2px 8px;
  3757. \t\t\tborder-radius: 12px;
  3758. \t\t\tfont-size: 0.7rem;
  3759. \t\t\tmargin-left: 10px;
  3760. \t\t}
  3762. \t\t.review-comment {
  3763. \t\t\tmargin: 10px 0 0;
  3764. \t\t\tline-height: 1.5;
  3765. \t\t\tcolor: #333;
  3766. \t\t}
  3768. \t\t.review-actions-card {
  3769. \t\t\tbackground: white;
  3770. \t\t\tborder-radius: 12px;
  3771. \t\t\tpadding: 20px;
  3772. \t\t\tbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  3773. \t\t\ttext-align: center;
  3774. \t\t}
  3776. \t\t.shop-banner-overlay {
  3777. \t\t\tposition: absolute;
  3778. \t\t\ttop: 0;
  3779. \t\t\tleft: 0;
  3780. \t\t\tright: 0;
  3781. \t\t\tbottom: 0;
  3782. \t\t\tbackground: rgba(0, 0, 0, 0.3);
  3783. \t\t\tz-index: 1;
  3784. \t\t}
  3786. \t\t.shop-header-content {
  3787. \t\t\tbackground: white;
  3788. \t\t\tborder: 1px solid #e1e1e1;
  3789. \t\t\tborder-radius: 4px;
  3790. \t\t\tpadding: 20px;
  3791. \t\t\tmargin: 0 20px 20px;
  3792. \t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  3793. \t\t\tposition: relative;
  3794. \t\t\tz-index: 2;
  3795. \t\t}
  3797. \t\t.shop-avatar {
  3798. \t\t\twidth: 80px;
  3799. \t\t\theight: 80px;
  3800. \t\t\tborder-radius: 4px;
  3801. \t\t\tborder: 1px solid #e1e1e1;
  3802. \t\t\tobject-fit: cover;
  3803. \t\t\tposition: relative;
  3804. \t\t\tz-index: 3;
  3805. \t\t}
  3807. \t\t.shop-title {
  3808. \t\t\tfont-size: 1.5rem;
  3809. \t\t\tfont-weight: 600;
  3810. \t\t\tcolor: #333;
  3811. \t\t\tmargin-bottom: 8px;
  3812. \t\t}
  3814. \t\t.shop-subtitle {
  3815. \t\t\tcolor: #666;
  3816. \t\t\tfont-size: 0.9rem;
  3817. \t\t\tmargin-bottom: 15px;
  3818. \t\t}
  3820. \t\t.shop-stats-row {
  3821. \t\t\tdisplay: flex;
  3822. \t\t\talign-items: center;
  3823. \t\t\tgap: 20px;
  3824. \t\t\tflex-wrap: wrap;
  3825. \t\t\tmargin-bottom: 15px;
  3826. \t\t}
  3828. \t\t.shop-stat-item {
  3829. \t\t\tdisplay: flex;
  3830. \t\t\talign-items: center;
  3831. \t\t\tgap: 5px;
  3832. \t\t\tfont-size: 0.9rem;
  3833. \t\t}
  3835. \t\t.positive-feedback {
  3836. \t\t\tcolor: #007bff;
  3837. \t\t\tfont-weight: 600;
  3838. \t\t}
  3840. \t\t.items-sold {
  3841. \t\t\tcolor: #666;
  3842. \t\t}
  3844. \t\t.followers-count {
  3845. \t\t\tcolor: #666;
  3846. \t\t}
  3848. \t\t.shop-badges {
  3849. \t\t\tdisplay: flex;
  3850. \t\t\tgap: 10px;
  3851. \t\t\tmargin-bottom: 15px;
  3852. \t\t}
  3854. \t\t.shop-badge {
  3855. \t\t\tbackground: #f0f0f0;
  3856. \t\t\tcolor: #333;
  3857. \t\t\tpadding: 4px 8px;
  3858. \t\t\tborder-radius: 3px;
  3859. \t\t\tfont-size: 0.8rem;
  3860. \t\t\tfont-weight: 500;
  3861. \t\t}
  3863. \t\t.shop-badge.verified {
  3864. \t\t\tbackground: #d4edda;
  3865. \t\t\tcolor: #155724;
  3866. \t\t}
  3868. \t\t.shop-badge.premium {
  3869. \t\t\tbackground: #fff3cd;
  3870. \t\t\tcolor: #856404;
  3871. \t\t}
  3873. \t\t.shop-actions-row {
  3874. \t\t\tdisplay: flex;
  3875. \t\t\talign-items: center;
  3876. \t\t\tgap: 15px;
  3877. \t\t\tflex-wrap: wrap;
  3878. \t\t}
  3880. \t\t.shop-action-btn {
  3881. \t\t\tbackground: #007bff;
  3882. \t\t\tcolor: white;
  3883. \t\t\tborder: none;
  3884. \t\t\tpadding: 8px 16px;
  3885. \t\t\tborder-radius: 3px;
  3886. \t\t\tfont-size: 0.9rem;
  3887. \t\t\tfont-weight: 500;
  3888. \t\t\tcursor: pointer;
  3889. \t\t\ttransition: background-color 0.2s;
  3890. \t\t\ttext-decoration: none;
  3891. \t\t\tdisplay: inline-flex;
  3892. \t\t\talign-items: center;
  3893. \t\t\tgap: 5px;
  3894. \t\t}
  3896. \t\t.shop-action-btn:hover {
  3897. \t\t\tbackground: #0056b3;
  3898. \t\t\tcolor: white;
  3899. \t\t}
  3901. \t\t.shop-action-btn.following {
  3902. \t\t\tbackground: #28a745;
  3903. \t\t}
  3905. \t\t.shop-action-btn.following:hover {
  3906. \t\t\tbackground: #1e7e34;
  3907. \t\t}
  3909. \t\t.shop-action-btn.secondary {
  3910. \t\t\tbackground: #6c757d;
  3911. \t\t}
  3913. \t\t.shop-action-btn.secondary:hover {
  3914. \t\t\tbackground: #545b62;
  3915. \t\t}
  3917. \t\t/* Onglets eBay-style avec classes Karma */
  3918. \t\t.shop-tabs {
  3919. \t\t\tbackground: white;
  3920. \t\t\tborder: 1px solid #e1e1e1;
  3921. \t\t\tborder-top: none;
  3922. \t\t\tborder-radius: 0 0 4px 4px;
  3923. \t\t\tmargin-top: 0;
  3924. \t\t}
  3926. \t\t.shop-tabs-nav {
  3927. \t\t\tdisplay: flex;
  3928. \t\t\tborder-bottom: 1px solid #e1e1e1;
  3929. \t\t\tmargin: 0;
  3930. \t\t\tpadding: 0;
  3931. \t\t\tlist-style: none;
  3932. \t\t\tbackground: #f8f9fa;
  3933. \t\t}
  3935. \t\t.shop-tab {
  3936. \t\t\tmargin: 0;
  3937. \t\t}
  3939. \t\t.shop-tab-link {
  3940. \t\t\tdisplay: block;
  3941. \t\t\tpadding: 12px 20px;
  3942. \t\t\tcolor: #000000;
  3943. \t\t\ttext-decoration: none;
  3944. \t\t\tborder-bottom: 2px solid transparent;
  3945. \t\t\ttransition: all 0.2s;
  3946. \t\t\tfont-weight: 500;
  3947. \t\t\tfont-size: 1rem;
  3948. \t\t}
  3950. \t\t.shop-tab-link:hover,
  3951. \t\t.shop-tab-link.active {
  3952. \t\t\tcolor: #095ad3;
  3953. \t\t\tborder-bottom-color: #095ad3;
  3954. \t\t\tbackground: #ffa200;
  3955. \t\t}
  3957. \t\t.shop-tab-content {
  3958. \t\t\tpadding: 30px;
  3959. \t\t\tmin-height: 400px;
  3960. \t\t}
  3962. \t\t.shop-tab-content:not(.active) {
  3963. \t\t\tdisplay: none;
  3964. \t\t}
  3966. \t\t.shop-tab-content.active {
  3967. \t\t\tdisplay: block;
  3968. \t\t}
  3970. \t\t/* Cards d'information avec style Karma */
  3971. \t\t.shop-info-card {
  3972. \t\t\tbackground: #f8f9fa;
  3973. \t\t\tborder: 1px solid #e1e1e1;
  3974. \t\t\tborder-radius: 4px;
  3975. \t\t\tpadding: 20px;
  3976. \t\t\tmargin-bottom: 20px;
  3977. \t\t}
  3979. \t\t.shop-info-card h6 {
  3980. \t\t\tcolor: #333;
  3981. \t\t\tfont-weight: 600;
  3982. \t\t\tmargin-bottom: 15px;
  3983. \t\t\tfont-size: 1.1rem;
  3984. \t\t}
  3986. \t\t.shop-info-card p {
  3987. \t\t\tcolor: #666;
  3988. \t\t\tfont-size: 0.9rem;
  3989. \t\t\tmargin: 0;
  3990. \t\t\tline-height: 1.5;
  3991. \t\t}
  3993. \t\t.shop-contact-info {
  3994. \t\t\tdisplay: flex;
  3995. \t\t\tflex-direction: column;
  3996. \t\t\tgap: 10px;
  3997. \t\t}
  3999. \t\t.shop-contact-item {
  4000. \t\t\tdisplay: flex;
  4001. \t\t\talign-items: center;
  4002. \t\t\tgap: 10px;
  4003. \t\t\tfont-size: 0.9rem;
  4004. \t\t\tcolor: #666;
  4005. \t\t\tpadding: 5px 0;
  4006. \t\t}
  4008. \t\t.shop-contact-item i {
  4009. \t\t\twidth: 16px;
  4010. \t\t\tcolor: #007bff;
  4011. \t\t\ttext-align: center;
  4012. \t\t}
  4014. \t\t.shop-social-links {
  4015. \t\t\tdisplay: flex;
  4016. \t\t\tgap: 10px;
  4017. \t\t\tmargin-top: 15px;
  4018. \t\t\tflex-wrap: wrap;
  4019. \t\t}
  4021. \t\t.shop-social-link {
  4022. \t\t\tdisplay: inline-flex;
  4023. \t\t\talign-items: center;
  4024. \t\t\tjustify-content: center;
  4025. \t\t\twidth: 36px;
  4026. \t\t\theight: 36px;
  4027. \t\t\tbackground: #f0f0f0;
  4028. \t\t\tcolor: #666;
  4029. \t\t\tborder-radius: 4px;
  4030. \t\t\ttext-decoration: none;
  4031. \t\t\ttransition: all 0.2s;
  4032. \t\t\tfont-size: 1.1rem;
  4033. \t\t}
  4035. \t\t.shop-social-link:hover {
  4036. \t\t\tbackground: #007bff;
  4037. \t\t\tcolor: white;
  4038. \t\t\ttransform: translateY(-2px);
  4039. \t\t}
  4041. \t\t/* Produits avec style Karma */
  4042. \t\t.product-card {
  4043. \t\t\tbackground: white;
  4044. \t\t\tborder: 1px solid #e1e1e1;
  4045. \t\t\tborder-radius: 4px;
  4046. \t\t\toverflow: hidden;
  4047. \t\t\ttransition: all 0.3s ease;
  4048. \t\t\tmargin-bottom: 20px;
  4049. \t\t}
  4051. \t\t.product-card:hover {
  4052. \t\t\ttransform: translateY(-2px);
  4053. \t\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  4054. \t\t}
  4056. \t\t/* Animation de tri des produits */
  4057. \t\t.product-item {
  4058. \t\t\ttransition: all 0.3s ease;
  4059. \t\t}
  4061. \t\t.product-item.sorting {
  4062. \t\t\topacity: 0;
  4063. \t\t\ttransform: translateY(20px);
  4064. \t\t}
  4066. \t\t.product-item.sorted {
  4067. \t\t\topacity: 1;
  4068. \t\t\ttransform: translateY(0);
  4069. \t\t}
  4071. \t\t.product-image {
  4072. \t\t\theight: 200px;
  4073. \t\t\tbackground-size: cover;
  4074. \t\t\tbackground-position: center;
  4075. \t\t\tposition: relative;
  4076. \t\t\toverflow: hidden;
  4077. \t\t}
  4079. \t\t.product-info {
  4080. \t\t\tpadding: 15px;
  4081. \t\t}
  4083. \t\t.product-title {
  4084. \t\t\tfont-size: 1rem;
  4085. \t\t\tfont-weight: 600;
  4086. \t\t\tmargin-bottom: 8px;
  4087. \t\t\tcolor: #333;
  4088. \t\t\tline-height: 1.3;
  4089. \t\t}
  4091. \t\t.product-title a {
  4092. \t\t\tcolor: #333;
  4093. \t\t\ttext-decoration: none;
  4094. \t\t}
  4096. \t\t.product-title a:hover {
  4097. \t\t\tcolor: #007bff;
  4098. \t\t}
  4100. \t\t.product-price {
  4101. \t\t\tfont-size: 1.2rem;
  4102. \t\t\tfont-weight: bold;
  4103. \t\t\tcolor: #ff6b35;
  4104. \t\t\tmargin-bottom: 10px;
  4105. \t\t}
  4107. \t\t.product-meta {
  4108. \t\t\tdisplay: flex;
  4109. \t\t\tjustify-content: space-between;
  4110. \t\t\talign-items: center;
  4111. \t\t\tfont-size: 0.85rem;
  4112. \t\t\tcolor: #666;
  4113. \t\t}
  4115. \t\t.rating {
  4116. \t\t\tcolor: #ffc107;
  4117. \t\t}
  4119. \t\t/* Responsive avec classes Karma */
  4120. \t\t/* Responsive amélioré pour la page shop */
  4121. \t\t@media(max-width: 991.98px) {
  4122. \t\t\t.shop-carousel-ebay {
  4123. \t\t\t\tmargin: 0 10px;
  4124. \t\t\t\theight: 300px;
  4125. \t\t\t}
  4126. \t\t\t
  4127. \t\t\t.shop-header-content {
  4128. \t\t\t\tpadding: 15px;
  4129. \t\t\t\tmargin: 0 10px 20px;
  4130. \t\t\t}
  4131. \t\t\t
  4132. \t\t\t.shop-header-content .row {
  4133. \t\t\t\tflex-wrap: wrap;
  4134. \t\t\t}
  4135. \t\t\t
  4136. \t\t\t.shop-info-ebay {
  4137. \t\t\t\tmargin-top: 15px;
  4138. \t\t\t}
  4139. \t\t}
  4140. \t\t
  4141. \t\t@media(max-width: 768px) {
  4142. \t\t\t.shop-banner,
  4143. \t\t\t.shop-carousel-ebay {
  4144. \t\t\t\theight: 250px;
  4145. \t\t\t\tmargin: 0;
  4146. \t\t\t\tborder-radius: 0;
  4147. \t\t\t}
  4148. \t\t\t
  4149. \t\t\t.shop-carousel-ebay .carousel-container {
  4150. \t\t\t\tborder-radius: 0;
  4151. \t\t\t}
  4153. \t\t\t.carousel-controls-ebay {
  4154. \t\t\t\tpadding: 0 10px;
  4155. \t\t\t\tbottom: 15px;
  4156. \t\t\t}
  4158. \t\t\t.carousel-btn-ebay {
  4159. \t\t\t\twidth: 35px;
  4160. \t\t\t\theight: 35px;
  4161. \t\t\t\tfont-size: 14px;
  4162. \t\t\t}
  4164. \t\t\t.carousel-indicators-ebay {
  4165. \t\t\t\tbottom: 10px;
  4166. \t\t\t\tgap: 6px;
  4167. \t\t\t}
  4168. \t\t\t
  4169. \t\t\t.carousel-indicator-ebay {
  4170. \t\t\t\twidth: 10px;
  4171. \t\t\t\theight: 10px;
  4172. \t\t\t}
  4174. \t\t\t.shop-header-content {
  4175. \t\t\t\tpadding: 15px;
  4176. \t\t\t\tmargin: 0;
  4177. \t\t\t}
  4178. \t\t\t
  4179. \t\t\t.shop-header-content .container {
  4180. \t\t\t\tpadding-left: 15px;
  4181. \t\t\t\tpadding-right: 15px;
  4182. \t\t\t}
  4184. \t\t\t.shop-avatar {
  4185. \t\t\t\twidth: 60px;
  4186. \t\t\t\theight: 60px;
  4187. \t\t\t}
  4189. \t\t\t.shop-title {
  4190. \t\t\t\tfont-size: 1.2rem;
  4191. \t\t\t}
  4193. \t\t\t.shop-actions-row {
  4194. \t\t\t\tflex-direction: column;
  4195. \t\t\t\tgap: 10px;
  4196. \t\t\t}
  4198. \t\t\t/* Styles eBay-style responsive */
  4199. \t\t\t.shop-header-content .row {
  4200. \t\t\t\tflex-direction: column;
  4201. \t\t\t\ttext-align: center;
  4202. \t\t\t}
  4204. \t\t\t.shop-avatar-container-ebay {
  4205. \t\t\t\tmargin-right: 0;
  4206. \t\t\t\tmargin-bottom: 15px;
  4207. \t\t\t\talign-self: center;
  4208. \t\t\t}
  4210. \t\t\t.shop-avatar-ebay {
  4211. \t\t\t\twidth: 80px;
  4212. \t\t\t\theight: 80px;
  4213. \t\t\t}
  4215. \t\t\t.shop-name-ebay {
  4216. \t\t\t\tfont-size: 1.5rem;
  4217. \t\t\t\tmargin-right: 0;
  4218. \t\t\t\tmargin-bottom: 10px;
  4219. \t\t\t}
  4221. \t\t\t.stat-row {
  4222. \t\t\t\tjustify-content: center;
  4223. \t\t\t\tgap: 15px;
  4224. \t\t\t\tflex-wrap: wrap;
  4225. \t\t\t}
  4226. \t\t\t
  4227. \t\t\t.stat-item-ebay {
  4228. \t\t\t\tfont-size: 0.9rem;
  4229. \t\t\t\tmin-width: 100px;
  4230. \t\t\t}
  4232. \t\t\t.shop-additional-info {
  4233. \t\t\t\tjustify-content: center;
  4234. \t\t\t\tflex-wrap: wrap;
  4235. \t\t\t}
  4237. \t\t\t.shop-actions-ebay {
  4238. \t\t\t\tflex-direction: column;
  4239. \t\t\t\tjustify-content: center;
  4240. \t\t\t\tmin-width: auto;
  4241. \t\t\t\tmargin-top: 15px;
  4242. \t\t\t\twidth: 100%;
  4243. \t\t\t}
  4245. \t\t\t.btn-ebay {
  4246. \t\t\t\twidth: 100%;
  4247. \t\t\t\tmin-width: auto;
  4248. \t\t\t\tmargin-bottom: 10px;
  4249. \t\t\t}
  4251. \t\t\t.btn-shop,
  4252. \t\t\t.shop-action-btn {
  4253. \t\t\t\twidth: 100%;
  4254. \t\t\t\tmin-width: auto;
  4255. \t\t\t\theight: 45px;
  4256. \t\t\t\tfont-size: 0.9rem;
  4257. \t\t\t\tpadding: 12px 20px;
  4258. \t\t\t}
  4260. \t\t\t.shop-tabs-nav {
  4261. \t\t\t\tflex-wrap: wrap;
  4262. \t\t\t\tjustify-content: center;
  4263. \t\t\t}
  4264. \t\t\t
  4265. \t\t\t.shop-tab-link {
  4266. \t\t\t\tfont-size: 0.85rem;
  4267. \t\t\t\tpadding: 0.5rem 0.75rem;
  4268. \t\t\t\tflex: 1;
  4269. \t\t\t\tmin-width: auto;
  4270. \t\t\t}
  4271. \t\t\t
  4272. \t\t\t/* Produits responsive */
  4273. \t\t\t#products-container .product-item {
  4274. \t\t\t\tmargin-bottom: 20px;
  4275. \t\t\t}
  4276. \t\t\t
  4277. \t\t\t.product-card {
  4278. \t\t\t\tpadding: 15px;
  4279. \t\t\t}
  4280. \t\t\t
  4281. \t\t\t.product-title {
  4282. \t\t\t\tfont-size: 0.95rem;
  4283. \t\t\t}
  4284. \t\t\t
  4285. \t\t\t.product-price {
  4286. \t\t\t\tfont-size: 1.1rem;
  4287. \t\t\t}
  4288. \t\t\t
  4289. \t\t\t/* Détails de la boutique responsive */
  4290. \t\t\t.shop-info-ebay {
  4291. \t\t\t\ttext-align: center;
  4292. \t\t\t}
  4293. \t\t}
  4294. \t\t
  4295. \t\t@media(max-width: 575.98px) {
  4296. \t\t\t.shop-banner,
  4297. \t\t\t.shop-carousel-ebay {
  4298. \t\t\t\theight: 200px;
  4299. \t\t\t\tmargin: 0;
  4300. \t\t\t}
  4301. \t\t\t
  4302. \t\t\t.shop-header-content {
  4303. \t\t\t\tmargin: 0;
  4304. \t\t\t\tpadding: 15px;
  4305. \t\t\t}
  4306. \t\t\t
  4307. \t\t\t.shop-name-ebay {
  4308. \t\t\t\tfont-size: 1.3rem;
  4309. \t\t\t}
  4310. \t\t\t
  4311. \t\t\t.stat-row {
  4312. \t\t\t\tgap: 10px;
  4313. \t\t\t\tflex-direction: column;
  4314. \t\t\t}
  4315. \t\t\t
  4316. \t\t\t.stat-item-ebay {
  4317. \t\t\t\tfont-size: 0.85rem;
  4318. \t\t\t\twidth: 100%;
  4319. \t\t\t}
  4320. \t\t\t
  4321. \t\t\t.carousel-btn-ebay {
  4322. \t\t\t\twidth: 25px;
  4323. \t\t\t\theight: 25px;
  4324. \t\t\t\tfont-size: 10px;
  4325. \t\t\t}
  4326. \t\t\t
  4327. \t\t\t.carousel-indicators-ebay {
  4328. \t\t\t\tbottom: 8px;
  4329. \t\t\t}
  4330. \t\t\t
  4331. \t\t\t.carousel-indicator-ebay {
  4332. \t\t\t\twidth: 6px;
  4333. \t\t\t\theight: 6px;
  4334. \t\t\t}
  4335. \t\t\t
  4336. \t\t\t.shop-tab-content {
  4337. \t\t\t\tpadding: 15px 10px;
  4338. \t\t\t}
  4340. \t\t\t.shop-stats-row {
  4341. \t\t\t\tflex-direction: column;
  4342. \t\t\t\tgap: 10px;
  4343. \t\t\t\talign-items: flex-start;
  4344. \t\t\t}
  4345. \t\t}
  4347. \t\t.follow-button {
  4348. \t\t\tbackground: #ffa200;
  4349. \t\t\tborder: none;
  4350. \t\t\tcolor: white;
  4351. \t\t\tpadding: 12px 30px;
  4352. \t\t\tborder-radius: 25px;
  4353. \t\t\tfont-weight: 600;
  4354. \t\t\ttransition: all 0.3s ease;
  4355. \t\t\tcursor: pointer;
  4356. \t\t\tdisplay: inline-flex;
  4357. \t\t\talign-items: center;
  4358. \t\t\tgap: 8px;
  4359. \t\t}
  4361. \t\t.follow-button:hover {
  4362. \t\t\tbackground: #e8910a;
  4363. \t\t\ttransform: translateY(-2px);
  4364. \t\t\tbox-shadow: 0 5px 15px rgba(255, 162, 0, 0.3);
  4365. \t\t}
  4367. \t\t.follow-button.following {
  4368. \t\t\tbackground: #28a745;
  4369. \t\t}
  4371. \t\t.follow-button.following:hover {
  4372. \t\t\tbackground: #218838;
  4373. \t\t}
  4375. \t\t.follow-button:disabled {
  4376. \t\t\topacity: 0.6;
  4377. \t\t\tcursor: not-allowed;
  4378. \t\t\ttransform: none;
  4379. \t\t}
  4381. \t\t.follow-stats {
  4382. \t\t\tdisplay: flex;
  4383. \t\t\tgap: 30px;
  4384. \t\t\tmargin-top: 20px;
  4385. \t\t\tflex-wrap: wrap;
  4386. \t\t}
  4388. \t\t.follow-stat {
  4389. \t\t\ttext-align: center;
  4390. \t\t\tpadding: 15px;
  4391. \t\t\tbackground: #f8f9fa;
  4392. \t\t\tborder-radius: 10px;
  4393. \t\t\tmin-width: 120px;
  4394. \t\t}
  4396. \t\t.follow-stat-number {
  4397. \t\t\tfont-size: 1.8rem;
  4398. \t\t\tfont-weight: bold;
  4399. \t\t\tcolor: #ffa200;
  4400. \t\t\tdisplay: block;
  4401. \t\t}
  4403. \t\t.follow-stat-label {
  4404. \t\t\tcolor: #666;
  4405. \t\t\tfont-size: 0.9rem;
  4406. \t\t\ttext-transform: uppercase;
  4407. \t\t\tletter-spacing: 0.5px;
  4408. \t\t}
  4410. \t\t.shop-actions {
  4411. \t\t\tdisplay: flex;
  4412. \t\t\tgap: 15px;
  4413. \t\t\talign-items: center;
  4414. \t\t\tflex-wrap: wrap;
  4415. \t\t\tmargin-top: 20px;
  4416. \t\t}
  4418. \t\t.action-button {
  4419. \t\t\tbackground: white;
  4420. \t\t\tborder: 2px solid #ffa200;
  4421. \t\t\tcolor: #ffa200;
  4422. \t\t\tpadding: 10px 20px;
  4423. \t\t\tborder-radius: 20px;
  4424. \t\t\ttext-decoration: none;
  4425. \t\t\tfont-weight: 500;
  4426. \t\t\ttransition: all 0.3s ease;
  4427. \t\t\tdisplay: inline-flex;
  4428. \t\t\talign-items: center;
  4429. \t\t\tgap: 8px;
  4430. \t\t}
  4432. \t\t.action-button:hover {
  4433. \t\t\tbackground: #ffa200;
  4434. \t\t\tcolor: white;
  4435. \t\t\ttransform: translateY(-2px);
  4436. \t\t\tbox-shadow: 0 5px 15px rgba(255, 162, 0, 0.3);
  4437. \t\t}
  4439. \t\t.positive-feedback {
  4440. \t\t\tcolor: #28a745;
  4441. \t\t\tfont-weight: bold;
  4442. \t\t}
  4444. \t\t.items-sold {
  4445. \t\t\tcolor: #666;
  4446. \t\t\tfont-size: 0.9rem;
  4447. \t\t}
  4449. \t\t.followers-count {
  4450. \t\t\tcolor: #666;
  4451. \t\t\tfont-size: 0.9rem;
  4452. \t\t}
  4454. \t\t.shop-avatar {
  4455. \t\t\twidth: 120px;
  4456. \t\t\theight: 120px;
  4457. \t\t\tborder-radius: 50%;
  4458. \t\t\tborder: 4px solid white;
  4459. \t\t\tobject-fit: cover;
  4460. \t\t\tmargin-bottom: 20px;
  4461. \t\t}
  4463. \t\t.shop-stats {
  4464. \t\t\tbackground: white;
  4465. \t\t\tborder-radius: 10px;
  4466. \t\t\tpadding: 30px;
  4467. \t\t\tbox-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  4468. \t\t\tmargin-top: -50px;
  4469. \t\t\tposition: relative;
  4470. \t\t\tz-index: 10;
  4471. \t\t}
  4473. \t\t.stat-item {
  4474. \t\t\ttext-align: center;
  4475. \t\t\tpadding: 20px;
  4476. \t\t}
  4478. \t\t.stat-number {
  4479. \t\t\tfont-size: 2.5rem;
  4480. \t\t\tfont-weight: bold;
  4481. \t\t\tcolor: #ffa200;
  4482. \t\t\tdisplay: block;
  4483. \t\t}
  4485. \t\t.stat-label {
  4486. \t\t\tcolor: #666;
  4487. \t\t\tfont-size: 0.9rem;
  4488. \t\t\ttext-transform: uppercase;
  4489. \t\t\tletter-spacing: 1px;
  4490. \t\t}
  4492. \t\t.shop-description {
  4493. \t\t\tbackground: #f8f9fa;
  4494. \t\t\tpadding: 30px;
  4495. \t\t\tborder-radius: 10px;
  4496. \t\t\tmargin-bottom: 40px;
  4497. \t\t}
  4499. \t\t.shop-contact {
  4500. \t\t\tbackground: white;
  4501. \t\t\tborder: 1px solid #e9ecef;
  4502. \t\t\tborder-radius: 10px;
  4503. \t\t\tpadding: 25px;
  4504. \t\t\tmargin-bottom: 40px;
  4505. \t\t}
  4507. \t\t.contact-item {
  4508. \t\t\tdisplay: flex;
  4509. \t\t\talign-items: center;
  4510. \t\t\tmargin-bottom: 15px;
  4511. \t\t}
  4513. \t\t.contact-item i {
  4514. \t\t\tcolor: #ffa200;
  4515. \t\t\tmargin-right: 15px;
  4516. \t\t\twidth: 20px;
  4517. \t\t}
  4519. \t\t.product-card {
  4520. \t\t\tbackground: white;
  4521. \t\t\tborder-radius: 10px;
  4522. \t\t\toverflow: hidden;
  4523. \t\t\tbox-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
  4524. \t\t\ttransition: transform 0.3s ease, box-shadow 0.3s ease;
  4525. \t\t\tmargin-bottom: 30px;
  4526. \t\t}
  4528. \t\t.product-card:hover {
  4529. \t\t\ttransform: translateY(-5px);
  4530. \t\t\tbox-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  4531. \t\t}
  4533. \t\t.product-image {
  4534. \t\t\theight: 200px;
  4535. \t\t\tbackground-size: cover;
  4536. \t\t\tbackground-position: center;
  4537. \t\t\tposition: relative;
  4538. \t\t}
  4540. \t\t.product-info {
  4541. \t\t\tpadding: 20px;
  4542. \t\t}
  4544. \t\t.product-title {
  4545. \t\t\tfont-size: 1.1rem;
  4546. \t\t\tfont-weight: 600;
  4547. \t\t\tmargin-bottom: 10px;
  4548. \t\t\tcolor: #333;
  4549. \t\t}
  4551. \t\t.product-price {
  4552. \t\t\tfont-size: 1.3rem;
  4553. \t\t\tfont-weight: bold;
  4554. \t\t\tcolor: #ffa200;
  4555. \t\t\tmargin-bottom: 15px;
  4556. \t\t}
  4558. \t\t.product-meta {
  4559. \t\t\tdisplay: flex;
  4560. \t\t\tjustify-content: space-between;
  4561. \t\t\talign-items: center;
  4562. \t\t\tfont-size: 0.9rem;
  4563. \t\t\tcolor: #666;
  4564. \t\t}
  4566. \t\t.rating {
  4567. \t\t\tcolor: #ffa200;
  4568. \t\t}
  4570. \t\t/* Boutons d'action uniformes */
  4571. \t\t.btn-shop,
  4572. \t\t.shop-action-btn {
  4573. \t\t\tbackground: #ffa200;
  4574. \t\t\tborder: 1px solid #ffa200;
  4575. \t\t\tcolor: white;
  4576. \t\t\tpadding: 12px 24px;
  4577. \t\t\tborder-radius: 6px;
  4578. \t\t\tfont-weight: 500;
  4579. \t\t\tfont-size: 0.9rem;
  4580. \t\t\ttransition: all 0.3s ease;
  4581. \t\t\ttext-decoration: none;
  4582. \t\t\tdisplay: inline-flex;
  4583. \t\t\talign-items: center;
  4584. \t\t\tjustify-content: center;
  4585. \t\t\tgap: 8px;
  4586. \t\t\tmin-width: 120px;
  4587. \t\t\theight: 44px;
  4588. \t\t\twhite-space: nowrap;
  4589. \t\t}
  4591. \t\t.btn-shop:hover,
  4592. \t\t.shop-action-btn:hover {
  4593. \t\t\tbackground: #e8910a;
  4594. \t\t\tborder-color: #e8910a;
  4595. \t\t\tcolor: white;
  4596. \t\t\ttransform: translateY(-1px);
  4597. \t\t\tbox-shadow: 0 4px 12px rgba(255, 162, 0, 0.3);
  4598. \t\t}
  4600. \t\t/* Boutons secondaires */
  4601. \t\t.shop-action-btn.secondary {
  4602. \t\t\tbackground: transparent;
  4603. \t\t\tborder: 1px solid #6c757d;
  4604. \t\t\tcolor: #6c757d;
  4605. \t\t}
  4607. \t\t.shop-action-btn.secondary:hover {
  4608. \t\t\tbackground: #6c757d;
  4609. \t\t\tborder-color: #6c757d;
  4610. \t\t\tcolor: white;
  4611. \t\t\ttransform: translateY(-1px);
  4612. \t\t\tbox-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
  4613. \t\t}
  4615. \t\t/* Responsive */
  4616. \t\t@media(max-width: 768px) {
  4617. \t\t\t.shop-header {
  4618. \t\t\t\tpadding: 100px 0 40px;
  4619. \t\t\t}
  4621. \t\t\t.shop-avatar {
  4622. \t\t\t\twidth: 80px;
  4623. \t\t\t\theight: 80px;
  4624. \t\t\t}
  4626. \t\t\t.shop-stats {
  4627. \t\t\t\tmargin-top: -30px;
  4628. \t\t\t\tpadding: 20px;
  4629. \t\t\t}
  4631. \t\t\t.stat-number {
  4632. \t\t\t\tfont-size: 2rem;
  4633. \t\t\t}
  4634. \t\t}
  4636. \t\t/* Très petits écrans */
  4637. \t\t@media(max-width: 480px) {
  4638. \t\t\t.btn-shop,
  4639. \t\t\t.shop-action-btn {
  4640. \t\t\t\tmin-width: 90px;
  4641. \t\t\t\theight: 38px;
  4642. \t\t\t\tfont-size: 0.8rem;
  4643. \t\t\t\tpadding: 8px 16px;
  4644. \t\t\t}
  4646. \t\t\t.shop-actions-row {
  4647. \t\t\t\tgap: 8px;
  4648. \t\t\t}
  4649. \t\t}
  4651. \t\t/* Styles pour la section des avis */
  4652. \t\t.review-stats-card {
  4653. \t\t\tbackground: white;
  4654. \t\t\tborder-radius: 10px;
  4655. \t\t\tpadding: 20px;
  4656. \t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  4657. \t\t\tmargin-bottom: 20px;
  4658. \t\t}
  4660. \t\t.stats-header {
  4661. \t\t\tdisplay: flex;
  4662. \t\t\talign-items: center;
  4663. \t\t\tmargin-bottom: 20px;
  4664. \t\t}
  4666. \t\t.overall-rating {
  4667. \t\t\ttext-align: center;
  4668. \t\t\tmargin-right: 20px;
  4669. \t\t}
  4671. \t\t.rating-number {
  4672. \t\t\tfont-size: 36px;
  4673. \t\t\tfont-weight: bold;
  4674. \t\t\tcolor: #333;
  4675. \t\t\tdisplay: block;
  4676. \t\t}
  4678. \t\t.stars {
  4679. \t\t\tcolor: #ffc107;
  4680. \t\t\tfont-size: 18px;
  4681. \t\t\tmargin-top: 5px;
  4682. \t\t}
  4684. \t\t.rating-summary p {
  4685. \t\t\tmargin: 0;
  4686. \t\t\tcolor: #666;
  4687. \t\t}
  4689. \t\t.rating-breakdown {
  4690. \t\t\tmargin-top: 15px;
  4691. \t\t}
  4693. \t\t.rating-bar {
  4694. \t\t\tdisplay: flex;
  4695. \t\t\talign-items: center;
  4696. \t\t\tmargin-bottom: 8px;
  4697. \t\t}
  4699. \t\t.rating-label {
  4700. \t\t\twidth: 40px;
  4701. \t\t\tfont-size: 14px;
  4702. \t\t\tcolor: #666;
  4703. \t\t}
  4705. \t\t.rating-progress {
  4706. \t\t\tflex: 1;
  4707. \t\t\theight: 6px;
  4708. \t\t\tbackground: #e9ecef;
  4709. \t\t\tborder-radius: 3px;
  4710. \t\t\tmargin: 0 10px;
  4711. \t\t\toverflow: hidden;
  4712. \t\t}
  4714. \t\t.rating-fill {
  4715. \t\t\theight: 100%;
  4716. \t\t\tbackground: linear-gradient(45deg, #ffc107, #ff8c00);
  4717. \t\t\ttransition: width 0.3s ease;
  4718. \t\t}
  4720. \t\t.rating-count {
  4721. \t\t\twidth: 30px;
  4722. \t\t\ttext-align: right;
  4723. \t\t\tfont-size: 14px;
  4724. \t\t\tcolor: #666;
  4725. \t\t}
  4727. \t\t.reviews-preview {
  4728. \t\t\tbackground: white;
  4729. \t\t\tborder-radius: 10px;
  4730. \t\t\tpadding: 20px;
  4731. \t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  4732. \t\t}
  4734. \t\t.review-card-preview {
  4735. \t\t\tborder-bottom: 1px solid #f0f0f0;
  4736. \t\t\tpadding-bottom: 15px;
  4737. \t\t\tmargin-bottom: 15px;
  4738. \t\t}
  4740. \t\t.review-card-preview:last-child {
  4741. \t\t\tborder-bottom: none;
  4742. \t\t\tmargin-bottom: 0;
  4743. \t\t}
  4745. \t\t.review-header {
  4746. \t\t\tdisplay: flex;
  4747. \t\t\tjustify-content: space-between;
  4748. \t\t\talign-items: center;
  4749. \t\t\tmargin-bottom: 10px;
  4750. \t\t}
  4752. \t\t.review-user {
  4753. \t\t\tdisplay: flex;
  4754. \t\t\talign-items: center;
  4755. \t\t}
  4757. \t\t.user-avatar {
  4758. \t\t\twidth: 35px;
  4759. \t\t\theight: 35px;
  4760. \t\t\tborder-radius: 50%;
  4761. \t\t\tbackground: linear-gradient(45deg, #667eea, #764ba2);
  4762. \t\t\tdisplay: flex;
  4763. \t\t\talign-items: center;
  4764. \t\t\tjustify-content: center;
  4765. \t\t\tcolor: white;
  4766. \t\t\tfont-weight: bold;
  4767. \t\t\tmargin-right: 10px;
  4768. \t\t}
  4770. \t\t.user-info h6 {
  4771. \t\t\tmargin: 0;
  4772. \t\t\tfont-size: 14px;
  4773. \t\t\tfont-weight: 600;
  4774. \t\t\tcolor: #333;
  4775. \t\t}
  4777. \t\t.user-info small {
  4778. \t\t\tcolor: #666;
  4779. \t\t\tfont-size: 12px;
  4780. \t\t}
  4782. \t\t.review-rating {
  4783. \t\t\tdisplay: flex;
  4784. \t\t\talign-items: center;
  4785. \t\t\tgap: 5px;
  4786. \t\t}
  4788. \t\t.verified-badge {
  4789. \t\t\tbackground: #28a745;
  4790. \t\t\tcolor: white;
  4791. \t\t\tpadding: 2px 4px;
  4792. \t\t\tborder-radius: 3px;
  4793. \t\t\tfont-size: 10px;
  4794. \t\t\tfont-weight: bold;
  4795. \t\t}
  4797. \t\t.review-content {
  4798. \t\t\tcolor: #666;
  4799. \t\t\tfont-size: 14px;
  4800. \t\t\tline-height: 1.5;
  4801. \t\t}
  4803. \t\t.empty-reviews {
  4804. \t\t\ttext-align: center;
  4805. \t\t\tpadding: 40px 20px;
  4806. \t\t\tcolor: #666;
  4807. \t\t}
  4809. \t\t.empty-reviews i {
  4810. \t\t\tfont-size: 48px;
  4811. \t\t\tcolor: #ddd;
  4812. \t\t\tmargin-bottom: 15px;
  4813. \t\t}
  4815. \t\t.empty-reviews h4 {
  4816. \t\t\tcolor: #333;
  4817. \t\t\tmargin-bottom: 10px;
  4818. \t\t}
  4820. \t\t.section-title h2 {
  4821. \t\t\tcolor: #333;
  4822. \t\t\tmargin-bottom: 10px;
  4823. \t\t}
  4825. \t\t.section-title p {
  4826. \t\t\tcolor: #666;
  4827. \t\t\tmargin-bottom: 30px;
  4828. \t\t}
  4830. \t\t@media(max-width: 768px) {
  4831. \t\t\t.stats-header {
  4832. \t\t\t\tflex-direction: column;
  4833. \t\t\t\ttext-align: center;
  4834. \t\t\t}
  4836. \t\t\t.overall-rating {
  4837. \t\t\t\tmargin-right: 0;
  4838. \t\t\t\tmargin-bottom: 15px;
  4839. \t\t\t}
  4841. \t\t\t.review-header {
  4842. \t\t\t\tflex-direction: column;
  4843. \t\t\t\talign-items: flex-start;
  4844. \t\t\t}
  4846. \t\t\t.review-rating {
  4847. \t\t\t\tmargin-top: 5px;
  4848. \t\t\t}
  4849. \t\t}
  4850. \t</style>
  4851. {% endblock %}
  4853. {% block body %}
  4855. \t<!-- Shop Header eBay-style avec Karma - Pleine largeur -->
  4856. \t<section
  4857. \t\tclass=\"shop-header\">
  4858. \t\t<!-- Carrousel eBay-style -->
  4859. \t\t<div class=\"shop-carousel-ebay\">
  4860. \t\t\t<div class=\"carousel-container\">
  4861. \t\t\t\t{% set allBannerImages = shop.getAllBannerImages() %}
  4862. \t\t\t\t{% if allBannerImages|length > 0 %}
  4863. \t\t\t\t\t{% for image in allBannerImages %}
  4864. \t\t\t\t\t\t<div class=\"carousel-slide {% if loop.first %}active{% endif %}\" style=\"background-image: url('{{ asset(image) }}')\">
  4865. \t\t\t\t\t\t\t<div class=\"shop-banner-overlay\"></div>
  4866. \t\t\t\t\t\t</div>
  4867. \t\t\t\t\t{% endfor %}
  4868. \t\t\t\t{% else %}
  4869. \t\t\t\t\t<!-- Slide par défaut avec dégradé si aucune image de bannière -->
  4870. \t\t\t\t\t<div class=\"carousel-slide active\" style=\"background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);\">
  4871. \t\t\t\t\t\t<div class=\"shop-banner-overlay\"></div>
  4872. \t\t\t\t\t</div>
  4873. \t\t\t\t{% endif %}
  4874. \t\t\t</div>
  4876. \t\t\t<!-- Contrôles eBay-style intégrés - uniquement si plusieurs images de bannière -->
  4877. \t\t\t{% set totalBannerImages = allBannerImages|length %}
  4878. \t\t\t{% if totalBannerImages > 1 %}
  4879. \t\t\t\t<div class=\"carousel-controls-ebay\">
  4880. \t\t\t\t\t<button class=\"carousel-btn-ebay prev-btn\" onclick=\"previousSlide()\" id=\"prevBtn\">
  4881. \t\t\t\t\t\t<i class=\"lnr lnr-chevron-left\"></i>
  4882. \t\t\t\t\t</button>
  4883. \t\t\t\t\t<button class=\"carousel-btn-ebay pause-btn\" onclick=\"toggleCarousel()\" id=\"pauseBtn\">
  4884. \t\t\t\t\t\t<i class=\"lnr lnr-pause\" id=\"pauseIcon\"></i>
  4885. \t\t\t\t\t</button>
  4886. \t\t\t\t\t<button class=\"carousel-btn-ebay next-btn\" onclick=\"nextSlide()\" id=\"nextBtn\">
  4887. \t\t\t\t\t\t<i class=\"lnr lnr-chevron-right\"></i>
  4888. \t\t\t\t\t</button>
  4889. \t\t\t\t</div>
  4891. \t\t\t\t<!-- Indicateurs eBay-style - uniquement pour les images de bannière -->
  4892. \t\t\t\t<div class=\"carousel-indicators-ebay\">
  4893. \t\t\t\t\t{% for image in allBannerImages %}
  4894. \t\t\t\t\t\t<button class=\"carousel-indicator-ebay {% if loop.first %}active{% endif %}\" onclick=\"goToSlide({{ loop.index0 }})\"></button>
  4895. \t\t\t\t\t{% endfor %}
  4896. \t\t\t\t</div>
  4897. \t\t\t{% endif %}
  4898. \t\t</div>
  4900. \t\t<!-- Contenu de la boutique eBay-style -->
  4901. \t\t<div class=\"shop-header-content\">
  4902. \t\t\t<div
  4903. \t\t\t\tclass=\"row align-items-center\">
  4904. \t\t\t\t<!-- Logo de la boutique -->
  4905. \t\t\t\t<div class=\"col-auto\">
  4906. \t\t\t\t\t<div class=\"shop-avatar-container-ebay\">
  4907. \t\t\t\t\t\t{% if shop.logo %}
  4908. \t\t\t\t\t\t\t<img src=\"{{ asset(shop.logo) }}\" alt=\"{{ shop.name }}\" class=\"shop-avatar-ebay\">
  4909. \t\t\t\t\t\t{% else %}
  4910. \t\t\t\t\t\t\t<div class=\"shop-avatar-ebay\" style=\"background: #f0f0f0; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: #666;\">
  4911. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-store\"></i>
  4912. \t\t\t\t\t\t\t</div>
  4913. \t\t\t\t\t\t{% endif %}
  4914. \t\t\t\t\t\t{% if shop.isVerified %}
  4915. \t\t\t\t\t\t\t<div class=\"verified-badge-ebay\">
  4916. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle\"></i>
  4917. \t\t\t\t\t\t\t</div>
  4918. \t\t\t\t\t\t{% endif %}
  4919. \t\t\t\t\t</div>
  4920. \t\t\t\t</div>
  4922. \t\t\t\t<!-- Informations principales -->
  4923. \t\t\t\t<div class=\"col\">
  4924. \t\t\t\t\t<div
  4925. \t\t\t\t\t\tclass=\"shop-info-ebay\">
  4926. \t\t\t\t\t\t<!-- Nom de la boutique -->
  4927. \t\t\t\t\t\t<div class=\"shop-name-section\">
  4928. \t\t\t\t\t\t\t<h1 class=\"shop-name-ebay\">{{ shop.name }}</h1>
  4929. \t\t\t\t\t\t\t{% if shop.isVerified %}
  4930. \t\t\t\t\t\t\t\t<span class=\"verified-text\">
  4931. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle me-1\"></i>Vendeur vérifié
  4932. \t\t\t\t\t\t\t\t</span>
  4933. \t\t\t\t\t\t\t{% endif %}
  4934. \t\t\t\t\t\t</div>
  4936. \t\t\t\t\t\t<!-- Catégorie -->
  4937. \t\t\t\t\t\t{% if shop.shopCategory %}
  4938. \t\t\t\t\t\t\t<div class=\"shop-category-section\">
  4939. \t\t\t\t\t\t\t\t<span class=\"shop-category-ebay\">{{ shop.shopCategory.name }}</span>
  4940. \t\t\t\t\t\t\t</div>
  4941. \t\t\t\t\t\t{% endif %}
  4943. \t\t\t\t\t\t<!-- Statistiques eBay-style -->
  4944. \t\t\t\t\t\t<div class=\"shop-stats-ebay\">
  4945. \t\t\t\t\t\t\t<div class=\"stat-row\">
  4946. \t\t\t\t\t\t\t\t{% if shop.averageRating > 0 %}
  4947. \t\t\t\t\t\t\t\t\t<div class=\"stat-item-ebay\">
  4948. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-percentage\">{{ shop.averageRating|number_format(1) }}%</span>
  4949. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-label-ebay\">Évaluations positives</span>
  4950. \t\t\t\t\t\t\t\t\t</div>
  4951. \t\t\t\t\t\t\t\t{% endif %}
  4953. \t\t\t\t\t\t\t\t{% if stats.totalProductSales > 0 %}
  4954. \t\t\t\t\t\t\t\t\t<div class=\"stat-item-ebay\">
  4955. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-number-ebay\">{{ stats.totalProductSales|number_format }}</span>
  4956. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-label-ebay\">Articles vendus</span>
  4957. \t\t\t\t\t\t\t\t\t</div>
  4958. \t\t\t\t\t\t\t\t{% endif %}
  4960. \t\t\t\t\t\t\t\t{% if followStats.active_follows > 0 %}
  4961. \t\t\t\t\t\t\t\t\t<div class=\"stat-item-ebay\">
  4962. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-number-ebay\">{{ followStats.active_follows|number_format }}</span>
  4963. \t\t\t\t\t\t\t\t\t\t<span class=\"stat-label-ebay\">Suiveurs</span>
  4964. \t\t\t\t\t\t\t\t\t</div>
  4965. \t\t\t\t\t\t\t\t{% endif %}
  4966. \t\t\t\t\t\t\t</div>
  4968. \t\t\t\t\t\t\t<!-- Informations supplémentaires -->
  4969. \t\t\t\t\t\t\t<div class=\"shop-additional-info\">
  4970. \t\t\t\t\t\t\t\t<div class=\"row\">
  4971. \t\t\t\t\t\t\t\t\t<div class=\"col-12\">
  4972. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 col-sm-6 w-100\">
  4973. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-thumbs-up\"></i>
  4974. \t\t\t\t\t\t\t\t\t\t\t7% positive feedback</span>
  4975. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 col-sm-6 w-100\">
  4976. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-cart\"></i>
  4977. \t\t\t\t\t\t\t\t\t\t\t29 produits vendus</span>
  4978. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 col-sm-6 w-100\">
  4979. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star\"></i>
  4980. \t\t\t\t\t\t\t\t\t\t\t150 followers</span>
  4981. \t\t\t\t\t\t\t\t\t\t<span class=\"member-since col-md-3 w-100\">
  4982. \t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-history\"></i>
  4983. \t\t\t\t\t\t\t\t\t\t\tCréé depuis
  4984. \t\t\t\t\t\t\t\t\t\t\t{{ shop.createdAt|date('M Y') }}</span>
  4985. \t\t\t\t\t\t\t\t\t</div>
  4986. \t\t\t\t\t\t\t\t</div>
  4987. \t\t\t\t\t\t\t</div>
  4988. \t\t\t\t\t\t</div>
  4989. \t\t\t\t\t</div>
  4990. \t\t\t\t</div>
  4992. \t\t\t\t<!-- Actions eBay-style -->
  4993. \t\t\t\t<div class=\"col-auto\">
  4994. \t\t\t\t\t<div class=\"shop-actions-ebay\">
  4995. \t\t\t\t\t\t{% if app.user %}
  4996. \t\t\t\t\t\t\t<button id=\"follow-button\" class=\"btn btn-primary btn-ebay {% if isFollowing %}following{% endif %}\" data-shop-id=\"{{ shop.id }}\" data-following=\"{{ isFollowing ? 'true' : 'false' }}\">
  4997. \t\t\t\t\t\t\t\t<span id=\"follow-text\">
  4998. \t\t\t\t\t\t\t\t\t{% if isFollowing %}
  4999. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle me-1\"></i> Suivi
  5000. \t\t\t\t\t\t\t\t\t{% else %}
  5001. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-plus me-1\"></i> Suivre
  5002. \t\t\t\t\t\t\t\t\t{% endif %}
  5003. \t\t\t\t\t\t\t\t</span>
  5004. \t\t\t\t\t\t\t</button>
  5005. \t\t\t\t\t\t{% else %}
  5006. \t\t\t\t\t\t\t<a href=\"{{ path('ui_app_login') }}\" class=\"btn btn-primary btn-ebay\">
  5007. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-user me-1\"></i> Se connecter pour suivre
  5008. \t\t\t\t\t\t\t</a>
  5009. \t\t\t\t\t\t{% endif %}
  5011. \t\t\t\t\t\t<button class=\"btn btn-outline-secondary btn-ebay\" onclick=\"shareShop()\">
  5012. \t\t\t\t\t\t\t<i class=\"lnr lnr-bubble me-1\"></i> Partager
  5013. \t\t\t\t\t\t</button>
  5015. \t\t\t\t\t\t<button class=\"btn btn-outline-danger btn-ebay\" onclick=\"reportShop()\">
  5016. \t\t\t\t\t\t\t<i class=\"lnr lnr-flag me-1\"></i> Signaler
  5017. \t\t\t\t\t\t</button>
  5019. \t\t\t\t\t\t{% if canEdit %}
  5020. \t\t\t\t\t\t\t<a href=\"{{ path('seller_shop_edit', {slug: shop.slug}) }}\" class=\"btn btn-outline-primary btn-ebay\">
  5021. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-pencil me-1\"></i> Modifier la boutique
  5022. \t\t\t\t\t\t\t</a>
  5023. \t\t\t\t\t\t{% endif %}
  5024. \t\t\t\t\t</div>
  5025. \t\t\t\t</div>
  5026. \t\t\t</div>
  5027. \t\t</div>
  5028. \t</section>
  5030. \t<!-- Shop Tabs eBay-style avec Karma -->
  5031. \t<section class=\"container\">
  5032. \t\t<div class=\"shop-tabs\">
  5033. \t\t\t<ul class=\"nav nav-tabs shop-tabs-nav\" role=\"tablist\">
  5034. \t\t\t\t<li class=\"nav-item shop-tab\">
  5035. \t\t\t\t\t<a href=\"#shop-items\" class=\"nav-link shop-tab-link active\" data-tab=\"items\" role=\"tab\">
  5036. \t\t\t\t\t\tBoutique
  5037. \t\t\t\t\t</a>
  5038. \t\t\t\t</li>
  5039. \t\t\t\t<li class=\"nav-item shop-tab\">
  5040. \t\t\t\t\t<a href=\"#shop-sale\" class=\"nav-link shop-tab-link\" data-tab=\"sale\" role=\"tab\">
  5041. \t\t\t\t\t\tPromotions
  5042. \t\t\t\t\t</a>
  5043. \t\t\t\t</li>
  5044. \t\t\t\t<li class=\"nav-item shop-tab\">
  5045. \t\t\t\t\t<a href=\"#shop-about\" class=\"nav-link shop-tab-link\" data-tab=\"about\" role=\"tab\">
  5046. \t\t\t\t\t\tÀ propos
  5047. \t\t\t\t\t</a>
  5048. \t\t\t\t</li>
  5049. \t\t\t\t<li class=\"nav-item shop-tab\">
  5050. \t\t\t\t\t<a href=\"#shop-feedback\" class=\"nav-link shop-tab-link\" data-tab=\"feedback\" role=\"tab\">
  5051. \t\t\t\t\t\tAvis ({{ shop.getVisibleReviewsCount() }})
  5052. \t\t\t\t\t</a>
  5053. \t\t\t\t</li>
  5054. \t\t\t</ul>
  5056. \t\t\t<!-- Tab Content: Shop Items avec Karma -->
  5057. \t\t\t<div id=\"shop-items\" class=\"tab-content shop-tab-content active\">
  5058. \t\t\t\t<div class=\"row\">
  5059. \t\t\t\t\t<div class=\"col-lg-12\">
  5060. \t\t\t\t\t\t<div class=\"d-flex justify-content-between align-items-center mb-4\">
  5061. \t\t\t\t\t\t\t<h4 class=\"mb-0\">Produits de
  5062. \t\t\t\t\t\t\t\t{{ shop.name }}</h4>
  5063. \t\t\t\t\t\t\t<div class=\"d-flex align-items-center gap-3\">
  5064. \t\t\t\t\t\t\t\t<span style=\"font-size: 2rem; font-weight: 600; min-width: 100px; display: inline-block; text-align: center;\">
  5065. \t\t\t\t\t\t\t\t\t<span class=\"product-count\">{{ products|length|number_format }}</span>
  5067. \t\t\t\t\t\t\t\t\t<span style=\"font-size: 1rem; font-weight: 400;\">produits</span>
  5068. \t\t\t\t\t\t\t\t</span>
  5069. \t\t\t\t\t\t\t\t<select class=\"form-select\" id=\"product-sort\" style=\"width: auto;\" onchange=\"if(window.sortProducts) window.sortProducts(this.value);\">
  5070. \t\t\t\t\t\t\t\t\t<option value=\"\">Trier par</option>
  5071. \t\t\t\t\t\t\t\t\t<option value=\"price_asc\">Prix : Croissant</option>
  5072. \t\t\t\t\t\t\t\t\t<option value=\"price_desc\">Prix : Décroissant</option>
  5073. \t\t\t\t\t\t\t\t\t<option value=\"newest\">Plus récents</option>
  5074. \t\t\t\t\t\t\t\t\t<option value=\"popular\">Plus populaires</option>
  5075. \t\t\t\t\t\t\t\t\t<option value=\"name_asc\">Nom : A-Z</option>
  5076. \t\t\t\t\t\t\t\t\t<option value=\"name_desc\">Nom : Z-A</option>
  5077. \t\t\t\t\t\t\t\t</select>
  5078. \t\t\t\t\t\t\t</div>
  5079. \t\t\t\t\t\t</div>
  5081. \t\t\t\t\t\t{% if products|length > 0 %}
  5082. \t\t\t\t\t\t\t<div class=\"row\" id=\"products-container\">
  5083. \t\t\t\t\t\t\t\t{% for product in products %}
  5084. \t\t\t\t\t\t\t\t\t<div class=\"col-xl-3 col-lg-4 col-md-6 col-sm-6 mb-4 d-flex align-items-stretch product-item\" data-price=\"{{ product.price }}\" data-name=\"{{ product.name|lower }}\" data-views=\"{{ product.viewCount ?? 0 }}\" data-created=\"{{ product.publishedAt|date('Y-m-d') }}\">
  5085. \t\t\t\t\t\t\t\t\t\t{% include 'home/_single_product_card.html.twig' with {'product': product} %}
  5086. \t\t\t\t\t\t\t\t\t</div>
  5087. \t\t\t\t\t\t\t\t{% endfor %}
  5088. \t\t\t\t\t\t\t</div>
  5089. \t\t\t\t\t\t{% else %}
  5090. \t\t\t\t\t\t\t<div class=\"text-center py-5\">
  5091. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-package\" style=\"font-size: 4rem; color: #ccc;\"></i>
  5092. \t\t\t\t\t\t\t\t<h4 class=\"mt-3\">Aucun produit disponible</h4>
  5093. \t\t\t\t\t\t\t\t<p class=\"text-muted\">Cette boutique n'a pas encore de produits en vente.</p>
  5094. \t\t\t\t\t\t\t</div>
  5095. \t\t\t\t\t\t{% endif %}
  5096. \t\t\t\t\t</div>
  5098. \t\t\t\t</div>
  5099. \t\t\t</div>
  5101. \t\t\t<!-- Tab Content: Sale avec Karma -->
  5102. \t\t\t<div id=\"shop-sale\" class=\"tab-content shop-tab-content\">
  5103. \t\t\t\t<div class=\"text-center py-5\">
  5104. \t\t\t\t\t<i class=\"lnr lnr-tag\" style=\"font-size: 4rem; color: #ccc;\"></i>
  5105. \t\t\t\t\t<h4 class=\"mt-3\">Aucune promotion actuellement</h4>
  5106. \t\t\t\t\t<p class=\"text-muted\">Cette boutique n'a pas de promotions actives pour le moment.</p>
  5107. \t\t\t\t</div>
  5108. \t\t\t</div>
  5110. \t\t\t<!-- Tab Content: About avec Karma -->
  5111. \t\t\t<div id=\"shop-about\" class=\"tab-content shop-tab-content\">
  5112. \t\t\t\t<div class=\"row\">
  5113. \t\t\t\t\t<div class=\"col-lg-8\">
  5114. \t\t\t\t\t\t<div class=\"card\">
  5115. \t\t\t\t\t\t\t<div class=\"card-header\">
  5116. \t\t\t\t\t\t\t\t<h5 class=\"mb-0\">
  5117. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-user me-2\"></i>À propos de
  5118. \t\t\t\t\t\t\t\t\t{{ shop.name }}
  5119. \t\t\t\t\t\t\t\t</h5>
  5120. \t\t\t\t\t\t\t</div>
  5121. \t\t\t\t\t\t\t<div class=\"card-body\">
  5122. \t\t\t\t\t\t\t\t{% if shop.description %}
  5123. \t\t\t\t\t\t\t\t\t<p class=\"card-text\">{{ shop.description }}</p>
  5124. \t\t\t\t\t\t\t\t{% else %}
  5125. \t\t\t\t\t\t\t\t\t<p class=\"text-muted\">Aucune description disponible.</p>
  5126. \t\t\t\t\t\t\t\t{% endif %}
  5128. \t\t\t\t\t\t\t\t{% if shop.businessHours %}
  5129. \t\t\t\t\t\t\t\t\t<h6 class=\"mt-4\">
  5130. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-clock me-2\"></i>Heures d'ouverture
  5131. \t\t\t\t\t\t\t\t\t</h6>
  5132. \t\t\t\t\t\t\t\t\t<p>{{ shop.businessHours }}</p>
  5133. \t\t\t\t\t\t\t\t{% endif %}
  5135. \t\t\t\t\t\t\t\t{% if shop.returnPolicy %}
  5136. \t\t\t\t\t\t\t\t\t<h6 class=\"mt-4\">
  5137. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-undo me-2\"></i>Politique de retour
  5138. \t\t\t\t\t\t\t\t\t</h6>
  5139. \t\t\t\t\t\t\t\t\t<p>{{ shop.returnPolicy }}</p>
  5140. \t\t\t\t\t\t\t\t{% endif %}
  5141. \t\t\t\t\t\t\t</div>
  5142. \t\t\t\t\t\t</div>
  5143. \t\t\t\t\t</div>
  5144. \t\t\t\t\t<div class=\"col-lg-4\">
  5145. \t\t\t\t\t\t<div class=\"card shop-info-card\">
  5146. \t\t\t\t\t\t\t<div class=\"card-header\">
  5147. \t\t\t\t\t\t\t\t<h6 class=\"mb-0\">
  5148. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-chart me-2\"></i>Statistiques de la boutique
  5149. \t\t\t\t\t\t\t\t</h6>
  5150. \t\t\t\t\t\t\t</div>
  5151. \t\t\t\t\t\t\t<div class=\"card-body\">
  5152. \t\t\t\t\t\t\t\t<div class=\"row text-center\">
  5153. \t\t\t\t\t\t\t\t\t<div class=\"col-6\">
  5154. \t\t\t\t\t\t\t\t\t\t<div class=\"shop-stat-item\">
  5155. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-number h4 text-primary\">{{ stats.activeProducts }}</span>
  5156. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-label d-block\">Produits actifs</span>
  5157. \t\t\t\t\t\t\t\t\t\t</div>
  5158. \t\t\t\t\t\t\t\t\t</div>
  5159. \t\t\t\t\t\t\t\t\t<div class=\"col-6\">
  5160. \t\t\t\t\t\t\t\t\t\t<div class=\"shop-stat-item\">
  5161. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-number h4 text-info\">{{ stats.shopViews }}</span>
  5162. \t\t\t\t\t\t\t\t\t\t\t<span class=\"stat-label d-block\">Vues boutique</span>
  5163. \t\t\t\t\t\t\t\t\t\t</div>
  5164. \t\t\t\t\t\t\t\t\t</div>
  5165. \t\t\t\t\t\t\t\t</div>
  5166. \t\t\t\t\t\t\t</div>
  5167. \t\t\t\t\t\t</div>
  5168. \t\t\t\t\t</div>
  5169. \t\t\t\t</div>
  5170. \t\t\t</div>
  5172. \t\t\t<!-- Tab Content: Feedback avec Karma -->
  5173. \t\t\t<div id=\"shop-feedback\" class=\"tab-content shop-tab-content\">
  5174. \t\t\t\t<div class=\"row\">
  5175. \t\t\t\t\t<div
  5176. \t\t\t\t\t\tclass=\"col-lg-8\">
  5177. \t\t\t\t\t\t<!-- Statistiques des avis -->
  5178. \t\t\t\t\t\t<div class=\"review-stats mb-4\">
  5179. \t\t\t\t\t\t\t<div class=\"row\">
  5180. \t\t\t\t\t\t\t\t<div class=\"col-md-4\">
  5181. \t\t\t\t\t\t\t\t\t<div class=\"stat-card text-center\">
  5182. \t\t\t\t\t\t\t\t\t\t<h3 class=\"stat-number\">{{ shop.getAverageRating() }}</h3>
  5183. \t\t\t\t\t\t\t\t\t\t<div class=\"rating-stars\">
  5184. \t\t\t\t\t\t\t\t\t\t\t{% for i in 1..5 %}
  5185. \t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star{% if i <= shop.getAverageRating() %}{% else %}-empty{% endif %}\"></i>
  5186. \t\t\t\t\t\t\t\t\t\t\t{% endfor %}
  5187. \t\t\t\t\t\t\t\t\t\t</div>
  5188. \t\t\t\t\t\t\t\t\t\t<p class=\"stat-label\">Note moyenne</p>
  5189. \t\t\t\t\t\t\t\t\t</div>
  5190. \t\t\t\t\t\t\t\t</div>
  5191. \t\t\t\t\t\t\t\t<div class=\"col-md-4\">
  5192. \t\t\t\t\t\t\t\t\t<div class=\"stat-card text-center\">
  5193. \t\t\t\t\t\t\t\t\t\t<h3 class=\"stat-number\">{{ shop.getVisibleReviewsCount() }}</h3>
  5194. \t\t\t\t\t\t\t\t\t\t<p class=\"stat-label\">Avis clients</p>
  5195. \t\t\t\t\t\t\t\t\t</div>
  5196. \t\t\t\t\t\t\t\t</div>
  5197. \t\t\t\t\t\t\t\t<div class=\"col-md-4\">
  5198. \t\t\t\t\t\t\t\t\t<div class=\"stat-card text-center\">
  5199. \t\t\t\t\t\t\t\t\t\t<h3 class=\"stat-number\">{{ ((shop.getVisibleReviewsCount() / 100) * 100)|round }}%</h3>
  5200. \t\t\t\t\t\t\t\t\t\t<p class=\"stat-label\">Satisfaction</p>
  5201. \t\t\t\t\t\t\t\t\t</div>
  5202. \t\t\t\t\t\t\t\t</div>
  5203. \t\t\t\t\t\t\t</div>
  5204. \t\t\t\t\t\t</div>
  5206. \t\t\t\t\t\t<!-- Liste des avis récents -->
  5207. \t\t\t\t\t\t<div class=\"reviews-preview\">
  5208. \t\t\t\t\t\t\t<h5 class=\"mb-3\">Avis récents</h5>
  5209. \t\t\t\t\t\t\t{% if shop.reviews|length > 0 %}
  5210. \t\t\t\t\t\t\t\t<div class=\"reviews-list\">
  5211. \t\t\t\t\t\t\t\t\t{% for review in shop.reviews|slice(0, 5) %}
  5212. \t\t\t\t\t\t\t\t\t\t{% if review.isVisible %}
  5213. \t\t\t\t\t\t\t\t\t\t\t<div class=\"review-item\">
  5214. \t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-header\">
  5215. \t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"reviewer-info\">
  5216. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"reviewer-avatar\">
  5217. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-user\"></i>
  5218. \t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  5219. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"reviewer-details\">
  5220. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h6 class=\"reviewer-name\">{{ review.user.userIdentifier }}</h6>
  5221. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-rating\">
  5222. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{% for i in 1..5 %}
  5223. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star{% if i <= review.rating %}{% else %}-empty{% endif %}\"></i>
  5224. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{% endfor %}
  5225. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  5226. \t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  5227. \t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  5228. \t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-meta\">
  5229. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"review-date\">{{ review.createdAt|date('d/m/Y') }}</span>
  5230. \t\t\t\t\t\t\t\t\t\t\t\t\t\t{% if review.isVerified %}
  5231. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"verified-badge\">
  5232. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-checkmark-circle\"></i>
  5233. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tVérifié
  5234. \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>
  5235. \t\t\t\t\t\t\t\t\t\t\t\t\t\t{% endif %}
  5236. \t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  5237. \t\t\t\t\t\t\t\t\t\t\t\t</div>
  5239. \t\t\t\t\t\t\t\t\t\t\t\t{% if review.comment %}
  5240. \t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"review-comment\">
  5241. \t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>{{ review.comment|length > 150 ? review.comment|slice(0, 150) ~ '...' : review.comment }}</p>
  5242. \t\t\t\t\t\t\t\t\t\t\t\t\t</div>
  5243. \t\t\t\t\t\t\t\t\t\t\t\t{% endif %}
  5244. \t\t\t\t\t\t\t\t\t\t\t</div>
  5245. \t\t\t\t\t\t\t\t\t\t{% endif %}
  5246. \t\t\t\t\t\t\t\t\t{% endfor %}
  5247. \t\t\t\t\t\t\t\t</div>
  5249. \t\t\t\t\t\t\t\t<div class=\"text-center mt-4\">
  5250. \t\t\t\t\t\t\t\t\t<a href=\"{{ path('shop_reviews_index', {'slug': shop.slug}) }}\" class=\"btn btn-primary\">
  5251. \t\t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star me-1\"></i>Voir tous les avis
  5252. \t\t\t\t\t\t\t\t\t</a>
  5253. \t\t\t\t\t\t\t\t</div>
  5254. \t\t\t\t\t\t\t{% else %}
  5255. \t\t\t\t\t\t\t\t<div class=\"text-center py-4\">
  5256. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnr-star\" style=\"font-size: 3rem; color: #ccc;\"></i>
  5257. \t\t\t\t\t\t\t\t\t<h5 class=\"mt-3\">Aucun avis pour le moment</h5>
  5258. \t\t\t\t\t\t\t\t\t<p class=\"text-muted\">Cette boutique n'a pas encore reçu d'avis clients.</p>
  5259. \t\t\t\t\t\t\t\t</div>
  5260. \t\t\t\t\t\t\t{% endif %}
  5261. \t\t\t\t\t\t</div>
  5262. \t\t\t\t\t</div>
  5264. \t\t\t\t\t<div
  5265. \t\t\t\t\t\tclass=\"col-lg-4\">
  5266. \t\t\t\t\t\t<!-- Lien vers la page complète des avis -->
  5267. \t\t\t\t\t\t<div class=\"review-actions-card\">
  5268. \t\t\t\t\t\t\t<h5>Évaluer cette boutique</h5>
  5269. \t\t\t\t\t\t\t<p class=\"text-muted\">Partagez votre expérience avec cette boutique.</p>
  5270. \t\t\t\t\t\t\t<a href=\"{{ path('shop_reviews_new', {'slug': shop.slug}) }}\" class=\"btn btn-primary w-100\">
  5271. \t\t\t\t\t\t\t\t<i class=\"lnr lnr-star me-1\"></i>Laisser un avis
  5272. \t\t\t\t\t\t\t</a>
  5273. \t\t\t\t\t\t</div>
  5274. \t\t\t\t\t</div>
  5275. \t\t\t\t</div>
  5276. \t\t\t</div>
  5277. \t\t</div>
  5278. \t</section>
  5280. \t<!-- Modal de signalement -->
  5281. \t<div class=\"modal fade\" id=\"reportModal\" tabindex=\"-1\" aria-labelledby=\"reportModalLabel\" aria-hidden=\"true\">
  5282. \t\t<div class=\"modal-dialog\">
  5283. \t\t\t<div class=\"modal-content\">
  5284. \t\t\t\t<div class=\"modal-header\">
  5285. \t\t\t\t\t<h5 class=\"modal-title\" id=\"reportModalLabel\">
  5286. \t\t\t\t\t\t<i class=\"lnr lnr-flag me-2\"></i>&nbsp;Signaler cette boutique
  5287. \t\t\t\t\t</h5>
  5288. \t\t\t\t\t<button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\"></button>
  5289. \t\t\t\t</div>
  5290. \t\t\t\t<div class=\"modal-body\">
  5291. \t\t\t\t\t<form id=\"reportForm\">
  5292. \t\t\t\t\t\t<div class=\"mb-3\">
  5293. \t\t\t\t\t\t\t<label for=\"reportReason\" class=\"form-label\">Motif du signalement *</label>
  5294. \t\t\t\t\t\t\t<select class=\"form-select\" id=\"reportReason\" required>
  5295. \t\t\t\t\t\t\t\t<option value=\"\">Sélectionnez un motif</option>
  5296. \t\t\t\t\t\t\t\t<option value=\"fake_products\">Produits contrefaits</option>
  5297. \t\t\t\t\t\t\t\t<option value=\"inappropriate_content\">Contenu inapproprié</option>
  5298. \t\t\t\t\t\t\t\t<option value=\"spam\">Spam ou publicité abusive</option>
  5299. \t\t\t\t\t\t\t\t<option value=\"fraud\">Fraude ou escroquerie</option>
  5300. \t\t\t\t\t\t\t\t<option value=\"harassment\">Harcèlement</option>
  5301. \t\t\t\t\t\t\t\t<option value=\"other\">Autre</option>
  5302. \t\t\t\t\t\t\t</select>
  5303. \t\t\t\t\t\t</div>
  5304. \t\t\t\t\t\t<div class=\"mb-3\">
  5305. \t\t\t\t\t\t\t<label for=\"reportDescription\" class=\"form-label\">Description détaillée *</label>
  5306. \t\t\t\t\t\t\t<textarea class=\"form-control\" id=\"reportDescription\" rows=\"4\" placeholder=\"Décrivez le problème rencontré...\" required></textarea>
  5307. \t\t\t\t\t\t</div>
  5308. \t\t\t\t\t\t<div class=\"mb-3\">
  5309. \t\t\t\t\t\t\t<label for=\"reportEmail\" class=\"form-label\">Votre email (optionnel)</label>
  5310. \t\t\t\t\t\t\t<input type=\"email\" class=\"form-control\" id=\"reportEmail\" placeholder=\"votre@email.com\">
  5311. \t\t\t\t\t\t\t<div class=\"form-text\">Nous pourrons vous contacter pour plus d'informations</div>
  5312. \t\t\t\t\t\t</div>
  5313. \t\t\t\t\t</form>
  5314. \t\t\t\t</div>
  5315. \t\t\t\t<div class=\"modal-footer\">
  5316. \t\t\t\t\t<button type=\"button\" class=\"btn btn-secondary\" data-bs-dismiss=\"modal\">Annuler</button>
  5317. \t\t\t\t\t<button type=\"button\" class=\"btn btn-danger\" onclick=\"submitReport()\">
  5318. \t\t\t\t\t\t<i class=\"lnr lnr-flag  me-2\"></i>Envoyer le signalement
  5319. \t\t\t\t\t</button>
  5320. \t\t\t\t</div>
  5321. \t\t\t</div>
  5322. \t\t</div>
  5323. \t</div>
  5325. \t<!-- Section des avis -->
  5326. \t<div class=\"container my-5\">
  5327. \t\t<div class=\"row\">
  5328. \t\t\t<div class=\"col-12\">
  5329. \t\t\t\t<div class=\"section-title text-center\">
  5330. \t\t\t\t\t<h2>Avis clients</h2>
  5331. \t\t\t\t\t<p>Découvrez ce que pensent nos clients de cette boutique</p>
  5332. \t\t\t\t</div>
  5333. \t\t\t</div>
  5334. \t\t</div>
  5336. \t\t<div
  5337. \t\t\tclass=\"row\">
  5338. \t\t\t<!-- Statistiques des avis -->
  5339. \t\t\t<div class=\"col-md-4\">
  5340. \t\t\t\t<div class=\"review-stats-card\">
  5341. \t\t\t\t\t<div class=\"stats-header\">
  5342. \t\t\t\t\t\t<div class=\"overall-rating\">
  5343. \t\t\t\t\t\t\t<span class=\"rating-number\">{{ shop.reviews|length > 0 ? (shop.reviews|map(r => r.rating)|reduce((a, b) => a + b) / shop.reviews|length)|number_format(1) : '0.0' }}</span>
  5344. \t\t\t\t\t\t\t<div class=\"stars\">
  5345. \t\t\t\t\t\t\t\t{% set avgRating = shop.reviews|length > 0 ? (shop.reviews|map(r => r.rating)|reduce((a, b) => a + b) / shop.reviews|length) : 0 %}
  5346. \t\t\t\t\t\t\t\t{% for i in 1..5 %}
  5347. \t\t\t\t\t\t\t\t\t{% if i <= avgRating %}
  5348. \t\t\t\t\t\t\t\t\t\t★
  5349. \t\t\t\t\t\t\t\t\t{% elseif i - avgRating < 1 %}
  5350. \t\t\t\t\t\t\t\t\t\t☆
  5351. \t\t\t\t\t\t\t\t\t{% else %}
  5352. \t\t\t\t\t\t\t\t\t\t☆
  5353. \t\t\t\t\t\t\t\t\t{% endif %}
  5354. \t\t\t\t\t\t\t\t{% endfor %}
  5355. \t\t\t\t\t\t\t</div>
  5356. \t\t\t\t\t\t</div>
  5357. \t\t\t\t\t\t<div class=\"rating-summary\">
  5358. \t\t\t\t\t\t\t<p class=\"mb-1\">{{ shop.reviews|length }}
  5359. \t\t\t\t\t\t\t\tavis</p>
  5360. \t\t\t\t\t\t\t<p class=\"text-muted small\">Basé sur
  5361. \t\t\t\t\t\t\t\t{{ shop.reviews|filter(r => r.isVerified)|length }}
  5362. \t\t\t\t\t\t\t\tavis vérifiés</p>
  5363. \t\t\t\t\t\t</div>
  5364. \t\t\t\t\t</div>
  5366. \t\t\t\t\t<div class=\"rating-breakdown\">
  5367. \t\t\t\t\t\t{% for rating in 5..1 %}
  5368. \t\t\t\t\t\t\t{% set count = shop.reviews|filter(r => r.rating == rating)|length %}
  5369. \t\t\t\t\t\t\t{% set percentage = shop.reviews|length > 0 ? (count / shop.reviews|length * 100) : 0 %}
  5370. \t\t\t\t\t\t\t<div class=\"rating-bar\">
  5371. \t\t\t\t\t\t\t\t<span class=\"rating-label\">{{ rating }}★</span>
  5372. \t\t\t\t\t\t\t\t<div class=\"rating-progress\">
  5373. \t\t\t\t\t\t\t\t\t<div class=\"rating-fill\" style=\"width: {{ percentage }}%\"></div>
  5374. \t\t\t\t\t\t\t\t</div>
  5375. \t\t\t\t\t\t\t\t<span class=\"rating-count\">{{ count }}</span>
  5376. \t\t\t\t\t\t\t</div>
  5377. \t\t\t\t\t\t{% endfor %}
  5378. \t\t\t\t\t</div>
  5379. \t\t\t\t</div>
  5380. \t\t\t</div>
  5382. \t\t\t<!-- Aperçu des avis -->
  5383. \t\t\t<div class=\"col-md-8\">
  5384. \t\t\t\t<div class=\"reviews-preview\">
  5385. \t\t\t\t\t{% if shop.reviews|length > 0 %}
  5386. \t\t\t\t\t\t{% for review in shop.reviews|slice(0, 3) %}
  5387. \t\t\t\t\t\t\t<div class=\"review-card-preview\">
  5388. \t\t\t\t\t\t\t\t<div class=\"review-header\">
  5389. \t\t\t\t\t\t\t\t\t<div class=\"review-user\">
  5390. \t\t\t\t\t\t\t\t\t\t<div class=\"user-avatar\">
  5391. \t\t\t\t\t\t\t\t\t\t\t{{ review.user.firstName|first|upper|default(review.user.email|first|upper) }}
  5392. \t\t\t\t\t\t\t\t\t\t</div>
  5393. \t\t\t\t\t\t\t\t\t\t<div class=\"user-info\">
  5394. \t\t\t\t\t\t\t\t\t\t\t<h6>{{ review.user.firstName|default('Utilisateur') }}</h6>
  5395. \t\t\t\t\t\t\t\t\t\t\t<small>{{ review.getTimeAgo() }}</small>
  5396. \t\t\t\t\t\t\t\t\t\t</div>
  5397. \t\t\t\t\t\t\t\t\t</div>
  5398. \t\t\t\t\t\t\t\t\t<div class=\"review-rating\">
  5399. \t\t\t\t\t\t\t\t\t\t<div class=\"stars\">{{ review.getRatingStars() }}</div>
  5400. \t\t\t\t\t\t\t\t\t\t{% if review.isVerified %}
  5401. \t\t\t\t\t\t\t\t\t\t\t<span class=\"verified-badge\">✓</span>
  5402. \t\t\t\t\t\t\t\t\t\t{% endif %}
  5403. \t\t\t\t\t\t\t\t\t</div>
  5404. \t\t\t\t\t\t\t\t</div>
  5405. \t\t\t\t\t\t\t\t<div class=\"review-content\">
  5406. \t\t\t\t\t\t\t\t\t{{ review.comment|slice(0, 150) }}
  5407. \t\t\t\t\t\t\t\t\t{% if review.comment|length > 150 %}...
  5408. \t\t\t\t\t\t\t\t\t{% endif %}
  5409. \t\t\t\t\t\t\t\t</div>
  5410. \t\t\t\t\t\t\t</div>
  5411. \t\t\t\t\t\t{% endfor %}
  5413. \t\t\t\t\t\t<div class=\"text-center mt-3\">
  5414. \t\t\t\t\t\t\t<a href=\"{{ path('shop_reviews_index', {'slug': shop.slug}) }}\" class=\"btn btn-outline-primary\">
  5415. \t\t\t\t\t\t\t\tVoir tous les avis ({{ shop.reviews|length }})
  5416. \t\t\t\t\t\t\t</a>
  5417. \t\t\t\t\t\t</div>
  5418. \t\t\t\t\t{% else %}
  5419. \t\t\t\t\t\t<div class=\"empty-reviews\">
  5420. \t\t\t\t\t\t\t<i class=\"lnr lnr-star\"></i>
  5421. \t\t\t\t\t\t\t<h4>Aucun avis pour le moment</h4>
  5422. \t\t\t\t\t\t\t<p>Soyez le premier à laisser un avis sur cette boutique !</p>
  5423. \t\t\t\t\t\t\t{% if app.user %}
  5424. \t\t\t\t\t\t\t\t<a href=\"{{ path('shop_reviews_new', {'slug': shop.slug}) }}\" class=\"btn btn-primary\">
  5425. \t\t\t\t\t\t\t\t\t<i class=\"lnr lnraccount_recently_viewed-star\"></i>
  5426. \t\t\t\t\t\t\t\t\tLaisser un avis
  5427. \t\t\t\t\t\t\t\t</a>
  5428. \t\t\t\t\t\t\t{% endif %}
  5429. \t\t\t\t\t\t</div>
  5430. \t\t\t\t\t{% endif %}
  5431. \t\t\t\t</div>
  5432. \t\t\t</div>
  5433. \t\t</div>
  5434. \t</div>
  5436. {% endblock %}
  5438. {% block javascripts %}
  5439. \t<script>
  5440. \t\tdocument.addEventListener('DOMContentLoaded', function () { // Initialisation du carrousel
  5441. initCarousel();
  5443. // Gestion des onglets eBay-style avec Bootstrap
  5444. const tabLinks = document.querySelectorAll('.shop-tab-link');
  5445. const tabContents = document.querySelectorAll('.shop-tab-content');
  5447. tabLinks.forEach(link => {
  5448. link.addEventListener('click', function (e) {
  5449. e.preventDefault();
  5451. // Retirer la classe active de tous les liens et contenus
  5452. tabLinks.forEach(l => {
  5453. l.classList.remove('active');
  5454. l.setAttribute('aria-selected', 'false');
  5455. });
  5456. tabContents.forEach(c => c.classList.remove('active'));
  5458. // Ajouter la classe active au lien cliqué
  5459. this.classList.add('active');
  5460. this.setAttribute('aria-selected', 'true');
  5462. // Afficher le contenu correspondant
  5463. const targetTab = this.dataset.tab;
  5464. const targetContent = document.getElementById (`shop-\${targetTab}`);
  5465. if (targetContent) {
  5466. targetContent.classList.add('active');
  5467. }
  5468. });
  5469. });
  5471. // Gestion du système de follow
  5472. const followButton = document.getElementById('follow-button');
  5474. if (followButton) {
  5475. followButton.addEventListener('click', function () {
  5476. const shopId = this.dataset.shopId;
  5477. const isFollowing = this.dataset.following === 'true';
  5479. // Désactiver le bouton pendant la requête
  5480. this.disabled = true;
  5481. const originalText = this.innerHTML;
  5482. this.innerHTML = '<i class=\"lnr lnr-spinner\"></i> Loading...';
  5484. // Envoyer la requête
  5485. fetch(\"{{ path('ui_api_shop_toggle_follow', {id: '__SHOP_ID__'}) }}\".replace('__SHOP_ID__', shopId), {
  5486. method: 'POST',
  5487. headers: {
  5488. 'Content-Type': 'application/json',
  5489. 'X-Requested-With': 'XMLHttpRequest'
  5490. }
  5491. }).then(response => response.json()).then(data => {
  5492. if (data.success) { // Mettre à jour l'interface
  5493. this.dataset.following = data.isFollowing;
  5495. if (data.isFollowing) {
  5496. this.classList.add('following');
  5497. this.innerHTML = '<i class=\"lnr lnr-checkmark\"></i> Suivi';
  5498. } else {
  5499. this.classList.remove('following');
  5500. this.innerHTML = '<i class=\"lnr lnr-plus\"></i> Suivre';
  5501. }
  5503. // Mettre à jour le compteur de followers
  5504. if (followersCount && data.followersCount !== undefined) {
  5505. followersCount.textContent = data.followersCount.toLocaleString();
  5506. }
  5508. // Afficher un message de confirmation
  5509. showNotification(data.message, 'success');
  5510. } else {
  5511. showNotification(data.message, 'error');
  5512. }
  5513. }).catch(error => {
  5514. console.error('Erreur:', error);
  5515. showNotification('Une erreur est survenue', 'error');
  5516. }). finally(() => {
  5517. this.disabled = false;
  5518. });
  5519. });
  5520. }
  5522. // Fonction pour afficher les notifications
  5523. function showNotification(message, type = 'info') { // Créer l'élément de notification
  5524. const notification = document.createElement('div');
  5525. notification.className = `alert alert-\${
  5526. type === 'success' ? 'success' : type === 'error' ? 'danger' : 'info'
  5527. } alert-dismissible fade show position-fixed`;
  5528. notification.style.cssText = 'top: 20px; right: 20px; z-index: 9999; min-width: 300px;';
  5529. notification.innerHTML = `
  5530.             \${message}
  5531.             <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\"></button>
  5532.         `;
  5534. document.body.appendChild(notification);
  5536. // Supprimer automatiquement après 5 secondes
  5537. setTimeout(() => {
  5538. if (notification.parentNode) {
  5539. notification.remove();
  5540. }
  5541. }, 5000);
  5542. }
  5544. // Fonctions pour les actions de boutique
  5545. window.shareShop = function () { // Vérifier si l'API Web Share est disponible et si on est sur mobile
  5546. if (navigator.share && /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
  5547. navigator.share({title: '{{ shop.name }}- Boutique sur MaketOu', text: 'Découvrez cette boutique et ses produits sur MaketOu', url: window.location.href}).then(() => {
  5548. console.log('Partage réussi');
  5549. showNotification('Lien partagé avec succès !', 'success');
  5550. }).catch((error) => {
  5551. console.log('Erreur lors du partage:', error);
  5552. // Fallback vers la copie
  5553. copyToClipboard();
  5554. });
  5555. } else { // Sur desktop ou si Web Share n'est pas disponible, copier directement
  5556. copyToClipboard();
  5557. }
  5558. };
  5560. // Fonction pour copier le lien dans le presse-papiers
  5561. function copyToClipboard() {
  5562. const shopUrl = window.location.href;
  5563. const shopName = '{{ shop.name }}';
  5564. const shareText = `Découvrez la boutique \"\${shopName}\" sur MaketOu : \${shopUrl}`;
  5566. // Utiliser directement le fallback pour éviter les conflits
  5567. fallbackCopyToClipboard(shareText);
  5568. }
  5570. // Fallback pour copier le texte
  5571. function fallbackCopyToClipboard(text) {
  5572. const textArea = document.createElement('textarea');
  5573. textArea.value = text;
  5574. textArea.style.position = 'fixed';
  5575. textArea.style.left = '-999999px';
  5576. textArea.style.top = '-999999px';
  5577. document.body.appendChild(textArea);
  5578. textArea.focus();
  5579. textArea.select();
  5581. try {
  5582. document.execCommand('copy');
  5583. showNotification('Lien copié dans le presse-papiers !', 'success');
  5584. } catch (err) {
  5585. console.error('Impossible de copier:', err);
  5586. showNotification('Impossible de copier le lien', 'error');
  5587. }
  5589. document.body.removeChild(textArea);
  5590. }
  5592. window.contactShop = function () { // Ouvrir un modal de signalement
  5593. openReportModal();
  5594. };
  5596. window.saveShop = function () { // Sauvegarder la boutique dans les favoris
  5597. showNotification('Boutique sauvegardée dans vos favoris', 'success');
  5598. };
  5600. // Fonction pour ouvrir le modal de signalement
  5601. window.openReportModal = function () {
  5602. const modal = new bootstrap.Modal(document.getElementById('reportModal'));
  5603. modal.show();
  5604. };
  5606. // Fonction pour soumettre le signalement
  5607. window.submitReport = function () {
  5608. const reason = document.getElementById('reportReason').value;
  5609. const description = document.getElementById('reportDescription').value;
  5610. const email = document.getElementById('reportEmail').value;
  5612. if (! reason || ! description) {
  5613. showNotification('Veuillez remplir tous les champs obligatoires', 'error');
  5614. return;
  5615. }
  5617. // Simuler l'envoi du signalement
  5618. const reportData = {
  5619. shopId: {{ shop.id }},
  5620. reason: reason,
  5621. description: description,
  5622. email: email,
  5623. reportedAt: new Date().toISOString()
  5624. };
  5626. console.log('Signalement envoyé:', reportData);
  5628. // Fermer le modal
  5629. const modal = bootstrap.Modal.getInstance(document.getElementById('reportModal'));
  5630. modal.hide();
  5632. // Réinitialiser le formulaire
  5633. document.getElementById('reportForm').reset();
  5635. // Afficher la confirmation
  5636. showNotification('Signalement envoyé avec succès. Nous examinerons votre demande.', 'success');
  5637. };
  5639. // Gestion du carrousel eBay-style
  5640. let currentSlide = 0;
  5641. let carouselInterval;
  5642. let isPaused = false;
  5643. let slides = [];
  5644. let indicators = [];
  5646. function initCarousel() {
  5647.     // Réinitialiser les variables
  5648.     currentSlide = 0;
  5649.     isPaused = false;
  5650.     
  5651.     // Récupérer les slides et indicateurs à nouveau
  5652.     const carouselContainer = document.querySelector('.shop-carousel-ebay');
  5653.     if (!carouselContainer) {
  5654.         console.log('Carousel container not found');
  5655.         return;
  5656.     }
  5657.     
  5658.     const allSlides = carouselContainer.querySelectorAll('.carousel-slide');
  5659.     const allIndicators = carouselContainer.querySelectorAll('.carousel-indicator-ebay');
  5660.     
  5661.     if (allSlides.length === 0) {
  5662.         // Masquer les contrôles si aucune image
  5663.         const controls = carouselContainer.querySelector('.carousel-controls-ebay');
  5664.         const indicators = carouselContainer.querySelector('.carousel-indicators-ebay');
  5665.         if (controls) controls.style.display = 'none';
  5666.         if (indicators) indicators.style.display = 'none';
  5667.         return;
  5668.     }
  5669.     
  5670.     // Si une seule image, masquer les contrôles
  5671.     if (allSlides.length <= 1) {
  5672.         const controls = carouselContainer.querySelector('.carousel-controls-ebay');
  5673.         const indicators = carouselContainer.querySelector('.carousel-indicators-ebay');
  5674.         if (controls) controls.style.display = 'none';
  5675.         if (indicators) indicators.style.display = 'none';
  5676.         // S'assurer que la slide unique est active
  5677.         allSlides[0].classList.add('active');
  5678.         return;
  5679.     }
  5680.     
  5681.     // Afficher les contrôles si plusieurs images
  5682.     const controls = carouselContainer.querySelector('.carousel-controls-ebay');
  5683.     const indicators = carouselContainer.querySelector('.carousel-indicators-ebay');
  5684.     if (controls) controls.style.display = 'flex';
  5685.     if (indicators) indicators.style.display = 'flex';
  5686.     
  5687.     // Mettre à jour les références globales
  5688.     slides = allSlides;
  5689.     indicators = allIndicators;
  5690.     
  5691.     // S'assurer que la première slide est active
  5692.     updateCarousel();
  5693.     
  5694.     // Démarrer le carrousel automatique
  5695.     startCarousel();
  5696.     
  5697.     // Gérer les événements de survol
  5698.     carouselContainer.addEventListener('mouseenter', pauseCarousel);
  5699.     carouselContainer.addEventListener('mouseleave', () => {
  5700.             if (!isPaused) startCarousel();
  5701.         });
  5702. }
  5704. function startCarousel() {
  5705.     // Nettoyer l'intervalle existant
  5706.     clearInterval(carouselInterval);
  5707.     
  5708.     if (slides.length <= 1) return;
  5709.     
  5710.     carouselInterval = setInterval(() => {
  5711.         if (!isPaused && slides.length > 0) {
  5712.             nextSlide();
  5713.         }
  5714.     }, 4000); // Change toutes les 4 secondes
  5720. }
  5722. function pauseCarousel() {
  5723. isPaused = true;
  5724. clearInterval(carouselInterval);
  5725. const pauseIcon = document.getElementById('pauseIcon');
  5726. if (pauseIcon) {
  5727.     pauseIcon.className = 'lnr lnr-play';
  5728. }
  5729. }
  5731. function resumeCarousel() {
  5732. isPaused = false;
  5733. const pauseIcon = document.getElementById('pauseIcon');
  5734. if (pauseIcon) {
  5735.     pauseIcon.className = 'lnr lnr-pause';
  5736. }
  5737. startCarousel();
  5738. }
  5740. function toggleCarousel() {
  5741. if (isPaused) {
  5742. resumeCarousel();
  5743. } else {
  5744. pauseCarousel();
  5745. }
  5746. }
  5748. function nextSlide() {
  5749. if (slides.length === 0) return;
  5750. currentSlide = (currentSlide + 1) % slides.length;
  5751. updateCarousel();
  5752. }
  5754. function previousSlide() {
  5755. if (slides.length === 0) return;
  5756. currentSlide = (currentSlide - 1 + slides.length) % slides.length;
  5757. updateCarousel();
  5758. }
  5760. function goToSlide(index) {
  5761. if (slides.length === 0) return;
  5762. if (index < 0 || index >= slides.length) return;
  5763. currentSlide = index;
  5764. updateCarousel();
  5765. }
  5767. function updateCarousel() {
  5768.     if (slides.length === 0 || indicators.length === 0) return;
  5769.     
  5770.     // Masquer toutes les slides
  5771.     slides.forEach(slide => slide.classList.remove('active'));
  5772.     indicators.forEach(indicator => indicator.classList.remove('active'));
  5773.     
  5774.     // Afficher la slide active
  5775.     if (slides[currentSlide]) {
  5776.         slides[currentSlide].classList.add('active');
  5777.     }
  5778.     if (indicators[currentSlide]) {
  5779.         indicators[currentSlide].classList.add('active');
  5780.     }
  5781. }
  5783. // Fonctions globales pour les boutons
  5784. window.nextSlide = nextSlide;
  5785. window.previousSlide = previousSlide;
  5786. window.goToSlide = goToSlide;
  5787. window.toggleCarousel = toggleCarousel;
  5789. // Gestion du tri des produits via API Symfony
  5790. console.log('=== INITIALIZING PRODUCT SORTING ===');
  5791. console.log('Shop ID:', {{ shop.id }});
  5793. // Fonction de tri via AJAX - RENDUE GLOBALE
  5794. window.sortProducts = function (sortValue) {
  5795. console.log('=== SORT PRODUCTS CALLED ===');
  5796. console.log('Sort value:', sortValue);
  5798. const productsContainer = document.getElementById('products-container');
  5799. console.log('Products container:', productsContainer);
  5801. if (! productsContainer) {
  5802. console.error('Products container not found!');
  5803. return;
  5804. }
  5806. if (! sortValue) {
  5807. console.log('Resetting to original order');
  5808. // Recharger la page pour revenir à l'ordre original
  5809. window.location.reload();
  5810. return;
  5811. }
  5813. console.log('Showing loading spinner...');
  5814. // Afficher un indicateur de chargement
  5815. productsContainer.innerHTML = '<div class=\"col-12 text-center py-5\"><div class=\"spinner-border text-primary\" role=\"status\"><span class=\"visually-hidden\">Chargement...</span></div><p class=\"mt-3\">Tri des produits en cours...</p></div>';
  5817. // Récupérer l'ID de la boutique
  5818. const shopId = {{ shop.id }};
  5819. console.log('Shop ID for request:', shopId);
  5821. const url = \"{{ path('ui_api_shop_products_sort', {id: '__SHOP_ID__'}) }}\".replace('__SHOP_ID__', shopId);
  5822. console.log('Request URL:', url);
  5824. const requestData = {
  5825. sortBy: sortValue
  5826. };
  5827. console.log('Request data:', requestData);
  5829. // Envoyer la requête AJAX
  5830. console.log('Sending AJAX request...');
  5831. fetch(url, {
  5832. method: 'POST',
  5833. headers: {
  5834. 'Content-Type': 'application/json',
  5835. 'X-Requested-With': 'XMLHttpRequest'
  5836. },
  5837. body: JSON.stringify(requestData)
  5838. }).then(response => {
  5839. console.log('Response received:', response);
  5840. console.log('Response status:', response.status);
  5841. return response.json();
  5842. }).then(data => {
  5843. console.log('Sort response data:', data);
  5845. if (data.success) {
  5846. console.log('Sort successful, updating content...');
  5847. // Mettre à jour le contenu avec le HTML retourné
  5848. productsContainer.innerHTML = data.html;
  5850. // Mettre à jour le compteur de produits
  5851. const productCount = document.querySelector('.product-count');
  5852. if (productCount) {
  5853. productCount.textContent = data.count;
  5854. }
  5856. console.log('Products sorted successfully!');
  5857. } else {
  5858. console.error('Sort failed:', data.message);
  5859. showNotification('Erreur lors du tri: ' + data.message, 'error');
  5861. // Recharger la page en cas d'erreur
  5862. window.location.reload();
  5863. }
  5864. }).catch(error => {
  5865. console.error('Sort request failed:', error);
  5866. showNotification('Erreur de connexion lors du tri', 'error');
  5868. // Recharger la page en cas d'erreur
  5869. window.location.reload();
  5870. });
  5871. };
  5873. // Attendre que le DOM soit chargé
  5874. console.log('Setting up event listeners...');
  5875. setTimeout(() => {
  5876. const sortSelect = document.getElementById('product-sort');
  5877. console.log('Sort select element:', sortSelect);
  5879. if (sortSelect) {
  5880. console.log('Adding change event listener...');
  5882. // Ecouter l'événement change avec jQuery (nécessaire à cause de nice-select)
  5883. if (typeof \$ !== 'undefined') {
  5884.     \$('#product-sort').on('change', function() {
  5885.         console.log('=== SELECT CHANGE EVENT TRIGGERED (jQuery) ===');
  5886.         if(window.sortProducts) window.sortProducts(this.value);
  5887.     });
  5888. }
  5890. sortSelect.addEventListener('change', function () {
  5891. console.log('=== SELECT CHANGE EVENT TRIGGERED ===');
  5892. console.log('Selected value:', this.value);
  5893. console.log('Calling sortProducts...');
  5894. window.sortProducts(this.value);
  5895. });
  5897. console.log('Event listener added successfully');
  5898. } else {
  5899. console.error('Sort select element not found!');
  5900. console.log('Available elements with ID containing \"sort\":', document.querySelectorAll('[id*=\"sort\"]'));
  5901. console.log('Available elements with class containing \"form-select\":', document.querySelectorAll('.form-select'));
  5902. }
  5903. }, 100);
  5905. // Gestion du bouton \"Suivre\"
  5906. const followBtn = document.querySelector('.btn-shop');
  5907. if (followBtn) {
  5908. followBtn.addEventListener('click', function () {
  5909. if (this.innerHTML.includes('Suivre')) {
  5910. this.innerHTML = '<i class=\"lnr lnr-heart me-1\"></i> Suivi';
  5911. this.classList.remove('btn-shop');
  5912. this.classList.add('btn-success');
  5913. } else {
  5914. this.innerHTML = '<i class=\"lnr lnr-heart me-1\"></i> Suivre';
  5915. this.classList.remove('btn-success');
  5916. this.classList.add('btn-shop');
  5917. }
  5918. });
  5919. }
  5920. });
  5921. \t</script>
  5922. {% endblock %}
  5923. ", "home/shop.html.twig", "/home/u540977899/domains/maketou-ht.com/public_html/templates/home/shop.html.twig");
  5924.     }
  5925. }