PageSourceSearch

https://houseofhm.com/hm-06

html houseofhm.com collected 2026-10-04 03:41:30 UTC 240,113 bytes, 5,244 lines download raw bytes

1
2
3
4
5
6
7
8<!DOCTYPE html>
9
10<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US"
11	lang="ar"
12	dir="rtl">
13
14<head>
15
16	
17
18
19
20
21
22
23
24
25
26
27
28<!-- Snap Pixel Code -->
29    
29<script type="text/javascript">
30      (function (e, t, n) {
31        if (e.snaptr) return;
32        var a = (e.snaptr = function () {
33          a.handleRequest ? a.handleRequest.apply(a, arguments) : a.queue.push(arguments);
34        });
35        a.queue = [];
36        var s = 'script';
37        r = t.createElement(s);
38        r.async = !0;
39        r.src = n;
40        var u = t.getElementsByTagName(s)[0];
41        u.parentNode.insertBefore(r, u);
42      })(window, document, 'https://sc-static.net/scevent.min.js');
43
44      snaptr('init', '18de90b9-9f1a-4fe7-9fbd-4cf57147ed07', {});
45
46      snaptr('track', 'PAGE_VIEW');
47    </script>
47
48    <!-- End Snap Pixel Code -->
49
50
51
52
53
54
55
56
57
58	<meta charset="utf-8" />
59	<title> house of HM </title>
60	<meta name="description"
61		content=" Default description for house of HM website " />
62	<meta name="keywords" content="" />
63
64
65
66	<meta name="author" content="Al7osam" />
67	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
68
69	<!-- Twitter Meta Tags -->
70	<meta name="twitter:card" content="summary_large_image">
71	<meta name="twitter:title"
72		content=" house of HM ">
73	<meta name="twitter:description"
74		content="Default description for house of HM website">
75	
76	
77	
78		
79	
80	<meta name="twitter:image" content="https://houseofhm.com/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp" />
81
82	<!-- Canonical URL (helps prevent duplicate content issues) -->
83	<link rel="canonical" href="https://houseofhm.com/hm-06" />
84
85
86	<!-- Open Graph / Facebook Meta Tags (for social sharing) -->
87	<meta property="og:title"
88		content=" house of HM " />
89	<meta property="og:description"
90		content="Default description for house of HM website" />
91	<meta property="og:image" content="https://houseofhm.com/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp" />
92	<meta property="og:image:width" content="1200" />
93	<meta property="og:image:height" content="630" />
94	<meta property="og:image:type" content="image/jpeg" />
95	
96	
97	
98	
99	<meta property="og:type" content="product" />
100	
101	<meta property="og:url" content="https://houseofhm.com/hm-06" />
102	<meta property="og:site_name" content="house of HM" />
103	<meta property="og:locale" content="ar_SA" />
104	<link rel="stylesheet"
105		href="https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-regular-rounded.css">
106	<link rel="stylesheet" href="/Views/Themes/decor/V1/Assets/fonts/font-icons.css" />
107	<link rel="stylesheet" href="/Views/Themes/decor/V1/Assets/css/bootstrap.min.css" />
108	<link rel="stylesheet" href="/Views/Themes/decor/V1/Assets/css/swiper-bundle.min.css" />
109	<link rel="stylesheet" href="/Views/Themes/decor/V1/Assets/css/animate.css" media="print" onload="this.media='all'" />
110	<link rel="preload" href="/Views/Themes/decor/V1/Assets/css/styles.css" as="style" />
111	<link rel="stylesheet" type="text/css" href="/Views/Themes/decor/V1/Assets/css/styles.css" />
112	<link rel="stylesheet" type="text/css" href="/Views/Themes/decor/V1/Assets/css/style-rtl.css" />
113
114
115	
116	
117	<!-- Favicon and Touch Icons - absolute URL from current domain -->
118	<link rel="shortcut icon" href="https://houseofhm.com/favicon.ico" type="image/x-icon" />
119	<link rel="icon" href="https://houseofhm.com/favicon.ico" type="image/x-icon" />
120	<link rel="apple-touch-icon" href="https://houseofhm.com/favicon.ico" />
121	
122
123
124
125
126	
127	
127<script src="/__bundles/LeptonXLite.Global.B846B3168EDD81627CD98A42A8109A0A.js" defer></script>
127
128	
129	
129<script src="/libs/jquery-validation/localization/messages_ar.js" defer></script>
129
130	
131	
131<script src="/libs/select2/js/i18n/ar.js" defer></script>
131
132	
133	
133<script src="/libs/timeago/locales/jquery.timeago.ar.js" defer></script>
133
134	
135	
135<script src="/libs/bootstrap-datepicker/locales/bootstrap-datepicker.ar.min.js" defer></script>
135
136	
137	
137<script src="/libs/moment/locale/ar.js" defer></script>
137
138	
139	
139<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.prod.js" defer></script>
139
140
141
142
143	
143<script>
144
145		window.cultureInfo = {
146			currentLang: "ar",
147		};
148
149	</script>
149
150
151
152
153	
154
155
156
157
158
159
160
161<script src="https://cdn.jsdelivr.net/npm/@microsoft/[email protected]/dist/browser/signalr.min.js" defer></script>
161
162
163<script src="https://cdn.jsdelivr.net/npm/disable-devtool" defer></script>
163
164
165
166
167<!-- // Live Environment For Saudi Arabia -->
168<script src="https://sa.myfatoorah.com/payment/v1/session.js" defer></script>
168
169
170
171
172
173
174
175<script src="https://cdn.jsdelivr.net/npm/paymob-pixel@latest/main.js" type="module"></script>
175
176
177
178<!-- ===== AI-CHANGE START [LIQUID][AI-DONE][LIQUID-20260203-01] =====
179reason: load MISpay widget SDK once in shared head based on tenant MISpay settings
180scope: add conditional script tag that references sandbox MISpay widget SDK using store.MisPayAccessKey when MISpay and widget are enabled
181risk: low
182===== AI-CHANGE END ===== -->
183
184
185
186
187
188
189
190
191
192
193	<style>
194	.myfatoorah-payment-section {
195	border-radius: 12px;
196	padding: 20px;
197	margin-top: 20px;
198	}
199
200	.payment-methods-accordion .card {
201	border: unset;
202	background-color: #fbfbfc;
203	border-radius: 10px;
204	}
205
206	#cardPaymentHeader .btn {
207	text-decoration: none;
208	}
209
210	#cardPaymentHeader {
211	background: #f7f7f7;
212	border: none;
213	}
214
215	#applePayHeader .btn,
216	#stcPayHeader .btn {
217	text-decoration: unset;
218	color: black;
219	font-size: 18px;
220	font-weight: 600;
221	}
222
223	#applePayHeade,
224	.card-header {
225	border: unset !important;
226	}
227
228	#stcPayHeader {
229	border: unset !important;
230	}
231
232	.variant-picker-item.variant-size .variant-picker-values input:checked+label.style-text:not(.color-btn) {
233	background-color: var(--text);
234	}
235
236	.variant-picker-item.variant-size .variant-picker-values input:checked+label.style-text:not(.color-btn) p {
237	color: var(--white);
238	}
239
240	.statistics-icon {
241	max-width: 100px;
242	margin: auto;
243	background-color: aliceblue;
244	padding: 20px;
245	border-radius: 20px;
246	}
247
248	.justify-center {
249	justify-content: center;
250	align-items: center;
251	gap: 10px;
252	}
253
254	.accordion-button::after {
255	margin-left: unset;
256	margin-right: auto;
257	}
258
259	.accordion-button {
260	background-color: unset !important
261	}
262
263	.accordion-item {
264	border: unset;
265	border-bottom: 1px solid black;
266
267	}
268
269	.selected-address-summary {
270	padding: 15px !important;
271	border-radius: 10px !important;
272	}
273
274	.accordion-button span {
275	line-height: 1;
276	font-weight: 600;
277	font-size: 20px;
278	}
279
280	.accordion-item {
281	border-radius: 0 !important;
282	border-bottom: 1px solid #e1e1e1;
283	margin-bottom: 15px !important
284	}
285
286
287	.accordion-button:focus {
288	border-color: unset;
289	outline: 0;
290	box-shadow: unset;
291	}
292
293	.tab-reviews .rating-score .number-2 {
294	width: 45px !important;
295	}
296
297	.div-aligned-footer{
298	flex-direction: column;
299	align-items: center;
300	display: flex;
301	gap:5px;
302	justify-content: center;
303	}
304
305	.gap-20px{
306	gap:20px !important;
307
308	}
309
310	.div-aligned-footer span{
311	font-size: 13px!important;
312	text-align: center;
313	color: var(--text);
314	}
315
316	.mt-20px{
317	margin-top:20px !important;
318
319	}
320
321	.btn-close{
322	margin-right: auto!important;
323	margin-left: unset!important;
324	}
325
326
327	.wrap-slider .box-content{
328	top: 85%;
329	}
330
331	.wrap-slider .box-content .fade-item a.tf-btn {
332	margin-top: 0;
333	}
334
335</style>
336
337
338
339<style>
340	.btn-underline{
341	text-decoration: underline;
342	color: var(--footer-bg) !important;
343
344	}
345	.bg-soft-primary {
346	background-color: rgb(251 251 252) !important;
347	}
348
349	.bg-soft-success {
350	background-color: rgba(40, 167, 69, 0.1) !important;
351	}
352
353	/* Address Card Styles */
354	.address-card {
355	transition: all 0.3s ease;
356	}
357
358	.address-card-inner {
359	transition: all 0.3s ease;
360	position: relative;
361	overflow: hidden;
362	}
363
364	.address-card-inner:hover {
365	transform: translateY(-2px);
366	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
367	}
368
369	.address-card-selected .address-card-inner {
370	border-color: var(--bs-primary, #007bff) !important;
371	box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2) !important;
372	background: linear-gradient(135deg, rgb(231 231 231) 0%, rgba(255, 255, 255, 1) 100%);
373	;
374	}
375
376	.address-card-selected .address-card-inner:hover {
377	box-shadow: 0 4px 16px rgba(0, 123, 255, 0.3) !important;
378	}
379
380	.address-actions {
381	transition: opacity 0.3s ease;
382	}
383
384	.address-card:hover .address-actions {
385	opacity: 1;
386	}
387
388	.contact-info {
389	display: flex;
390	flex-direction: column;
391	gap: 4px;
392	}
393
394	.address-details {
395	background: #f8f9fa;
396	padding: 12px;
397	border-radius: 6px;
398	border-left: 3px solid var(--secondary);
399	}
400
401	.selected-address-summary {
402	animation: slideIn 0.3s ease;
403	}
404
405	@keyframes slideIn {
406	from {
407	opacity: 0;
408	transform: translateY(-10px);
409	}
410
411	to {
412	opacity: 1;
413	transform: translateY(0);
414	}
415	}
416
417	/* Radio button styling */
418	.radio-wrapper input[type="radio"] {
419	cursor: pointer;
420	}
421
422
423	/* Button hover effects */
424	.address-actions .btn {
425	transition: all 0.2s ease;
426	}
427
428	.address-actions .btn:hover {
429	transform: translateY(-1px);
430	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
431	}
432
433	.address-actions .btn-outline-danger:hover {
434	background-color: var(--bs-danger);
435	color: white;
436	}
437
438	.address-actions .btn-outline-primary:hover {
439	background-color: var(--bs-primary);
440	color: white;
441	}
442
443	.address-actions .btn-outline-secondary:hover {
444	background-color: var(--secondary) !important;
445	border: unset !important;
446	color: white;
447	}
448
449	/* Responsive adjustments */
450	@media (max-width: 768px) {
451	.address-card-inner {
452	padding: 15px !important;
453	}
454
455	.address-actions {
456	flex-direction: column;
457	}
458
459	.address-actions .btn {
460	width: 100%;
461	}
462	}
463
464
465	.address-card .address-card-inner {
466	box-shadow: 0 0 20px #00000021 !important;
467	background-color: #fbfbfc !important;
468	border: 1px solid #d5d5d5 !important;
469	padding: 20px !important;
470	}
471
472	.main-location {
473	top: 15px;
474	left: 15px;
475	padding: 6px 12px;
476	font-size: 11px;
477	font-weight: 600;
478	border-radius: 20px;
479	}
480
481	.radio-address-btn {
482	width: 20px;
483	height: 20px;
484	cursor: pointer;
485	accent-color: #000000 !important;
486
487	}
488
489	.close-address-modal {
490	margin-right: auto !important;
491	margin-left: unset !important;
492	}
493
494	.btn {
495	border-radius: 50px !important;
496	}
497
498	.box-location-address {
499	padding: 15px !important;
500	margin-top: 15px !important;
501	}
502
503	.btn-loc {
504	background-color: var(--secondary) !important;
505	border: unset !important;
506	color: var(--white) !important;
507	gap: 10px !important;
508	}
509
510	.location-details {
511	padding: 15px !important;
512	}
513
514	.model-address label {
515	font-weight: 600 !important;
516	font-size: 16px !important;
517	color: var(--text) !important;
518	}
519
520	.form-check .form-check-input {
521	margin-left: unset !important;
522	margin-right: 0em !important;
523	}
524
525
526	.selected-address-summary {
527	background-color: rgba(var(--secondary), 0.5) !important;
528	border: 1px solid var(--secondary) !important;
529
530	}
531
532
533	.delivery-rate {
534	font-size: 16px !important;
535	}
536
537	.selected-courier {
538	border: 2px solid var(--secondary) !important;
539	background: linear-gradient(135deg, rgb(231 231 231) 0%, rgba(255, 255, 255, 1) 100%);
540	}
541
542	.courier-logo-img {
543	width: 120px;
544	height: 50px;
545	position: relative;
546	border-radius: 50px;
547	overflow: hidden;
548	}
549
550	.courier-logo-img img {
551	width: 100%;
552	height: 100%;
553	object-fit: cover;
554	}
555	.attach-div {
556	align-items: start!important;
557	border-bottom: 1px solid #e1e1e1!important;
558	}
559
560	.attach-div .content{
561	width: 100%!important;
562	}
563	.attachment-item{
564	margin-bottom: 15px!important;
565	justify-content: space-between!important;
566	}
567
568	.text-darkk{
569	color: var(--text)!important;
570	}
571	body .widget-tabs .widget-content-tab .text-darkk .fs-25{
572	font-size: 25px!important;
573	}
574
575	/* Add this to your stylesheet */
576	.veri01, .veri02, .veri03 {
577	flex: 1 1 0; /* Equal width for all items */
578	min-width: 120px; /* Minimum width for each item */
579	}
580
581	.icon-container {
582	height: 40px; /* Fixed height for icons */
583	display: flex;
584	align-items: center;
585	justify-content: center;
586	}
587
588	.div-aligned-footer {
589	padding: 15px 10px;
590	border-radius: 8px;
591	transition: all 0.3s ease;
592	}
593
594	.decor-slider {
595	position: relative;
596	}
597
598	.container.wrap-navigation {
599	display: flex;
600	width: 100%;
601	flex-direction: row-reverse;
602	position: absolute;
603	top: 50%;
604	left: 0;
605	z-index: 999;
606	justify-content: space-between;
607	align-items: center;
608	}
609	.snap-icon svg {
610	fill:var(--footer-text);
611	}
612	.snap-icon a:hover{
613	background:#f7f200;
614	border:1px solid #f7f200 !important;
615	}
616
617	.snap-icon a:hover {
618	background: #f7f200!important;
619	}
620
621	.Paymentscreen{
622	min-height: 100vh;
623	display: flex;
624	justify-content: center;
625	align-items: center;
626
627	}
628
629	.confii{
630	background:url('/Images/confii.png') no-repeat center center fixed;
631	background-size: cover;)
632	}
633
634	.img-payment-result svg{
635	width: 138px;
636	height: auto;
637	margin-bottom: 20px;
638	}
639
640	.login-tabs-main{
641
642	display: inline-block;
643
644	}
645
646	.login-tabs{
647	background-color: #f5f5f5;
648	padding: 12px 20px;
649	border-radius: 50px;
650	font-weight: 600;
651	display: flex;
652	align-items: center;
653	justify-content: center;
654	}
655
656	.login-tab-btn.active{
657	background-color:var(--footer-bg);
658	padding:9px 20px 5px;
659	border-radius: 50px;
660	color: white;
661
662	}
663
664	#loginForm{
665	text-align: center;
666
667	}
668
669	#loginForm .tf-field{
670	text-align: right;
671	}
672
673	#bankTransferFile{
674	width: 100%;
675	border-radius: 0;
676	height: 100%;
677	}
678
679	.card-product .card-product-wrapper .on-sale-wrap.promo-item {
680	bottom: 0 !important;
681	top: unset;
682	}
683
684	/* ===== AI-CHANGE START [UI][AI-DONE][FEATURE-20260917-33] ===== */
685	.card-product .card-product-wrapper .on-sale-wrap.offer-list-badges {
686		display: flex;
687		flex-direction: column;
688		align-items: flex-end;
689		gap: 4px;
690	}
691
692	.card-product .card-product-wrapper .on-sale-wrap.offer-list-badges .on-sale-item,
693	.rtl .card-product .card-product-wrapper .on-sale-wrap.offer-list-badges .on-sale-item {
694		display: inline-flex;
695		align-items: center;
696		justify-content: center;
697		gap: 4px;
698		width: auto;
699		max-width: 100%;
700		min-width: 0;
701		padding: 4px 10px;
702		line-height: 1;
703		white-space: nowrap;
704		word-break: normal;
705		direction: rtl;
706		overflow: visible;
707	}
708
709	.card-product .card-product-wrapper .on-sale-wrap.offer-list-badges .on-sale-item .icon-saudi_riyal {
710		font-size: 18px !important;
711		width: 1em;
712		height: 1em;
713		line-height: 1;
714		display: inline-block;
715		flex: 0 0 auto;
716	}
717
718	.tf-product-info-price .badges-on-sale {
719		display: inline-flex;
720		align-items: center;
721		gap: 4px;
722		direction: rtl;
723		white-space: nowrap;
724	}
725
726	.tf-product-info-price .badges-on-sale .icon-saudi_riyal {
727		font-size: 18px !important;
728		width: 1em;
729		height: 1em;
730		line-height: 1;
731		display: inline-block;
732		flex: 0 0 auto;
733	}
734	/* ===== AI-CHANGE END ===== */
735
736	/* ===== AI-CHANGE START [UI][AI-DONE][FEATURE-20260917-36] ===== */
737	.tf-page-cart-checkout .tf-cart-totals-discounts .total-value,
738	.tf-mini-cart-bottom-wrap .tf-cart-totals-discounts .price,
739	.cart-money,
740	.cart-price {
741		display: inline-flex !important;
742		flex-direction: row !important;
743		flex-wrap: nowrap !important;
744		align-items: center !important;
745		gap: 4px;
746		white-space: nowrap !important;
747		min-width: max-content;
748	}
749
750	.tf-page-cart-checkout .tf-cart-totals-discounts .total-value .icon-saudi_riyal,
751	.tf-mini-cart-bottom-wrap .tf-cart-totals-discounts .price .icon-saudi_riyal,
752	.cart-money .icon-saudi_riyal,
753	.cart-price .icon-saudi_riyal {
754		font-size: 18px !important;
755		width: 18px !important;
756		height: 18px !important;
757		line-height: 1 !important;
758		display: inline-block !important;
759		flex: 0 0 18px !important;
760		order: unset !important;
761	}
762
763	.tf-mini-cart-bottom-wrap .tf-cart-totals-discounts .price .totalCartPrice {
764		display: inline !important;
765	}
766	/* ===== AI-CHANGE END ===== */
767
768	.card-product .card-product-wrapper .on-sale-wrap.promo-item .on-sale-item {
769	background-color: var(--primary);
770	color: var(--white);
771	font-size: 12px !important;
772	}
773	
774	
775	
776	
777    .tf-social-icon .social-youtube:hover {
778        background: var(--youtube-cl) !important;
779        color: var(--white);
780    }
781
782        .tf-social-icon .social-line.social-facebook:hover {
783            background: transparent;
784            color: white !important;
785            border-color: var(--facebook-cl);
786        }
787
788        .tf-social-icon .social-line.social-twiter:hover {
789            background: transparent;
790            color: white;
791            border-color: var(--twitter-cl);
792        }
793
794        .tf-social-icon .social-line.social-instagram:hover {
795            background: transparent;
796            color: var(--threads-cl);
797            border-color: var(--threads-cl);
798        }
799
800        .tf-social-icon .social-line.social-tiktok:hover {
801            background: transparent;
802            color: var(--tiktok-cl2);
803            border-color: var(--tiktok-cl2);
804        }
805
806        .tf-social-icon .social-line.social-pinterest:hover {
807            background: transparent;
808            color: var(--pinterest-cl);
809            border-color: var(--pinterest-cl);
810        }
811
812        .tf-social-icon .social-line.social-youtube:hover {
813            background: transparent;
814            color: white !important;
815            border-color: var(--youtube-cl);
816        }
817
818    .tf-social-icon.style-default li {
819        display: inline-flex;
820    }
821
822        .tf-social-icon.style-default li a {
823            border: 0 !important;
824        }
825
826            .tf-social-icon.style-default li a:hover {
827                background: unset !important;
828            }
829
830        .tf-social-icon.style-default li .social-facebook:hover {
831            color: var(--facebook-cl);
832        }
833
834        .tf-social-icon.style-default li .social-twiter:hover {
835            color: var(--twitter-cl);
836        }
837
838        .tf-social-icon.style-default li .social-instagram:hover {
839            color: var(--threads-cl);
840        }
841
842        .tf-social-icon.style-default li .social-tiktok:hover {
843            color: var(--tiktok-cl2);
844        }
845
846        .tf-social-icon.style-default li .social-pinterest:hover {
847            color: var(--pinterest-cl);
848        }
849
850        .tf-social-icon.style-default li .social-youtube:hover {
851            color: var(--youtube-cl);
852        }
853
854	/* ===== AI-CHANGE START [UI][AI-DONE][NOTIF-20260909-05] ===== */
855	.notify-outline {
856		display: block;
857		width: 18px;
858		height: 18px;
859		background-color: currentColor;
860		/* ===== AI-CHANGE START [UI][AI-DONE][NOTIF-20260909-07] ===== */
861		/* reason: bell stroke was thinner than bag/heart/account/search icomoon glyphs */
862		/* scope: raise SVG mask stroke-width from 1.7 to 2.4 */
863		/* risk: low */
864		/* ===== AI-CHANGE END ===== */
865		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9'%3E%3C/path%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat;
866		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9'%3E%3C/path%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat;
867	}
868	.tf-toolbar-bottom .toolbar-item a .toolbar-icon .notify-outline {
869		color: var(--text);
870	}
871	/* ===== AI-CHANGE START [UI][AI-DONE][NOTIF-20260909-12] ===== */
872	.notification-item.notification-unread {
873		cursor: pointer;
874	}
875	/* ===== AI-CHANGE END ===== */
876	/* ===== AI-CHANGE END ===== */
877
878	/* ===== AI-CHANGE START [UI][AI-DONE][UI-20260922-01] =====
879	reason: address map needs a search field and a visible location-access hint
880	scope: checkout address map search and hint overlay
881	risk: low
882	===== AI-CHANGE END ===== */
883	.address-map-tools {
884		display: flex;
885		flex-direction: column;
886		gap: 10px;
887	}
888
889	.address-map-search {
890		display: flex;
891		align-items: stretch;
892		gap: 8px;
893	}
894
895	.address-map-search .form-control {
896		flex: 1 1 auto;
897		min-width: 0;
898		min-height: 44px;
899	}
900
901	.address-map-search-btn {
902		flex: 0 0 auto;
903		min-height: 44px;
904		padding-inline: 16px;
905		border: 0;
906		border-radius: 50px;
907		background: var(--secondary);
908		color: var(--white);
909		font-weight: 600;
910	}
911
912	.address-map-search-error {
913		margin: 0;
914		font-size: 13px;
915	}
916
917	.address-map-frame {
918		position: relative;
919		height: 300px;
920		border-radius: 8px;
921		border: 1px solid var(--line);
922		overflow: hidden;
923	}
924
925	#address-modal-map {
926		height: 100%;
927		width: 100%;
928	}
929
930	.map-location-hint-backdrop {
931		position: absolute;
932		inset: 0;
933		z-index: 3;
934		display: flex;
935		align-items: center;
936		justify-content: center;
937		padding: 12px;
938		background: rgba(0, 0, 0, 0.28);
939	}
940
941	.map-location-hint {
942		width: min(100%, 340px);
943		max-height: 100%;
944		overflow: auto;
945		display: flex;
946		flex-direction: column;
947		gap: 8px;
948		padding: 14px;
949		border-radius: 12px;
950		background: var(--white);
951		text-align: center;
952		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
953	}
954
955	.map-location-hint-title {
956		margin: 0;
957		font-size: 16px;
958		font-weight: 700;
959		color: var(--text);
960	}
961
962	.map-location-hint-text {
963		margin: 0;
964		font-size: 14px;
965		line-height: 1.5;
966		color: var(--text);
967	}
968
969	.map-location-hint-actions {
970		display: flex;
971		flex-wrap: wrap;
972		justify-content: center;
973		gap: 8px;
974		margin-top: 4px;
975	}
976
977	.map-location-hint-actions .tf-btn,
978	.map-location-hint-actions .btn {
979		min-height: 40px;
980		padding-inline: 18px;
981	}
982
983	.pac-container {
984		z-index: 2000 !important;
985	}
986
987	@media (max-width: 430px) {
988		.map-location-hint-actions {
989			flex-direction: column;
990		}
991
992		.map-location-hint-actions .tf-btn,
993		.map-location-hint-actions .btn {
994			width: 100%;
995		}
996	}
997</style>
998
999
1000
1001
1002
1003<style>
1004	.oc-page {
1005		width: 100%;
1006		padding: 28px 0 56px;
1007	}
1008
1009	.oc-page .oc-hero,
1010	.oc-page .oc-card,
1011	.oc-page .oc-layout,
1012	.oc-page .oc-actions,
1013	.oc-page .oc-steps {
1014		width: 100%;
1015		box-sizing: border-box;
1016	}
1017
1018	.oc-page .oc-hero {
1019		text-align: center;
1020		background: color-mix(in srgb, var(--primary) 16%, var(--white));
1021		border: 1px solid var(--line);
1022		border-radius: 20px;
1023		padding: 36px 20px 28px;
1024		margin-bottom: 20px;
1025	}
1026
1027	.oc-page .oc-check {
1028		width: 72px;
1029		height: 72px;
1030		margin: 0 auto 14px;
1031		border-radius: 50%;
1032		display: flex;
1033		align-items: center;
1034		justify-content: center;
1035		background: var(--primary);
1036		color: var(--white);
1037	}
1038
1039	.oc-page .oc-title {
1040		margin: 0 0 8px;
1041		font-size: 32px !important;
1042		line-height: 1.35 !important;
1043		font-weight: 700 !important;
1044		color: var(--text);
1045	}
1046
1047	.oc-page .oc-subtitle {
1048		margin: 0;
1049		font-size: 16px;
1050		line-height: 1.6;
1051		color: #0d1f46 !important;
1052	}
1053
1054	.oc-page .oc-chips {
1055		display: flex;
1056		flex-wrap: wrap;
1057		justify-content: center;
1058		gap: 8px;
1059		margin-top: 18px;
1060	}
1061
1062	.oc-page .oc-chip {
1063		display: inline-flex;
1064		align-items: center;
1065		background: var(--white);
1066		border: 1px solid var(--line);
1067		border-radius: 999px;
1068		padding: 8px 14px;
1069		font-size: 14px;
1070		line-height: 1.4;
1071		color: var(--text);
1072	}
1073
1074	.oc-page .oc-chip-ok {
1075		background: var(--primary);
1076		border-color: var(--primary);
1077		color: var(--white);
1078	}
1079
1080	.oc-page .oc-layout {
1081		display: grid;
1082		grid-template-columns: minmax(0, 1fr);
1083		gap: 16px;
1084	}
1085
1086	.oc-page .oc-card {
1087		display: block;
1088		background: var(--white);
1089		border: 1px solid var(--line);
1090		border-radius: 16px;
1091		padding: 20px;
1092	}
1093
1094	.oc-page .oc-card-title {
1095		display: block;
1096		margin: 0 0 8px;
1097		font-size: 20px !important;
1098		line-height: 1.4 !important;
1099		font-weight: 700 !important;
1100		color: var(--text);
1101	}
1102
1103	.oc-page .oc-map {
1104		display: block;
1105		width: 100%;
1106		height: 180px;
1107		border: 0;
1108		border-radius: 12px;
1109		margin: 12px 0;
1110		background: var(--bg-2);
1111	}
1112
1113	.oc-page .oc-line,
1114	.oc-page .oc-stack,
1115	.oc-page .oc-note {
1116		display: block;
1117		width: 100%;
1118		padding: 12px 0;
1119		border-bottom: 1px solid var(--line);
1120	}
1121
1122	.oc-page .oc-line {
1123		display: flex;
1124		justify-content: space-between;
1125		align-items: flex-start;
1126		gap: 16px;
1127	}
1128
1129	.oc-page .oc-label {
1130		display: block;
1131		color: var(--text-2);
1132		font-size: 14px;
1133		line-height: 1.6;
1134		font-weight: 500;
1135	}
1136
1137	.oc-page .oc-value {
1138		display: block;
1139		color: var(--text);
1140		font-size: 15px;
1141		line-height: 1.7;
1142		font-weight: 600;
1143		text-align: start;
1144	}
1145
1146	.oc-page .oc-line .oc-value {
1147		text-align: end;
1148	}
1149
1150	.oc-page .oc-note {
1151		color: var(--text-2);
1152		font-size: 14px;
1153		line-height: 1.7;
1154	}
1155
1156	.oc-page .oc-products {
1157		display: flex;
1158		flex-direction: column;
1159		gap: 14px;
1160		margin-top: 12px;
1161	}
1162
1163	.oc-page .oc-product {
1164		display: flex;
1165		align-items: center;
1166		gap: 12px;
1167		width: 100%;
1168	}
1169
1170	.oc-page .oc-product img {
1171		width: 84px;
1172		height: 84px;
1173		max-width: 84px;
1174		object-fit: cover;
1175		border-radius: 12px;
1176		background: var(--bg-2);
1177		flex: 0 0 84px;
1178	}
1179
1180	.oc-page .oc-product-info {
1181		display: flex;
1182		flex-direction: column;
1183		gap: 4px;
1184		flex: 1 1 auto;
1185		min-width: 0;
1186	}
1187
1188	.oc-page .oc-product-name {
1189		display: block;
1190		color: var(--text);
1191		font-size: 15px;
1192		font-weight: 700;
1193		line-height: 1.5;
1194	}
1195
1196	.oc-page .oc-meta {
1197		display: block;
1198		color: var(--text-2);
1199		font-size: 13px;
1200		line-height: 1.5;
1201	}
1202
1203	.oc-page .oc-gift {
1204		display: inline-flex;
1205		width: fit-content;
1206		background: color-mix(in srgb, var(--primary) 18%, var(--white));
1207		color: var(--text);
1208		border-radius: 999px;
1209		padding: 2px 8px;
1210		font-size: 12px;
1211	}
1212
1213	.oc-page .oc-product-price {
1214		flex: 0 0 auto;
1215		color: var(--text);
1216		font-size: 15px;
1217		font-weight: 700;
1218		white-space: nowrap;
1219	}
1220
1221	.oc-page .oc-totals {
1222		list-style: none;
1223		margin: 16px 0 0;
1224		padding: 0;
1225	}
1226
1227	.oc-page .oc-totals li {
1228		display: flex;
1229		justify-content: space-between;
1230		align-items: center;
1231		gap: 12px;
1232		padding: 8px 0;
1233		color: var(--text-2);
1234		font-size: 14px;
1235	}
1236
1237	.oc-page .oc-totals strong {
1238		color: var(--text);
1239		font-weight: 700;
1240	}
1241
1242	.oc-page .oc-grand {
1243		margin-top: 6px;
1244		padding: 14px 12px !important;
1245		border-radius: 12px;
1246		background: color-mix(in srgb, var(--primary) 14%, var(--white));
1247		font-size: 16px;
1248	}
1249
1250	.oc-page .oc-actions {
1251		display: flex;
1252		flex-wrap: wrap;
1253		gap: 12px;
1254		margin-top: 16px;
1255	}
1256
1257	.oc-page .oc-actions .tf-btn {
1258		flex: 1 1 220px;
1259		min-height: 48px;
1260		padding: 12px 20px;
1261	}
1262
1263	.oc-page .oc-steps-card {
1264		margin-top: 16px;
1265	}
1266
1267	.oc-page .oc-steps {
1268		list-style: none;
1269		display: grid;
1270		grid-template-columns: 1fr;
1271		gap: 12px;
1272		margin: 12px 0 0;
1273		padding: 0;
1274	}
1275
1276	.oc-page .oc-steps li {
1277		display: flex;
1278		align-items: center;
1279		gap: 10px;
1280		color: var(--text-2);
1281		font-size: 14px;
1282	}
1283
1284	.oc-page .oc-steps span {
1285		width: 28px;
1286		height: 28px;
1287		border-radius: 50%;
1288		display: flex;
1289		align-items: center;
1290		justify-content: center;
1291		border: 1px solid var(--line);
1292		background: var(--white);
1293		color: var(--text-2);
1294		font-size: 13px;
1295		flex: 0 0 28px;
1296	}
1297
1298	.oc-page .oc-steps .is-done,
1299	.oc-page .oc-steps .is-current {
1300		color: var(--text);
1301		font-weight: 700;
1302	}
1303
1304	.oc-page .oc-steps .is-done span,
1305	.oc-page .oc-steps .is-current span {
1306		background: var(--primary);
1307		border-color: var(--primary);
1308		color: var(--white);
1309	}
1310
1311	.oc-page .oc-help {
1312		display: block;
1313		width: 100%;
1314		text-align: center;
1315		margin: 20px 0 0;
1316		color: var(--text-2);
1317		font-size: 15px;
1318	}
1319
1320	.oc-page .oc-help a {
1321		color: var(--text);
1322		font-weight: 700;
1323		margin-inline-start: 6px;
1324	}
1325
1326	@media (min-width: 992px) {
1327		.oc-page .oc-layout {
1328			grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
1329			align-items: start;
1330		}
1331
1332		.oc-page .oc-steps {
1333			grid-template-columns: repeat(4, minmax(0, 1fr));
1334		}
1335	}
1336</style>
1337
1338
1339
1340<style>
1341	:root { --primary: #AB4429; --secondary: #4e1b0e; --secondary-lignt-bg: #4e1b0e33; --text-2: #AB4429; --text: #AB4429; --footer-bg: #AB4429; --fontar: "PingAR", sans-serif; --footer-text: #4e1b0e; }
1342</style>
1343
1344
1345
1346
1347
1348<style>
1349	body:after,body:before{z-index:999999999999999999;position:fixed;content:"";opacity:0;top:0;height:100%}body:before,header{background-color:var(--body)}.flat-title .heading,.nav-cart .count-box,.variant-picker-item .variant-picker-values input:checked+label.style-text:not(.color-btn) p{color:var(--third-color)!important}.card,.flat-title{position:relative}.card,footer{overflow:hidden}:root{--main-color:#4e1b0e;--second-color:#AB4429;--third-color:white;--fourth-color:black;--body:white;--logo:url(https://houseofhm.com/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/storeScreenshots/0901e432-6c0a-4a2e-9c19-9126f6c8dc26.png)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body#app{background:var(--body)!important}::-webkit-scrollbar{width:12px;height:12px;background:var(--body)}::-webkit-scrollbar-track{background:var(--body);border-radius:10px}::-webkit-scrollbar-thumb{background:linear-gradient(45deg,var(--second-color),var(--main-color));border-radius:10px;border:2px solid var(--body);transition:background .3s}.card,.d-flex img{transition:.5s cubic-bezier(.23, 1, .32, 1)}::-webkit-scrollbar-thumb:hover{background:var(--main-color)}::selection{color:var(--main-color);background:var(--second-color)}body:before{left:0;width:0;animation:2.7s intro}body:after{background-image:var(--logo)!important;background-position-y:center;background-position-x:center;background-size:25%;background-repeat:no-repeat;width:0%;right:0;animation:2.5s intro_logo}@keyframes intro{0%{width:100%;opacity:1}40%,80%{opacity:1}99%{width:100%}100%{width:0;opacity:0;display:none}}@keyframes intro_logo{0%{width:100%;height:110%;opacity:0}
134950%,70%,80%{opacity:1}99%{width:100%;height:100%}100%{width:0;opacity:0;display:none}}.nav-cart .count-box{background:linear-gradient(135deg,var(--second-color),color-mix(in srgb,var(--second-color) 80%,var(--fourth-color)))!important;font-weight:700;transition:.3s;animation:2.5s ease-in-out infinite goldenPulse;box-shadow:0 0 15px rgb(from var(--second-color) r g b / .4)}.card::after,.card::before{transition:opacity .5s;opacity:0}@keyframes goldenPulse{0%,100%{transform:scale(1);box-shadow:0 0 15px rgb(from var(--second-color) r g b / .4)}50%{transform:scale(1.12);box-shadow:0 0 25px rgb(from var(--second-color) r g b / .7)}}.nav-cart:hover .count-box{animation:none;transform:scale(1.25);box-shadow:0 0 30px rgb(from var(--second-color) r g b / .9)}.nav-search .nav-icon-item:hover i{animation:.6s searchRotate}@keyframes searchRotate{0%,100%{transform:rotate(0)}25%{transform:rotate(-15deg) scale(1.1)}75%{transform:rotate(15deg) scale(1.1)}}.nav-account .nav-icon-item:hover i{animation:.5s accountJump}@keyframes accountJump{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}.nav-cart .nav-icon-item:hover i{animation:.5s cartShake}@keyframes cartShake{0%,100%{transform:rotate(0)}25%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}75%{transform:rotate(-5deg)}}.wrap-slider img{max-height:100%!important}.swiper-slide a.tf-btn.btn-sm.radius-3.btn-fill.btn-icon,section.flat-spacing-18.decor-slider{display:none}.footer .footer-infor>a,.nav-sw.style-var(--third-color).nav-next-slider.navigation-next-slider.box-icon.w_46.round,.nav-sw.style-var(--third-color).nav-prev-slider.navigation-prev-slider.box-icon.w_46.round,.tf-product-info-delivery-return{display:none!important}.decor-slider{margin:0!important;border-radius:0!important}.flat-title{padding-bottom:25px;margin-bottom:50px}.flat-title .heading{font-size:42px!important;font-weight:700!important;text-align:center;letter-spacing:2px;text-transform:uppercase;background:linear-gradient(135deg,var(--third-color) 0,var(--second-color) 50%,var(--third-color) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;display:inline-block;animation:3s ease-in-out infinite titleShine}@keyframes titleShine{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}.flat-title .heading::before{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,transparent 0,rgb(from var(--second-color) r g b / .3) 50%,transparent 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:blur(10px);opacity:.7;z-index:-1}.flat-title::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:120px;height:4px;background:linear-gradient(90deg,transparent,var(--second-color),transparent);border-radius:10px;box-shadow:0 0 20px rgb(from var(--second-color) r g b / .6),0 0 40px rgb(from var(--second-color) r g b / .3);animation:2s ease-in-out infinite lineGrow}.flat-title .heading::after,.flat-title::before{content:'✦';top:50%;transform:translateY(-50%);color:var(--second-color);font-size:24px}@keyframes lineGrow{0%,100%{width:120px;box-shadow:0 0 20px rgb(from var(--second-color) r g b / .6),0 0 40px rgb(from var(--second-color) r g b / .3)}50%{width:180px;box-shadow:0 0 30px rgb(from var(--second-color) r g b / .8),0 0 60px rgb(from var(--second-color) r g b / .5)}}.flat-title::before{position:absolute;left:-50px;animation:2s ease-in-out infinite starTwinkle}.card::before,section.subscribe-form::before{position:absolute;top:0;left:0;pointer-events:none;content:''}.flat-title .heading::after{position:absolute;right:-50px;animation:2s ease-in-out 1s infinite starTwinkle}@keyframes starTwinkle{0%,100%{opacity:.3;transform:translateY(-50%) scale(1)}50%{opacity:1;transform:translateY(-50%) scale(1.3)}}@media (max-width:768px){.flat-title .heading{font-size:28px!important}.flat-title .heading::after,.flat-title::before{display:none}section:has(.tf-slideshow){padding:40px 0 60px}}.card{border:none!important;border-radius:20px!important;background:var(--third-color)!important;box-shadow:0 8px 32px rgb(from var(--fourth-color) r g b / .08),0 2px 12px rgb(from var(--fourth-color) r g b / .04)!important;height:100%!important;animation:.6s ease-out forwards slideUp}.card::before{right:0;bottom:0;background:linear-gradient(135deg,rgb(from var(--third-color) r g b / .4) 0,rgba(240,247,255,.2) 100%);z-index:1}
1349.card:hover{transform:translateY(-16px) scale(1.02);box-shadow:0 24px 48px rgb(from var(--fourth-color) r g b / .15),0 12px 24px rgb(from var(--fourth-color) r g b / .1)!important}.card:hover::after,.card:hover::before{opacity:1}.card:hover .d-flex.justify-content-center{transform:scale(1.08) rotate(-2deg)}.d-flex img{filter:drop-shadow(0 8px 16px rgb(from var(--fourth-color) r g b / .1))}.card:hover .d-flex img{transform:scale(1.1);filter:drop-shadow(0 12px 24px rgb(from var(--fourth-color) r g b / .15))}.card-title{font-size:22px!important;font-weight:700!important;color:#1a202c!important;margin-bottom:12px!important;transition:.4s}.card:hover .card-title{color:var(--main-color)!important;transform:scale(1.05)}.card:hover .card-text,.testimonial-item .text{color:#2d3748!important}.card-text{font-size:15px!important;color:#718096!important;line-height:1.6!important;transition:color .4s}.card::after{content:'';position:absolute;top:-50%;right:-50%;width:200px;height:200px;background:radial-gradient(circle,rgb(from var(--third-color) r g b / .6) 0,transparent 70%);pointer-events:none}@keyframes slideUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.col-md-4:first-child .card{animation-delay:.1s}.col-md-4:nth-child(2) .card{animation-delay:.2s}.col-md-4:nth-child(3) .card{animation-delay:.3s}.testimonial-item.style-column{background:var(--third-color)!important;border-radius:20px!important;padding:30px 25px!important;position:relative;overflow:hidden!important;transition:.4s!important;border:2px solid #f0f0f0!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;box-shadow:0 8px 20px rgb(from var(--fourth-color) r g b / .08)!important;margin:20px 12px!important}.testimonial-item.style-column:hover{transform:translateY(-8px)!important;border-color:var(--main-color)!important;box-shadow:0 16px 32px rgba(69,142,137,.15)!important}.testimonial-item .text{font-size:15px!important;font-weight:500!important;line-height:1.7!important;display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical!important;overflow:hidden!important;text-overflow:ellipsis!important;flex-grow:1!important}.testimonial-item .text::before{content:'"';font-size:35px;color:var(--second-color);opacity:.4;position:absolute;top:5px;right:15px}.nav-sw,.testimonial-item .author .name,.testimonial-item:hover .author .metas,.testimonial-item:hover .text{color:var(--main-color)!important}.testimonial-item .author{display:flex!important;align-items:center!important;gap:12px!important;margin-top:auto!important}.testimonial-item .image.auther-img{min-width:50px!important;width:50px!important;height:50px!important;border-radius:50%!important;border:3px solid #f5f5f5!important;box-shadow:0 4px 12px rgb(from var(--fourth-color) r g b / .08)!important;transition:.3s!important;flex-shrink:0!important}.testimonial-item:hover .image.auther-img{border-color:var(--second-color)!important;box-shadow:0 6px 16px rgba(225,116,149,.2)!important}.testimonial-item .author-info{display:flex!important;flex-direction:column!important;gap:2px!important}.testimonial-item .author .name{font-size:15px!important;font-weight:700!important;transition:color .3s!important;line-height:1.3!important}.testimonial-item:hover .author .name{color:var(--second-color)!important}.testimonial-item .author .metas{font-size:12px!important;color:#a0aec0!important;transition:color .3s!important;line-height:1.3!important}p.sub-title{background:var(--secondary-lignt-bg);padding:5px 20px;border-radius:24px;margin-bottom:10px!important;width:max-content;font-weight:500;color:var(--primary)}.nav-sw{background:#f5f5f5!important;border:2px solid #e0e0e0!important;border-radius:50%!important;width:48px!important;height:48px!important;transition:.3s!important;display:flex!important;align-items:center!important;justify-content:center!important}.faq-container .accordion-button span,.statistics-content h5,.statistics-number{color:var(--main-color)}.nav-sw:hover:not(.swiper-button-disabled){background:var(--main-color)!important;border-color:var(--main-color)!important;color:var(--third-color)!important;transform:scale(1.1)}.sw-dots.sw-pagination-testimonial .swiper-pagination-bullet{width:10px!important;height:10px!important;background:#d0d8e0!important;opacity:.6!important;transition:.3s!important;cursor:pointer!important}.sw-dots.sw-pagination-testimonial .swiper-pagination-bullet-active{background:var(--main-color)!important;opacity:1!important;width:28px!important;border-radius:5px!important}.statistics-container{justify-content:center;gap:1.8rem;margin-block:2.5rem}.statistics-item-wrapper{margin-bottom:0}.statistics-item-card{background-color:var(--third-color);border-radius:20px;padding:34px 32px;box-shadow:0 22px 60px rgb(from var(--fourth-color) r g b / .06);border:1px solid color-mix(in srgb,var(--main-color) 7%,transparent);transition:transform .25s,box-shadow .25s}.statistics-item-card:hover{transform:translateY(-4px);box-shadow:0 30px 80px rgb(from var(--fourth-color) r g b / .08)}.statistics-icon{width:120px;height:120px;border-radius:999px;background:var(--third-color);display:flex;align-items:center;justify-content:center;margin:0 auto 24px}.bg_black,.widget-card-store,.widget-card-store.bg_black,.widget-card-store.type-4{background:rgb(from var(--third-color) r g b / .04)!important}.statistics-image{width:110px;height:110px;max-width:max-content;object-fit:contain;display:block}.statistics-content .d-flex{justify-content:center;align-items:baseline;gap:6px}.statistics-number{font-size:2.6rem;font-weight:800;margin:0}.statistics-content h5{font-size:1.4rem;margin:0}.statistics-title{margin-top:12px;font-size:1.05rem;color:var(--second-color)}@media (max-width:992px){.statistics-item-card{padding:30px 26px}.statistics-icon{width:110px;height:110px;margin-bottom:20px}.statistics-image{width:100px;height:100px}.statistics-number{font-size:2.3rem}.statistics-content h5{font-size:1.25rem}}section.subscribe-form{position:relative;padding:80px 0!important;background:linear-gradient(135deg,var(--second-color) 0,var(--second-color) 100%)!important;overflow:hidden;margin:0!important}section.subscribe-form::before{width:100%;height:100%;background-image:radial-gradient(circle at 20% 30%,rgb(from var(--second-color) r g b / .08) 0,transparent 50%),radial-gradient(circle at 80% 70%,rgb(from var(--second-color) r g b / .06) 0,transparent 50%);animation:15s ease-in-out infinite bgPulse;z-index:0}.store-img,.store-item-info{z-index:2;position:relative}@keyframes bgPulse{0%,100%{opacity:.5}50%{opacity:1}}section.subscribe-form .container{position:relative;z-index:2}.widget-card-store,.widget-card-store.type-4{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:25px!important;border:2px solid rgb(from var(--second-color) r g b / .25)!important;padding:50px!important;box-shadow:0 20px 60px rgb(from var(--fourth-color) r g b / .4),inset 0 1px 0 rgb(from var(--third-color) r g b / .1)!important;position:relative;overflow:visible!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:40px!important;align-items:center!important}.widget-card-store::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(135deg,var(--second-color),transparent 40%,transparent 60%,var(--second-color));border-radius:25px;opacity:0;z-index:-1;transition:opacity .5s;filter:blur(10px)}.footer-heading h6,.store-item-info .sec-title,.store-item-info h3.sec-title{font-weight:800!important;background:linear-gradient(135deg,var(--third-color) 0,var(--third-color) 100%);-webkit-text-fill-color:transparent;line-height:1.3!important}.widget-card-store:hover::before{opacity:.3}.store-item-info{color:var(--third-color)!important}.store-item-info .sec-title,.store-item-info h3.sec-title{color:var(--third-color)!important;font-size:36px!important;margin-bottom:20px!important;-webkit-background-clip:text;background-clip:text;text-shadow:none!important;position:relative;display:inline-block}.store-item-info .description{color:rgb(from var(--third-color) r g b / .85)!important;font-size:16px!important;line-height:1.7!important;margin-bottom:30px!important;text-shadow:0 2px 8px rgb(from var(--fourth-color) r g b / .5)}#newsletterForm,.store-item-info form{margin-top:25px}#newsletterForm label,.store-item-info form label{color:rgb(from var(--third-color) r g b / .9)!important;font-size:14px!important;font-weight:600!important;margin-bottom:10px!important;display:block;text-shadow:0 2px 8px rgb(from var(--fourth-color) r g b / .5)}
1349.form-group{display:flex!important;gap:12px!important;align-items:stretch!important;flex-wrap:nowrap!important}#newsletterForm input[type=email],.form-group input[type=email]{flex:1!important;background:rgb(from var(--third-color) r g b / .95)!important;backdrop-filter:blur(10px);border:2px solid rgb(from var(--second-color) r g b / .4)!important;color:var(--fourth-color)!important;border-radius:12px!important;padding:16px 24px!important;font-size:15px!important;transition:.3s;outline:0!important;box-shadow:0 4px 15px rgb(from var(--fourth-color) r g b / .1)}#newsletterForm input[type=email]::placeholder,.form-group input[type=email]::placeholder{color:rgb(from var(--fourth-color) r g b / .5)!important;opacity:1!important}#newsletterForm input[type=email]:focus,.form-group input[type=email]:focus{background:rgb(from var(--third-color) r g b / 1)!important;border-color:var(--second-color)!important;box-shadow:0 0 0 4px rgb(from var(--second-color) r g b / .2),0 4px 20px rgb(from var(--second-color) r g b / .3)!important;transform:translateY(-2px)}#newsletterForm button[type=submit],.form-group .tf-btn{background:linear-gradient(135deg,var(--second-color),color-mix(in srgb,var(--second-color) 80%,var(--fourth-color)))!important;color:var(--third-color)!important;border:2px solid var(--second-color)!important;border-radius:12px!important;padding:16px 35px!important;font-weight:700!important;font-size:15px!important;transition:.3s;cursor:pointer;box-shadow:0 8px 25px rgb(from var(--second-color) r g b / .4),inset 0 1px 0 rgb(from var(--third-color) r g b / .3)!important;text-transform:uppercase;letter-spacing:.5px;line-height:normal!important}#newsletterForm button[type=submit]:hover,.form-group .tf-btn:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--second-color) 80%,var(--fourth-color)),var(--second-color))!important;transform:translateY(-3px) scale(1.02);box-shadow:0 12px 35px rgb(from var(--second-color) r g b / .5),inset 0 1px 0 rgb(from var(--third-color) r g b / .4)!important;border-color:color-mix(in srgb,var(--second-color) 80%,var(--fourth-color))!important}#newsletterForm button[type=submit]:active,.form-group .tf-btn:active{transform:translateY(-1px) scale(1)}.store-img{display:flex;align-items:center;justify-content:center}.footer-bottom,.footer-wrap{position:relative;z-index:3}.store-img img{width:100%!important;max-width:450px!important;height:auto!important;transition:.5s;filter:drop-shadow(0 10px 30px rgb(from var(--fourth-color) r g b / .3))}.store-img img:hover{transform:scale(1.05) rotate(2deg)}.tf-grid-layout.md-col-2{display:grid!important;grid-template-columns:1fr 1fr!important;gap:40px!important}.coupon-box .form-group,.subscribe-form .form-group{background:0 0;border-radius:0;padding:0;border:none}.footer-bottom .footer-menu_item,.footer-infor ul li p{background:rgb(from var(--third-color) r g b / .06)!important}.footer-infor ul li p,.footer-logo img,a.footer-menu_item{border-radius:12px!important}@media (max-width:991px){section.subscribe-form{padding:60px 0!important}.tf-grid-layout.md-col-2,.widget-card-store,.widget-card-store.type-4{grid-template-columns:1fr!important;gap:30px!important;padding:40px 30px!important}.store-item-info .sec-title,.store-item-info h3.sec-title{font-size:30px!important}.store-img{order:-1}.store-img img{max-width:350px!important}}footer{position:relative;background-color:var(--second-color)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;padding-top:0!important;padding-bottom:0!important;min-height:600px;margin-top:0!important}.footer-wrap{padding-top:100px}.footer-body{border-bottom:none!important;padding:60px 0 50px!important;position:relative}.footer-infor ul li p:hover,a.footer-menu_item:hover{border-color:rgb(from var(--third-color) r g b / .4)!important;transform:translateX(-5px);box-shadow:0 5px 20px rgb(from var(--second-color) r g b / .2)}.footer-logo,.footer-logo img{padding:0!important;transition:.4s}.footer-logo{background:0 0!important;backdrop-filter:none;border-radius:20px!important;box-shadow:none!important;display:inline-block;margin-bottom:20px}.footer-logo:hover{transform:translateY(-5px) scale(1.05);filter:drop-shadow(0 10px 25px rgb(from var(--second-color) r g b / .4))}.footer-logo img{filter:drop-shadow(0 4px 15px rgb(from var(--fourth-color) r g b / .3))}.footer-logo:hover img{filter:drop-shadow(0 8px 25px rgb(from var(--second-color) r g b / .5))}.footer-heading h6{color:var(--third-color)!important;font-size:20px!important;text-transform:uppercase;letter-spacing:1px;margin-bottom:25px!important;padding-bottom:12px;position:relative;-webkit-background-clip:text;background-clip:text;display:inline-block}.footer-bottom .footer-menu_item,a.footer-menu_item{color:rgb(from var(--third-color) r g b / .9)!important;display:inline-block}.footer-bottom .footer-menu_item,.footer-infor ul li a,.footer-infor ul li p,a.footer-menu_item{font-size:15px!important;text-shadow:0 2px 10px rgb(from var(--fourth-color) r g b / .6);transition:.3s}.footer-infor{position:relative}.footer-infor ul,.footer-menu-list{list-style:none!important;padding:0!important;margin:0!important}.footer-infor ul li{margin-bottom:15px!important}.footer-infor ul li a,.footer-infor ul li p{color:rgb(from var(--third-color) r g b / .95)!important}.footer-infor ul li p{padding:14px 20px!important;border:2px solid rgb(from var(--third-color) r g b / .1)!important;backdrop-filter:blur(10px);margin:0!important;transition:.3s}.footer-infor ul li p:hover{background:rgb(from var(--third-color) r g b / .1)!important}.footer-infor ul li a,.footer-infor ul li p a{color:var(--third-color)!important;font-weight:600!important}.footer-infor ul li a:hover,.footer-infor ul li p a:hover{color:var(--third-color)!important;text-shadow:0 0 20px var(--second-color)}.footer-menu-list li{margin-bottom:12px!important}a.footer-menu_item{padding:12px 18px!important;background:rgb(from var(--third-color) r g b / .05)!important;border:2px solid rgb(from var(--third-color) r g b / .1)!important;backdrop-filter:blur(10px);width:100%;text-align:right}a.footer-menu_item:hover{color:var(--third-color)!important;background:rgb(from var(--second-color) r g b / .12)!important;text-shadow:0 0 20px var(--second-color)}.tf-payment{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:15px}.tf-payment img{width:auto!important;background:rgb(from var(--third-color) r g b / .98)!important;border-radius:12px!important;border:2px solid rgb(from var(--second-color) r g b / .25)!important;transition:.3s;box-shadow:0 8px 25px rgb(from var(--second-color) r g b / .2),inset 0 1px 0 rgb(from var(--third-color) r g b / .3)!important}.tf-payment img:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 35px rgb(from var(--second-color) r g b / .4),inset 0 1px 0 rgb(from var(--third-color) r g b / .4)!important;border-color:var(--second-color)!important}.footer-bottom{backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border-top:2px solid rgb(from var(--second-color) r g b / .2);padding:30px 0!important;margin-top:0!important}.footer-bottom .footer-menu_item:hover,.tf-social-icon a:hover{background:linear-gradient(135deg,var(--second-color),color-mix(in srgb,var(--second-color) 80%,var(--fourth-color)))!important;border-color:var(--second-color)!important}.footer-bottom-wrap{text-align:center}.footer-bottom .footer-menu_item{font-weight:600!important;padding:12px 30px!important;border-radius:25px!important;border:2px solid rgb(from var(--third-color) r g b / .12)!important;width:auto!important;backdrop-filter:blur(10px)}.footer-bottom .footer-menu_item:hover{color:var(--third-color)!important;transform:scale(1.05);box-shadow:0 8px 25px rgb(from var(--second-color) r g b / .4),inset 0 1px 0 rgb(from var(--third-color) r g b / .3)!important;text-shadow:none}.tf-social-icon{display:flex!important;gap:12px!important;margin-top:20px!important;list-style:none!important;padding:0!important}.tf-social-icon a{width:45px!important;height:45px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:rgb(from var(--third-color) r g b / .08)!important;backdrop-filter:blur(10px);border:2px solid rgb(from var(--third-color) r g b / .15)!important;border-radius:50%!important;color:var(--third-color)!important;transition:.3s}.tf-social-icon a:hover{color:var(--main-color)!important;transform:translateY(-3px) rotate(5deg);box-shadow:0 8px 25px rgb(from var(--second-color) r g b / .4)}.footer-wrap *{visibility:visible!important;opacity:1!important}@media (min-width:1150px){.footer .col-xl-2{width:20%}}@media (max-width:991px){footer{min-height:500px;padding-bottom:40px!important}.footer-wrap{padding-top:80px}.footer-body{padding:50px 0 40px!important;border-radius:20px 20px 0 0!important}.footer-heading h6{font-size:20px!important;margin-top:30px!important;margin-bottom:20px!important}.footer-col-block:first-child .footer-heading h6{margin-top:0!important}}@media (max-width:576px){.card{padding-block:5px!important}.statistics-container{gap:1.4rem;margin-block:2rem}.statistics-item-card{padding:26px 22px;border-radius:18px}.statistics-icon{width:110px;height:110px;margin-bottom:18px}.statistics-image{width:100px;height:100px}.statistics-number{font-size:2.1rem}.statistics-content h5{font-size:1.15rem}.statistics-title{font-size:.98rem}section.subscribe-form{padding:40px 0!important}section.subscribe-form.pt_0{padding-top:40px!important}section.subscribe-form.px-2{padding-left:15px!important;padding-right:15px!important}.widget-card-store,.widget-card-store.type-4{padding:30px 20px!important;border-radius:20px!important;gap:25px!important}.store-item-info .sec-title,.store-item-info h3.sec-title{font-size:24px!important;margin-bottom:15px!important}.store-item-info .description{font-size:14px!important;margin-bottom:20px!important}.form-group{flex-direction:column!important;gap:10px!important}#newsletterForm input[type=email],.form-group input[type=email]{padding:14px 20px!important;font-size:14px!important;width:100%!important}#newsletterForm button[type=submit],.form-group .tf-btn{width:100%!important;padding:14px 25px!important;font-size:14px!important}.store-img img{max-width:280px!important}.footer-body,.footer-body .row>
1349div,.footer-bottom-wrap,.footer-heading,.footer-infor{text-align:center!important}.footer-logo,.tf-payment,.tf-social-icon{margin-left:auto!important;margin-right:auto!important}footer{padding-top:0!important;min-height:auto}.footer-wrap{padding-top:60px}.footer-body{border-radius:20px 20px 0 0!important;padding:40px 0 35px!important}.footer-logo{margin-bottom:20px!important}.tf-payment,.tf-social-icon{justify-content:center!important}.footer-heading h6{font-size:20px!important;margin:25px auto 18px!important}.footer-infor ul li a,.footer-infor ul li p,a.footer-menu_item{font-size:14px!important;text-align:center!important}.footer-heading h6::after{left:50%!important;transform:translateX(-50%)}.footer-infor ul,.footer-menu-list{display:inline-block;text-align:center!important}.footer-infor ul li p{padding:12px 16px!important}.footer-infor ul li p:hover,a.footer-menu_item:hover{transform:translateY(-3px)!important}a.footer-menu_item{padding:10px 14px!important;margin:0 auto 12px!important;display:block!important;max-width:280px}.footer-bottom{padding:25px 0!important;text-align:center!important}.footer-bottom .footer-menu_item{font-size:13px!important;padding:10px 22px!important;margin:0 auto!important}}@media (max-width:400px){.widget-card-store,.widget-card-store.type-4{padding:25px 15px!important}.footer-heading h6,.store-item-info .sec-title,.store-item-info h3.sec-title{font-size:20px!important}.store-item-info .description{font-size:13px!important}.store-img img{max-width:240px!important}.tf-payment{justify-content:center!important}.footer-body{padding:35px 0 30px!important}a.footer-menu_item{max-width:250px;font-size:13px!important}}@media only screen and (max-width:767px){.tf-payment img{max-width:50px}}.whatsapp-button{background:var(--second-color)}.accordion-item{background:var(--body)}.collection-item-circle.style-2{padding:0!important;width:100%!important;height:auto!important;aspect-ratio:1/1!important;max-width:280px!important;margin:0 auto!important;position:relative!important;filter:drop-shadow(0px 15px 20px rgb(from var(--fourth-color) r g b / .15))!important}.collection-item-circle .collection-image,.hover-img .img-style{display:flex!important;height:100%!important;width:100%!important}.collection-item-circle .collection-image{border-radius:0!important;overflow:visible!important;align-items:center!important;justify-content:center!important;margin:0!important;background:0 0!important;box-shadow:none!important;position:relative!important}.hover-img .img-style{align-items:center!important;justify-content:center!important}.hover-img .img-style img{border-radius:10px!important;width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain!important;display:block!important}.collection-content{text-align:center!important;margin-top:20px!important;position:relative!important}.collection-content .title{font-size:16px!important;line-height:1.5!important;font-weight:600!important}.collection-item-v3,.has-saleoff-wrap,.hover-img,.swiper-slide,.swiper-wrapper{overflow:visible!important}@media (max-width:991px){.collection-item-circle.style-2{max-width:240px!important}.collection-content .title{font-size:15px!important}}@media (max-width:750px){.collection-item-circle.style-2{max-width:180px!important;filter:drop-shadow(0px 10px 15px rgb(from var(--fourth-color) r g b / .15))!important}.collection-content{margin-top:15px!important}.collection-content .title{font-size:14px!important}}@media (max-width:480px){.collection-item-circle.style-2{max-width:150px!important;filter:drop-shadow(0px 8px 12px rgb(from var(--fourth-color) r g b / .15))!important}.collection-content{margin-top:12px!important}.collection-content .title{font-size:13px!important}}.tf-top-bar.bg-secondary{background:var(--second-color)!important}
1350</style>
1351
1352
1353	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pannellum/build/pannellum.css" />
1354	
1354<script src="https://cdn.jsdelivr.net/npm/pannellum/build/pannellum.js"></script>
1354
1355
1356</head>
1357
1358<body class="preload-wrapper rtl color-primary-2" id="app">
1359
1360	
1360<script>
1361	window.LocalizationKeys = {
1362	Dashboard: "لوحة التحكم",
1363	FillVerificationCode: "يرجى إدخال رمز التحقق بالكامل",
1364	InvalidLogin: "فشل تسجيل الدخول.",
1365	Accept: "موافق",
1366	RateRequired: "التقييم إجباري",
1367
1368	AddSuccessfully: "تمت الإضافة",
1369	ProductSuccessfullyCart: "تمت إضافة المنتج إلى السلة بنجاح",
1370	AcceptTerms: "يرجى قبول الشروط والأحكام للمتابعة.",
1371	UploadReceiptRequired: "يرجى رفع إثبات الدفع",
1372	SaudiArabia: "المملكة العربية السعوديه",
1373	EnterCode: "يرجى إدخال رمز الخصم",
1374	InvalidCode: "رمز الخصم غير صالح",
1375	ErrOccurred: "حدث خطأ أثناء التحقق من الكوبون",
1376	LinkCopy: "تم نسخ رابط المنتج!",
1377	Now: "الآن",
1378	Validation: "يرجى إدخال بريد إلكتروني صحيح (مثال: [email protected])",
1379	SendSucc: "تم إرسال الطلب بنجاح.",
1380	ErrorOccurred: "حدث خطأ",
1381	NewNotiFication: "إشعار جديد",
1382	MobileValidation: "يرجى إدخال رقم جوال صحيح مكون من 9 أرقام يبدأ بـ5",
1383	NotExist: "العنصر غير موجود!",
1384
1385	ErrorInOrder: "خطأ في الطلب",
1386	PhoneNumberFirst: "لابد من إدخال رقم الجوال اولاً",
1387	Phone: "رقم التليفون :",
1388	Email: " البريد الإلكتروني",
1389	ErrorInCode: "حدث خطأ أثناء إعادة إرسال الكود",
1390
1391	UnknownError: "خطأ غير معروف",
1392	ConnectError: "حدث خطأ أثناء الاتصال بالسيرفر.",
1393	CompletedSuccessfully: "تمت العملية بنجاح!",
1394	Success: "نجاح",
1395	Warning: "تحذير",
1396	Error: "خطأ",
1397	CheckData: "يرجى التحقق من البيانات المدخلة.",
1398	Ago: "منذ",
1399	Year: "سنة",
1400	Month: "شهر",
1401	Day: "يوم",
1402	Hour: "ساعة",
1403	Minute: "دقيقة",
1404	Second: "ثانية",
1405
1406	IsRequired: "هذا الحقل مطلوب",
1407	FirstNameValidation: "الاسم الأول يجب أن يكون على الأقل حرفين",
1408	SurNameValidation: "اسم العائلة يجب أن يكون على الأقل حرفين",
1409	InvalidEmail: "البريد الإلكتروني غير صالح",
1410	SelectCourier: "يرجى اختيار شركة شحن",
1411	SelectCourierMessage: "يجب اختيار شركة شحن للمتابعة",
1412	SelectLocationFirst: "اختر الموقع",
1413	PleaseSelectLocationOnMap: "انقر على الخريطة لتحديد موقع التوصيل",
1414	RequiredFields: "يرجى التحقق من البيانات المدخلة.",
1415	PleaseEnterRequiredFields: "هذا الحقل مطلوب",
1416	SelectCity: "اختر المدينة",
1417	PleaseSelectCity: "اختر المدينة",
1418	ChooseShipmentAddress: "اختر عنوان الشحن",
1419	ChooseCountryForShipping: "يرجى اختيار الدولة للتوصيل",
1420	ChooseCityForShipping: "يرجى اختيار المدينة للتوصيل",
1421	ChooseAddressAndCity: "يرجى اختيار عنوان الشحن وتحديد المدينة",
1422	ChooseRegionForShipping: "يرجى اختيار المنطقة للتوصيل",
1423	ChooseDistrictForShipping: "يرجى اختيار الحي للتوصيل",
1424	EnterDistrictForShipping: "يرجى إدخال الحي للتوصيل",
1425	AddressSaved: "حفظ العنوان",
1426	AddressUpdated: "تحديث العنوان",
1427	ErrorSavingAddress: "خطأ غير معروف",
1428	ConfirmDelete: "تأكيد الحذف",
1429	DeleteAddressConfirm: "هل أنت متأكد من الحذف",
1430	Delete: "حذف",
1431	Cancel: "إلغاء",
1432	Deleted: "نجاح",
1433	AddressDeleted: "تمت العملية بنجاح!",
1434	DefaultAddressSet: "تمت العملية بنجاح!",
1435
1436	FailedLoad: "فشل تحميل البيانات",
1437	NoChange: "لم تقم بإجراء أي تغييرات",
1438	Save: "جاري الحفظ",
1439	FailedUpdate: "فشل تحديث البيانات",
1440	SaveChanges: "حفظ التغييرات",
1441	FirstNameReq: "الاسم الأول مطلوب",
1442	LastNameReq: "الاسم الأخير مطلوب",
1443	LastNameValidation: "الاسم الأخير يجب أن يكون على الأقل حرفين",
1444	EmailReq: "البريد الإلكتروني مطلوب",
1445
1446	OneSec: "منذ ثانية واحدة",
1447	MinAgo: "منذ دقيقة واحدة",
1448	MinTwoAgo: "منذ دقيقتين",
1449	HourAgo: "منذ ساعة واحدة",
1450	HoursTwoAgo: "منذ ساعتين",
1451	DayAgo: "منذ يوم واحد",
1452	DaysTwoAgo: "منذ يومين",
1453	WeekAgo: "منذ أسبوع واحد",
1454	WeeksTwoAgo: "منذ أسبوعين",
1455	MonthAgo: "منذ شهر واحد",
1456	MonthsTwoAgo: "منذ شهرين",
1457	YearAgo: "منذ سنة واحدة",
1458	YearsTwoAgo: "منذ سنتين",
1459	Year: "سنة",
1460	Years: "سنوات",
1461	Month: "شهراً",
1462	Months: "أشهر",
1463	Week: "أسبوعاً",
1464	Weeks: "أسابيع",
1465	Day: "يوماً",
1466	Days: "أيام",
1467	Hour: "ساعة",
1468	Hours: "ساعات",
1469	Minute: "دقيقة",
1470	Minutes: "دقائق",
1471	PhoneReq: "رقم الهاتف إجباري",
1472	PhoneNumberInvalid: "رقم الهاتف إجباري",
1473	PhoneNumberInvalid: "رقم الهاتف إجباري",
1474	ChoosePhoto: "اختر صورة أولاً",
1475	ErrorUploading: "Pages.Customers.ErrorUploading",
1476	SuccessUploading: "تم رفع الصورة بنجاح",
1477	PaymentSuccessMessage: "تم الدفع بنجاح!",
1478	CartHaveAdiffrentType: "لا يمكنك إضافة منتجات من انواع مختلفة إلى عربة التسوق نفسها. يرجى إكمال الطلب الحالي أو إزالة المنتجات من السلة الآخر لإضافة هذا المنتج.",
1479	PreventChangeOptions: "لا يمكنك اختيار هذا الخيار لأن هذه العربة تحتوي على منتج رقمي",
1480	AddressIsRequired: "العنوان مطلوب",
1481	
1482	TamaraUnavailable: "تمارا غير متاحة حالياً لهذا الطلب.",
1483	
1484	Pages_Login_InvalidCaptcha: "فشل التحقق الأمني. يرجى إكمال التحقق والمحاولة مرة أخرى.",
1485	};
1486</script>
1486
1487
1488	<div class="loading-overlay" id="loadingOverlay">
1489		<div class="loading-modal">
1490			<div class="loading-spinner"></div>
1491
1492		</div>
1493	</div>
1494
1495	<!-- preload -->
1496	<div class="preload preload-container">
1497		<div class="preload-logo">
1498			<div class="spinner"></div>
1499		</div>
1500	</div>
1501
1502	<!-- /preload -->
1503	<div id="wrapper">
1504		
1505		<div class="tf-top-bar bg-secondary">
1506  <div class="px_15 lg-px_40">
1507    <div class="tf-top-bar_wrap grid-3 gap-30 align-items-center">
1508      <ul class="tf-top-bar_item tf-social-icon d-flex gap-10 list-none">
1509		  
1510		  
1511		  
1512		  
1513		  
1514		  
1515
1516	  </ul>
1517      <div class="text-center text-white overflow-hidden d-lg-block d-none">
1518        <div dir="ltr" class="swiper tf-sw-top_bar" data-preview="1" data-space="0" data-loop="true"
1519            data-speed="1000" data-delay="2000">
1520          <div class="swiper-wrapper">
1521            <div class="swiper-slide">
1522              <p class="top-bar-text fw-5">
1523              &#x627;&#x647;&#x644;&#x627;&#x64B; &#x628;&#x643; &#x646;&#x62A;&#x645;&#x646;&#x64A; &#x644;&#x643; &#x62A;&#x62C;&#x631;&#x628;&#x629; &#x634;&#x631;&#x627;&#x621; &#x645;&#x645;&#x62A;&#x639;&#x629;
1524           
1525              </p>
1526            </div>
1527            <div class="swiper-slide">
1528              <p class="top-bar-text fw-5">&#x627;&#x628;&#x62A;&#x643;&#x627;&#x631;&#x627;&#x62A; &#x62C;&#x62F;&#x64A;&#x62F;&#x629; &#x62A;&#x646;&#x62A;&#x638;&#x631;&#x643;!</p>
1529            </div>
1530            <div class="swiper-slide">
1531              <p class="top-bar-text fw-5">&#x627;&#x643;&#x62A;&#x634;&#x641; &#x623;&#x62D;&#x62F;&#x62B; &#x627;&#x644;&#x645;&#x646;&#x62A;&#x62C;&#x627;&#x62A; &#x2728;</p>
1532            </div>
1533          </div>
1534        </div>
1535      </div>
1536
1537      <div class="top-bar-language tf-cur justify-content-end">
1538        <div class="tf-languages text-white">
1539          <select class=" image-select center style-default type-languages" 
1540          id="language-selection" onchange="changeLanguage()">
1541             <option value="en" >English</option>
1542             <option value="ar" selected>العربية</option>    
1543          </select>
1544        </div>
1545      </div>
1546    </div>
1547  </div>
1548</div>
1549<!-- /Top Bar -->
1550
1551<!-- Header -->
1552<header id="header" class="header-default">
1553  <div class="px_15 lg-px_40">
1554    <div class="row wrapper-header align-items-center">
1555      <div class="col-md-4 col-3 tf-lg-hidden">
1556        <a href="#mobileMenu" data-bs-toggle="offcanvas" aria-controls="offcanvasLeft">
1557          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="16" viewBox="0 0 24 16"
1558              fill="none">
1559            <path
1560                d="M2.00056 2.28571H16.8577C17.1608 2.28571 17.4515 2.16531 17.6658 1.95098C17.8802 1.73665 18.0006 1.44596 18.0006 1.14286C18.0006 0.839753 17.8802 0.549063 17.6658 0.334735C17.4515 0.120408 17.1608 0 16.8577 0H2.00056C1.69745 0 1.40676 0.120408 1.19244 0.334735C0.978109 0.549063 0.857702 0.839753 0.857702 1.14286C0.857702 1.44596 0.978109 1.73665 1.19244 1.95098C1.40676 2.16531 1.69745 2.28571 2.00056 2.28571ZM0.857702 8C0.857702 7.6969 0.978109 7.40621 1.19244 7.19188C1.40676 6.97755 1.69745 6.85714 2.00056 6.85714H22.572C22.8751 6.85714 23.1658 6.97755 23.3801 7.19188C23.5944 7.40621 23.7148 7.6969 23.7148 8C23.7148 8.30311 23.5944 8.59379 23.3801 8.80812C23.1658 9.02245 22.8751 9.14286 22.572 9.14286H2.00056C1.69745 9.14286 1.40676 9.02245 1.19244 8.80812C0.978109 8.59379 0.857702 8.30311 0.857702 8ZM0.857702 14.8571C0.857702 14.554 0.978109 14.2633 1.19244 14.049C1.40676 13.8347 1.69745 13.7143 2.00056 13.7143H12.2863C12.5894 13.7143 12.8801 13.8347 13.0944 14.049C13.3087 14.2633 13.4291 14.554 13.4291 14.8571C13.4291 15.1602 13.3087 15.4509 13.0944 15.6653C12.8801 15.8796 12.5894 16 12.2863 16H2.00056C1.69745 16 1.40676 15.8796 1.19244 15.6653C0.978109 15.4509 0.857702 15.1602 0.857702 14.8571Z"
1561                fill="currentColor"></path>
1562          </svg>
1563        </a>
1564      </div>
1565      <div class="col-xl-2 col-md-4 col-6">
1566        <a href="/" class="logo-header"> 
1567          <img src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/storeScreenshots/0901e432-6c0a-4a2e-9c19-9126f6c8dc26.png" alt="logo" class="logo" /> 
1568        </a>
1569      </div>
1570      <div class="col-xl-8 tf-md-hidden">
1571        <nav class="box-navigation text-center">
1572          
1573            <ul id="category-menu" class="box-nav-ul d-flex align-items-center justify-content-center gap-30 list-none">
1574              <li>
1575                <a class="item-link" href="/products">
1576                  &#x643;&#x644; &#x627;&#x644;&#x645;&#x646;&#x62A;&#x62C;&#x627;&#x62A;
1577                </a>
1578              </li>
1579
1580              
1581              <li class="menu-item position-relative menu-inner">
1582                <a href="/&#x639;&#x628;&#x627;&#x64A;&#x627;&#x62A;-&#x627;&#x644;&#x645;&#x648;&#x633;&#x645;" class="item-link">
1583                  &#x639;&#x628;&#x627;&#x64A;&#x627;&#x62A; &#x627;&#x644;&#x645;&#x648;&#x633;&#x645;
1584                  
1585                </a>
1586
1587                
1588			  </li>
1589              
1590              <li class="menu-item position-relative menu-inner">
1591                <a href="/&#x641;&#x62E;&#x627;&#x645;&#x629;-&#x627;&#x644;&#x639;&#x628;&#x627;&#x64A;&#x629;" class="item-link">
1592                  &#x641;&#x62E;&#x627;&#x645;&#x629; &#x627;&#x644;&#x639;&#x628;&#x627;&#x64A;&#x629;
1593                  
1594                </a>
1595
1596                
1597			  </li>
1598              
1599              <!-- باقي الأقسام -->
1600              <li id="more-categories" class="menu-item position-relative more-categories" style="display:none;">
1601                <a href="#" class="item-link">
1602					&#x628;&#x627;&#x642;&#x64A; &#x627;&#x644;&#x623;&#x642;&#x633;&#x627;&#x645; <i class="icon icon-arrow-down"></i></a>
1603                <div class="sub-menu submenu-default">
1604                  <ul class="menu-list"></ul>
1605                </div>
1606              </li>
1607				
1608				
1609			</ul>
1610          
1611        </nav>
1612      </div>
1613      <div class="col-xl-2 col-md-4 col-3">
1614        <ul class="nav-icon d-flex justify-content-end align-items-center gap-20">
1615          <li class="nav-search">
1616            <a href="#canvasSearch" data-bs-toggle="offcanvas" aria-controls="offcanvasLeft"
1617                class="nav-icon-item">
1618              <i class="icon icon-search"></i>
1619            </a>
1620          </li>
1621          <li class="nav-account">
1622
1623            <a href="#login" 
1624             data-bs-toggle="modal" 
1625            class="nav-icon-item">
1626				<!--   &#x62A;&#x633;&#x62C;&#x64A;&#x644; &#x627;&#x644;&#x62F;&#x62E;&#x648;&#x644;  -->
1627              <i class="icon icon-account"></i>
1628            </a>
1629
1630
1631          
1632          </li>
1633
1634
1635 
1636          <li class="nav-cart">
1637            <a href="#shoppingCart" data-bs-toggle="modal" class="nav-icon-item">
1638              <i class="icon icon-bag"></i>
1639              <span class="count-box" v-text="cartCount"></span>
1640            </a>
1641          </li>
1642
1643        </ul>
1644      </div>
1645    </div>
1646  </div>
1647</header>
1648<!-- /Header -->
1649<script src="/Views/Themes/decor/V1/Components/Header/Header.js"></script>
1649
1650		
1651
1652		
1653
1654
1655
1656
1657
1658
1659
1660
1661
1662
1663
1664
1665
1666
1667
1668
1669
1670
1671
1672
1673
1674
1675
1676
1677
1678
1679
1680
1681
1682
1683
1684
1685
1686
1687
1688
1689
1690
1691
1692
1693
1694
1695
1696
1697
1698
1699
1700
1701
1702
1703
1704
1705
1706
1707
1708
1709
1710
1711
1712
1713
1714
1715
1716
1717
1718
1719
1720
1721
1722
1723
1724
1725
1726
1727
1728
1729
1730
1731
1732
1733
1734
1735
1736
1737
1738
1739
1740
1741
1742
1743
1744
1745
1746
1747
1748<script>
1749window.dataLayer = window.dataLayer || [];
1750dataLayer.push({ ecommerce: null }); // Clear previous ecommerce object
1751dataLayer.push({
1752event: 'view_item',
1753ecommerce: {
1754currency: "SAR",
1755value: 395.00,
1756items: [{
1757item_id: "bb22b21a-cb74-b4f7-e839-3a2096bbcae4",
1758item_name: "Hm 06",
1759item_brand: "",
1760price: 395.00,
1761quantity: 1
1762}]
1763}
1764});
1765</script>
1765
1766
1767
1768<!-- breadcrumb -->
1769<div class="tf-breadcrumb">
1770  <div class="container">
1771    <div class="tf-breadcrumb-wrap d-flex justify-content-between flex-wrap align-items-center">
1772      <div class="tf-breadcrumb-list">
1773        <a href="/" class="text">                    &#x627;&#x644;&#x635;&#x641;&#x62D;&#x629; &#x627;&#x644;&#x631;&#x626;&#x64A;&#x633;&#x64A;&#x629;
1774</a>
1775        <i class="icon icon-arrow-left" v-if="false"></i>
1776        <a href="#" class="text" v-if="false">&#x627;&#x62B;&#x627;&#x62B;</a>
1777        <i class="icon icon-arrow-left"></i>
1778        <span class="text">Hm 06</span>
1779      </div>
1780     
1781    </div>
1782  </div>
1783</div>
1784<!-- /breadcrumb -->
1785<!-- default -->
1786<section class="flat-spacing-4 pt_0">
1787  <div class="tf-main-product section-image-zoom">
1788    <div class="container">
1789      <div class="row">
1790        <div class="col-md-6">
1791          <div class="tf-product-media-wrap sticky-top">
1792
1793
1794            <div class="thumbs-slider thumbs-default">
1795              <div dir="rtl" class="swiper tf-product-media-thumbs tf-product-media-thumbs-default other-image-zoom" data-direction="vertical">
1796                <div class="swiper-wrapper stagger-wrap wrap-images-group-item">
1797                  <!-- beige color -->
1798                  
1799                  <!-- ===== AI-CHANGE START [LIQUID][AI-Done][UI-20260825-01] ===== -->
1800                  <div class="swiper-slide stagger-item images-group-item beige" data-option-detail-id="" data-filename="70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp">
1801					  
1802					  <!-- Render image -->
1803					  <div class="item">
1804						  <img class="lazyload" data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp" src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp" alt=""/>
1805					  </div>
1806					  
1807					  
1808					  
1809				  </div>
1810                  
1811                  <!-- ===== AI-CHANGE START [LIQUID][AI-Done][UI-20260825-01] ===== -->
1812                  <div class="swiper-slide stagger-item images-group-item beige" data-option-detail-id="" data-filename="c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp">
1813					  
1814					  <!-- Render image -->
1815					  <div class="item">
1816						  <img class="lazyload" data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp" src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp" alt=""/>
1817					  </div>
1818					  
1819					  
1820					  
1821				  </div>
1822                  
1823
1824                </div>
1825              </div>
1826              <div dir="rtl" class="swiper tf-product-media-main tf-product-media-main-default" id="gallery-swiper-started">
1827                <div class="swiper-wrapper">
1828                  <!-- beige -->
1829                  
1830                  
1831                  <div class="swiper-slide images-group-item beige" data-option-detail-id="" data-filename="70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp">
1832					  
1833					  
1834					  <!-- Render image -->
1835					  <a href="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp" target="_blank" class="item" data-pswp-width="770px" data-pswp-height="1075px">
1836						  <img class="tf-image-zoom lazyload" data-zoom="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp" data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/70f9e9df-1c31-4500-82b2-ec9b584a7bc1.webp" alt=""/>
1837					  </a>
1838					  
1839					  
1840					  
1841				  </div>
1842                  
1843                  <div class="swiper-slide images-group-item beige" data-option-detail-id="" data-filename="c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp">
1844					  
1845					  
1846					  <!-- Render image -->
1847					  <a href="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp" target="_blank" class="item" data-pswp-width="770px" data-pswp-height="1075px">
1848						  <img class="tf-image-zoom lazyload" data-zoom="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c
18487d61a00-2405-4bf3-b10c-c63afdbbd161.webp" data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp" alt=""/>
1849					  </a>
1850					  
1851					  
1852					  
1853				  </div>
1854                  
1855                  
1856                </div>
1857                <div class="swiper-button-next button-style-arrow thumbs-next"></div>
1858                <div class="swiper-button-prev button-style-arrow thumbs-prev"></div>
1859              </div>
1860            </div>
1861          </div>
1862        </div>
1863        <div class="col-md-6">
1864          <div class="tf-product-info-wrap position-relative">
1865            <div class="tf-zoom-main"></div>
1866            <div class="tf-product-info-list other-image-zoom">
1867				
1868				<div
1869                class="tf-product-info-title d-flex align-items-center justify-content-between">
1870                <h5>Hm 06</h5>
1871                <a href="javascript:void(0);" @click="manageFavorite('bb22b21a-cb74-b4f7-e839-3a2096bbcae4')"
1872                  class="tf-product-btn-wishlist hover-tooltip box-icon bg_white wishlist btn-icon-action ">
1873                  <span class="icon icon-heart"></span>
1874                                        <span class="tooltip">&#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;</span>
1875                  <span class="icon icon-delete"></span>
1876                </a>
1877
1878              </div>
1879              <div class="tf-product-info-badges">
1880                <div class="badges radius-60">  &#x627;&#x644;&#x623;&#x643;&#x62B;&#x631; &#x645;&#x628;&#x64A;&#x639;&#x627;&#x64B;</div>
1881                <div class="product-status-content">
1882                  <i class="icon-lightning"></i>
1883                  <p class="fw-6">
1884                   &#x64A;&#x62A;&#x645; &#x628;&#x64A;&#x639;&#x647; &#x628;&#x633;&#x631;&#x639;&#x629;! &#x627;&#x644;&#x646;&#x627;&#x633; &#x644;&#x62F;&#x64A;&#x647;&#x645; &#x647;&#x630;&#x627; &#x641;&#x64A; &#x639;&#x631;&#x628;&#x627;&#x62A; &#x627;&#x644;&#x62A;&#x633;&#x648;&#x642; &#x627;&#x644;&#x62E;&#x627;&#x635;&#x629; &#x628;&#x647;&#x645;.
1885</p>
1886                </div>
1887              </div>
1888              <div class="tf-product-info-price">
1889				  <div v-if="totalBeforePriceProduct && totalBeforePriceProduct !=totalPriceProduct" class="compare-at-price" v-text="totalBeforePriceProduct"></div>
1890				  <span class="price">
1891					  <span v-text="totalPriceProduct"></span>
1892					  <span class="icon-saudi_riyal"></span>
1893				  </span>
1894				
1895
1896
1897
1898<div class="badges-on-sale" v-if="!hasOfferAmountBadge && Number(totalDiscountPriceProduct) > 0 && Number(product.DiscountPercentage || 0) <= 0">
1899	<span v-text="totalDiscountPriceProduct"></span>% &#x62E;&#x635;&#x645;
1900</div>
1901
1902
1903              </div>
1904
1905              
1906				
1907				
1908
1909				
1910				
1911				
1912
1913				<!--   <div class="des">
1914
1915                <p>
1916                  
1917                </p>
1918
1919
1920              </div> -->
1921
1922
1923              <div class="tf-product-info-countdown" v-if="false">
1924                <div class="countdown-wrap">
1925                  <div class="countdown-title">
1926                    <i class="icon-time tf-ani-tada"></i>
1927                    <p>&#x627;&#x633;&#x631;&#x639;! &#x627;&#x644;&#x639;&#x631;&#x636; &#x633;&#x64A;&#x646;&#x62A;&#x647;&#x64A; &#x62E;&#x644;&#x627;&#x644;:</p>
1928                  </div>
1929                  <div class="tf-countdown style-1">
1930                    <div class="js-countdown" data-timer="1007500"
1931                      data-labels="Days :,Hours :,Mins :,Secs"></div>
1932                  </div>
1933                </div>
1934              </div>
1935
1936
1937              <div class="tf-product-info-variant-picker">
1938  <!-- عرض كقائمة منسدلة -->
1939  <template v-if="enableProductOptionsAsDropdown">
1940    <div class="variant-picker-item variant-dropdown" v-for="(optionHeader, headerIndex) in optionHeaders" :key="optionHeader.id">
1941      <div class="variant-picker-label">
1942        <label :for="`dropdown-${optionHeader.id}-2`" v-text="optionHeader.name + ': '"></label>
1943      </div>
1944      <select
1945        :id="`dropdown-${optionHeader.id}-2`"
1946        class="variant-picker-select form-select"
1947        :value="getSelectedValueForHeader(optionHeader.id)?.id"
1948        @change="onOptionDropdownChange(optionHeader, $event)"
1949      >
1950        <option value="" disabled>اختر</option>
1951        <option v-for="detail in optionHeader.productOptionDetails" :key="detail.id" :value="detail.id" v-text="detail.name"></option>
1952      </select>
1953    </div>
1954  </template>
1955
1956  <!-- العرض العادي (أزرار/راديو) -->
1957  <template v-else>
1958    <!-- اختيار اللون -->
1959    <div class="variant-picker-item variant-color" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 2)" :key="optionHeader.id">
1960      <div class="variant-picker-label">
1961        <span v-text="optionHeader.name + ': '"></span>
1962        <span class="fw-6 variant-picker-label-value" v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
1963      </div>
1964      <div class="variant-picker-values" >
1965        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
1966          <input
1967            type="radio"
1968            :id="`value-${detail.id}-${headerIndex}-${index}-2`"
1969            :name="`value-${detail.id}-${headerIndex}-${index}-2`"
1970            :value="detail.id"
1971            :checked="isSelected(detail.id, optionHeader.id)"
1972            @click="selectColor(detail, optionHeader)"
1973                                         />
1974          <label
1975            class="hover-tooltip radius-60"
1976            :for="`value-${detail.id}-${headerIndex}-${index}-2`"
1977            :data-value="detail.id">
1978            <span class="btn-checkbox" :style="{ backgroundColor: detail.value }"></span>
1979            <span class="tooltip" v-text="detail.name"></span>
1980          </label>
1981        </div>
1982      </div>
1983    </div>
1984
1985    <!-- اختيار المقاس -->
1986    <div class="variant-picker-item variant-size" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 1)" :key="optionHeader.id" >
1987      <div class="d-flex justify-content-between align-items-center">
1988        <div class="variant-picker-label">
1989          <span v-text="optionHeader.name + ': '"></span>
1990          <span class="fw-6 variant-picker-label-value"
1991                v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
1992        </div>
1993      </div>
1994      <div class="variant-picker-values">
1995        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
1996          <input type="radio"
1997                 :id="`value-${detail.id}-${headerIndex}-${index}-2`"
1998                 :name="`value-${detail.id}-${headerIndex}-${index}-2`"
1999                 :value="detail.id"
2000                 :checked="isSelected(detail.id, optionHeader.id)"
2001                 @click="selectValue(detail, optionHeader)" />
2002          <label class="style-text" :for="`value-${detail.id}-${headerIndex}-${index}-2`">
2003            <p v-text="detail.name"></p>
2004          </label>
2005        </div>
2006      </div>
2007    </div>
2008
2009    <!-- اختيار صورة -->
2010    <div class="variant-picker-item variant-image" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 3)" :key="optionHeader.id" >
2011      <div class="d-flex justify-content-between align-items-center">
2012        <div class="variant-picker-label">
2013          <span v-text="optionHeader.name + ': '"></span>
2014          <span class="fw-6 variant-picker-label-value"
2015                v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
2016        </div>
2017      </div>
2018      <div class="variant-picker-values">
2019        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
2020          <input type="radio"
2021                 :id="`value-${detail.id}-${headerIndex}-${index}-2`"
2022                 :name="`value-${detail.id}-${headerIndex}-${index}-2`"
2023                 :value="detail.id"
2024                 :checked="isSelected(detail.id, optionHeader.id)"
2025                 @click="selectValue(detail, optionHeader)" />
2026          <label class="style-text" :for="`value-${detail.id}-${headerIndex}-${index}-2`" style="width: 78px;height: 60px;">
2027            <img :src="'/' + detail.fullFilePath" :data-src="'/' + detail.fullFilePath" alt="صور المنتج للإختيار" style="width: 50px;"/>
2028            <p v-text="detail.name"></p>
2029          </label>
2030        </div>
2031      </div>
2032    </div>
2033  </template>
2034</div>
2035
2036
2037
2038              <div class="tf-product-info-buy-button">
2039                <form class="">
2040
2041                  <div class="tf-product-info-quantity">
2042                    <div class="wg-quantity radius-60">
2043                      <span class="btn-quantity btn-decrease" @click="decreaseQuantity({})"><i class="fi fi-rr-minus-small"></i></span>
2044                      <input type="number" class="quantity-product" name="number" value="1" disabled="" v-model="quantity" @change="changeQuantity()" />
2045                      <span class="btn-quantity btn-increase" @click="increaseQuantity({})"><i class="fi fi-rr-plus-small"></i></span>
2046                    </div>
2047                  </div>
2048                  <a href="javascript:void(0);" @click="addToCart()" class="tf-btn btn-fill justify-content-center radius-60 fw-6 fs-16 flex-grow-1 animate-hover-btn btn-add-to-cart">
2049                    <span>
2050                     &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629; &nbsp;
2051                    </span>
2052                    <span class="tf-qty-price total-price">
2053                      <span class="price ">
2054						  <span class="space-between"></span>
2055                        <span v-text="totalPriceProduct"></span>
2056                        <span class="icon-saudi_riyal"></span>
2057                      </span>
2058                    </span>
2059                  </a>
2060
2061                </form>
2062              </div>
2063              <div class="tf-product-info-extra-link">
2064
2065                <a  class="tf-product-extra-icon" @click="shareProduct()">
2066                  <div class="icon">
2067                    <i class="icon-share"></i>
2068                  </div>
2069                  <div class="text fw-6">&#x645;&#x634;&#x627;&#x631;&#x643;&#x629;</div>
2070                </a>
2071              </div>
2072              
2073              <div class="tf-product-info-delivery-return" >
2074                <div class="row">
2075                  <div class="col-xl-6 col-12">
2076                    <div class="tf-product-delivery">
2077                      <div class="icon">
2078                        <i class="icon-delivery-time"></i>
2079                      </div>
2080                      <p>
2081						  &#x645;&#x62F;&#x629; &#x627;&#x644;&#x62A;&#x648;&#x635;&#x64A;&#x644; &#x627;&#x644;&#x645;&#x62A;&#x648;&#x642;&#x639;&#x629;: <span class="fw-7">12-26 &#x64A;&#x648;&#x645;&#x64B;&#x627;</span>
2082						  (&#x62F;&#x648;&#x644;&#x64A;&#x64B;&#x627;)&#x60C; <span class="fw-7">3-6 &#x623;&#x64A;&#x627;&#x645;</span> ( &#x627;&#x644;&#x633;&#x639;&#x648;&#x62F;&#x64A;&#x629;).
2083					  </p>
2084                    </div>
2085                  </div>
2086                  <div class="col-xl-6 col-12">
2087                    <div class="tf-product-delivery mb-0">
2088                      <div class="icon">
2089                        <i class="icon-return-order"></i>
2090                      </div>
2091                      <p>
2092						  &#x627;&#x644;&#x625;&#x631;&#x62C;&#x627;&#x639; &#x62E;&#x644;&#x627;&#x644; <span class="fw-7">30 &#x64A;&#x648;&#x645;&#x64B;&#x627;</span> &#x645;&#x646; &#x62A;&#x627;&#x631;&#x64A;&#x62E; &#x627;&#x644;&#x634;&#x631;&#x627;&#x621;.
2093						  &#x627;&#x644;&#x631;&#x633;&#x648;&#x645; &#x648;&#x627;&#x644;&#x636;&#x631;&#x627;&#x626;&#x628; &#x63A;&#x64A;&#x631; &#x642;&#x627;&#x628;&#x644;&#x629; &#x644;&#x644;&#x627;&#x633;&#x62A;&#x631;&#x62F;&#x627;&#x62F;.
2094					  </p>
2095
2096                    </div>
2097                  </div>
2098                </div>
2099              </div>
2100              
2101              <div class="tf-product-info-trust-seal">
2102                <div class="tf-product-trust-mess">
2103                  <i class="icon-safe"></i>
2104                  <p class="fw-6">
2105&#x639;&#x645;&#x644;&#x64A;&#x629; &#x62F;&#x641;&#x639; &#x622;&#x645;&#x646;&#x647;                  </p>
2106                </div>
2107                <div class="tf-payment">
2108                  <img src="/Views/Themes/decor/V1/Assets/images/payments/mada.png" alt=""/>
2109                  <img src="/Views/Themes/decor/V1/Assets/images/payments/visa.png" alt=""/>
2110                  <img src="/Views/Themes/decor/V1/Assets/images/payments/masterCard.png" alt=""/>
2111                  <img src="/Views/Themes/decor/V1/Assets/images/payments/applePay.png" alt=""/>
2112                  
2113                </div>
2114              </div>
2115            </div>
2116          </div>
2117        </div>
2118      </div>
2119    </div>
2120  </div>
2121  <div class="tf-sticky-btn-atc">
2122    <div class="container">
2123      <div class="tf-height-observer w-100 d-flex align-items-center">
2124        <div class="tf-sticky-atc-product d-flex align-items-center">
2125          <div class="tf-sticky-atc-img">
2126			  <img class="lazyloaded"  data-src="https://theme.lak.sa/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c
21267d61a00-2405-4bf3-b10c-c63afdbbd161.webp"
2127			src="https://theme.lak.sa/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp"
2128			alt="image-product" />
2129          </div>
2130          <div class="tf-sticky-atc-title fw-5 d-xl-block d-none"> Hm 06</div>
2131        </div>
2132        <div class="tf-sticky-atc-infos">
2133          <form class="">
2134            <div class="tf-sticky-atc-btns">
2135              <div class="tf-product-info-quantity ">
2136                <div class="wg-quantity radius-60">
2137                  <span class="btn-quantity minus-btn" @click="decreaseQuantity({})"><i class="fi fi-rr-minus-small"></i></span>
2138                  <input type="text" name="number" value="1" disabled="" v-model="quantity" @change="changeQuantity()"/>
2139                  <span class="btn-quantity plus-btn" @click="increaseQuantity({})"><i class="fi fi-rr-plus-small"></i></span>
2140                </div>
2141              </div>
2142              <a href="javascript:void(0);" @click="addToCart()"
2143                class="tf-btn btn-fill radius-3 justify-content-center fw-6 fs-14 flex-grow-1 radius-60 animate-hover-btn btn-add-to-cart">
2144                <span>
2145                 &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;  &nbsp;
2146                </span>
2147                <span class="tf-qty-price total-price">
2148                  <span class="price ">
2149					<span class="space-between"></span>
2150                    <span v-text="totalPriceProduct"></span>
2151                    <span class="icon-saudi_riyal"></span>
2152                  </span>
2153                </span>
2154              </a>
2155            </div>
2156          </form>
2157        </div>
2158      </div>
2159    </div>
2160  </div>
2161</section>
2162<!-- /default -->
2163<!-- tabs -->
2164<section class="flat-spacing-17 pt_0">
2165  <div class="container">
2166    <div class="row">
2167      <div class="col-12">
2168        <div class="widget-tabs style-has-border">
2169          <ul class="widget-menu-tab">
2170            <li class="item-title active">
2171              <span class="inner">&#x627;&#x644;&#x648;&#x635;&#x641;</span>
2172            </li>
2173            <li class="item-title"  v-show="optionHeaders && optionHeaders.length > 0">
2174              <span class="inner">&#x645;&#x639;&#x644;&#x648;&#x645;&#x627;&#x62A; &#x625;&#x636;&#x627;&#x641;&#x64A;&#x629;</span>
2175            </li>
2176            <li class="item-title">
2177              <span class="inner">&#x62A;&#x642;&#x64A;&#x64A;&#x645;&#x627;&#x62A;</span>
2178            </li>
2179            <li class="item-title" v-if="false">
2180              <span class="inner">&#x627;&#x644;&#x634;&#x62D;&#x646;</span>
2181            </li>
2182            <li class="item-title" v-if="false">
2183              <span class="inner">&#x633;&#x64A;&#x627;&#x633;&#x627;&#x62A; &#x627;&#x644;&#x625;&#x631;&#x62C;&#x627;&#x639;</span>
2184            </li>
2185          </ul>
2186          <div class="widget-content-tab">
2187			  <div v-if="loadingDescription" class="text-center py-3 widget-content-inner active">
2188				  &#x62A;&#x62D;&#x645;&#x64A;&#x644; ...
2189			  </div>
2190			  <div v-if="!loadingDescription" v-html="productDescription" class="widget-content-inner active"></div>
2191            <div class="widget-content-inner">
2192              <table class="tf-pr-attrs">
2193                <tbody>
2194                  <tr class="tf-attr-pa-color" v-for="(optionHeader, index) in optionHeaders">
2195                    <th class="tf-attr-label" v-text="optionHeader?.name"></th>
2196                    <td class="tf-attr-value">
2197                      <p v-text="optionHeader.productOptionDetails.map(x => x.name).join(', ')"></p>
2198                    </td>
2199                  </tr>
2200                </tbody>
2201              </table>
2202            </div>
2203
2204
2205
2206            <div class="widget-content-inner">
2207              <div class="tab-reviews write-cancel-review-wrap">
2208                <div class="tab-reviews-heading">
2209                  <div class="top">
2210                    <div class="text-center">
2211                      <h1 class="number fw-6">5</h1>
2212                      <div class="list-star">
2213                        
2214					<li>
2215                     <i class="icon icon-star "></i>
2216					</li>
2217					
2218					<li>
2219                     <i class="icon icon-star "></i>
2220					</li>
2221					
2222					<li>
2223                     <i class="icon icon-star "></i>
2224					</li>
2225					
2226					<li>
2227                     <i class="icon icon-star "></i>
2228					</li>
2229					
2230					<li>
2231                     <i class="icon icon-star "></i>
2232					</li>
2233					  
2234                      </div>
2235						
2236					</div>
2237					  <div class="rating-score">
2238						  <div class="item">
2239							  <div class="number-1 text-caption-1">5</div>
2240							  <i class="icon icon-star"></i>
2241							  <div class="line-bg">
2242								  
2243								  <div :style="{ width: 100 + '%' }"></div>
2244								  
2245								  
2246								  
2247							  </div>
2248							  <div class="number-2 text-caption-1" v-if="rateData.fiveRate > 0" v-text="rateData.fiveRate"></div>
2249							  
2250							  <div class="number-2 text-caption-1" v-if="rateData.fiveRate == 0" v-text="100"></div>
2251							  
2252							  
2253						  </div>
2254						  <div class="item">
2255							  <div class="number-1 text-caption-1">4</div>
2256							  <i class="icon icon-star"></i>
2257							  <div class="line-bg">
2258								  
2259								  
2260								  
2261							  </div>
2262							  <div class="number-2 text-caption-1" v-if="rateData.fourRate > 0" v-text="rateData.fourRate"></div>
2263							  
2264							  
2265							  <div class="number-2 text-caption-1" v-if="rateData.fourRate == 0" v-text="rateData.fourRate"></div>
2266							  
2267						  </div>
2268						  <div class="item">
2269							  <div class="number-1 text-caption-1">3</div>
2270							  <i class="icon icon-star"></i>
2271							  <div class="line-bg">
2272								  
2273								  
2274								  
2275							  </div>
2276							  <div class="number-2 text-caption-1" v-if="rateData.threeRate > 0" v-text="rateData.threeRate"></div>
2277							  
2278							  
2279							  <div class="number-2 text-caption-1" v-if="rateData.threeRate == 0" v-text="rateData.threeRate"></div>
2280							  
2281						  </div>
2282						  <div class="item">
2283							  <div class="number-1 text-caption-1">2</div>
2284							  <i class="icon icon-star"></i>
2285							  <div class="line-bg">
2286								  
2287								  
2288								  
2289							  </div>
2290							  <div class="number-2 text-caption-1" v-if="rateData.rateData > 0" v-text="rateData.twoRate"></div>
2291							  
2292							  
2293							  <div class="number-2 text-caption-1" v-if="rateData.twoRate == 0" v-text="rateData.twoRate"></div>
2294							  
2295						  </div>
2296						  <div class="item">
2297							  <div class="number-1 text-caption-1">1</div>
2298							  <i class="icon icon-star"></i>
2299							  <div class="line-bg">
2300								  
2301								  
2302								  
2303							  </div>
2304							  <div class="number-2 text-caption-1" v-if="rateData.oneRate > 0" v-text="rateData.oneRate"></div>
2305							  
2306							  
2307							  <div class="number-2 text-caption-1" v-if="rateData.oneRate == 0" v-text="rateData.oneRate"></div>
2308							  
2309						  </div>
2310					  </div>
2311                  </div>
2312                  <div>
2313                    <div class="tf-btn btn-outline-dark fw-6 btn-comment-review btn-cancel-review">&#x627;&#x62D;&#x630;&#x641; &#x627;&#x644;&#x62A;&#x642;&#x64A;&#x64A;&#x645;</div>
2314                    <div class="tf-btn btn-outline-dark fw-6 btn-comment-review btn-write-review">&#x627;&#x643;&#x62A;&#x628; &#x62A;&#x642;&#x64A;&#x64A;&#x645; </div>
2315                  </div>
2316                </div>
2317
2318                <div class="reply-comment cancel-review-wrap">
2319                  <div class="d-flex mb_24 gap-20 align-items-center justify-content-between flex-wrap">
2320					  <h5 class="" v-if="productReviews.length > 0">
2321						  <span v-text="productReviews.length"></span> &#x62A;&#x639;&#x644;&#x64A;&#x642;&#x627;&#x62A;
2322					  </h5>
2323                    <div class="d-flex align-items-center gap-12">
2324                      <div class="text-caption-1">&#x627;&#x644;&#x641;&#x631;&#x632; &#x62D;&#x633;&#x628; :</div>
2325                      <div class="tf-dropdown-sort" data-bs-toggle="dropdown">
2326                        <div class="btn-select">
2327                          <span class="text-sort-value">&#x627;&#x644;&#x623;&#x62D;&#x62F;&#x62B;</span>
2328                          <span class="icon icon-arrow-down"></span>
2329                        </div>
2330                        <div class="dropdown-menu">
2331                          <div class="select-item active" @click="getProductPreviews('creationTime desc')">
2332                            <span class="text-value-item">&#x627;&#x644;&#x623;&#x62D;&#x62F;&#x62B;</span>
2333                          </div>
2334                          <div class="select-item" @click="getProductPreviews('creationTime asc')">
2335                            <span class="text-value-item">&#x627;&#x644;&#x623;&#x642;&#x62F;&#x645;</span>
2336                          </div>
2337                        </div>
2338                      </div>
2339                    </div>
2340                  </div>
2341
2342					<div class="reply-comment-wrap">
2343						<div class="reply-comment-item" v-for="item in productReviews">
2344							<div class="user">
2345								<div class="image">
2346									<img :src="item.avatarPath ? '/'+item.avatarPath : '/default-avatar.jpg'"
2347														alt="user-image" />
2348								</div>
2349								<div>
2350									<h6 v-text="item.customerName">
2351									</h6>
2352									<div class="day text_black-2" v-text="item.creationTimeAgo"></div>
2353								</div>
2354							</div>
2355							<h6 class="link" v-text="item.title"> </h6>
2356							<p class="text_black-2" v-text="item.comment"></p>
2357							<div class="replyyy" v-if="item.reply" >
2358								<div class="comment-main">
2359									<div class="user">
2360										<div class="image">
2361											<img src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/storeScreenshots/0901e432-6c0a-4a2e-9c19-9126f6c8dc26.png"  alt="logo"/>
2362										</div>
2363										<div>
2364											<h6  >
2365												house of HM
2366											</h6>
2367											<div class="day text_black-2"  v-text="item.creationTimeAgo">
2368
2369											</div>
2370										</div>
2371									</div>
2372									<p class="text_black-2"  v-text="item.reply" > </p>
2373								</div>
2374							</div>
2375						</div>
2376					</div>
2377                </div>
2378
2379                <form class="form-write-review write-review-wrap" id="reviewForm">
2380                  <div class="heading">
2381                    <h5> 
2382                      &#x627;&#x643;&#x62A;&#x628; &#x62A;&#x642;&#x64A;&#x64A;&#x645; :</h5>
2383                    <div class="list-rating-check">
2384                      <input type="radio" id="star5" name="rate" value="5" v-model="productPreview.rateValue"/>
2385                      <label for="star5" title="&#x645;&#x645;&#x62A;&#x627;&#x632;"></label>
2386                      <input type="radio" id="star4" name="rate" value="4" v-model="productPreview.rateValue"/>
2387                      <label for="star4" title="&#x62C;&#x64A;&#x62F; &#x62C;&#x62F;&#x627;&#x64B;"></label>
2388                      <input type="radio" id="star3" name="rate" value="3" v-model="productPreview.rateValue"/>
2389                      <label for="star3" title="&#x62C;&#x64A;&#x62F;"></label>
2390                      <input type="radio" id="star2" name="rate" value="2" v-model="productPreview.rateValue"/>
2391                      <label for="star2" title="&#x636;&#x639;&#x64A;&#x641;"></label>
2392                      <input type="radio" id="star1" name="rate" value="1" v-model="productPreview.rateValue"/>
2393                      <label for="star1" title="&#x633;&#x64A;&#x626;"></label>
2394                    </div>
2395                  </div>
2396
2397                  <div class="form-content">
2398                    <fieldset class="box-field">
2399                      <label class="label"> &#x639;&#x646;&#x648;&#x627;&#x646; &#x627;&#x644;&#x62A;&#x642;&#x64A;&#x64A;&#x645;</label>
2400                      <input type="text" placeholder="&#x623;&#x62F;&#x62E;&#x644; &#x639;&#x646;&#x648;&#x627;&#x646; &#x644;&#x62A;&#x642;&#x64A;&#x64A;&#x645;&#x643;" name="title" required="" v-model="productPreview.title"/>
2401                    </fieldset>
2402                    <fieldset class="box-field">
2403                      <label class="label">&#x627;&#x644;&#x62A;&#x639;&#x644;&#x64A;&#x642;</label>
2404                      <textarea rows="4" placeholder="&#x627;&#x643;&#x62A;&#x628; &#x62A;&#x639;&#x644;&#x64A;&#x642;&#x643; &#x647;&#x646;&#x627;" name="comment" required="" v-model="productPreview.comment"></textarea>
2405                      
2406                    </fieldset>
2407                    
2408                  </div>
2409
2410                  <div class="button-submit">
2411                    <button class="tf-btn btn-fill animate-hover-btn" type="button" @click="sendPreview"> 
2412                      &#x627;&#x631;&#x633;&#x644; &#x627;&#x644;&#x62A;&#x642;&#x64A;&#x64A;&#x645;
2413                    </button>
2414                  </div>
2415                </form>
2416              </div>
2417            </div>
2418
2419            <div class="widget-content-inner">
2420              <div class="tf-page-privacy-policy">
2421                <div class="title">سياسة شركة The Company Private Limited</div>
2422                <p>تُدرك شركة The Company Private Limited، وكل من الشركات التابعة لها أو الأم أو المرتبطة بها والتي يُفترض أنها تُشغّل هذا الموقع ("نحن" أو "لنا")، مدى اهتمامك بكيفية استخدام ومشاركة معلوماتك. لقد أنشأنا سياسة الخصوصية هذه لإبلاغك بالمعلومات التي نقوم بجمعها على الموقع، وكيف نستخدم معلوماتك، والخيارات المتاحة أمامك بخصوص طريقة جمع المعلومات واستخدامها. يرجى قراءة سياسة الخصوصية هذه بعناية. إن استخدامك للموقع يُشير إلى أنك قرأت ووافقت على ممارسات الخصوصية الخاصة بنا كما هو موضح في هذه السياسة.</p>
2423
2424                <p>يرجى العلم أن الممارسات الموضحة في سياسة الخصوصية هذه تنطبق على المعلومات التي نقوم بجمعها نحن أو شركاتنا التابعة أو وكلاؤنا من خلال: (1) Ù
2424‡Ø°Ø§ الموقع، (2) عند الاقتضاء، من خلال قسم خدمة العملاء لدينا فيما يتعلق بهذا الموقع، (3) المعلومات المقدمة لنا في متاجرنا المستقلة، و(4) المعلومات المقدمة لنا في إطار العروض الترويجية والمسابقات التسويقية.</p>
2425
2426                <p>نحن غير مسؤولين عن محتوى أو ممارسات الخصوصية لأي مواقع إلكترونية أخرى.</p>
2427
2428                <p>نحتفظ بالحق، وفقًا لتقديرنا الخاص، في تعديل أو تحديث أو إضافة أو إيقاف أو إزالة أو تغيير أي جزء من سياسة الخصوصية هذه، سواء كليًا أو جزئيًا، في أي وقت. عند تعديل سياسة الخصوصية هذه، سنقوم بتحديث تاريخ "آخر تحديث" الموجود في أعلى هذه السياسة.</p>
2429
2430                <p>إذا قمت بتقديم معلومات لنا أو قمت بالوصول أو استخدام الموقع بأي شكل من الأشكال بعد تغيير سياسة الخصوصية هذه، فسيُعتبر أنك قد وافقت بشكل غير مشروط على هذه التغييرات. النسخة الأحدث من سياسة الخصوصية ستكون متاحة على الموقع وستُلغي جميع النسخ السابقة من هذه السياسة.</p>
2431
2432                <p>إذا كان لديك أي أسئلة بخصوص سياسة الخصوصية هذه، يُرجى التواصل مع قسم خدمة العملاء لدينا عبر البريد الإلكتروني: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="b8d5d9cad3ddccd1d6dff8dbd7d5c8d9d6c196dbd7d5">[email&#160;protected]</a></p>
2433              </div>
2434
2435            </div>
2436            <div class="widget-content-inner">
2437              <ul class="d-flex justify-content-center mb_18">
2438                <li class="">
2439                  <svg viewBox="0 0 40 40" width="35px" height="35px" color="#222"
2440                    margin="5px">
2441                    <path fill="currentColor"
2442                      d="M8.7 30.7h22.7c.3 0 .6-.2.7-.6l4-25.3c-.1-.4-.3-.7-.7-.8s-.7.2-.8.6L34 8.9l-3-1.1c-2.4-.9-5.1-.5-7.2 1-2.3 1.6-5.3 1.6-7.6 0-2.1-1.5-4.8-1.9-7.2-1L6 8.9l-.7-4.3c0-.4-.4-.7-.7-.6-.4.1-.6.4-.6.8l4 25.3c.1.3.3.6.7.6zm.8-21.6c2-.7 4.2-.4 6 .8 1.4 1 3 1.5 4.6 1.5s3.2-.5 4.6-1.5c1.7-1.2 4-1.6 6-.8l3.3 1.2-3 19.1H9.2l-3-19.1 3.3-1.2zM32 32H8c-.4 0-.7.3-.7.7s.3.7.7.7h24c.4 0 .7-.3.7-.7s-.3-.7-.7-.7zm0 2.7H8c-.4 0-.7.3-.7.7s.3.6.7.6h24c.4 0 .7-.3.7-.7s-.3-.6-.7-.6zm-17.9-8.9c-1 0-1.8-.3-2.4-.6l.1-2.1c.6.4 1.4.6 2 .6.8 0 1.2-.4 1.2-1.3s-.4-1.3-1.3-1.3h-1.3l.2-1.9h1.1c.6 0 1-.3 1-1.3 0-.8-.4-1.2-1.1-1.2s-1.2.2-1.9.4l-.2-1.9c.7-.4 1.5-.6 2.3-.6 2 0 3 1.3 3 2.9 0 1.2-.4 1.9-1.1 2.3 1 .4 1.3 1.4 1.3 2.5.3 1.8-.6 3.5-2.9 3.5zm4-5.5c0-3.9 1.2-5.5 3.2-5.5s3.2 1.6 3.2 5.5-1.2 5.5-3.2 5.5-3.2-1.6-3.2-5.5zm4.1 0c0-2-.1-3.5-.9-3.5s-1 1.5-1 3.5.1 3.5 1 3.5c.8 0 .9-1.5.9-3.5zm4.5-1.4c-.9 0-1.5-.8-1.5-2.1s.6-2.1 1.5-2.1 1.5.8 1.5 2.1-.5 2.1-1.5 2.1zm0-.8c.4 0 .7-.5.7-1.2s-.2-1.2-.7-1.2-.7.5-.7 1.2.3 1.2.7 1.2z">
2443                    </path>
2444                  </svg>
2445                </li>
2446                <li class="">
2447                  <svg viewBox="0 0 40 40" width="35px" height="35px" color="#222"
2448                    margin="5px">
2449                    <path fill="currentColor"
2450                      d="M36.7 31.1l-2.8-1.3-4.7-9.1 7.5-3.5c.4-.2.6-.6.4-1s-.6-.5-1-.4l-7.5 3.5-7.8-15c-.3-.5-1.1-.5-1.4 0l-7.8 15L4 15.9c-.4-.2-.8 0-1 .4s0 .8.4 1l7.5 3.5-4.7 9.1-2.8 1.3c-.4.2-.6.6-.4 1 .1.3.4.4.7.4.1 0 .2 0 .3-.1l1-.4-1.5 2.8c-.1.2-.1.5 0 .8.1.2.4.3.7.3h31.7c.3 0 .5-.1.7-.4.1-.2.1-.5 0-.8L35.1 32l1 .4c.1 0 .2.1.3.1.3 0 .6-.2.7-.4.1-.3 0-.8-.4-1zm-5.1-2.3l-9.8-4.6 6-2.8 3.8 7.4zM20 6.4L27.1 20 20 23.3 12.9 20 20 6.4zm-7.8 15l6 2.8-9.8 4.6 3.8-7.4zm22.4 13.1H5.4L7.2 31 20 25l12.8 6 1.8 3.5z">
2451                    </path>
2452                  </svg>
2453                </li>
2454                <li class="">
2455                  <svg viewBox="0 0 40 40" width="35px" height="35px" c
2455olor="#222"
2456                    margin="5px">
2457                    <path fill="currentColor"
2458                      d="M5.9 5.9v28.2h28.2V5.9H5.9zM19.1 20l-8.3 8.3c-2-2.2-3.2-5.1-3.2-8.3s1.2-6.1 3.2-8.3l8.3 8.3zm-7.4-9.3c2.2-2 5.1-3.2 8.3-3.2s6.1 1.2 8.3 3.2L20 19.1l-8.3-8.4zM20 20.9l8.3 8.3c-2.2 2-5.1 3.2-8.3 3.2s-6.1-1.2-8.3-3.2l8.3-8.3zm.9-.9l8.3-8.3c2 2.2 3.2 5.1 3.2 8.3s-1.2 6.1-3.2 8.3L20.9 20zm8.4-10.2c-1.2-1.1-2.6-2-4.1-2.6h6.6l-2.5 2.6zm-18.6 0L8.2 7.2h6.6c-1.5.6-2.9 1.5-4.1 2.6zm-.9.9c-1.1 1.2-2 2.6-2.6 4.1V8.2l2.6 2.5zM7.2 25.2c.6 1.5 1.5 2.9 2.6 4.1l-2.6 2.6v-6.7zm3.5 5c1.2 1.1 2.6 2 4.1 2.6H8.2l2.5-2.6zm18.6 0l2.6 2.6h-6.6c1.4-.6 2.8-1.5 4-2.6zm.9-.9c1.1-1.2 2-2.6 2.6-4.1v6.6l-2.6-2.5zm2.6-14.5c-.6-1.5-1.5-2.9-2.6-4.1l2.6-2.6v6.7z">
2459                    </path>
2460                  </svg>
2461                </li>
2462                <li class="">
2463                  <svg viewBox="0 0 40 40" width="35px" height="35px" color="#222"
2464                    margin="5px">
2465                    <path fill="currentColor"
2466                      d="M35.1 33.6L33.2 6.2c0-.4-.3-.7-.7-.7H13.9c-.4 0-.7.3-.7.7s.3.7.7.7h18l.7 10.5H20.8c-8.8.2-15.9 7.5-15.9 16.4 0 .4.3.7.7.7h28.9c.2 0 .4-.1.5-.2s.2-.3.2-.5v-.2h-.1zm-28.8-.5C6.7 25.3 13 19 20.8 18.9h11.9l1 14.2H6.3zm11.2-6.8c0 1.2-1 2.1-2.1 2.1s-2.1-1-2.1-2.1 1-2.1 2.1-2.1 2.1 1 2.1 2.1zm6.3 0c0 1.2-1 2.1-2.1 2.1-1.2 0-2.1-1-2.1-2.1s1-2.1 2.1-2.1 2.1 1 2.1 2.1z">
2467                    </path>
2468                  </svg>
2469                </li>
2470                <li class="">
2471                  <svg viewBox="0 0 40 40" width="35px" height="35px" color="#222"
2472                    margin="5px">
2473                    <path fill="currentColor"
2474                      d="M20 33.8c7.6 0 13.8-6.2 13.8-13.8S27.6 6.2 20 6.2 6.2 12.4 6.2 20 12.4 33.8 20 33.8zm0-26.3c6.9 0 12.5 5.6 12.5 12.5S26.9 32.5 20 32.5 7.5 26.9 7.5 20 13.1 7.5 20 7.5zm-.4 15h.5c1.8 0 3-1.1 3-3.7 0-2.2-1.1-3.6-3.1-3.6h-2.6v10.6h2.2v-3.3zm0-5.2h.4c.6 0 .9.5.9 1.7 0 1.1-.3 1.7-.9 1.7h-.4v-3.4z">
2475                    </path>
2476                  </svg>
2477                </li>
2478                <li class="">
2479                  <svg viewBox="0 0 40 40" width="35px" height="35px" color="#222"
2480                    margin="5px">
2481                    <path fill="currentColor"
2482                      d="M30.2 29.3c2.2-2.5 3.6-5.7 3.6-9.3s-1.4-6.8-3.6-9.3l3.6-3.6c.3-.3.3-.7 0-.9-.3-.3-.7-.3-.9 0l-3.6 3.6c-2.5-2.2-5.7-3.6-9.3-3.6s-6.8 1.4-9.3 3.6L7.1 6.2c-.3-.3-.7-.3-.9 0-.3.3-.3.7 0 .9l3.6 3.6c-2.2 2.5-3.6 5.7-3.6 9.3s1.4 6.8 3.6 9.3l-3.6 3.6c-.3.3-.3.7 0 .9.1.1.3.2.5.2s.3-.1.5-.2l3.6-3.6c2.5 2.2 5.7 3.6 9.3 3.6s6.8-1.4 9.3-3.6l3.6 3.6c.1.1.3.2.5.2s.3-.1.5-.2c.3-.3.3-.7 0-.9l-3.8-3.6z">
2483                    </path>
2484                  </svg>
2485                </li>
2486                <li class="">
2487                  <svg viewBox="0 0 40 40" width="35px" height="35px" color="#222"
2488                    margin="5px">
2489                    <path fill="currentColor"
2490                      d="M34.1 34.1H5.9V5.9h28.2v28.2zM7.2 32.8h25.6V7.2H7.2v25.6zm13.5-18.3a.68.68 0 0 0-.7-.7.68.68 0 0 0-.7.7v10.9a.68.68 0 0 0 .7.7.68.68 0 0 0 .7-.7V14.5z">
2491                    </path>
2492                  </svg>
2493                </li>
2494              </ul>
2495              <p class="text-center text-paragraph">
2496                LT01: 70% wool, 15% polyester, 10% polyamide,
2497                5% acrylic 900 Grms/mt
2498              </p>
2499            </div>
2500          </div>
2501        </div>
2502      </div>
2503    </div>
2504  </div>
2505</section>
2506<!-- /tabs -->
2507
2508
2509<!-- Sale Product -->
2510<section class="flat-spacing-17" v-if="false">
2511  <div class="container">
2512    <div class="flat-title">
2513      <h2 class="title wow fadeInUp" data-wow-delay="0s">
2514       &#x645;&#x646;&#x62A;&#x62C;&#x627;&#x62A; &#x630;&#x627;&#x62A; &#x635;&#x644;&#x629;
2515      </span>
2516    </div>
2517    <div class="flat-animate-tab">
2518      <div class="tab-content">
2519        <!-- tab Product 01 -->
2520        <div class="tab-pane active show" id="bestSeller" role="tabpanel">
2521          <div class="grid-layout loadmore-item" data-grid="grid-4">
2522            <!-- card product 5 -->
2523            <div class="card-product fl-item">
2524              <div class="card-product-wrapper">
2525                <a href="product-detail.html" class="product-img">
2526                  <img class="lazyload img-product" data-src="/Views/Themes/decor/V1/Assets/images/products/product01.jpg"
2527                    src="/Views/Themes/decor/V1/Assets/images/products/product01.jpg" alt="image-product" />
2528                  <img class="lazyload img-hover" data-src="/Views/Themes/decor/V1/Assets/images/products/product02.jpg"
2529                    src="/Views/Themes/decor/V1/Assets/images/products/product02.jpg" alt="image-product" />
2530                </a>
2531
2532                <div class="list-product-btn">
2533                  <a href="#quick_add" data-bs-toggle="modal"
2534                    class="box-icon bg_white quick-add tf-btn-loading">
2535                    <span class="icon icon-bag"></span>
2536                    <span class="tooltip">
2537						&#x625;&#x636;&#x627;&#x641;&#x629; &#x633;&#x631;&#x64A;&#x639;&#x629;
2538					</span>
2539                  </a>
2540                  <a href="javascript:void(0);"
2541                    class="box-icon bg_white wishlist btn-icon-action">
2542                    <span class="icon icon-heart"></span>
2543                    <span class="tooltip">&#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;</span>
2544                    <span class="icon icon-delete"></span>
2545                  </a>
2546                  <a href="#quick_view" data-bs-toggle="modal"
2547                    class="box-icon bg_white quickview tf-btn-loading">
2548                    <span class="icon icon-view"></span>
2549                    <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
2550                  </a>
2551                </div>
2552                <div class="on-sale-wrap text-end">
2553                  <div class="on-sale-item bg_red-2">-29%</div>
2554                </div>
2555              </div>
2556
2557              <div class="card-product-info">
2558                <div class="flex items-center gap-1 rate-item">
2559                  <i class="icon icon-star text-orange"></i>
2560                  <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
2561                  <span> (115 &#x62A;&#x642;&#x64A;&#x64A;&#x645;&#x627;&#x62A;) </span>
2562                </div>
2563                <a href="product-detail.html" class="title link">&#x643;&#x631;&#x633;&#x64A; &#x627;&#x646;&#x633;&#x64A;&#x627;&#x628;&#x64A; &#x645;&#x648;&#x62F;&#x631;&#x646;</a>
2564                <div class="d-flex mt-2 gap-5">
2565                  <span
2566                    class="before-price text-gray-400 line-through whitespace-nowrap leading-none">
2567                    1150.5
2568
2569                  </span>
2570                  <span class="price ">
2571                    114.95
2572                    <span class="icon-saudi_riyal"></span>
2573                  </span>
2574                </div>
2575              </div>
2576            </div>
2577            <!-- card product 5 -->
2578            
2579          </div>
2580          <div class="tf-pagination-wrap view-more-button text-center">
2581            <button class="tf-btn-loading tf-loading-default style-2 " onclick="location.href='/products'; return false;">
2582              <span class="text">&#x62A;&#x62D;&#x645;&#x64A;&#x644; &#x627;&#x644;&#x645;&#x632;&#x64A;&#x62F;</span>
2583            </button>
2584          </div>
2585        </div>
2586        <!-- /tab Product 01 -->
2587      </div>
2588    </div>
2589  </div>
2590</section>
2591
2592
2593
2594
2595
2596
2597
2598<!-- related products -->
2599  <section class="flat-spacing-18 matcha-slider">
2600      <div class="container">
2601        <div class="flat-title">
2602          <span class="title wow fadeInUp" data-wow-delay="0s">&#x645;&#x646;&#x62A;&#x62C;&#x627;&#x62A; &#x630;&#x627;&#x62A; &#x635;&#x644;&#x629; </span>
2603        </div>
2604          <div class="wrap-carousel">
2605              <div dir="ltr" class="swiper tf-sw-product-sell-1" data-loop="false" data-auto-play="true" data-delay="2000" data-preview="4" data-tablet="3" data-mobile="2" data-space-lg="30" data-space-md="15" data-pagination="2" data-pagination-md="3" data-pagination-lg="3">
2606                  <div class="swiper-wrapper">          
2607                    
2608                      <div class="swiper-slide">
2609                          
2610<div class="card-product style-decor"
2611	data-lak-sort-price="355.00"
2612	data-lak-sort-name="Hm 21"
2613	data-lak-sort-time="">
2614  <div class="card-product-wrapper">
2615    <a href="/hm-21" class="product-img">
2616      
2617        <img class="lazyload img-product"
2618            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1354c1e5-caaa-454f-91ed-c961e46c9767.webp"
2619            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1354c1e5-caaa-454f-91ed-c961e46c9767.webp"
2620            alt="image-product" />
2621        <img class="lazyload img-hover"
2622            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1354c1e5-caaa-454f-91ed-c961e46c9767.webp"
2623            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1354c1e5-caaa-454f-91ed-c961e46c9767.webp"
2624            alt="image-product" />
2625      
2626    </a> 
2627
2628      <div class="list-product-btn">
2629        
2630        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('7824476f-838f-a0e9-1c0a-3a2096e7664f')">
2631          <span class="icon icon-heart"></span>
2632          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
2633          <span class="icon icon-delete"></span>
2634        </a>
2635        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 21&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-21&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1354c1e5-caaa-454f-91ed-c961e46c9767.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;7824476f-838f-a0e9-1c0a-3a2096e7664f&quot;})"
2636            class="box-icon bg_white quickview tf-btn-loading">
2637          <span class="icon icon-view"></span>
2638          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
2639        </a>
2640      </div>
2641      
2642
2643
2644
2645
2646
2647
2648
2649
2650
2651
2652
2653		
2654		<div class="on-sale-wrap promo-item text-end">
2655			<div class="on-sale-item "></div>
2656		</div>
2657		
2658	</div>
2659
2660    <div class="card-product-info text-center">
2661      <div class="flex items-center gap-1 rate-item">
2662        <i class="icon icon-star text-orange"></i>
2663        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
2664		  
2665	  </div>
2666      <h3 href="/hm-21" class="title link">Hm 21</h3>
2667		
2668		<span>
2669			
2670		</span>
2671		
2672		<div class="d-flex mt-2 gap-5 justify-content-center">
2673		  
2674
2675		  
2676
2677		  
2678		  <span class="price">
2679			  355.00
2680			  <span class="icon-saudi_riyal"></span>
2681		  </span>
2682		  
2683	  </div>
2684      <div class="tf-product-btns">
2685        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 21&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-21&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1354c1e5-caaa-454f-91ed-c961e46c9767.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;7824476f-838f-a0e9-1c0a-3a2096e7664f&quot;})">
2686          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
2687        </a>
2688      </div>
2689    </div>
2690  </div>
2691                      </div>
2692                    
2693                      <div class="swiper-slide">
2694                          
2695<div class="card-product style-decor"
2696	data-lak-sort-price="355.00"
2697	data-lak-sort-name="Hm 66"
2698	data-lak-sort-time="">
2699  <div class="card-product-wrapper">
2700    <a href="/hm-66-1" class="product-img">
2701      
2702        <img class="lazyload img-product"
2703            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/97b70058-9368-4af2-8397-e92206e34772.webp"
2704            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/97b70058-9368-4af2-8397-e92206e34772.webp"
2705            alt="image-product" />
2706        <img class="lazyload img-hover"
2707            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/97b70058-9368-4af2-8397-e92206e34772.webp"
2708            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/97b70058-9368-4af2-8397-e92206e34772.webp"
2709            alt="image-product" />
2710      
2711    </a> 
2712
2713      <div class="list-product-btn">
2714        
2715        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('18892aa9-6069-5e10-2904-3a2096e75ba2')">
2716          <span class="icon icon-heart"></span>
2717          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
2718          <span class="icon icon-delete"></span>
2719        </a>
2720        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 66&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-66-1&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/97b70058-9368-4af2-8397-e92206e34772.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;18892aa9-6069-5e10-2904-3a2096e75ba2&quot;})"
2721            class="box-icon bg_white quickview tf-btn-loading">
2722          <span class="icon icon-view"></span>
2723          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
2724        </a>
2725      </div>
2726      
2727
2728
2729
2730
2731
2732
2733
2734
2735
2736
2737
2738		
2739		<div class="on-sale-wrap promo-item text-end">
2740			<div class="on-sale-item "></div>
2741		</div>
2742		
2743	</div>
2744
2745    <div class="card-product-info text-center">
2746      <div class="flex items-center gap-1 rate-item">
2747        <i class="icon icon-star text-orange"></i>
2748        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
2749		  
2750	  </div>
2751      <h3 href="/hm-66-1" class="title link">Hm 66</h3>
2752		
2753		<span>
2754			
2755		</span>
2756		
2757		<div class="d-flex mt-2 gap-5 justify-content-center">
2758		  
2759
2760		  
2761
2762		  
2763		  <span class="price">
2764			  355.00
2765			  <span class="icon-saudi_riyal"></span>
2766		  </span>
2767		  
2768	  </div>
2769      <div class="tf-product-btns">
2770        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 66&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-66-1&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/97b70058-9368-4af2-8397-e92206e34772.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;18892aa9-6069-5e10-2904-3a2096e75ba2&quot;})">
2771          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
2772        </a>
2773      </div>
2774    </div>
2775  </div>
2776                      </div>
2777                    
2778                      <div class="swiper-slide">
2779                          
2780<div class="card-product style-decor"
2781	data-lak-sort-price="355.00"
2782	data-lak-sort-name="Hm 11"
2783	data-lak-sort-time="">
2784  <div class="card-product-wrapper">
2785    <a href="/hm-11" class="product-img">
2786      
2787        <img class="lazyload img-product"
2788            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/4b605e38-3ac5-4e52-a3f8-7364aedc478d.webp"
2789            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/4b605e38-3ac5-4e52-a3f8-7364aedc478d.webp"
2790            alt="image-product" />
2791        <img class="lazyload img-hover"
2792            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/4b605e38-3ac5-4e52-a3f8-7364aedc478d.webp"
2793            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/4b605e38-3ac5-4e52-a3f8-7364aedc478d.webp"
2794            alt="image-product" />
2795      
2796    </a> 
2797
2798      <div class="list-product-btn">
2799        
2800        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('611674fa-f2d7-2962-cd47-3a2096e74e3a')">
2801          <span class="icon icon-heart"></span>
2802          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
2803          <span class="icon icon-delete"></span>
2804        </a>
2805        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 11&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-11&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/4b605e38-3ac5-4e52-a3f8-7364aedc478d.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;611674fa-f2d7-2962-cd47-3a2096e74e3a&quot;})"
2806            class="box-icon bg_white quickview tf-btn-loading">
2807          <span class="icon icon-view"></span>
2808          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
2809        </a>
2810      </div>
2811      
2812
2813
2814
2815
2816
2817
2818
2819
2820
2821
2822
2823		
2824		<div class="on-sale-wrap promo-item text-end">
2825			<div class="on-sale-item "></div>
2826		</div>
2827		
2828	</div>
2829
2830    <div class="card-product-info text-center">
2831      <div class="flex items-center gap-1 rate-item">
2832        <i class="icon icon-star text-orange"></i>
2833        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
2834		  
2835	  </div>
2836      <h3 href="/hm-11" class="title link">Hm 11</h3>
2837		
2838		<span>
2839			
2840		</span>
2841		
2842		<div class="d-flex mt-2 gap-5 justify-content-center">
2843		  
2844
2845		  
2846
2847		  
2848		  <span class="price">
2849			  355.00
2850			  <span class="icon-saudi_riyal"></span>
2851		  </span>
2852		  
2853	  </div>
2854      <div class="tf-product-btns">
2855        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 11&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-11&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/4b605e38-3ac5-4e52-a3f8-7364aedc478d.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;611674fa-f2d7-2962-cd47-3a2096e74e3a&quot;})">
2856          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
2857        </a>
2858      </div>
2859    </div>
2860  </div>
2861                      </div>
2862                    
2863                      <div class="swiper-slide">
2864                          
2865<div class="card-product style-decor"
2866	data-lak-sort-price="355.00"
2867	data-lak-sort-name="Hm 44"
2868	data-lak-sort-time="">
2869  <div class="card-product-wrapper">
2870    <a href="/hm-44-1" class="product-img">
2871      
2872        <img class="lazyload img-product"
2873            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/91ea26c8-b64e-4269-8295-89dc7030b291.webp"
2874            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/91ea26c8-b64e-4269-8295-89dc7030b291.webp"
2875            alt="image-product" />
2876        <img class="lazyload img-hover"
2877            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/91ea26c8-b64e-4269-8295-89dc7030b291.webp"
2878            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/91ea26c8-b64e-4269-8295-89dc7030b291.webp"
2879            alt="image-product" />
2880      
2881    </a> 
2882
2883      <div class="list-product-btn">
2884        
2885        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('d4982502-fa08-a5b7-f5eb-3a2096e74132')">
2886          <span class="icon icon-heart"></span>
2887          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
2888          <span class="icon icon-delete"></span>
2889        </a>
2890        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 44&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-44-1&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/91ea26c8-b64e-4269-8295-89dc7030b291.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;d4982502-fa08-a5b7-f5eb-3a2096e74132&quot;})"
2891            class="box-icon bg_white quickview tf-btn-loading">
2892          <span class="icon icon-view"></span>
2893          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
2894        </a>
2895      </div>
2896      
2897
2898
2899
2900
2901
2902
2903
2904
2905
2906
2907
2908		
2909		<div class="on-sale-wrap promo-item text-end">
2910			<div class="on-sale-item "></div>
2911		</div>
2912		
2913	</div>
2914
2915    <div class="card-product-info text-center">
2916      <div class="flex items-center gap-1 rate-item">
2917        <i class="icon icon-star text-orange"></i>
2918        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
2919		  
2920	  </div>
2921      <h3 href="/hm-44-1" class="title link">Hm 44</h3>
2922		
2923		<span>
2924			
2925		</span>
2926		
2927		<div class="d-flex mt-2 gap-5 justify-content-center">
2928		  
2929
2930		  
2931
2932		  
2933		  <span class="price">
2934			  355.00
2935			  <span class="icon-saudi_riyal"></span>
2936		  </span>
2937		  
2938	  </div>
2939      <div class="tf-product-btns">
2940        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 44&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-44-1&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/91ea26c8-b64e-4269-8295-89dc7030b291.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;d4982502-fa08-a5b7-f5eb-3a2096e74132&quot;})">
2941          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
2942        </a>
2943      </div>
2944    </div>
2945  </div>
2946                      </div>
2947                    
2948                      <div class="swiper-slide">
2949                          
2950<div class="card-product style-decor"
2951	data-lak-sort-price="355.00"
2952	data-lak-sort-name="Hm 25"
2953	data-lak-sort-time="">
2954  <div class="card-product-wrapper">
2955    <a href="/hm-25" class="product-img">
2956      
2957        <img class="lazyload img-product"
2958            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/a6c3087a-bd7d-4219-83f8-80b1b34db478.webp"
2959            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/a6c3087a-bd7d-4219-83f8-80b1b34db478.webp"
2960            alt="image-product" />
2961        <img class="lazyload img-hover"
2962            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/a6c3087a-bd7d-4219-83f8-80b1b34db478.webp"
2963            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/a6c3087a-bd7d-4219-83f8-80b1b34db478.webp"
2964            alt="image-product" />
2965      
2966    </a> 
2967
2968      <div class="list-product-btn">
2969        
2970        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('876a88d7-00a8-da65-bf8e-3a2096dd5e54')">
2971          <span class="icon icon-heart"></span>
2972          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
2973          <span class="icon icon-delete"></span>
2974        </a>
2975        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 25&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-25&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/a6c3087a-bd7d-4219-83f8-80b1b34db478.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;876a88d7-00a8-da65-bf8e-3a2096dd5e54&quot;})"
2976            class="box-icon bg_white quickview tf-btn-loading">
2977          <span class="icon icon-view"></span>
2978          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
2979        </a>
2980      </div>
2981      
2982
2983
2984
2985
2986
2987
2988
2989
2990
2991
2992
2993		
2994		<div class="on-sale-wrap promo-item text-end">
2995			<div class="on-sale-item "></div>
2996		</div>
2997		
2998	</div>
2999
3000    <div class="card-product-info text-center">
3001      <div class="flex items-center gap-1 rate-item">
3002        <i class="icon icon-star text-orange"></i>
3003        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
3004		  
3005	  </div>
3006      <h3 href="/hm-25" class="title link">Hm 25</h3>
3007		
3008		<span>
3009			
3010		</span>
3011		
3012		<div class="d-flex mt-2 gap-5 justify-content-center">
3013		  
3014
3015		  
3016
3017		  
3018		  <span class="price">
3019			  355.00
3020			  <span class="icon-saudi_riyal"></span>
3021		  </span>
3022		  
3023	  </div>
3024      <div class="tf-product-btns">
3025        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 25&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-25&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/a6c3087a-bd7d-4219-83f8-80b
30251b34db478.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;876a88d7-00a8-da65-bf8e-3a2096dd5e54&quot;})">
3026          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
3027        </a>
3028      </div>
3029    </div>
3030  </div>
3031                      </div>
3032                    
3033                      <div class="swiper-slide">
3034                          
3035<div class="card-product style-decor"
3036	data-lak-sort-price="355.00"
3037	data-lak-sort-name="Hm 22"
3038	data-lak-sort-time="">
3039  <div class="card-product-wrapper">
3040    <a href="/hm-22" class="product-img">
3041      
3042        <img class="lazyload img-product"
3043            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8f7097e1-e3d9-4575-b23e-8d9a8c41d0e6.webp"
3044            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8f7097e1-e3d9-4575-b23e-8d9a8c41d0e6.webp"
3045            alt="image-product" />
3046        <img class="lazyload img-hover"
3047            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8f7097e1-e3d9-4575-b23e-8d9a8c41d0e6.webp"
3048            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8f7097e1-e3d9-4575-b23e-8d9a8c41d0e6.webp"
3049            alt="image-product" />
3050      
3051    </a> 
3052
3053      <div class="list-product-btn">
3054        
3055        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('deafbc26-bd7d-57ee-701c-3a2096dd54c6')">
3056          <span class="icon icon-heart"></span>
3057          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
3058          <span class="icon icon-delete"></span>
3059        </a>
3060        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 22&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-22&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8f7097e1-e3d9-4575-b23e-8d9a8c41d0e6.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;deafbc26-bd7d-57ee-701c-3a2096dd54c6&quot;})"
3061            class="box-icon bg_white quickview tf-btn-loading">
3062          <span class="icon icon-view"></span>
3063          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
3064        </a>
3065      </div>
3066      
3067
3068
3069
3070
3071
3072
3073
3074
3075
3076
3077
3078		
3079		<div class="on-sale-wrap promo-item text-end">
3080			<div class="on-sale-item "></div>
3081		</div>
3082		
3083	</div>
3084
3085    <div class="card-product-info text-center">
3086      <div class="flex items-center gap-1 rate-item">
3087        <i class="icon icon-star text-orange"></i>
3088        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
3089		  
3090	  </div>
3091      <h3 href="/hm-22" class="title link">Hm 22</h3>
3092		
3093		<span>
3094			
3095		</span>
3096		
3097		<div class="d-flex mt-2 gap-5 justify-content-center">
3098		  
3099
3100		  
3101
3102		  
3103		  <span class="price">
3104			  355.00
3105			  <span class="icon-saudi_riyal"></span>
3106		  </span>
3107		  
3108	  </div>
3109      <div class="tf-product-btns">
3110        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 22&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-22&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8f7097e1-e3d9-4575-b23e-8d9a8c41d0e6.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;deafbc26-bd7d-57ee-701c-3a2096dd54c6&quot;})">
3111          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
3112        </a>
3113      </div>
3114    </div>
3115  </div>
3116                      </div>
3117                    
3118                      <div class="swiper-slide">
3119                          
3120<div class="card-product style-decor"
3121	data-lak-sort-price="355.00"
3122	data-lak-sort-name="Hm 88"
3123	data-lak-sort-time="">
3124  <div class="card-product-wrapper">
3125    <a href="/hm-88" class="product-img">
3126      
3127        <img class="lazyload img-product"
3128            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1e258ee6-26e1-413a-b5cf-17e41203d46e.webp"
3129            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1e258ee6-26e1-413a-b5cf-17e41203d46e.webp"
3130            alt="image-product" />
3131        <img class="lazyload img-hover"
3132            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1e258ee6-26e1-413a-b5cf-17e41203d46e.webp"
3133            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1e258ee6-26e1-413a-b5cf-17e41203d46e.webp"
3134            alt="image-product" />
3135      
3136    </a> 
3137
3138      <div class="list-product-btn">
3139        
3140        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('14fe8561-c1c1-0f92-ac1a-3a2096dd47b1')">
3141          <span class="icon icon-heart"></span>
3142          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
3143          <span class="icon icon-delete"></span>
3144        </a>
3145        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 88&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-88&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1e258ee6-26e1-413a-b5cf-17e41203d46e.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;14fe8561-c1c1-0f92-ac1a-3a2096dd47b1&quot;})"
3146            class="box-icon bg_white quickview tf-btn-loading">
3147          <span class="icon icon-view"></span>
3148          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
3149        </a>
3150      </div>
3151      
3152
3153
3154
3155
3156
3157
3158
3159
3160
3161
3162
3163		
3164		<div class="on-sale-wrap promo-item text-end">
3165			<div class="on-sale-item "></div>
3166		</div>
3167		
3168	</div>
3169
3170    <div class="card-product-info text-center">
3171      <div class="flex items-center gap-1 rate-item">
3172        <i class="icon icon-star text-orange"></i>
3173        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
3174		  
3175	  </div>
3176      <h3 href="/hm-88" class="title link">Hm 88</h3>
3177		
3178		<span>
3179			
3180		</span>
3181		
3182		<div class="d-flex mt-2 gap-5 justify-content-center">
3183		  
3184
3185		  
3186
3187		  
3188		  <span class="price">
3189			  355.00
3190			  <span class="icon-saudi_riyal"></span>
3191		  </span>
3192		  
3193	  </div>
3194      <div class="tf-product-btns">
3195        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 88&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-88&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/1e258ee6-26e1-413a-b5cf-17e41203d46e.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;14fe8561-c1c1-0f92-ac1a-3a2096dd47b1&quot;})">
3196          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
3197        </a>
3198      </div>
3199    </div>
3200  </div>
3201                      </div>
3202                    
3203                      <div class="swiper-slide">
3204                          
3205<div class="card-product style-decor"
3206	data-lak-sort-price="355.00"
3207	data-lak-sort-name="Hm 87"
3208	data-lak-sort-time="">
3209  <div class="card-product-wrapper">
3210    <a href="/hm-87" class="product-img">
3211      
3212        <img class="lazyload img-product"
3213            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8dc99ae9-a06a-4f3e-969a-4486dc0030a5.webp"
3214            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8dc99ae9-a06a-4f3e-969a-4486dc0030a5.webp"
3215            alt="image-product" />
3216        <img class="lazyload img-hover"
3217            data-src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8dc99ae9-a06a-4f3e-969a-4486dc0030a5.webp"
3218            src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8dc99ae9-a06a-4f3e-969a-4486dc0030a5.webp"
3219            alt="image-product" />
3220      
3221    </a> 
3222
3223      <div class="list-product-btn">
3224        
3225        <a href="javascript:void(0);" class="box-icon bg_white wishlist btn-icon-action " @click="manageFavorite('afa6f8a8-bb76-3b89-6aa3-3a2096d98bea')">
3226          <span class="icon icon-heart"></span>
3227          <span class="tooltip"> &#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;    </span>
3228          <span class="icon icon-delete"></span>
3229        </a>
3230        <a href="#quick_view" data-bs-toggle="modal" @click="getProductDetails({&quot;Name&quot;:&quot;Hm 87&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-87&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8dc99ae9-a06a-4f3e-969a-4486dc0030a5.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;afa6f8a8-bb76-3b89-6aa3-3a2096d98bea&quot;})"
3231            class="box-icon bg_white quickview tf-btn-loading">
3232          <span class="icon icon-view"></span>
3233          <span class="tooltip">&#x639;&#x631;&#x636; &#x633;&#x631;&#x64A;&#x639;</span>
3234        </a>
3235      </div>
3236      
3237
3238
3239
3240
3241
3242
3243
3244
3245
3246
3247
3248		
3249		<div class="on-sale-wrap promo-item text-end">
3250			<div class="on-sale-item "></div>
3251		</div>
3252		
3253	</div>
3254
3255    <div class="card-product-info text-center">
3256      <div class="flex items-center gap-1 rate-item">
3257        <i class="icon icon-star text-orange"></i>
3258        <span class="opacity-60 d-inline-block text-sm leading-1 -mb-0.5">5</span>
3259		  
3260	  </div>
3261      <h3 href="/hm-87" class="title link">Hm 87</h3>
3262		
3263		<span>
3264			
3265		</span>
3266		
3267		<div class="d-flex mt-2 gap-5 justify-content-center">
3268		  
3269
3270		  
3271
3272		  
3273		  <span class="price">
3274			  355.00
3275			  <span class="icon-saudi_riyal"></span>
3276		  </span>
3277		  
3278	  </div>
3279      <div class="tf-product-btns">
3280        <a href="#quick_add" data-bs-toggle="modal" class="tf-btn style-3  btn-fill animate-hover-btn" @click="setProductDetails({&quot;Name&quot;:&quot;Hm 87&quot;,&quot;SubTitle&quot;:&quot;&quot;,&quot;PromoTitle&quot;:&quot;&quot;,&quot;SeoUrl&quot;:&quot;hm-87&quot;,&quot;Price&quot;:355.00,&quot;FullDefualtFilePath&quot;:&quot;lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/8dc99ae9-a06a-4f3e-969a-4486dc0030a5.webp&quot;,&quot;FullFilePaths&quot;:[],&quot;SKU&quot;:&quot;&quot;,&quot;DiscountPrice&quot;:355.00,&quot;DiscountPercentage&quot;:0,&quot;RateValue&quot;:5,&quot;RateCount&quot;:0,&quot;IsFav&quot;:false,&quot;Id&quot;:&quot;afa6f8a8-bb76-3b89-6aa3-3a2096d98bea&quot;})">
3281          &#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629;
3282        </a>
3283      </div>
3284    </div>
3285  </div>
3286                      </div>
3287                              
3288                  </div>
3289              </div>
3290              <div class="nav-sw  nav-next-slider nav-next-sell-1 box-icon w_46 round"><span class="icon icon-arrow-left"></span></div>
3291              <div class="nav-sw  nav-prev-slider nav-prev-sell-1 box-icon w_46 round"><span class="icon icon-arrow-right"></span></div>
3292              <div class="sw-dots style-2 sw-pagination-sell-1 justify-content-center"></div>  
3293          </div>
3294      </div>
3295  </section>
3296  <!-- /related products -->
3297
3298
3299
3300<!-- /Sale Product -->
3301
3302<div class="modal fade quick-view-modal" id="panorama_view" tabindex="-1" aria-labelledby="panorama_viewLabel" aria-hidden="true">
3303	<div class="modal-dialog modal-lg modal-dialog-centered">
3304		<div class="modal-content">
3305			<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
3306			<div id="panorama-2" style="width:100%; height:500px;"></div>
3307		</div>
3308	</div>
3309</div>
vendor: 114 bytes, lines 3309-3312
3309
3310
3311
3312<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>
3312<script src="/Views/Themes/decor/V1/ProductDetails/Index.js"></script>
3312
3313
3314<textarea id="product-details-json" hidden readonly>{
3315	"Id": "bb22b21a-cb74-b4f7-e839-3a2096bbcae4",
3316	"OfferId": null,
3317	"OfferType": null,
3318	"OfferName": null,
3319	"OfferDiscountAmount": null,
3320	"OfferPurchaseQuantity": null,
3321	"OfferFreeQuantity": null,
3322	"OfferFreeProductId": null,
3323	"OfferFreeProductName": null,
3324	
3325	"SalePrice": null,
3326	"OfferTerms": [],
3327	"OfferBadgeBuyGetTemplate": "\u0627\u0634\u062A\u0631\u064A __QTY__ \u002B __FREE__ \u0645\u0646\u062A\u062C \u0647\u062F\u064A\u0629",
3328	"OfferBadgeValueTemplate": "\u062E\u0635\u0645 __AMT__",
3329	"OfferBadgePercentTemplate": "\u062E\u0635\u0645 __AMT__ %",
3330	
3331	"Name": "Hm 06",
3332	"ApplyQtyOptions": true,
3333	"DiscountPrice": 395.00,
3334	"DiscountPercentage": 0,
3335	"Price": 395.00,
3336	"FullDefualtFilePath": "https://theme.lak.sa/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/productPictures/c7d61a00-2405-4bf3-b10c-c63afdbbd161.webp",
3337	"ProductType": 1
3338}</textarea>
3339<script>
3340window.productDetails = JSON.parse(document.getElementById('product-details-json').textContent);
3341(function () {
3342	var raw = window.productDetails.OfferTerms || window.productDetails.offerTerms;
3343	if (Array.isArray(raw)) {
3344		window.productDetails.OfferTerms = raw;
3345		return;
3346	}
3347	if (typeof raw === "string") {
3348		try {
3349			var parsed = JSON.parse(raw);
3350			if (Array.isArray(parsed)) {
3351				window.productDetails.OfferTerms = parsed;
3352				return;
3353			}
3354		} catch (e) { }
3355	}
3356	if (raw && Array.isArray(raw.$values)) {
3357		window.productDetails.OfferTerms = raw.$values;
3358		return;
3359	}
3360	window.productDetails.OfferTerms = [];
3361})();
3362</script>
3362
3363
3364
3365
3366
3367<script>
3368	document.addEventListener('DOMContentLoaded', function () {
3369
3370	setTimeout(function () {
3371
3372	let viewerInstance = null;
3373
3374	// Listen for clicks on elements that open the modal
3375	document.querySelectorAll('.open-panorama-modal').forEach(button => {
3376	button.addEventListener('click', function () {
3377	const panoramaUrl = this.getAttribute('data-panorama');
3378
3379	// Delay to ensure modal is rendered before mounting viewer
3380	setTimeout(function () {
3381	// If a viewer already exists, destroy and reinitialize
3382	if (viewerInstance) {
3383	viewerInstance.destroy();
3384	}
3385
3386	viewerInstance = pannellum.viewer('panorama-2', {
3387	"type": "equirectangular",
3388	"panorama": panoramaUrl,
3389	"autoLoad": true,
3390	<!--"minHfov": 30,   // Maximum zoom in (smaller number = more zoomed in)
3391	"maxHfov": 120,  // Maximum zoom out (larger number = more zoomed out)
3392	"hfov": 90       // Initial zoom level (optional)-->
3393	});
3394	}, 500); // Adjust delay if needed
3395	});
3396	});
3397	}, 1000);
3398
3399	});
3400</script>
3400
3401
3402
3403		
3404		<!-- form -->
3405<section class="subscribe-form pt_0 px-2">
3406	<div class="container">
3407		<div class="widget-card-store type-4 overflow-hidden align-items-center tf-grid-layout md-col-2 bg_black">
3408			<div class="store-item-info">
3409				<h3 class="sec-title mb-4">
3410					&#x627;&#x634;&#x62A;&#x631;&#x643; &#x628;&#x627;&#x644;&#x646;&#x634;&#x631;&#x629; &#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F;&#x64A;&#x629;
3411
3412				</h3>
3413				<div class="description">
3414					&#x627;&#x634;&#x62A;&#x631;&#x643; &#x644;&#x62A;&#x643;&#x648;&#x646; &#x623;&#x648;&#x644; &#x645;&#x646; &#x64A;&#x639;&#x644;&#x645; &#x628;&#x627;&#x644;&#x639;&#x631;&#x648;&#x636;&#x60C; &#x648;&#x627;&#x644;&#x645;&#x646;&#x62A;&#x62C;&#x627;&#x62A; &#x627;&#x644;&#x62C;&#x62F;&#x64A;&#x62F;&#x629;&#x60C; &#x648;&#x627;&#x644;&#x645;&#x62D;&#x62A;&#x648;&#x649; &#x627;&#x644;&#x62D;&#x635;&#x631;&#x64A;&#x60C; &#x648;&#x627;&#x644;&#x641;&#x639;&#x627;&#x644;&#x64A;&#x627;&#x62A;!
3415
3416				</div>
3417				<form class="" id="newsletterForm"  @submit.prevent="submitNewsLetter">
3418					<label for="exampleInputEmail1" class="mb-2">&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x625;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A;</label>
3419					<div class="form-group d-flex justify-content-between align-items-center">
3420						<input
3421							type="email"
3422							name="email"
3423							id="email"
3424							placeholder="&#x623;&#x62F;&#x62E;&#x644; &#x628;&#x631;&#x64A;&#x62F;&#x643; &#x627;&#x644;&#x625;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A;..."
3425							required="true"
3426							v-model="newsLetter.email"
3427							@input="validateEmail"
3428							title="&#x64A;&#x631;&#x62C;&#x649; &#x625;&#x62F;&#x62E;&#x627;&#x644; &#x628;&#x631;&#x64A;&#x62F; &#x625;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A; &#x635;&#x62D;&#x64A;&#x62D; (&#x645;&#x62B;&#x627;&#x644;: [email protected])"
3429							ref="emailInput"/>
3430
3431						<div class="">
3432							<button type="submit" class="tf-btn style-3  btn-fill animate-hover-btn">
3433								&#x627;&#x634;&#x62A;&#x631;&#x643;
3434							</button>
3435						</div>
3436					</div>
3437				</form>
3438
3439			</div>
3440			<div class="store-img">
3441				<img class="lazyload" src="/Views/Themes/decor/V1/Assets/images/newsletter-1.jpg" alt="newsletter-Banner"/>
3442			</div>
3443		</div>
3444	</div>
3445</section>
3446<!-- /form -->
3447<!-- Footer -->
3448<footer id="footer" class="footer">
3449	<div class="footer-wrap wow fadeIn" data-wow-delay="0s">
3450		<div class="footer-body">
3451			<div class="container">
3452				<div class="row justify-content-between">
3453					<!-- اللوجو -->
3454					<div class="col-xl-2 col-md-6 col-12">
3455						<div class="footer-infor">
3456							<div class="footer-logo">
3457								<a href="/">
3458									<!-- <img width="150" src="/Views/Themes/decor/V1/Assets/images/logo/logo-white.svg" alt="" /> -->
3459
3460									<img width="150" src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/storeScreenshots/0901e432-6c0a-4a2e-9c19-9126f6c8dc26.png" alt="" />
3461								</a>
3462							</div>
3463							<!-- روابط التواصل الاجتماعي -->
3464
3465							<ul class="tf-social-icon d-flex gap-10 style-white list-none">
3466
3467								<li>
3468									<a href="" target="_blank"  class="box-icon w_34 round social-youtube social-line">
3469										<i
3470																		class="icon fs-14 icon-youtube"></i>
3471									</a>
3472								</li>
3473
3474								
3475								
3476
3477								
3478								
3479								
3480
3481							</ul>
3482						</div>
3483					</div>
3484					<!-- معلومات الاتصال -->
3485					<div class="col-xl-2 col-md-6 col-12">
3486						<div class="footer-infor">
3487
3488							<ul class="list-none">
3489								
3490								
3491								<li>
3492									<p>
3493										<span class="fw-6">&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x625;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A; </span>: <a href="/cdn-cgi/l/email-protection#4f2e2d2e362e276127220f28222e2623612c2022"><span class="__cf_email__" data-cfemail="761714170f171e581e1b36111b171f1a5815191b">[email&#160;protected]</span></a>
3494									</p>
3495								</li>
3496								
3497								
3498								<li>
3499									<p>
3500										<span class="fw-6">&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;</span>: <a class="fw-5" href="tel:&#x2B;966597307117">&#x2B;966597307117</a>
3501									</p>
3502								</li>
3503								
3504							</ul>
3505							
3506						</div>
3507					</div>
3508
3509					<!-- المساعدة -->
3510					
3511					<div class="col-xl-2 col-md-6 col-12 footer-col-block">
3512						<div class="footer-heading">
3513							<h6>&#x627;&#x646;&#x62A;&#x642;&#x627;&#x644; &#x633;&#x631;&#x64A;&#x639;</h6>
3514						</div>
3515
3516
3517
3518						<ul class="footer-menu-list tf-collapse-content">
3519
3520							
3521
3522
3523							<li>
3524								<a href="/page/sys-lstkhdm-wlkhswsy" class="footer-menu_item">&#x633;&#x64A;&#x627;&#x633;&#x629; &#x627;&#x644;&#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x648;&#x627;&#x644;&#x62E;&#x635;&#x648;&#x635;&#x64A;&#x629;</a>
3525							</li>
3526
3527							
3528
3529						</ul>
3530					</div>
3531					
3532
3533					
3534
3535
3536					<div class="col-xl-2 col-md-6 col-12">
3537
3538						<!--الدفع روابط   -->
3539
3540						
3541						
3542						
3543						
3544						
3545						<div class="footer-heading">
3546							<h6>&#x64A;&#x645;&#x643;&#x646;&#x643; &#x627;&#x644;&#x62F;&#x641;&#x639; &#x639;&#x646; &#x637;&#x631;&#x64A;&#x642;     </h6>
3547						</div>
3548
3549						
3550						
3551						
3552						
3553						
3554						
3555						
3556						
3557						
3558						
3559						
3560						
3561						
3562						
3563						
3564						
3565						
3566						
3567						
3568						
3569						
3570
3571						
3572						
3573
3574						
3575						
3576						
3577						
3578
3579						
3580						<div class="tf-payment">
3581							
3582							<img src="/Views/Themes/decor/V1/Assets/images/payments/mada.png" alt="Mada"/>
3583							<img src="/Views/Themes/decor/V1/Assets/images/payments/visa.png" alt="Visa"/>
3584							<img src="/Views/Themes/decor/V1/Assets/images/payments/masterCard.png" alt="MasterCard"/>
3585							<img src="/Views/Themes/decor/V1/Assets/images/payments/applePay.png" alt="Apple Pay"/>
3586							
3587							
3588							
3589							
3590							
3591							
3592							
3593						</div>
3594						
3595						
3596						
3597
3598						
3599						<div class="d-flex gap-10px mt-20px">
3600							
3601
3602							
3603
3604							
3605						</div>
3606					</div>
3607				</div>
3608			</div>
3609		</div>
3610
3611		<!-- التذييل السفلي -->
3612		<div class="footer-bottom">
3613			<div class="container">
3614				<div class="row">
3615					<div class="col-12">
3616						<div
3617						  class="footer-bottom-wrap d-flex gap-20 flex-wrap justify-content-center align-items-center">
3618							<div class="footer-menu_item">&#x62A;&#x645; &#x627;&#x644;&#x62A;&#x637;&#x648;&#x64A;&#x631; &#x628;&#x648;&#x627;&#x633;&#x637;&#x629; &#x644;&#x643; | LAK</div>
3619
3620
3621						</div>
3622					</div>
3623				</div>
3624			</div>
3625		</div>
3626	</div>
3627</footer>
3628<!-- /Footer -->
3629		
3630	</div>
3631
3632
3633	<!-- gotop -->
3634	<div class="progress-wrap">
3635		<svg class="progress-circle svg-content" width="100%" height="100%" viewB
3635ox="-1 -1 102 102">
3636			<path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"
3637				style="transition: stroke-dashoffset 10ms linear 0s; stroke-dasharray: 307.919, 307.919; stroke-dashoffset: 286.138;">
3638			</path>
3639		</svg>
3640	</div>
3641	<!-- /gotop -->
3642
3643	<!-- toolbar-bottom -->
3644	<!-- toolbar-bottom -->
3645<div class="tf-toolbar-bottom type-1150">
3646    <div class="toolbar-item">
3647        <a href="#toolbarShopmb" data-bs-toggle="offcanvas" aria-controls="offcanvasLeft">
3648            <div class="toolbar-icon">
3649                <i class="icon-shop"></i>
3650            </div>
3651            <div class="toolbar-label">&#x62A;&#x633;&#x648;&#x651;&#x642;</div>
3652        </a>
3653    </div>
3654
3655    <div class="toolbar-item">
3656        <a href="#canvasSearch" data-bs-toggle="offcanvas" aria-controls="offcanvasLeft">
3657            <div class="toolbar-icon">
3658                <i class="icon-search"></i>
3659            </div>
3660            <div class="toolbar-label">&#x628;&#x62D;&#x62B;</div>
3661        </a>
3662    </div>
3663
3664	<div class="toolbar-item">
3665		
3666		
3667		<a href="#login" data-bs-toggle="modal">
3668			<div class="toolbar-icon">
3669				<i class="icon-account"></i>
3670			</div>
3671			<div class="toolbar-label">&#x627;&#x644;&#x62D;&#x633;&#x627;&#x628;</div>
3672		</a>
3673		
3674	</div>
3675	
3676	
3677	<div class="toolbar-item">
3678        <a href="#shoppingCart" data-bs-toggle="modal">
3679            <div class="toolbar-icon">
3680                <i class="icon-bag"></i>
3681                
3682                
3683                
3684                
3685                <div class="toolbar-count" v-text="cartCount"></div>
3686                
3687            </div>
3688            <div class="toolbar-label">&#x633;&#x644;&#x629; &#x627;&#x644;&#x645;&#x634;&#x62A;&#x631;&#x64A;&#x627;&#x62A;</div>
3689        </a>
3690    </div>
3691</div>
3692<!-- /toolbar-bottom -->
3693	<!-- /toolbar-bottom -->
3694
3695
3696
3697	<!-- mobile menu -->
3698	<div class="offcanvas offcanvas-start canvas-mb" id="mobileMenu">
3699	<span class="icon-close icon-close-popup" data-bs-dismiss="offcanvas" aria-label="Close"></span>
3700	<div class="mb-canvas-content">
3701		<div class="mb-body">
3702			<ul class="nav-ul-mb mb-3" id="wrapper-menu-navigation">
3703				<!-- Home -->
3704				<li class="nav-mb-item">
3705					<a href="/" class="mb-menu-link current">
3706						<span>&#x627;&#x644;&#x635;&#x641;&#x62D;&#x629; &#x627;&#x644;&#x631;&#x626;&#x64A;&#x633;&#x64A;&#x629;</span>
3707					</a>
3708				</li>
3709
3710				<!-- All products -->
3711				<li class="nav-mb-item">
3712					<a href="/products" class="mb-menu-link current">
3713						<span>&#x643;&#x644; &#x627;&#x644;&#x645;&#x646;&#x62A;&#x62C;&#x627;&#x62A;</span>
3714					</a>
3715				</li>
3716
3717				<!-- Dynamic Categories -->
3718				
3719				<li class="nav-mb-item">
3720					<div class="mainn-li">
3721						<a href="/&#x639;&#x628;&#x627;&#x64A;&#x627;&#x62A;-&#x627;&#x644;&#x645;&#x648;&#x633;&#x645;">&#x639;&#x628;&#x627;&#x64A;&#x627;&#x62A; &#x627;&#x644;&#x645;&#x648;&#x633;&#x645;</a>
3722						<a
3723				href="#dropdown-4c77536f-5941-dc38-7606-3a221e01df89"
3724				class="collapsed mb-menu-link"
3725				data-bs-toggle="collapse"
3726				aria-expanded="false"
3727				aria-controls="dropdown-4c77536f-5941-dc38-7606-3a221e01df89"
3728					>
3729
3730							
3731						</a>
3732					</div>
3733
3734
3735
3736					
3737				</li>
3738				
3739				<li class="nav-mb-item">
3740					<div class="mainn-li">
3741						<a href="/&#x641;&#x62E;&#x627;&#x645;&#x629;-&#x627;&#x644;&#x639;&#x628;&#x627;&#x64A;&#x629;">&#x641;&#x62E;&#x627;&#x645;&#x629; &#x627;&#x644;&#x639;&#x628;&#x627;&#x64A;&#x629;</a>
3742						<a
3743				href="#dropdown-1a4d4c98-b50b-c137-3146-3a2096b85a4c"
3744				class="collapsed mb-menu-link"
3745				data-bs-toggle="collapse"
3746				aria-expanded="false"
3747				aria-controls="dropdown-1a4d4c98-b50b-c137-3146-3a2096b85a4c"
3748					>
3749
3750							
3751						</a>
3752					</div>
3753
3754
3755
3756					
3757				</li>
3758				
3759			</ul>
3760			<div class="mb-other-content">
3761				<div class="d-flex group-icon">
3762					
3763				</div>
3764				<div class="mb-notice">
3765					<a href="https://wa.me/" class="text-need">&#x647;&#x644; &#x62A;&#x62D;&#x62A;&#x627;&#x62C; &#x625;&#x644;&#x649; &#x645;&#x633;&#x627;&#x639;&#x62F;&#x629;&#x61F;</a>
3766				</div>
3767				<ul class="mb-info">
3768					
3769					<li>
3770						&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x625;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A; : <b><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="107172716971783e787d50777d71797c3e737f7d">[email&#160;protected]</a></b>
3771					</li>
3772					<li>
3773						&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;: <b>&#x2B;966597307117</b>
3774					</li>
3775				</ul>
3776			</div>
3777
3778		</div>
3779		<div class="mb-bottom">
3780			<a @click="logout" v-if="session.phoneNumber" class="site-nav-icon">
3781				<i class="icon icon-account"></i>&#x62A;&#x633;&#x62C;&#x64A;&#x644; &#x627;&#x644;&#x62E;&#x631;&#x648;&#x62C;
3782			</a>
3783			<div class="bottom-bar-language">
3784			</div>
3785		</div>
3786	</div>
3787</div>
3788
3789	<!-- /mobile menu -->
3790
3791
3792	<!-- canvasSearch -->
3793	<div class="offcanvas offcanvas-end canvas-search" id="canvasSearch">
3794		<div class="canvas-wrapper">
3795			<header class="tf-search-head">
3796				<div class="title fw-5">
3797&#x627;&#x628;&#x62D;&#x62B; &#x641;&#x64A; &#x645;&#x648;&#x642;&#x639;&#x646;&#x627;					<div class="close">
3798						<span class="icon-close icon-close-popup" data-bs-dismiss="offcanvas" aria-label="إغلاق"></span>
3799					</div>
3800				</div>
3801				<div class="tf-search-sticky">
3802					<form class="tf-mini-search-frm" onsubmit="handleSearch(); return false;">
3803						<fieldset class="text">
3804							<input type="text" id="search-input" placeholder="&#x627;&#x628;&#x62D;&#x62B; &#x647;&#x646;&#x627;..." name="search" tabindex="0" value=""
3805								aria-required="true" />
3806						</fieldset>
3807						<button type="button" onclick="handleSearch()"><i class="icon-search"></i></button>
3808					</form>
3809				</div>
3810			</header>
3811
3812			<div class="canvas-body p-0">
3813				<div class="tf-search-content">
3814					<div class="tf-cart-hide-has-results">
3815
3816						<!-- روابط سريعة -->
3817						<div class="tf-col-quicklink">
3818
3819
3820							  
3821							<div class="tf-search-content-title fw-5">&#x627;&#x646;&#x62A;&#x642;&#x627;&#x644; &#x633;&#x631;&#x64A;&#x639; </div>
3822
3823        <ul class="tf-quicklink-list">
3824
3825              
3826
3827			  <li class="tf-quicklink-item">
3828									<a  href="/page/sys-lstkhdm-wlkhswsy">&#x633;&#x64A;&#x627;&#x633;&#x629; &#x627;&#x644;&#x627;&#x633;&#x62A;&#x62E;&#x62F;&#x627;&#x645; &#x648;&#x627;&#x644;&#x62E;&#x635;&#x648;&#x635;&#x64A;&#x629;</a>
3829								</li>
3830
3831
3832           
3833              
3834
3835            </ul>
3836
3837            
3838
3839
3840
3841
3842							 
3843						</div>
3844
3845					 
3846					</div>
3847				</div>
3848			</div>
3849
3850		</div>
3851	</div>
vendor: 111 bytes, lines 3851-3854
3851
3852
3853
3854<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>
3854<script src="/Views/Themes/decor/V1/Components/CanvasSearch/CanvasSearch.js"></script>
3854
3855
3856	<!-- /canvasSearch -->
3857
3858
3859
3860	<!-- toolbarShopmb -->
3861	<div class="offcanvas offcanvas-start canvas-mb toolbar-shop-mobile" id="toolbarShopmb">
3862		<span class="icon-close icon-close-popup" data-bs-dismiss="offcanvas" aria-label="Close"></span>
3863		<div class="mb-canvas-content">
3864      <div class="mb-body">
3865        <ul class="nav-ul-mb" id="wrapper-menu-navigation">
3866          
3867          <li class="nav-mb-item">
3868            
3869            <a href="/&#x639;&#x628;&#x627;&#x64A;&#x627;&#x62A;-&#x627;&#x644;&#x645;&#x648;&#x633;&#x645;" class="tf-category-link mb-menu-link">
3870              <div class="image">
3871                <img src="/images/nophoto/category-nophoto.png" alt="" />
3872              </div>
3873              <span>&#x639;&#x628;&#x627;&#x64A;&#x627;&#x62A; &#x627;&#x644;&#x645;&#x648;&#x633;&#x645;</span>
3874            </a>
3875            
3876          </li>
3877          
3878          <li class="nav-mb-item">
3879            
3880            <a href="/&#x641;&#x62E;&#x627;&#x645;&#x629;-&#x627;&#x644;&#x639;&#x628;&#x627;&#x64A;&#x629;" class="tf-category-link mb-menu-link">
3881              <div class="image">
3882                <img src="/lak/tenants/12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde/categories/08d74377-4175-4406-a4ad-cf889364349c.webp" alt="" />
3883              </div>
3884              <span>&#x641;&#x62E;&#x627;&#x645;&#x629; &#x627;&#x644;&#x639;&#x628;&#x627;&#x64A;&#x629;</span>
3885            </a>
3886            
3887          </li>
3888          
3889        </ul>
3890      </div>
3891
3892
3893
3894      <div class="mb-bottom">
3895				<a href="/products" class="tf-btn fw-5 btn-line">
3896					&#x62A;&#x635;&#x641;&#x62D; &#x643;&#x644; &#x627;&#x644;&#x641;&#x626;&#x627;&#x62A; <i
3897						class="icon icon-arrow1-top-left"></i></a>
3898			</div>
3899		</div>
3900	</div>
3901
3902	<!-- /toolbarShopmb -->
3903
3904	<!-- modal login -->
3905	<div class="modal modalCentered fade form-sign-in modal-part-content" id="login">
3906		<div class="modal-dialog modal-dialog-centered">
3907			<div class="modal-content">
3908				<div class="image-login">
3909					<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 24 24" fill="none" class="injected-svg" data-src="https://cdn.hugeicons.com/icons/user-sharing-bulk-rounded.svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" color="#000000">
3910						<path fill-rule="evenodd" clip-rule="evenodd" d="M3.25 10.9286C3.25 6.1356 7.16751 2.25012 12 2.25012C16.8325 2.25012 20.75 6.1356 20.75 10.9286C20.75 12.5077 20.3239 13.9911 19.5788 15.2685C19.3099 15.7295 18.7152 15.887 18.2504 15.6204C17.7857 15.3537 17.6268 14.7638 17.8957 14.3029C18.4742 13.311 18.8056 12.1596 18.8056 10.9286C18.8056 7.20071 15.7586 4.17867 12 4.17867C8.2414 4.17867 5.19444 7.20071 5.19444 10.9286C5.19444 12.1596 5.52583 13.311 6.10431 14.3029C6.37317 14.7638 6.21435 15.3537 5.74957 15.6204C5.28479 15.887 4.69005 15.7295 4.42119 15.2685C3.67612 13.9911 3.25 12.5077 3.25 10.9286Z" fill="#000000"></path>
3911						<path opacity="0.4" d="M10.4034 14.4399C7.44608 15.1571 5.25 17.8221 5.25 21C5.25 21.4142 5.58579 21.75 6 21.75H18C18.4142 21.75 18.75 21.4142 18.75 21C18.75 17.8221 16.5539 15.1571 13.5966 14.4399C15.1526 13.8088 16.25 12.2825 16.25 10.5C16.25 8.15279 14.3472 6.25 12 6.25C9.65279 6.25 7.75 8.15279 7.75 10.5C7.75 12.2825 8.84739 13.8088 10.4034 14.4399Z" fill="#000000"></path>
3912					</svg>
3913				</div>
3914				<div class="header">
3915					
3916					<div class="demo-title">&#x62A;&#x633;&#x62C;&#x64A;&#x644; &#x627;&#x644;&#x62F;&#x62E;&#x648;&#x644;</div>
3917					<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
3918				</div>
3919				<div class="tf-login-form">
3920					<form id="loginForm"  @submit.prevent="login">
3921
3922						<div class="login-tabs-main">
3923							<div class="login-tabs d-flex gap-2 mb-2">
3924								
3925								<a type="button" class="login-tab-btn" :class="{'active': loginType === 'phone'}" @click="loginType = 'phone'; emailLogin = ''">
3926									&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;
3927								</a>
3928								
3929								
3930								<a type="button" class="login-tab-btn" :class="{'active': loginType === 'email'}" @click="loginType = 'email'; phoneNumber = ''">
3931									&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x627;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A;
3932								</a>
3933								
3934							</div>
3935						</div>
3936
3937
3938						<div class="tf-field style-1" v-if="loginType === 'phone'">
3939							<div class="number-input">
3940								<label class="tf-field-label">&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644; * </label>
3941								<div class="position-relative">
3942									<input
3943										id="phoneNumber"
3944										name="phoneNumber"
3945										v-model="phoneNumber"
3946										class="tf-field-input tf-input"
3947										placeholder="&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;"
3948										type="tel"
3949										maxlength="9"
3950										pattern="^5[0-9]{8}$"
3951										@input="handlePhoneInput"
3952										@invalid="setPhoneValidation"
3953										@keyup="handlePhoneInput"
3954									/>
3955									<div class="number-tag">+966</div>
3956								</div>
3957							</div>
3958						</div>
3959
3960						<div class="tf-field style-1" v-else="">
3961							<label class="tf-field-label">&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x627;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A; *</label>
3962							<input
3963								id="emailAddress"
3964								name="emailAddress"
3965								v-model="emailLogin"
3966								class="tf-field-input tf-input"
3967								placeholder="&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x627;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A;"
3968								type="email"
3969								required=""
3970							/>
3971						</div>
3972
3973						<div class="bottom">
3974							<div class="w-100">
3975								<button type="submit"
3976									class="tf-btn btn-fill animate-hover-btn radius-3 w-100 justify-content-center">
3977									<span>&#x62A;&#x633;&#x62C;&#x64A;&#x644; &#x627;&#x644;&#x62F;&#x62E;&#x648;&#x644;</span>
3978								</button>
3979							</div>
3980						</div>
3981					</form>
3982				</div>
3983			</div>
3984		</div>
3985	</div>
3986
3987	
3987<script type="text/javascript" src="/Views/Themes/decor/V1/Components/Account/Login/Login.js"></script>
3987
3988<style>
3989	.login-tabs {
3990	border-bottom: 1px solid #d7d9de;
3991	padding-bottom: 10px;
3992	}
3993	.login-tab-btn {
3994	flex: 1;
3995	background: transparent;
3996	border: none;
3997	padding: 10px 0;
3998	font-weight: 600;
3999	color: #6c6f78;
4000	position: relative;
4001	}
4002	.login-tab-btn.active {
4003	color: #000;
4004	}
4005	.login-tab-btn.active::after {
4006	content: "";
4007	position: absolute;
4008	left: 10%;
4009	right: 10%;
4010	bottom: -11px;
4011	height: 3px;
4012	background: #000;
4013	border-radius: 999px;
4014	}
4015</style>
4016
4017
4018	<div class="modal modalCentered fade form-sign-in modal-part-content" id="verification">
4019	<div class="modal-dialog modal-dialog-centered">
4020		<div class="modal-content" id="verificationModalBody">
4021			<div class="header">
4022				<div class="demo-title"> &#x62A;&#x623;&#x643;&#x64A;&#x62F; &#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;</div>
4023				<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4024			</div>
4025			<div class="tf-login-form">
4026				<div class="text-center">
4027					<h6  class="text-center">
4028					&#x631;&#x642;&#x645; &#x627;&#x644;&#x62A;&#x62D;&#x642;&#x642; &#x645;&#x637;&#x644;&#x648;&#x628; &#x644;&#x627;&#x643;&#x645;&#x627;&#x644; &#x627;&#x644;&#x639;&#x645;&#x644;&#x64A;&#x629; &#x644;&#x642;&#x62F; &#x62A;&#x645; &#x625;&#x631;&#x633;&#x627;&#x644; &#x631;&#x645;&#x632; &#x627;&#x644;&#x62A;&#x62D;&#x642;&#x642; &#x641;&#x649; &#x631;&#x633;&#x627;&#x644;&#x629; &#x625;&#x644;&#x64A;&#x643;&#x645;
4029					</h6>
4030					<h6 class="email-display"></h6>
4031					<h6 class="code-display"></h6>
4032				</div>
4033				<form id="verificationForm" >
4034					<input name="phoneNumber" type="hidden" value="&#x2B;966597307117" />
4035					<input name="isNewUser" type="hidden" value="" />
4036					<input name="code" type="hidden" value="" />
4037					<input name="loginType" type="hidden" value="phone" />
4038					<input name="userNameOrEmailAddress" type="hidden" value="" />
4039					
4040					<div class="d-flex justify-content-center gap-2 mb-3" dir="ltr">
4041						
4042						<input type="text" class="code-input form-control text-center" maxlength="1" inputmode="numeric" pattern="[0-9]*" />
4043						
4044						<input type="text" class="code-input form-control text-center" maxlength="1" inputmode="numeric" pattern="[0-9]*" />
4045						
4046						<input type="text" class="code-input form-control text-center" maxlength="1" inputmode="numeric" pattern="[0-9]*" />
4047						
4048						<input type="text" class="code-input form-control text-center" maxlength="1" inputmode="numeric" pattern="[0-9]*" />
4049						
4050					</div>
4051					<!-- الحقل المخفي اللي هيجمع الكود -->
4052					<input type="hidden"  id="_code" name="_code" value=""  />
4053
4054					<div class="bottom">
4055						<div class=" mb-2">
4056							<button type="submit" class="tf-btn btn-fill animate-hover-btn radius-3 w-100 justify-content-center">
4057								<span>&#x627;&#x644;&#x62A;&#x62D;&#x642;&#x642;</span>
4058							</button>
4059						</div>
4060						<div class="d-flex justify-content-center align-items-center gap-1" >
4061							<span>			
4062								&#x644;&#x645; &#x64A;&#x62A;&#x645; &#x625;&#x631;&#x633;&#x627;&#x644; &#x627;&#x644;&#x643;&#x648;&#x62F;
4063							</span>
4064							<button type="button" id="resendBtn" class=" radius-3  justify-content-center button-style" disabled="">
4065								<span class="text-primary">
4066									&#x625;&#x639;&#x627;&#x62F;&#x629; &#x625;&#x631;&#x633;&#x627;&#x644; &#x627;&#x644;&#x643;&#x648;&#x62F;
4067								</span>
4068							</button>
4069						</div>
4070						<div class="w-100 text-center">
4071							<p>
4072								&#x64A;&#x645;&#x643;&#x646;&#x643; &#x625;&#x639;&#x627;&#x62F;&#x629; &#x627;&#x644;&#x625;&#x631;&#x633;&#x627;&#x644; &#x628;&#x639;&#x62F; 
4073								<span id="countdown">60</span> 
4074								&#x62B;&#x648;&#x627;&#x646;&#x64A;	
4075							</p>
4076						</div>
4077					</div>
4078				</form>
4079			</div>
4080		</div>
4081	</div>
4082</div>
4083
4084
4085
4086	<!-- /modal register -->
4087	<div class="modal modalCentered fade form-sign-in modal-part-content" id="register">
4088  <div class="modal-dialog modal-dialog-centered">
4089    <div class="modal-content">
4090      <div class="header">
4091        <div class="demo-title">&#x62A;&#x633;&#x62C;&#x64A;&#x644; &#x62D;&#x633;&#x627;&#x628; &#x62C;&#x62F;&#x64A;&#x62F;</div>
4092        <span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4093      </div>
4094      <div class="tf-login-form">
4095        <form id="registerForm" @submit.prevent="register">
4096          <input name="phoneNumber" id="phoneNumber" type="hidden" v-model="phoneNumber" value="&#x2B;966597307117" />
4097
4098          <div class="tf-field style-1">
4099            <input name="firstName" id="firstName" v-model="firstName" class="tf-field-input tf-input" placeholder=" " type="text" required />
4100            <label class="tf-field-label">&#x627;&#x644;&#x627;&#x633;&#x645; &#x627;&#x644;&#x623;&#x648;&#x644;</label>
4101          </div>
4102
4103          <div class="tf-field style-1">
4104            <input name="lastName" id="lastName" v-model="lastName" class="tf-field-input tf-input" placeholder=" " type="text" required />
4105            <label class="tf-field-label">&#x627;&#x633;&#x645; &#x627;&#x644;&#x639;&#x627;&#x626;&#x644;&#x629;</label>
4106          </div>
4107
4108			<div class="tf-field style-1" v-if="loginType === 'phone'">
4109				<input id="emailAddress" name="emailAddress" v-model="emailAddress" class="tf-field-input tf-input" placeholder=" " type="email"  />
4110				<label class="tf-field-label">&#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F; &#x627;&#x644;&#x625;&#x644;&#x643;&#x62A;&#x631;&#x648;&#x646;&#x64A;</label>
4111			</div>
4112
4113			<div class="tf-field style-1" v-else="">
4114				<div class="number-input">
4115					<label class="tf-field-label">&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;</label>
4116					<div class="position-relative">
4117						<input
4118						  id="registerPhoneNumber"
4119						  name="phoneNumber"
4120						  v-model="phoneNumber"
4121						  class="tf-field-input tf-input"
4122						  placeholder="&#x631;&#x642;&#x645; &#x627;&#x644;&#x62C;&#x648;&#x627;&#x644;"
4123						  type="tel"
4124						  maxlength="9"
4125						  pattern="^5[0-9]{8}$"
4126						  @input="handlePhoneInput"
4127						  @invalid="setPhoneValidation"
4128						  @keyup="handlePhoneInput"
4129                />
4130						<div class="number-tag">+966</div>
4131					</div>
4132				</div>
4133			</div>
4134
4135          <div class="bottom">
4136            <div class="w-100">
4137              <button type="submit" class="tf-btn btn-fill animate-hover-btn radius-3 w-100 justify-content-center">
4138                <span>&#x62A;&#x633;&#x62C;&#x64A;&#x644;</span>
4139              </button>
4140            </div>
4141          </div>
4142        </form>
4143      </div>
4144    </div>
4145  </div>
4146</div>
4147
4148
4149
4150	<!-- /modal register -->
4151
4152
4153	<!-- shoppingCart -->
4154	<div class="modal fullRight fade modal-shopping-cart" id="shoppingCart">
4155		<div class="modal-dialog">
4156			<div class="modal-content">
4157				<div class="header">
4158					<div class="title fw-5"> &#x633;&#x644;&#x629; &#x627;&#x644;&#x645;&#x634;&#x62A;&#x631;&#x64A;&#x627;&#x62A;</div>
4159					<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4160				</div>
4161				<div class="wrap">
4162								<div class="tf-mini-cart-threshold" v-if="enableFreeShippingOnValue && freeShippingValue">
4163						<div class="tf-progress-bar">
4164							<span :style="{ width: freeShippingProgress + '%' }">
4165								<div class="progress-car">
4166									<svg xmlns="http://www.w3.org/2000/svg" width="21" height="14" viewBox="0 0 21 14"
4167										fill="currentColor">
4168										<path fill-rule="evenodd" clip-rule="evenodd"
4169											d="M0 0.875C0 0.391751 0.391751 0 0.875 0H13.5625C14.0457 0 14.4375 0.391751 14.4375 0.875V3.0625H17.3125C17.5867 3.0625 17.845 3.19101 18.0104 3.40969L20.8229 7.12844C20.9378 7.2804 21 7.46572 21 7.65625V11.375C21 11.8582 20.6082 12.25 20.125 12.25H17.7881C17.4278 13.2695 16.4554 14 15.3125 14C14.1696 14 13.1972 13.2695 12.8369 12.25H7.72563C7.36527 13.2695 6.39293 14 5.25 14C4.10706 14 3.13473 13.2695 2.77437 12.25H0.875C0.391751 12.25 0 11.8582 0 11.375V0.875ZM2.77437 10.5C3.13473 9.48047 4.10706 8.75 5.25 8.75C6.39293 8.75 7.36527 9.48046 7.72563 10.5H12.6875V1.75H1.75V10.5H2.77437ZM14.4375 8.89937V4.8125H16.8772L19.25 7.94987V10.5H17.7881C17.4278 9.48046 16.4554 8.75 15.3125 8.75C15.0057 8.75 14.7112 8.80264 14.4375 8.89937ZM5.25 10.5C4.76676 10.5 4.375 10.8918 4.375 11.375C4.375 11.8582 4.76676 12.25 5.25 12.25C5.73323 12.25 6.125 11.8582 6.125 11.375C6.125 10.8918 5.73323 10.5 5.25 10.5
4169ZM15.3125 10.5C14.8293 10.5 14.4375 10.8918 14.4375 11.375C14.4375 11.8582 14.8293 12.25 15.3125 12.25C15.7957 12.25 16.1875 11.8582 16.1875 11.375C16.1875 10.8918 15.7957 10.5 15.3125 10.5Z">
4170										</path>
4171									</svg>
4172								</div>
4173							</span>
4174						</div>
4175						<div class="tf-progress-msg">
4176							<span>
4177								<span v-text="freeShippingMessage"></span>
4178								<span v-if="freeShippingRemaining > 0" class=" " style="color: black;">
4179								    اشتري بقيمة	<span class="icon-saudi_riyal"></span>
4180									<span v-text="freeShippingRemaining"></span>
4181								</span>
4182								<span v-text="freeShippingEmoji"></span>
4183							</span>
4184						</div>
4185					</div>
4186						
4187						
4188						
4189						<!--<div class="tf-progress-msg">
4190							 &#x627;&#x634;&#x62A;&#x631;&#x64A; &#x628;&#x640; <span class="price"> <div class="totalCartPrice" v-text="formatCartMoney(totalPrice)"></div>
4191								<span class="icon-saudi_riyal" v-if="!item.isOfferGift"></span>
4192							</span> &#x644;&#x643;&#x64A; &#x62A;&#x62D;&#x635;&#x644; &#x639;&#x644;&#x649;  
4193	<span class="fw-6">&#x62A;&#x648;&#x635;&#x64A;&#x644; &#x645;&#x62C;&#x627;&#x646;&#x64A; </span>	
4194		
4195				</div>-->
4196					<div class="tf-mini-cart-wrap">
4197						<div class="tf-mini-cart-main">
4198							<div class="tf-mini-cart-sroll">
4199								<div class="tf-mini-cart-items">
4200                  
4201									<div class="tf-mini-cart-item" v-for="(item, index) in cart">
4202										<div class="tf-mini-cart-image">
4203											<a :href="'/ProductDetail?productId=' + item.productId">
4204												<img :src="getCartItemImageSrc(item, '/Views/Themes/decor/V1/Assets/images/nophoto/1000x1000.png')" alt="" />
4205                        
4206											</a>
4207										</div>
4208										<div class="tf-mini-cart-info">
4209											<a class="title link" :href="'/ProductDetail?productId=' + item.productId" v-text="item.name"></a>
4210											<span class="badges-on-sale" v-if="item.isOfferGift || item.IsOfferGift">&#x645;&#x62C;&#x627;&#x646;&#x627;&#x64B;</span>
4211											<div class="meta-variant" v-text="item.optionNames"> </div>
4212											<span class="price d-flex gap-2 align-items-center flex-wrap">
4213												
4214<template v-if="item.isOfferGift || item.IsOfferGift">
4215	<span class="price-value">&#x645;&#x62C;&#x627;&#x646;&#x627;&#x64B;</span>
4216</template>
4217<template v-else>
4218	<span class="cart-money">
4219		<span class="before-price text-gray-400 line-through" v-if="cartItemCompareAt(item) > Number(item.discountPrice)" v-text="formatCartMoney(cartItemCompareAt(item))"></span>
4220		<span class="price-value" v-text="formatCartMoney(item.discountPrice)"></span>
4221		<span class="icon-saudi_riyal"></span>
4222	</span>
4223</template>
4224
4225
4226											</span>
4227											<div class="tf-mini-cart-btns">
4228												<div class="wg-quantity small">
4229													<span class="btn-quantity minus-btn" v-if="!item.isOfferGift" @click="decreaseQuantity(item)"><i class="fi fi-rr-minus-small"></i></span>
4230													<input type="number" name="number" :value="item.quantity" disabled="true"/>
4231													<span class="btn-quantity plus-btn" v-if="!item.isOfferGift" @click="increaseQuantity(item)"><i class="fi fi-rr-plus-small"></i></span>
4232												</div>
4233												<div class="tf-mini-cart-remove" v-if="!item.isOfferGift" @click="removeFromCart(item)">&#x645;&#x633;&#x62D;</div>
4234											</div>
4235										</div>
4236									</div>
4237                 
4238                  
4239                  
4240								</div>
4241							</div>
4242						</div>
4243						<div class="tf-mini-cart-bottom">
4244							<div class="tf-mini-cart-tool" v-if="false">
4245								<div class="tf-mini-cart-tool-btn btn-add-note">
4246									<svg xmlns="http://www.w3.org/2000/svg" width="16" height="18" viewBox="0 0 16 18"
4247										fill="currentColor">
4248										<path
4249											d="M5.12187 16.4582H2.78952C2.02045 16.4582 1.39476 15.8325 1.39476 15.0634V2.78952C1.39476 2.02045 2.02045 1.39476 2.78952 1.39476H11.3634C12.1325 1.39476 12.7582 2.02045 12.7582 2.78952V7.07841C12.7582 7.46357 13.0704 7.77579 13.4556 7.77579C13.8407 7.77579 14.1529 7.46357 14.1529 7.07841V2.78952C14.1529 1.25138 12.9016 0 11.3634 0H2.78952C1.25138 0 0 1.25138 0 2.78952V15.0634C0 16.6015 1.25138 17.8529 2.78952 17.8529H5.12187C5.50703 17.8529 5.81925 17.5407 5.81925 17.1555C5.81925 16.7704 5.50703 16.4582 5.12187 16.4582Z">
4250										</path>
4251										<path
4252											d="M15.3882 10.0971C14.5724 9.28136 13.2452 9.28132 12.43 10.0965L8.60127 13.9168C8.51997 13.9979 8.45997 14.0979 8.42658 14.2078L7.59276 16.9528C7.55646 17.0723 7.55292 17.1993 7.58249 17.3207C7.61206 17.442 7.67367 17.5531 7.76087 17.6425C7.84807 17.7319 7.95768 17.7962 8.07823 17.8288C8.19879 17.8613 8.32587 17.8609 8.44621 17.8276L11.261 17.0479C11.3769 17.0158 11.4824 16.9543 11.5675 16.8694L15.3882 13.0559C16.2039 12.2401 16.2039 10.9129 15.3882 10.0971ZM10.712 15.7527L9.29586 16.145L9.71028 14.7806L12.2937 12.2029L13.2801 13.1893L10.712 15.7527ZM14.4025 12.0692L14.2673 12.204L13.2811 11.2178L13.4157 11.0834C13.6876 10.8115 14.1301 10.8115 14.402 11.0834C14.6739 11.3553 
425214.6739 11.7977 14.4025 12.0692Z">
4253										</path>
4254									</svg>
4255								</div>
4256								<div class="tf-mini-cart-tool-btn btn-add-gift">
4257									<svg xmlns="http://www.w3.org/2000/svg" width="17" height="18" viewBox="0 0 17 18"
4258										fill="currentColor">
4259										<path fill-rule="evenodd" clip-rule="evenodd"
4260											d="M2.99566 2.73409C2.99566 0.55401 5.42538 -0.746668 7.23916 0.463462L8.50073 1.30516L9.7623 0.463462C11.5761 -0.746668 14.0058 0.55401 14.0058 2.73409V3.24744H14.8225C15.9633 3.24744 16.8881 4.17233 16.8881 5.31312V6.82566C16.8881 7.21396 16.5734 7.52873 16.1851 7.52873H15.8905V15.1877C15.8905 15.1905 15.8905 15.1933 15.8905 15.196C15.886 16.7454 14.6286 18 13.0782 18H3.92323C2.37003 18 1.11091 16.7409 1.11091 15.1877V7.52877H0.81636C0.42806 7.52877 0.113281 7.21399 0.113281 6.82569V5.31316C0.113281 4.17228 1.03812 3.24744 2.179 3.24744H2.99566V2.73409ZM4.40181 3.24744H7.79765V2.52647L6.45874 1.63317C5.57987 1.0468 4.40181 1.67677 4.40181 2.73409V3.24744ZM9.20381 2.52647V3.24744H12.5996V2.73409C12.5996 1.67677 11.4216 1.0468 10.5427 1.63317L9.20381 2.52647ZM2.179 4.6536C1.81472 4.6536 1.51944 4.94888 1.51944 5.31316V6.12261H5.73398L5.734 4.6536H2.179ZM5.73401 7.52877V13.9306C5.73401 14.1806 5.86682 14.4119 6.08281 14.5379C6.29879 14.6639 6.56545 14.6657 6.78312 14.5426L8.50073 13.5715L10.2183 14.5426C10.436 14.6657 10.7027 14.6639 10.9187 14.5379C11.1346 14.4119 11.2674 14.1806 11.2674 13.9306V7.52873H14.4844V15.1603C14.4844 15.1627 14.4843 15.1651 14.4843 15.1675V15.1877C14.4843 15.9643 13.8548 16.5938 13.0782 16.5938H3.92323C3.14663 16.5938 2.51707 15.9643 2.51707 15.1877V7.52877H5.73401ZM15.482 6.12258V5.31312C15.482 4.94891 15.1867 4.6536 14.8225 4.6536H11.2674V6.12258H15.482ZM9.86129 4.6536H7.14017V12.7254L8.15469 12.1518C8.36941 12.0304 8.63204 12.0304 8.84676 12.1518L9.86129 12.7254V4.6536Z">
4261										</path>
4262									</svg>
4263								</div>
4264								<div class="tf-mini-cart-tool-btn btn-estimate-shipping">
4265									<svg xmlns="http://www.w3.org/2000/svg" width="26" height="18" viewBox="0 0 26 18"
4266										fill="currentColor">
4267										<path fill-rule="evenodd" clip-rule="evenodd"
4268											d="M0 0.811989C0 0.36354 0.36354 0 0.811989 0H15.4278C15.8763 0 16.2398 0.36354 16.2398 0.811989V3.10596H21.0144C23.6241 3.10596 25.8643 5.05894 25.8643 7.61523V14.6414C25.8643 15.0899 25.5007 15.4534 25.0523 15.4534H23.545C23.2139 16.9115 21.9098 18 20.3514 18C18.7931 18 17.4889 16.9115 17.1578 15.4534H8.69534C8.36423 16.9115 7.0601 18 5.50175 18C3.9434 18 2.63927 16.9115 2.30815 15.4534H0.811989C0.36354 15.4534 0 15.0899 0 14.6414V0.811989ZM2.35089 13.8294C2.74052 12.4562 4.00366 11.4503 5.50175 11.4503C6.99983 11.4503 8.26298 12.4562 8.6526 13.8294H14.6158V1.62398H1.62398V13.8294H2.35089ZM16.2398 4.72994V7.95749H24.2403V7.61523C24.2403 6.08759 22.8649 4.72994 21.0144 4.72994H16.2398ZM24.2403 9.58147H16.2398V13.8294H17.2006C17.5902 12.4562 18.8533 11.4503 20.3514 11.4503C21.8495 11.4503 23.1126 12.4562 23.5023 13.8294H24.2403V9.58147ZM5.50175 13.0743C4.58999 13.0743 3.85087 13.8134 3.85087 14.7251C3.85087 15.6369 4.58999 16.376 5.50175 16.376C6.41351 16.376 7.15263 15.6369 7.15263 14.7251C7.15263 13.8134 6.41351 13.0743 5.50175 13.0743ZM20.3514 13.0743C19.4397 13.0743 18.7005 13.8134 18.7005 14.7251C18.7005 15.6369 19.4397 16.376 20.3514 16.376C21.2632 16.376 22.0023 15.6369 22.0023 14.7251C22.0023 13.8134 21.2632 13.0743 20.3514 13.0743Z">
4269										</path>
4270									</svg>
4271								</div>
4272							</div>
4273							<div class="tf-mini-cart-bottom-wrap">
4274								<div class="tf-cart-totals-discounts">
4275									<div class="tf-cart-total">&#x627;&#x644;&#x645;&#x62C;&#x645;&#x648;&#x639; &#x627;&#x644;&#x641;&#x631;&#x639;&#x64A;</div>
4276									<span class="price ">
4277                    <div class="totalCartPrice" v-text="formatCartMoney(checkout.priceBeforeVat)"></div>
4278										<span class="icon-saudi_riyal"></span>
4279									</span>
4280								</div>
4281								<div class="tf-cart-tax" v-if="false">
4282									&#x64A;&#x62A;&#x645; &#x627;&#x62D;&#x62A;&#x633;&#x627;&#x628; &#x627;&#x644;&#x636;&#x631;&#x627;&#x626;&#x628; &#x648;<a href="#">&#x627;&#x644;&#x634;&#x62D;&#x646;</a> &#x639;&#x646;&#x62F; &#x625;&#x646;&#x647;&#x627;&#x621; &#x627;&#x644;&#x637;&#x644;&#x628;
4283
4284								</div>
4285								<div class="tf-mini-cart-line"></div>
4286								<!--<div class="tf-cart-checkbox">
4287									<div class="tf-checkbox-wrapp">
4288										<input class="" type="checkbox" id="CartDrawer-Form_agree" name="agree_checkbox" v-model="acceptTermsInShoppingCart"/>
4289										<div>
4290											<i class="icon-check"></i>
4291										</div>
4292									</div>
4293									<label for="CartDrawer-Form_agree">
4294									&#x623;&#x648;&#x627;&#x641;&#x642; &#x639;&#x644;&#x649; <a  href="/page/&#x627;&#x644;&#x634;&#x631;&#x648;&#x637; &#x648;&#x627;&#x644;&#x623;&#x62D;&#x643;&#x627;&#x645;" title="Terms of Service" target="_blank"> &#x627;&#x644;&#x634;&#x631;&#x648;&#x637; &#x648;&#x627;&#x644;&#x623;&#x62D;&#x643;&#x627;&#x645;
4295
4296									</label>
4297								</div>-->
4298					<div class="tf-mini-cart-view-checkout"  v-show="checkout.priceBeforeVat > 0">
4299  <a href="javascript:void(0);" @click="goPageFromShoppingCart('cart')"
4300     class="tf-btn btn-outline radius-3 link w-100 justify-content-center">
4301    &#x639;&#x631;&#x636; &#x627;&#x644;&#x633;&#x644;&#x629;
4302  </a>
4303  <a href="javascript:void(0);" @click="goPageFromShoppingCart('checkout')"
4304     class="tf-btn btn-fill animate-hover-btn radius-3 w-100 justify-content-center">
4305    <span>&#x625;&#x62A;&#x645;&#x627;&#x645; &#x627;&#x644;&#x634;&#x631;&#x627;&#x621;</span>
4306  </a>
4307</div>
4308
4309							</div>
4310						</div>
4311						<!--<div class="tf-mini-cart-tool-openable add-note">
4312							<div class="overplay tf-mini-cart-tool-close"></div>
4313							<div class="tf-mini-cart-tool-content">
4314								<label for="Cart-note" class="tf-mini-cart-tool-text">
4315									<div class="icon">
4316										<svg xmlns="http://www.w3.org/2000/svg" width="16" height="18"
4317											viewBox="0 0 16 18" fill="currentColor">
4318											<path
4319												d="M5.12187 16.4582H2.78952C2.02045 16.4582 1.39476 15.8325 1.39476 15.0634V2.78952C1.39476 2.02045 2.02045 1.39476 2.78952 1.39476H11.3634C12.1325 1.39476 12.7582 2.02045 12.7582 2.78952V7.07841C12.7582 7.46357 13.0704 7.77579 13.4556 7.77579C13.8407 7.77579 14.1529 7.46357 14.1529 7.07841V2.78952C14.1529 1.25138 12.9016 0 11.3634 0H2.78952C1.25138 0 0 1.25138 0 2.78952V15.0634C0 16.6015 1.25138 17.8529 2.78952 17.8529H5.12187C5.50703 17.8529 5.81925 17.5407 5.81925 17.1555C5.81925 16.7704 5.50703 16.4582 5.12187 16.4582Z">
4320											</path>
4321											<path
4322												d="M15.3882 10.0971C14.5724 9.28136 13.2452 9.28132 12.43 10.0965L8.60127 13.9168C8.51997 13.9979 8.45997 14.0979 8.42658 14.2078L7.59276 16.9528C7.55646 17.0723 7.55292 17.1993 7.58249 17.3207C7.61206 17.442 7.67367 17.5531 7.76087 17.6425C7.84807 17.7319 7.95768 17.7962 8.07823 17.8288C8.19879 17.8613 8.32587 17.8609 8.44621 17.8276L11.261 17.0479C11.3769 17.0158 11.4824 16.9543 11.5675 16.8694L15.3882 13.0559C16.2039 12.2401 16.2039 10.9129 15.3882 10.0971ZM10.712 15.7527L9.29586 16.145L9.71028 14.7806L12.2937 12.2029L13.2801 13.1893L10.712 15.7527ZM14.4025 12.0692L14.2673 12.204L13.2811 11.2178L13.4157 11.0834C13.6876 10.8115 14.1301 10.8115 14.402 11.0834C14.6739 11.3553 14.6739 11.7977 14.4025 12.0692Z">
4323											</path>
4324										</svg>
4325									</div>
4326									<span>&#x623;&#x636;&#x641; &#x645;&#x644;&#x627;&#x62D;&#x638;&#x629; &#x644;&#x644;&#x637;&#x644;&#x628;</span>
4327
4328								</label>
4329								<textarea name="note" id="Cart-note"
4330									placeholder="&#x64A;&#x631;&#x62C;&#x649; &#x643;&#x62A;&#x627;&#x628;&#x629; &#x623;&#x64A; &#x645;&#x644;&#x627;&#x62D;&#x638;&#x627;&#x62A; &#x62A;&#x631;&#x63A;&#x628; &#x628;&#x647;&#x627; &#x628;&#x62E;&#x635;&#x648;&#x635; &#x637;&#x644;&#x628;&#x643;"></textarea>
4331								<div class="tf-cart-tool-btns justify-content-center">
4332									<div
4333										class="tf-mini-cart-tool-primary text-center w-100 fw-6 tf-mini-cart-tool-close">
4334										&#x625;&#x63A;&#x644;&#x627;&#x642;
4335									</div>
4336								</div>
4337							</div>
4338						</div>
4339						<div class="tf-mini-cart-tool-openable add-gift">
4340							<div class="overplay tf-mini-cart-tool-close"></div>
4341							<form class="tf-product-form-addgift">
4342								<div class="tf-mini-cart-tool-content">
4343									<div class="tf-mini-cart-tool-text">
4344										<div class="icon">
4345											<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
4346												viewBox="0 0 24 24" fill="currentColor">
4347												<path fill-rule="evenodd" clip-rule="evenodd"
4348													d="M4.65957 3.64545C4.65957 0.73868 7.89921 -0.995558 10.3176 0.617949L11.9997 1.74021L13.6818 0.617949C16.1001 -0.995558 19.3398 0.73868 19.3398 3.64545V4.32992H20.4286C21.9498 4.32992 23.1829 5.56311 23.1829 7.08416V9.10087C23.1829 9.61861 22.7632 10.0383 22.2454 10.0383H21.8528V20.2502C21.8528 20.254 21.8527 20.2577 21.8527 20.2614C21.8467 22.3272 20.1702 24 18.103 24H5.89634C3.82541 24 2.14658 22.3212 2.14658 20.2502V10.0384H1.75384C1.23611 10.0384 0.816406 9.61865 0.816406 9.10092V7.08421C0.816406 5.56304 2.04953 4.32992 3.57069 4.32992H4.65957V3.64545ZM6.53445 4.32992H11.0622V3.36863L9.27702 2.17757C8.10519 1.39573 6.53445 2.2357 6.53445 3.64545V4.32992ZM12.9371 3.36863V4.32992H17.4649V3.64545C17.4649 2.2357 15.8942 1.39573 14.7223 2.17756L12.9371 3.36863ZM3.57069 6.2048C3.08499 6.2048 2.69128 6.59851 2.69128 7.08421V8.16348H8.31067L8.3107 6.2048H3.57069ZM8.31071 10.0384V18.5741C8.31071 18.9075 8.48779 19.2158 8.77577 19.3838C9.06376 19.5518 9.4193 19.5542 9.70953 19.3901L11.9997 18.0953L14.2898 19.3901C14.58 19.5542 14.9356 19.5518 15.2236 19.3838C15.5115 19.2158 15.6886 18.9075 15.6886 18.5741V10.0383H19.9779V20.2137C19.9778 20.2169 19.9778 20.2201 19.9778 20.2233V20.2502C19.9778 21.2857 19.1384 22.1251 18.103 22.1251H5.89634C4.86088 22.1251 4.02146 21.2857 4.02146 20.2502V10.0384H8.31071ZM21.308 8.16344V7.08416C21.308 6.59854 20.9143 6.2048 20.4286 6.2048H15.6886V8.16344H21.308ZM13.8138 6.2048H10.1856V16.9672L11.5383 16.2024C11.8246 16.0405 12.1748 16.0405 12.461 16.2024L13.8138 16.9672V6.2048Z">
4349												</path>
4350											</svg>
4351										</div>
4352										<div class="tf-gift-wrap-infos">
4353											<p>&#x647;&#x644; &#x62A;&#x631;&#x63A;&#x628; &#x641;&#x64A; &#x62A;&#x63A;&#x644;&#x64A;&#x641; &#x643;&#x647;&#x62F;&#x64A;&#x629;&#x61F;</p>
4354											&#x641;&#x642;&#x637;
4355											<span class="price fw-6">5.00$</span>
4356										</div>
4357
4358									</div>
4359									<div class="tf-cart-tool-btns">
4360										<button type="submit"
4361											class="tf-btn fw-6 w-100 justify-content-center btn-fill animate-hover-btn radius-3">
4362											<span>&#x623;&#x636;&#x641; &#x62A;&#x63A;&#x644;&#x64A;&#x641; &#x643;&#x647;&#x62F;&#x64A;&#x629;</span>
4363										</button>
4364										<div
4365											class="tf-mini-cart-tool-primary text-center w-100 fw-6 tf-mini-cart-tool-close">
4366											&#x625;&#x644;&#x63A;&#x627;&#x621;
4367										</div>
4368									</div>
4369
4370								</div>
4371							</form>
4372						</div>
4373						<div class="tf-mini-cart-tool-openable estimate-shipping">
4374							<div class="overplay tf-mini-cart-tool-close"></div>
4375							<div class="tf-mini-cart-tool-content">
4376								<div class="tf-mini-cart-tool-text">
4377									<div class="icon">
4378										<svg xmlns="http://www.w3.org/2000/svg" width="21" height="15"
4379											viewBox="0 0 21 15" fill="currentColor">
4380											<path fill-rule="evenodd" clip-rule="evenodd"
4381												d="M0.441406 1.13155C0.441406 0.782753 0.724159 0.5 1.07295 0.5H12.4408C12.7896 0.5 13.0724 0.782753 13.0724 1.13155V2.91575H16.7859C18.8157 2.91575 20.5581 4.43473 20.5581 6.42296V11.8878C20.5581 12.2366 20.2753 12.5193 19.9265 12.5193H18.7542C18.4967 13.6534 17.4823 14.5 16.2703 14.5C15.0582 14.5 14.0439 13.6534 13.7864 12.5193H7.20445C6.94692 13.6534 5.93259 14.5 4.72054 14.5C3.50849 14.5 2.49417 13.6534 2.23664 12.5193H1.07295C0.724159 12.5193 0.441406 12.2366 0.441406 11.8878V1.13155ZM2.26988 11.2562C2.57292 10.1881 3.55537 9.40578 4.72054 9.40578C5.88572 9.40578 6.86817 10.1881 7.17121 11.2562H11.8093V1.76309H1.7045V11.2562H2.26988ZM13.0724 4.17884V6.68916H19.295V6.42296C19.295 5.2348 18.2252 4.17884 16.7859 4.17884H13.0724ZM19.295 7.95226H13.0724V11.2562H13.8196C14.1227 10.1881 15.1051 9.40578 16.2703 9.40578C17.4355 9.40578 18.4179 10.1881 18.7209 11.2562H19.295V7.95226ZM4.72054 10.6689C4.0114 10.6689 3.43652 11.2437 3.43652 11.9529C3.43652 12.662 4.0114 13.2369 4.72054 13.2369C5.42969 13.2369 6.00456 12.662 6.00456 11.9529C6.00456 11.2437 5.42969 10.6689 4.72054 10.6689ZM16.2703 10.6689C15.5611 10.6689 14.9863 11.2437 14.9863 11.9529C14.9863 12.662 15.5611 13.2369 16.2703 13.2369C16.9794 13.2369 17.5543 12.662 17.5543 11.9529C17.5543 11.2437 16.9794 10.6689 16.2703 10.6689Z">
4382											</path>
4383										</svg>
4384									</div>
4385									<span class="fw-6">&#x62A;&#x642;&#x62F;&#x64A;&#x631; &#x62A;&#x643;&#x644;&#x641;&#x629; &#x627;&#x644;&#x634;&#x62D;&#x646;
4385</span>
4386								</div>
4387								<div class="field">
4388									<p>&#x627;&#x644;&#x62F;&#x648;&#x644;&#x629;</p>
4389									<select class="tf-select w-100" id="ShippingCountry_CartDrawer-Form"
4390										name="address[country]" data-default="">
4391										<option value="---" data-provinces="[]">---</option>
4392
4393									</select>
4394								</div>
4395								<div class="field">
4396									<p>&#x627;&#x644;&#x631;&#x645;&#x632; &#x627;&#x644;&#x628;&#x631;&#x64A;&#x62F;&#x64A;</p>
4397									<input type="text" name="text" placeholder="" />
4398								</div>
4399								<div class="tf-cart-tool-btns">
4400									<a href="#"
4401										class="tf-btn fw-6 justify-content-center btn-fill w-100 animate-hover-btn radius-3">
4402										<span>&#x627;&#x62D;&#x633;&#x628;</span>
4403									</a>
4404									<div
4405										class="tf-mini-cart-tool-primary text-center fw-6 w-100 tf-mini-cart-tool-close">
4406										&#x625;&#x644;&#x63A;&#x627;&#x621;
4407									</div>
4408								</div>
4409
4410							</div>
4411						</div>-->
4412					</div>
4413			
4414        
4415          
4416          
4417          
4418        </div>
4419			</div>
4420		</div>
4421	</div>
4422
4423	<!-- /shoppingCart -->
4424
4425	<!--Quick add-->
4426	<div class="modal fade modalDemo" id="quick_add">
4427		<div class="modal-dialog modal-dialog-centered">
4428			<div class="modal-content">
4429				<div class="header">
4430					<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4431				</div>
4432				<div class="wrap">
4433
4434					<!-- معلومات المنتج -->
4435					<div class="tf-product-info-item">
4436						<div class="image">
4437							<img :src="getSelectedProductImageSrc('/Views/Themes/decor/V1/Assets/images/nophoto/1000x1000.png')" alt="image-product" />
4438						</div>
4439						<div class="content">
4440							<a href="" v-text="product.Name"></a>
4441							<div class="tf-product-info-price">
4442								<div class="price" v-text="totalPriceProduct"></div><span
4443									class="icon-saudi_riyal"></span>
4444							</div>
4445						</div>
4446					</div>
4447	<div class="tf-product-info-variant-picker">
4448  <!-- عرض كقائمة منسدلة -->
4449  <template v-if="enableProductOptionsAsDropdown">
4450    <div class="variant-picker-item variant-dropdown" v-for="(optionHeader, headerIndex) in optionHeaders" :key="optionHeader.id">
4451      <div class="variant-picker-label">
4452        <label :for="`dropdown-${optionHeader.id}-1`" v-text="optionHeader.name + ': '"></label>
4453      </div>
4454      <select
4455        :id="`dropdown-${optionHeader.id}-1`"
4456        class="variant-picker-select form-select"
4457        :value="getSelectedValueForHeader(optionHeader.id)?.id"
4458        @change="onOptionDropdownChange(optionHeader, $event)"
4459      >
4460        <option value="" disabled>اختر</option>
4461        <option v-for="detail in optionHeader.productOptionDetails" :key="detail.id" :value="detail.id" v-text="detail.name"></option>
4462      </select>
4463    </div>
4464  </template>
4465
4466  <!-- العرض العادي (أزرار/راديو) -->
4467  <template v-else>
4468    <!-- اختيار اللون -->
4469    <div class="variant-picker-item variant-color" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 2)" :key="optionHeader.id">
4470      <div class="variant-picker-label">
4471        <span v-text="optionHeader.name + ': '"></span>
4472        <span class="fw-6 variant-picker-label-value" v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
4473      </div>
4474      <div class="variant-picker-values" >
4475        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
4476          <input
4477            type="radio"
4478            :id="`value-${detail.id}-${headerIndex}-${index}-1`"
4479            :name="`value-${detail.id}-${headerIndex}-${index}-1`"
4480            :value="detail.id"
4481            :checked="isSelected(detail.id, optionHeader.id)"
4482            @click="selectColor(detail, optionHeader)"
4483                                         />
4484          <label
4485            class="hover-tooltip radius-60"
4486            :for="`value-${detail.id}-${headerIndex}-${index}-1`"
4487            :data-value="detail.id">
4488            <span class="btn-checkbox" :style="{ backgroundColor: detail.value }"></span>
4489            <span class="tooltip" v-text="detail.name"></span>
4490          </label>
4491        </div>
4492      </div>
4493    </div>
4494
4495    <!-- اختيار المقاس -->
4496    <div class="variant-picker-item variant-size" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 1)" :key="optionHeader.id" >
4497      <div class="d-flex justify-content-between align-items-center">
4498        <div class="variant-picker-label">
4499          <span v-text="optionHeader.name + ': '"></span>
4500          <span class="fw-6 variant-picker-label-value"
4501                v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
4502        </div>
4503      </div>
4504      <div class="variant-picker-values">
4505        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
4506          <input type="radio"
4507                 :id="`value-${detail.id}-${headerIndex}-${index}-1`"
4508                 :name="`value-${detail.id}-${headerIndex}-${index}-1`"
4509                 :value="detail.id"
4510                 :checked="isSelected(detail.id, optionHeader.id)"
4511                 @click="selectValue(detail, optionHeader)" />
4512          <label class="style-text" :for="`value-${detail.id}-${headerIndex}-${index}-1`">
4513            <p v-text="detail.name"></p>
4514          </label>
4515        </div>
4516      </div>
4517    </div>
4518
4519    <!-- اختيار صورة -->
4520    <div class="variant-picker-item variant-image" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 3)" :key="optionHeader.id" >
4521      <div class="d-flex justify-content-between align-items-center">
4522        <div class="variant-picker-label">
4523          <span v-text="optionHeader.name + ': '"></span>
4524          <span class="fw-6 variant-picker-label-value"
4525                v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
4526        </div>
4527      </div>
4528      <div class="variant-picker-values">
4529        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
4530          <input type="radio"
4531                 :id="`value-${detail.id}-${headerIndex}-${index}-1`"
4532                 :name="`value-${detail.id}-${headerIndex}-${index}-1`"
4533                 :value="detail.id"
4534                 :checked="isSelected(detail.id, optionHeader.id)"
4535                 @click="selectValue(detail, optionHeader)" />
4536          <label class="style-text" :for="`value-${detail.id}-${headerIndex}-${index}-1`" style="width: 78px;height: 60px;">
4537            <img :src="'/' + detail.fullFilePath" :data-src="'/' + detail.fullFilePath" alt="صور المنتج للإختيار" style="width: 50px;"/>
4538            <p v-text="detail.name"></p>
4539          </label>
4540        </div>
4541      </div>
4542    </div>
4543  </template>
4544</div>
4545
4546
4547					<!-- الكمية -->
4548					<div class="tf-product-info-quantity mb_15">
4549						<div class="quantity-title fw-6">&#x627;&#x644;&#x643;&#x645;&#x64A;&#x629;</div>
4550						<div class="wg-quantity w-100">
4551							<span class="btn-quantity minus-btn" @click="decreaseQuantity"><i
4552									class="fi fi-rr-minus-small"></i></span>
4553							<input type="number" name="number" value="1" disabled v-model="quantity"
4554								@change="changeQuantity()" />
4555							<span class="btn-quantity plus-btn" @click="increaseQuantity"><i
4556									class="fi fi-rr-plus-small"></i></span>
4557						</div>
4558					</div>
4559
4560					<!-- زر الإضافة للسلة -->
4561					<div class="tf-product-info-buy-button">
4562						<form>
4563							<a href="javascript:void(0);" @click="addToCart()"
4564								class="tf-btn btn-fill justify-content-center fw-6 fs-16 flex-grow-1 animate-hover-btn btn-add-to-cart">
4565								<span>&#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629; &nbsp;</span>
4566								<span class="space-between" style="padding: 5px;"></span>
4567								<span class="tf-qty-price totalProductPrice" v-text="totalPriceProduct">
4568								</span> <span class="icon-saudi_riyal"></span>
4569							</a>
4570
4571							<!-- المفضلة -->
4572							<div class="tf-product-btn-wishlist btn-icon-action">
4573								<i class="icon-heart"></i>
4574								<i class="icon-delete"></i>
4575							</div>
4576
4577
4578						</form>
4579					</div>
4580
4581				</div>
4582			</div>
4583		</div>
4584	</div>
4585	<!--Quick add-->
4586
4587
4588	<div class="modal fade modalDemo" id="quick_view">
4589		<div class="modal-dialog modal-dialog-centered">
4590			<div class="modal-content">
4591				<div class="header">
4592					<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4593				</div>
4594				<div class="row">
4595
4596					<!-- صور المنتج -->
4597					<div class="tf-product-media-wrap col-md-6">
4598						<div dir="ltr" class="swiper tf-single-slide">
4599							<div class="swiper-wrapper">
4600								<div class="swiper-slide" v-for="item in productPictures"
4601									:data-option-detail-id="item.productOptionDetailId"
4602									:data-filename="item.fileName"
4603									v-show="productPictures.length">
4604									<div class="item">
4605										<!-- Check if media is an image or video -->
4606										<template v-if="item.mediaType === 1">
4607											<!-- Render image -->
4608											<img :src="item.fullFilePath.startsWith('/') ? item.fullFilePath : '/' + item.fullFilePath"
4609												alt="" />
4610										</template>
4611
4612										<template v-if="item.mediaType === 2">
4613											<!-- Render video -->
4614											<div class="item video-wrapper">
4615												
4616												<iframe width="560" height="315"
4617													src="https://www.youtube.com/embed/" frameborder="0"
4618													allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
4619													allowfullscreen="">
4620												</iframe>
4621											</div>
4622										</template>
4623									</div>
4624								</div>
4625								<div class="swiper-slide" v-show="!productPictures.length">
4626									<div class="item">
4627
4628										<img src="/Views/Themes/decor/V1/Assets/images/nophoto/1000x1000.png"
4629											alt="" />
4630									</div>
4631								</div>
4632							</div>
4633							<div class="swiper-button-next button-style-arrow single-slide-prev"></div>
4634							<div class="swiper-button-prev button-style-arrow single-slide-next"></div>
4635						</div>
4636					</div>
4637
4638					<!-- معلومات المنتج -->
4639					<div class="tf-product-info-wrap position-relative col-md-6">
4640						<div class="tf-product-info-list">
4641							<div class="tf-product-info-title">
4642								<h5><a class="link" :href="ProductDetailUrl" v-text="product.Name"></a></h5>
4643							</div>
4644
4645							<div class="tf-product-info-badges">
4646								&#x627;&#x644;&#x623;&#x643;&#x62B;&#x631; &#x645;&#x628;&#x64A;&#x639;&#x627;&#x64B;
4647								<div class="product-status-content">
4648									<i class="icon-lightning"></i>
4649									<p class="fw-6">&#x627;&#x644;&#x637;&#x644;&#x628; &#x645;&#x631;&#x62A;&#x641;&#x639;! &#x634;&#x62E;&#x635;&#x64B;&#x627; &#x623;&#x636;&#x627;&#x641;&#x648;&#x647; &#x625;&#x644;&#x649; &#x633;&#x644;&#x62A;&#x647;&#x645;.</p>
4650								</div>
4651							</div>
4652
4653							<div class="tf-product-info-price">
4654								<div class="price" v-text="totalPriceProduct"></div> <span
4655									class="icon-saudi_riyal"></span>
4656							</div>
4657
4658							<!--<div class="tf-product-description">
4659								<p v-html="product.Desc">
4660								</p>
4661							</div>-->
4662
4663							<div class="tf-product-info-variant-picker">
4664  <!-- عرض كقائمة منسدلة -->
4665  <template v-if="enableProductOptionsAsDropdown">
4666    <div class="variant-picker-item variant-dropdown" v-for="(optionHeader, headerIndex) in optionHeaders" :key="optionHeader.id">
4667      <div class="variant-picker-label">
4668        <label :for="`dropdown-${optionHeader.id}-1`" v-text="optionHeader.name + ': '"></label>
4669      </div>
4670      <select
4671        :id="`dropdown-${optionHeader.id}-1`"
4672        class="variant-picker-select form-select"
4673        :value="getSelectedValueForHeader(optionHeader.id)?.id"
4674        @change="onOptionDropdownChange(optionHeader, $event)"
4675      >
4676        <option value="" disabled>اختر</option>
4677        <option v-for="detail in optionHeader.productOptionDetail
4677s" :key="detail.id" :value="detail.id" v-text="detail.name"></option>
4678      </select>
4679    </div>
4680  </template>
4681
4682  <!-- العرض العادي (أزرار/راديو) -->
4683  <template v-else>
4684    <!-- اختيار اللون -->
4685    <div class="variant-picker-item variant-color" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 2)" :key="optionHeader.id">
4686      <div class="variant-picker-label">
4687        <span v-text="optionHeader.name + ': '"></span>
4688        <span class="fw-6 variant-picker-label-value" v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
4689      </div>
4690      <div class="variant-picker-values" >
4691        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
4692          <input
4693            type="radio"
4694            :id="`value-${detail.id}-${headerIndex}-${index}-1`"
4695            :name="`value-${detail.id}-${headerIndex}-${index}-1`"
4696            :value="detail.id"
4697            :checked="isSelected(detail.id, optionHeader.id)"
4698            @click="selectColor(detail, optionHeader)"
4699                                         />
4700          <label
4701            class="hover-tooltip radius-60"
4702            :for="`value-${detail.id}-${headerIndex}-${index}-1`"
4703            :data-value="detail.id">
4704            <span class="btn-checkbox" :style="{ backgroundColor: detail.value }"></span>
4705            <span class="tooltip" v-text="detail.name"></span>
4706          </label>
4707        </div>
4708      </div>
4709    </div>
4710
4711    <!-- اختيار المقاس -->
4712    <div class="variant-picker-item variant-size" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 1)" :key="optionHeader.id" >
4713      <div class="d-flex justify-content-between align-items-center">
4714        <div class="variant-picker-label">
4715          <span v-text="optionHeader.name + ': '"></span>
4716          <span class="fw-6 variant-picker-label-value"
4717                v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
4718        </div>
4719      </div>
4720      <div class="variant-picker-values">
4721        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
4722          <input type="radio"
4723                 :id="`value-${detail.id}-${headerIndex}-${index}-1`"
4724                 :name="`value-${detail.id}-${headerIndex}-${index}-1`"
4725                 :value="detail.id"
4726                 :checked="isSelected(detail.id, optionHeader.id)"
4727                 @click="selectValue(detail, optionHeader)" />
4728          <label class="style-text" :for="`value-${detail.id}-${headerIndex}-${index}-1`">
4729            <p v-text="detail.name"></p>
4730          </label>
4731        </div>
4732      </div>
4733    </div>
4734
4735    <!-- اختيار صورة -->
4736    <div class="variant-picker-item variant-image" v-for="(optionHeader, headerIndex) in optionHeaders.filter(p => p.type === 3)" :key="optionHeader.id" >
4737      <div class="d-flex justify-content-between align-items-center">
4738        <div class="variant-picker-label">
4739          <span v-text="optionHeader.name + ': '"></span>
4740          <span class="fw-6 variant-picker-label-value"
4741                v-text="getSelectedValueForHeader(optionHeader.id)?.name"></span>
4742        </div>
4743      </div>
4744      <div class="variant-picker-values">
4745        <div v-for="(detail, index) in optionHeader.productOptionDetails" :key="detail.id">
4746          <input type="radio"
4747                 :id="`value-${detail.id}-${headerIndex}-${index}-1`"
4748                 :name="`value-${detail.id}-${headerIndex}-${index}-1`"
4749                 :value="detail.id"
4750                 :checked="isSelected(detail.id, optionHeader.id)"
4751                 @click="selectValue(detail, optionHeader)" />
4752          <label class="style-text" :for="`value-${detail.id}-${headerIndex}-${index}-1`" style="width: 78px;height: 60px;">
4753            <img :src="'/' + detail.fullFilePath" :data-src="'/' + detail.fullFilePath" alt="صور المنتج للإختيار" style="width: 50px;"/>
4754            <p v-text="detail.name"></p>
4755          </label>
4756        </div>
4757      </div>
4758    </div>
4759  </template>
4760</div>
4761
4762
4763							<!-- الكمية -->
4764							<div class="tf-product-info-quantity">
4765								<div class="quantity-title fw-6">&#x627;&#x644;&#x643;&#x645;&#x64A;&#x629;</div>
4766								<div class="wg-quantity">
4767									<span class="btn-quantity minus-btn" @click="decreaseQuantity({})"><i
4768											class="fi fi-rr-minus-small"></i></span>
4769									<input type="number" name="number" value="1" disabled v-model="quantity"
4770										@change="changeQuantity()" />
4771									<span class="btn-quantity plus-btn" @click="increaseQuantity({})"><i
4772											class="fi fi-rr-plus-small"></i></span>
4773								</div>
4774							</div>
4775
4776							<!-- أزرار الإجراء -->
4777							<div class="tf-product-info-buy-button">
4778								<form>
4779									<a href="javascript:void(0);" @click="addToCart()"
4780										class="tf-btn btn-fill justify-content-center fw-6 fs-16 flex-grow-1 animate-hover-btn btn-add-to-cart">
4781										<span>&#x623;&#x636;&#x641; &#x644;&#x644;&#x633;&#x644;&#x629; &nbsp;</span>
4782										<span class="space-between" style="padding: 5px;"></span>
4783										<span class="tf-qty-price" v-text="totalPriceProduct"></span>
4784										<span class="icon-saudi_riyal"></span>
4785									</a>
4786
4787									<a href="javascript:void(0);"
4788										class="tf-product-btn-wishlist hover-tooltip box-icon bg_white wishlist btn-icon-action">
4789										<span class="icon icon-heart"></span>
4790										<span class="tooltip">&#x623;&#x636;&#x641; &#x625;&#x644;&#x649; &#x627;&#x644;&#x645;&#x641;&#x636;&#x644;&#x629;</span>
4791										<span class="icon icon-delete"></span>
4792									</a>
4793
4794									
4795
4796
4797								</form>
4798							</div>
4799
4800							<!-- عرض التفاصيل -->
4801							<div>
4802								<a :href="ProductDetailUrl" class="tf-btn fw-6 btn-line">
4803									&#x639;&#x631;&#x636; &#x627;&#x644;&#x62A;&#x641;&#x627;&#x635;&#x64A;&#x644; &#x627;&#x644;&#x643;&#x627;&#x645;&#x644;&#x629; <i class="icon icon-arrow1-top-left"></i>
4804								</a>
4805							</div>
4806
4807						</div>
4808					</div>
4809
4810				</div>
4811			</div>
4812		</div>
4813	</div>
4814	<!-- /modal quick_view -->
4815
4816	<!-- modal find_size -->
4817	<div class="modal fade modalDemo tf-product-modal" id="find_size">
4818		<div class="modal-dialog modal-dialog-centered">
4819			<div class="modal-content">
4820				<div class="header">
4821					<div class="demo-title">&#x62F;&#x644;&#x64A;&#x644; &#x627;&#x644;&#x645;&#x642;&#x627;&#x633;&#x627;&#x62A;</div>
4822					<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4823				</div>
4824				<div class="tf-rte">
4825					<div class="tf-table-res-df">
4826						<h6>&#x62C;&#x62F;&#x648;&#x644; &#x645;&#x642;&#x627;&#x633;&#x627;&#x62A; &#x627;&#x644;&#x623;&#x62B;&#x627;&#x62B;</h6>
4827						<table class="tf-sizeguide-table">
4828							<thead>
4829								<tr>
4830									<th>&#x627;&#x644;&#x645;&#x642;&#x627;&#x633;</th>
4831									<th>&#x627;&#x644;&#x646;&#x648;&#x639; &#x627;&#x644;&#x623;&#x645;&#x631;&#x64A;&#x643;&#x64A;</th>
4832									<th>&#x627;&#x644;&#x639;&#x631;&#x636; (&#x633;&#x645;)</th>
4833									<th>&#x627;&#x644;&#x639;&#x645;&#x642; (&#x633;&#x645;)</th>
4834									<th>&#x627;&#x644;&#x627;&#x631;&#x62A;&#x641;&#x627;&#x639; (&#x633;&#x645;)</th>
4835								</tr>
4836							</thead>
4837							<tbody>
4838								<tr>
4839									<td>&#x635;&#x63A;&#x64A;&#x631; &#x62C;&#x62F;&#x64B;&#x627; (XS)</td>
4840									<td>2</td>
4841									<td>60</td>
4842									<td>50</td>
4843									<td>40</td>
4844								</tr>
4845								<tr>
4846									<td>&#x635;&#x63A;&#x64A;&#x631; (S)</td>
4847									<td>4</td>
4848									<td>80</td>
4849									<td>60</td>
4850									<td>45</td>
4851								</tr>
4852								<tr>
4853									<td>&#x645;&#x62A;&#x648;&#x633;&#x637; (M)</td>
4854									<td>6</td>
4855									<td>100</td>
4856									<td>70</td>
4857									<td>50</td>
4858								</tr>
4859								<tr>
4860									<td>&#x643;&#x628;&#x64A;&#x631; (L)</td>
4861									<td>8</td>
4862									<td>120</td>
4863									<td>80</td>
4864									<td>55</td>
4865								</tr>
4866								<tr>
4867									<td>&#x643;&#x628;&#x64A;&#x631; &#x62C;&#x62F;&#x64B; (XL)</td>
4868									<td>10</td>
4869									<td>140</td>
4870									<td>90</td>
4871									<td>60</td>
4872								</tr>
4873								<tr>
4874									<td>&#x636;&#x62E;&#x645; (XXL)</td>
4875									<td>12</td>
4876									<td>160</td>
4877									<td>100</td>
4878									<td>70</td>
4879								</tr>
4880							</tbody>
4881						</table>
4882					</div>
4883
4884					<div class="tf-page-size-chart-content">
4885						<div>
4886							<h6>&#x646;&#x635;&#x627;&#x626;&#x62D; &#x627;&#x644;&#x642;&#x64A;&#x627;&#x633;</h6>
4887							<div class="title">&#x627;&#x644;&#x639;&#x631;&#x636;</div>
4888							<p>&#x642;&#x645; &#x628;&#x642;&#x64A;&#x627;&#x633; &#x627;&#x644;&#x645;&#x633;&#x627;&#x641;&#x629; &#x645;&#x646; &#x627;&#x644;&#x62D;&#x627;&#x641;&#x629; &#x627;&#x644;&#x64A;&#x633;&#x631;&#x649; &#x625;&#x644;&#x649; &#x627;&#x644;&#x62D;&#x627;&#x641;&#x629; &#x627;&#x644;&#x64A;&#x645;&#x646;&#x649; &#x644;&#x644;&#x642;&#x637;&#x639;&#x629;.</p>
4889
4890							<div class="title">&#x627;&#x644;&#x639;&#x645;&#x642;</div>
4891							<p>&#x642;&#x645; &#x628;&#x642;&#x64A;&#x627;&#x633; &#x627;&#x644;&#x645;&#x633;&#x627;&#x641;&#x629; &#x645;&#x646; &#x645;&#x642;&#x62F;&#x645;&#x629; &#x627;&#x644;&#x642;&#x637;&#x639;&#x629; &#x625;&#x644;&#x649; &#x627;&#x644;&#x62E;&#x644;&#x641;.</p>
4892
4893							<div class="title">&#x627;&#x644;&#x627;&#x631;&#x62A;&#x641;&#x627;&#x639;</div>
4894							<p class="mb-0">&#x642;&#x645; &#x628;&#x642;&#x64A;&#x627;&#x633; &#x645;&#x646; &#x627;&#x644;&#x623;&#x631;&#x636; &#x625;&#x644;&#x649; &#x623;&#x639;&#x644;&#x649; &#x646;&#x642;&#x637;&#x629; &#x641;&#x64A; &#x627;&#x644;&#x642;&#x637;&#x639;&#x629;.</p>
4895						</div>
4896
4897
4898					</div>
4899				</div>
4900			</div>
4901		</div>
4902	</div>
4903
4904
4905	<!-- modal share social -->
4906	<div class="modal modalCentered fade modalDemo tf-product-modal modal-part-content" id="share_social">
4907		<div class="modal-dialog modal-dialog-centered">
4908			<div class="modal-content">
4909				<div class="header">
4910					<div class="demo-title">&#x645;&#x634;&#x627;&#x631;&#x643;&#x629; </div>
4911					<span class="icon-close icon-close-popup" data-bs-dismiss="modal"></span>
4912				</div>
4913				<div class="overflow-y-auto">
4914					<ul class="tf-social-icon d-flex gap-10">
4915					
4916								 
4917									 
4918						<li><a href="https://www.tiktok.com/" class="box-icon social-tiktok bg_line" target="_blank"><i
4919									class="icon icon-tiktok"></i></a></li>
4920									
4921					</ul>
4922					<form class="form-share" method="post" accept-charset="utf-8">
4923						<fieldset>
4924							<input type="text" value="" tabindex="0" aria-required="true" v-model="sharUrl" disabled>
4925						</fieldset>
4926						<div class="button-submit">
4927							<button class="tf-btn btn-sm radius-3 btn-fill btn-icon animate-hover-btn" type="button"
4928								@click="copyLink()"> &#x646;&#x633;&#x62E; &#x627;&#x644;&#x631;&#x627;&#x628;&#x637;
4929							</button>
4930						</div>
4931					</form>
4932				</div>
4933			</div>
4934		</div>
4935	</div>
4936	<!-- /modal share social -->
4937
4938
4939	<a href="https://wa.me/" target="_blank" class="whatsapp-button" aria-label="WhatsApp">
4940		<i class="icon  icon-whatsapp"></i>
4941	</a>
4942
4943	<a href="tel:" target="_blank" class="phone-button" aria-label="call">
4944		<i class="icon  ">
4945			<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 24 24" width="22"
4946				height="22">
4947				<path
4948					d="M22.17,1.82l-1.05-.91c-1.21-1.21-3.17-1.21-4.38,0-.03,.03-1.88,2.44-1.88,2.44-1.14,1.2-1.14,3.09,0,4.28l1.16,1.46c-1.46,3.31-3.73,5.59-6.93,6.95l-1.46-1.17c-1.19-1.15-3.09-1.15-4.28,0,0,0-2.41,1.85-2.44,1.88-1.21,1.21-1.21,3.17-.05,4.33l1,1.15c1.15,1.15,2.7,1.78,4.38,1.78,7.64,0,17.76-10.13,17.76-17.76,0-1.67-.63-3.23-1.83-4.42ZM6.24,22c-1.14,0-2.19-.42-2.91-1.15l-1-1.15c-.41-.41-.43-1.08-.04-1.51,0,0,2.39-1.84,2.42-1.87,.41-.41,1.13
4948-.41,1.55,0,.03,.03,2.04,1.64,2.04,1.64,.28,.22,.65,.28,.98,.15,4.14-1.58,7.11-4.54,8.82-8.81,.13-.33,.08-.71-.15-1,0,0-1.61-2.02-1.63-2.04-.43-.43-.43-1.12,0-1.55,.03-.03,1.87-2.42,1.87-2.42,.43-.39,1.1-.38,1.56,.08l1.05,.91c.77,.77,1.2,1.82,1.2,2.96,0,6.96-9.77,15.76-15.76,15.76Z" />
4949			</svg>
4950		</i>
4951	</a>
4952
4953
4954
4955	<input name="__RequestVerificationToken" type="hidden" value="CfDJ8OkjBRrcfUVOmNlc-QG_ReSJ05DhduyIKlu7IfrfwVi44t2Ij8mKBLjAAZTDQWFRNqHZiDmEx6lRHDkUEnsnZSL4On8kSx8tTcMnn53m2OPWkxNUzuIjVZIHXDAcq-WZv6KzkTQib5RI2WYo-FcoR-w" />
4956
4957	
4957<script src="/Views/ThemesCommonJs/Common/UiLocker.js?v=154" defer></script>
4957
4958	
4958<script src="/Views/ThemesCommonJs/Common/LocalizationHelper.js?v=154" defer></script>
4958
4959
4960	<!-- Javascript -->
4961	
4961<script type="text/javascript" src="/Views/ThemesCommonJs/Common/Helper.js?v=154" defer></script>
4961
4962	
4962<script type="text/javascript" src="/Views/ThemesCommonJs/Common/Account.js?v=154" defer></script>
4962
4963	
4963<script type="text/javascript" src="/Views/ThemesCommonJs/App.js?v=154" defer></script>
4963
4964
4965	
4965<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/swiper-bundle.min.js" defer></script>
4965
4966	
4966<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/carousel.js" defer></script>
4966
4967	
4967<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/bootstrap-select.min.js" defer></script>
4967
4968	
4968<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/lazysize.min.js" defer></script>
4968
4969	
4969<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/drift.min.js" defer></script>
4969
4970	
4970<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/count-down.js" defer></script>
4970
4971	
4971<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/wow.min.js" defer></script>
4971
4972	
4972<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/multiple-modal.js" defer></script>
4972
4973
4974	
4974<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/nouislider.min.js" defer></script>
4974
4975	
4975<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/shop.js" defer></script>
4975
4976
4977
4978	
4978<script type="text/javascript" src="/Views/Themes/decor/V1/Assets/js/main.js" defer></script>
4978
4979
4980
4981 
4982	
4982<script>
4983	window.AppSession = {
4984	userName: "",
4985	email: "",
4986	phoneNumber: "",
4987	name: "",
4988	avatar: "lak/host/nophoto/400x400-user.png",
4989	enableVat: "false",
4990	lastName: "",
4991	shippingAmount: "30",
4992	enableShipping: "true",
4993	enableLakLogisticsIntegration: "false",
4994	lakLogisticsShippingViaSupplier: "false",
4995	isLiveMyFatoorahPayment: "true",
4996	isLivePaymobPayment: "true",
4997	messagesGateWayType: "1",
4998	isMisPayEnabled: "false",
4999	
5000	isTamaraEnabled: "false",
5001	misPayWidgetEnabled: "false",
5002	misPayAccessKey: "",
5003	showTermsAndConditions: "false",
5004	currentLang: "ar",
5005	enableProductOptionsAsDropdown: ""
5006	};
5007
5008	window.tenantObj = {
5009	tenantUrlPrefix: "",
5010	currentTenantId: "12ee1324-6c3f-ae55-ccbc-3a1fbb6e4dde"
5011	};
5012
5013	window.loginMethodsobj = {
5014	loginByPhone: "true",
5015	loginByEmail: "true"
5016	};
5017</script>
5017
5018
5019
5020
5021
5022
5023<script>
5024    function injectStyleOnce(t,e){if(document.getElementById(t))return;let o=document.createElement("style");o.id=t,o.textContent=e,document.head.appendChild(o)}function rafThrottle(t){let e=!1;return function(){e||(e=!0,requestAnimationFrame(()=>{e=!1,t()}))}}function updateDeliveryAndReturnText(){let t=document.querySelector(".tf-product-info-delivery-return");if(!t)return;function e(t,e,o,n){if(!t)return;t.textContent="",e&&t.append(document.createTextNode(e));let i=document.createElement("span");i.className="fw-7",i.textContent=o||"",t.append(i),n&&t.append(document.createTextNode(n))}let o=t.querySelector(".tf-product-delivery p");o&&o.textContent.includes("مدة التوصيل المتوقعة")&&e(o,"مدة التوصيل المتوقعة: ","7-14 يومًا",""),t.querySelectorAll(".tf-product-delivery p").forEach(t=>{t.textContent.includes("الإرجاع خلال")&&e(t,"الإرجاع خلال ","7 أيام"," من تاريخ الشراء. الرسوم والضرائب غير قابلة للاسترداد.")})}document.addEventListener("DOMContentLoaded",function(){let t=document.querySelector(".subscribe-form .store-img img");t&&(t.src="https://iili.io/BgL4vG1.webp",t.alt="newsletter-Banner")}),document.addEventListener("DOMContentLoaded",updateDeliveryAndReturnText),function(){let t="top-scrolling-bar";if(document.getElementById(t))return;let e=document.createElement("div");e.id=t,e.className="top-scrolling-bar";let o=`
5025    <span class="scrolling-text">مرحباً بكم في متجرنا</span>
5026    <span class="scrolling-logo" aria-hidden="true"></span>
5027    <span class="scrolling-text">عروض مميزة • منتجات مختارة بعناية</span>
5028    <span class="scrolling-logo" aria-hidden="true"></span>
5029    <span class="scrolling-text">جودة موثوقة • أسعار مناسبة • توصيل سريع</span>
5030    <span class="scrolling-logo" aria-hidden="true"></span>
5031    <span class="scrolling-text">طرق دفع آمنة • خدمة عملاء متاحة</span>
5032    <span class="scrolling-logo" aria-hidden="true"></span>
5033    <span class="scrolling-text">استبدال وإرجاع وفق سياسة المتجر</span>
5034    <span class="scrolling-logo" aria-hidden="true"></span>
5035  `;e.innerHTML=`
5036    <div class="marquee">${o}</div>
5037    <div class="marquee marquee2">${o}</div>
5038  `,document.body.insertBefore(e,document.body.firstChild),injectStyleOnce("top-scrolling-bar-style",`
5039    .top-scrolling-bar {
5040      width: 100%;
5041      position: relative;
5042      backdrop-filter: blur(20px);
5043      box-shadow: rgb(from var(--second-color) r g b / 0.2) 0px 4px 30px;
5044      z-index: 1000;
5045      background: var(--body) !important;
5046      overflow: hidden;
5047      height: 45px;
5048    }
5049    .marquee {
5050      position: absolute;
5051      top: 0;
5052      left: 0;
5053      width: max-content;
5054      height: 100%;
5055      display: flex;
5056      align-items: center;
5057      gap: 60px;
5058      white-space: nowrap;
5059      animation: marquee 25s linear infinite;
5060      padding-right: 60px;
5061    }
5062    .marquee2 { animation-delay: -12.5s; }
5063
5064    .scrolling-text {
5065      font-size: 15px;
5066      font-weight: 600;
5067      letter-spacing: 0.5px;
5068      text-shadow: 0 2px 10px rgb(from var(--fourth-color) r g b / 0.5);
5069      background: var(--third-color);
5070      -webkit-background-clip: text;
5071      color: var(--second-color);
5072      background-clip: text;
5073      flex-shrink: 0;
5074    }
5075    .scrolling-logo {
5076      height: 60px;
5077      width: 60px;
5078      display: inline-block;
5079      background-image: var(--logo);
5080      background-repeat: no-repeat;
5081      background-position: center;
5082      background-size: contain;
5083      filter: drop-shadow(0 0 10px rgb(from var(--second-color) r g b / 0.5));
5084      animation: logoGlow 2s ease-in-out infinite;
5085      flex-shrink: 0;
5086    }
5087    @keyframes marquee { from { transform: translateX(100%); } to { transform: translateX(-100%); } }
5088    @keyframes logoGlow {
5089      0%, 100% { filter: drop-shadow(0 0 10px rgb(from var(--second-color) r g b / 0.5)); }
5090      50% { filter: drop-shadow(0 0 20px rgb(from var(--second-color) r g b / 0.8)); }
5091    }
5092    .top-scrolling-bar:hover .marquee { animation-play-state: paused; }
5093
5094    @media (max-width: 576px) {
5095      .top-scrolling-bar { height: 40px; }
5096      .marquee { gap: 80px; padding-right: 80px; animation: marquee 30s linear infinite; }
5097      .marquee2 { animation-delay: -15s; }
5098      .scrolling-text { font-size: 14px; }
5099      .scrolling-logo { height: 26px; width: 26px; }
5100    }
5101  `)}(),document.addEventListener("DOMContentLoaded",function(){let t=document.querySelector(".label-title");t&&"تألقي مع منتجاتنا"===t.textContent.trim()&&(t.textContent="اكتشف أفضل منتجاتنا")}),document.addEventListener("DOMContentLoaded",function(){let t=document.querySelector(".top-bar-language.tf-cur");t&&t.remove()}),document.addEventListener("DOMContentLoaded",function(){injectStyleOnce("mobile-topbar-swiper-style",`
5102    .text-center.text-white.overflow-hidden {
5103      display: block !important;
5104      visibility: visible !important;
5105    }
5106    @media (max-width: 991px) {
5107      .tf-top-bar_wrap .tf-social-icon { display: none !important; }
5108      .tf-top-bar_wrap { grid-template-columns: 1fr !important; }
5109      .tf-top-bar .text-center.text-white.overflow-hidden {
5110        padding: 0 !important;
5111        height: 32px !important;
5112        display: flex !important;
5113        align-items: center !important;
5114        justify-content: center !important;
5115      }
5116      .tf-top-bar .swiper.tf-sw-top_bar { height: 32px !important; }
5117      .tf-top-bar .swiper-wrapper { align-items: center !important; }
5118      .tf-top-bar .swiper-slide {
5119        display: flex !important;
5120        align-items: center !important;
5121        justify-content: center !important;
5122        height: 32px !important;
5123      }
5124      .tf-top-bar .top-bar-text.fw-5 {
5125        font-size: 14px !important;
5126        line-height: 1.3 !important;
5127        margin: 0 !important;
5128        padding: 0 5px !important;
5129      }
5130      .tf-top-bar {
5131        min-height: 32px !important;
5132        padding-top: 5px !important;
5133        padding-bottom: 5px !important;
5134      }
5135    }
5136  `),setTimeout(function(){let t=document.querySelector(".tf-sw-top_bar");if(t){if(t.swiper){t.swiper.params.autoplay={delay:2e3,disableOnInteraction:!1},t.swiper.autoplay&&"function"==typeof t.swiper.autoplay.start&&t.swiper.autoplay.start(),"function"==typeof t.swiper.update&&t.swiper.update();return}"undefined"!=typeof Swiper&&new Swiper(".tf-sw-top_bar",{slidesPerView:1,spaceBetween:0,loop:!0,speed:1e3,autoplay:{delay:5e3,disableOnInteraction:!1}})}},1e3)}),document.addEventListener("DOMContentLoaded",function(){let t=document.querySelector(".footer-logo");if(t&&!document.querySelector(".footer-description")){let e=document.createElement("p");e.className="footer-description",e.textContent="نحن نقدم لك تجربة تسوق استثنائية، حيث تكتشف عالمًا من المنتجات الفريدة التي تلبي ذوقك الرفيع. كل قطعة في متجرنا تحمل بصمة شخصية، ونحن نسعى دائمًا لتقديم الأفضل لك.",t.insertAdjacentElement("afterend",e)}injectStyleOnce("footer-description-style",`
5137    .footer-description {
5138      font-size: 17px;
5139      line-height: 1.7;
5140      max-width: 280px;
5141      font-weight: 400;
5142      letter-spacing: 0.2px;
5143      background: var(--third-color);
5144      background-size: 200% auto;
5145      -webkit-background-clip: text;
5146      -webkit-text-fill-color: transparent;
5147      background-clip: text;
5148      animation: gradientShift 8s ease-in-out infinite;
5149      filter: drop-shadow(0 0 8px rgba(237, 211, 151, 0.3));
5150    }
5151    @keyframes gradientShift {
5152      0%, 100% { background-position: 0% center; }
5153      50% { background-position: 100% center; }
5154    }
5155    .footer-logo { margin-bottom: 0; }
5156    .footer-infor .tf-social-icon { margin-top: 0; }
5157
5158    @media (max-width: 991px) and (min-width: 768px) {
5159      .footer-description { font-size: 16px; max-width: 100%; margin-bottom: 20px; }
5160    }
5161    @media (max-width: 767px) {
5162      .footer-description {
5163        font-size: 16px;
5164        line-height: 1.6;
5165        max-width: 100%;
5166        margin-bottom: 20px;
5167        text-align: center;
5168      }
5169      .footer-logo { text-align: center; }
5170      .footer-logo a { display: inline-block; }
5171      .footer-infor .tf-social-icon { justify-content: center; }
5172    }
5173    @media (max-width: 480px) {
5174      .footer-description { font-size: 16px; padding: 0 10px; margin-bottom: 18px; }
5175    }
5176  `)}),document.addEventListener("DOMContentLoaded",function(){injectStyleOnce("footer-policies-mobile-style",`
5177    @media (max-width: 767px) {
5178      .footer-col-block,
5179      .footer-col-block .footer-heading,
5180      .footer-col-block .footer-menu-list,
5181      .footer-col-block .footer-menu-list li,
5182      .footer-col-block .footer-menu_item {
5183        display: block !important;
5184        visibility: visible !important;
5185        opacity: 1 !important;
5186        height: auto !important;
5187        max-height: none !important;
5188      }
5189      .footer-col-block { width: 100% !important; }
5190    }
5191    @media (max-width: 576px) {
5192      .footer-col-block,
5193      .footer-col-block .footer-heading,
5194      .footer-col-block .footer-menu-list,
5195      .footer-col-block .footer-menu-list li,
5196      .footer-col-block .footer-menu_item {
5197        display: block !important;
5198        visibility: visible !important;
5199        opacity: 1 !important;
5200      }
5201    }
5202    .footer-col-block,
5203    .footer-menu-list.tf-collapse-content {
5204      display: block !important;
5205      visibility: visible !important;
5206    }
5207  `)}),(()=>{function t(){injectStyleOnce("footer-headings-final",`
5208      .footer-infor .footer-heading h6 {
5209        color: #ffffff;
5210        font-size: 18px;
5211        font-weight: 600;
5212        margin-bottom: 15px;
5213        letter-spacing: 0.3px;
5214      }
5215      .footer-logo { display: none !important; }
5216      @media (max-width: 767px) {
5217        .footer-infor .footer-heading h6 {
5218          text-align: center;
5219          font-size: 17px;
5220          margin-bottom: 12px;
5221        }
5222      }
5223    `)}function e(){let t=document.querySelectorAll(".footer-menu_item");return!!t.length&&(t.forEach(t=>{let e=t.innerText||"";(e.includes("LAK")||e.includes("لك"))&&!e.includes("Muthri")&&(t.innerText="تم التطوير بواسطة اتش ام | house of hm")}),!0)}function o(){let t=document.querySelector('.footer-infor a[href^="tel:"]');if(!t)return!1;let e=t.closest(".footer-infor");if(!e)return!1;if(!e.querySelector(".footer-heading")){let o=document.createElement("div");o.className="footer-heading";let n=document.createElement("h6");n.textContent="تواصل معنا",o.appendChild(n),e.insertBefore(o,e.firstChild)}return!0}function n(){let t=document.querySelector(".footer-logo");if(!t)return!1;let e=t.closest(".footer-infor");if(!e)return!1;if(!e.querySelector(".about-heading-added")){let o=document.createElement("div");o.className="footer-heading about-heading-added";let n=document.createElement("h6");n.textContent="من نحن",o.appendChild(n),e.insertBefore(o,e.firstChild)}return!0}function i(){t();let i=e(),r=o(),a=n();return i&&!!document.querySelector(".footer-infor .footer-heading")&&!!document.querySelector(".footer-infor .about-heading-added")||i&&(r||a)}function r(){i();let t=document.querySelector("footer#footer");if(!t)return;let e=rafThrottle(()=>{i()&&o.disconnect()}),o=new MutationObserver(e);o.observe(t,{childList:!0,subtree:!0}),setTimeout(()=>
5223o.disconnect(),8e3)}"loading"===document.readyState?document.addEventListener("DOMContentLoaded",r):r()})(),function(){"use strict";let t="#gridLayout",e="tf-col-6",o=!1,n=null;function i(t){if(!t)return;n&&n.disconnect();let o=t.className.split(/\s+/).filter(Boolean).filter(t=>!/^tf-col-\d+$/.test(t));o.includes(e)||o.push(e);let i=o.join(" ");t.className!==i&&(t.className=i),n&&n.observe(t,{attributes:!0,attributeFilter:["class"]})}function r(){o||(o=!0,requestAnimationFrame(()=>{o=!1,i(document.querySelector(t))}))}function a(){let e=document.querySelector(t);return!!e&&(i(e),(n=new MutationObserver(r)).observe(e,{attributes:!0,attributeFilter:["class"]}),!0)}function l(){if(a())return;let t=new MutationObserver(()=>{a()&&t.disconnect()});t.observe(document.documentElement,{childList:!0,subtree:!0})}"loading"===document.readyState?document.addEventListener("DOMContentLoaded",l):l()}(),setTimeout(()=>{document.querySelectorAll(".top-bar-text").forEach(t=>{"ابتكارات جديدة تنتظرك!"===t.textContent.trim()&&t.closest(".swiper-slide")?.remove()})},1e3);
5224</script>
5224
5225
5226
5227
5228
5229
5230<script>
5231	if ("serviceWorker" in navigator) {
5232		window.addEventListener("load", function () {
5233			navigator.serviceWorker.register("/sw.js")
5234				.catch(function (error) {
5235					console.warn("Service worker registration failed:", error);
5236				});
5237		});
5238	}
5239</script>
5239
5240
5241<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"f578a22d67304eba91511bc973f51d74","r":1,"spa":2}' crossorigin="anonymous"></script>
vendor: 1 bytes, line 5241
5241
5242<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a4512bd76fe33bdc',t:'MTc5MTA4NTI5MA=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
5242</body>
5243
5244</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.