/* =========================================================
   Levant Site Tweaks
   ========================================================= */

/* ---------------------------------------------------------
   1) فلتر تصنيفات المنيو (Woo Grid filters) — سطر واحد على كل الأجهزة
      - ديسكتوب: الكل يظهر بسطر واحد ومتوسّط
      - موبايل/تابلت: سطر واحد قابل للسحب أفقياً (بدون شريط تمرير)
   --------------------------------------------------------- */
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters-parent {
	text-align: center;
}

.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters-parent .tmpcoder-grid-filters {
	display: flex !important;
	flex-wrap: nowrap;
	align-items: center;
	gap: 4px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 8px !important;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	scrollbar-width: none;      /* Firefox */
	-ms-overflow-style: none;   /* IE/Edge القديم */
}
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters::-webkit-scrollbar {
	display: none;              /* Chrome / Safari */
}

/* توسيط العناصر لما تكون أقصر من الحاوية، وبدون قص لما تكون أطول */
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li:first-child { margin-left: auto !important; }
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li:last-child  { margin-right: auto !important; }

.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li {
	flex: 0 0 auto;
	margin: 0;
	white-space: nowrap;
}
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > span,
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > a {
	display: inline-block;
	white-space: nowrap;
	line-height: 1.2;
}

/* الفواصل بين العناصر مو لازمة مع الشكل الحبّي (pill) */
.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters .tmpcoder-grid-filters-sep {
	display: none;
}

/* ديسكتوب: تصغير بسيط للحشو والخط حتى تدخل الـ 12 تصنيف بسطر واحد داخل 1200px */
@media (min-width: 1025px) {
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li {
		font-size: 13px !important;
		letter-spacing: 0.3px !important;
	}
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > span,
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > a {
		padding: 12px 12px !important;
	}
}
@media (min-width: 1300px) {
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li {
		letter-spacing: 0.5px !important;
	}
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > span,
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > a {
		padding: 13px 20px !important;
	}
}

/* موبايل: حشو أصغر شوي حتى يبيّن أكثر من تصنيف بالشاشة */
@media (max-width: 767px) {
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li {
		font-size: 13px !important;
	}
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > span,
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters > li > a {
		padding: 11px 16px !important;
	}
	.elementor-widget-tmpcoder-woo-grid .tmpcoder-grid-filters-parent .tmpcoder-grid-filters {
		padding: 6px !important;
	}
}

/* ---------------------------------------------------------
   2) زر "الرجوع للأعلى" كان يقع فوق أيقونة واتساب (Joinchat)
      نرفعه فوق الأيقونة ونحاذي مركزيهما، ونخفيه عند فتح نافذة الدردشة
      قياسات Joinchat: زر 60px، هامش 14px موبايل / 28px ديسكتوب
   --------------------------------------------------------- */
.tmpcoder-scroll-btn-align-fixed-right .tmpcoder-scroll-btn,
.tmpcoder-scroll-btn {
	right: 23px !important;   /* مركز واتساب = 14 + 30 = 44px ← 44 - 21 */
	bottom: 88px !important;  /* 14 + 60 + 14 فراغ */
}
@media (min-width: 768px) {
	.tmpcoder-scroll-btn-align-fixed-right .tmpcoder-scroll-btn,
	.tmpcoder-scroll-btn {
		right: 37px !important;  /* مركز واتساب = 28 + 30 = 58px ← 58 - 21 */
		bottom: 102px !important; /* 28 + 60 + 14 فراغ */
	}
}
/* لما تنفتح نافذة الدردشة، الزر يختفي حتى ما يغطي المحادثة */
body:has(.joinchat--chatbox) .tmpcoder-scroll-btn {
	opacity: 0 !important;
	pointer-events: none !important;
}

/* ---------------------------------------------------------
   3) أيقونة واتساب (Joinchat) كانت بدون z-index فتنحشر تحت
      أقسام الصفحة (الفوتر مثلاً). نرفعها فوق كل المحتوى.
   --------------------------------------------------------- */
.joinchat {
	z-index: 9998 !important;
}
