/**
 * بطاقة المنتج المعتمدة — CSS
 * المواصفة الملزمة: store/homepage-redesign/card-workshop.html (النمط ج — قرار #312).
 * يعمل حصراً داخل .esh-card (منتج مسجّل في data/product-types.json) —
 * البطاقات خارج السجل تحتفظ بعرض Woodmart الافتراضي بلا مساس.
 *
 * الألوان بوظائفها (قاعدة 14):
 *   قرمزي #ED0954 السعر والزر (وهوفر الزر #CE0747 من الورشة) ·
 *   ذهبي #E8B04B حصري لشارة الضمان · برتقالي #FE581F النجوم ·
 *   حبر #1A1A1A · رماديات الورشة #F5F5F5 / #6B6B6B / #E5E5E5.
 */

/* الخط IBM Plex Sans Arabic على كل عنصر في البطاقة (قاعدة 14) */
.esh-card,
.esh-card * {
	font-family: 'IBM Plex Sans Arabic', -apple-system, Tahoma, sans-serif !important;
}

/* الحاوية: بطاقة مستقلة مدوّرة — والتلميحات تفتح للأعلى ولا تُقصّ (overflow:visible) */
.esh-card {
	overflow: visible !important;
}
.esh-card:hover {
	position: relative;
	z-index: 10;
}
.esh-card .wd-product-wrapper {
	overflow: visible;
	border: 1px solid #E5E5E5;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
}

/* منطقة الصورة: خلفية #F5F5F5 وزوايا علوية مدوّرة (التدوير على الصورة لا البطاقة) */
.esh-card .product-element-top {
	position: relative;
	overflow: visible;
	background: transparent;
}
.esh-card a.product-image-link {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 150px;
	background: #F5F5F5;
	border-radius: 16px 16px 0 0;
}
.esh-card .esh-card-img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
.esh-card .esh-card-img img {
	width: 64px;
	height: 64px;
	object-fit: contain;
}

/* شارة «ضمان ذهبي» أعلى يمين الصورة — الذهبي حصري لها */
.esh-card .esh-gbadge {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 5px;
	background: #E8B04B;
	color: #1A1A1A;
	font-size: 11px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 100px;
	pointer-events: none;
}

/* أزرار المقارنة/الكويك فيو/الويشليست تُخفى — تتصادم مع الشارة والتلميحات */
.esh-card .wd-buttons {
	display: none !important;
}

/* جسم البطاقة */
.esh-card .product-element-bottom {
	padding: 18px;
}

/* الوسمان: النوع + التسليم */
.esh-card .esh-tags {
	display: flex;
	gap: 7px;
	margin: 0 0 10px;
	flex-wrap: wrap;
}
.esh-card .esh-tag {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 10.5px;
	font-weight: 600;
	border: 1px solid #E5E5E5;
	padding: 2px 10px;
	border-radius: 100px;
	color: #444;
}
.esh-card .esh-tag-type {
	color: #1A1A1A;
	border-color: #E5E5E5;
	font-weight: 700;
}

/* الاسم */
.esh-card h3.wd-entities-title {
	/* !important لأن خيار طباعة القالب (post-titles-font) يولّد قاعدة أعلى تخصيصاً تفرض 15px */
	font-size: 16px !important;
	font-weight: 600 !important;
	margin: 0 0 6px;
	text-align: start;
}
.esh-card h3.wd-entities-title a {
	color: #1A1A1A !important;
}

/* ليست في المواصفة: التصنيفات · البراند · SKU · السواتشات */
.esh-card .wd-product-cats,
.esh-card .wd-product-brands-links,
.esh-card .wd-product-sku,
.esh-card .wd-swatches-product {
	display: none !important;
}

/* نجوم القالب الافتراضية تُستبدل بنجومنا */
.esh-card .product-element-bottom > .star-rating,
.esh-card .wd-product-wrapper > .star-rating {
	display: none !important;
}
.esh-card .esh-stars {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	margin: 0 0 10px;
	min-height: 19px;
}
.esh-card .esh-star-track {
	position: relative;
	display: inline-block;
	color: #E5E5E5;
	letter-spacing: 2px;
	line-height: 1;
}
.esh-card .esh-star-fill {
	position: absolute;
	top: 0;
	right: 0;
	overflow: hidden;
	white-space: nowrap;
	color: #FE581F;
	letter-spacing: 2px;
}
.esh-card .esh-stars small {
	color: #6B6B6B;
	font-size: 11px;
}

/* صف «يعمل على:» — النمط ج (قرار #312)، والتلميح يفتح للأعلى */
.esh-card .esh-plats {
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0 0 10px;
}
.esh-card .esh-plats-lbl {
	font-size: 11px;
	color: #6B6B6B;
}
.esh-card .esh-plat {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #F5F5F5;
	border: 1px solid #E5E5E5;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #6B6B6B;
	position: relative;
	cursor: default;
	flex: 0 0 26px;
}
.esh-card .esh-plat svg {
	width: 14px;
	height: 14px;
	display: block;
}
.esh-card .esh-plat[data-tip]:hover::after {
	content: attr(data-tip);
	position: absolute;
	bottom: calc(100% + 7px);
	left: 50%;
	transform: translateX(-50%);
	background: #1A1A1A;
	color: #fff;
	font-size: 10.5px;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 7px;
	white-space: nowrap;
	z-index: 30;
}
.esh-card .esh-plat[data-tip]:hover::before {
	content: '';
	position: absolute;
	bottom: calc(100% + 2px);
	left: 50%;
	transform: translateX(-50%);
	border: 5px solid transparent;
	border-top-color: #1A1A1A;
	z-index: 30;
}

/* السعر — قرمزي مع رمز الريال الرسمي (يرثه بـcurrentColor) */
.esh-card .esh-price {
	display: block;
	font-size: 22px;
	font-weight: 700;
	color: #ED0954 !important;
	margin: 0 0 12px;
	line-height: 1.3;
}
.esh-card .esh-price .esh-price-from {
	font-size: 12px;
	font-weight: 600;
	color: #6B6B6B;
}
.esh-card .esh-price .esh-price-unit {
	font-size: 12px;
	font-weight: 400;
	color: #6B6B6B;
}
.esh-sar {
	width: .86em;
	height: .86em;
	fill: currentColor;
	display: inline-block;
	vertical-align: -.06em;
	margin-inline-start: .12em;
}

/* زرّ «اشترِ الآن» — قرمزي بعرض البطاقة، ظاهر دائماً (لا يعتمد على الهوفر) */
.esh-card .wd-add-btn {
	position: static !important;
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	margin: 0;
}
.esh-card .wd-add-btn > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px !important;
	max-height: none;
	background-color: #ED0954 !important;
	color: #fff !important;
	border: 0;
	border-radius: 12px !important; /* القالب يفرض 35px — والورشة 12px */
	padding: 12px 18px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-transform: none !important;
}
.esh-card .wd-add-btn > a:hover {
	background-color: #CE0747 !important;
	color: #fff !important;
}
/* نص الزر: القالب يفرض على السبان الداخلي min-height:36px وحجم 12px — نعيده لمقاس الورشة */
.esh-card .wd-add-btn > a .wd-action-text {
	min-height: 0 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
}
/* تعطيل انزلاق النص/أيقونة السلة عند الهوفر (سلوك wd-add-btn-replace) — يبقى سبينر التحميل */
.esh-card .wd-add-btn-replace > a::before {
	content: none !important;
}
.esh-card .wd-add-btn-replace > a:hover span {
	transform: none !important;
}
.esh-card .wd-add-btn > a .wd-action-icon {
	display: none !important;
}

/* السطر السفلي */
.esh-card .esh-foot {
	font-size: 11px;
	color: #6B6B6B;
	text-align: center;
	margin-top: 10px;
}

/* ═══════════════════════════════════════════════════════════════
   الجوال (< 768px) — إعادة توازن بأمر المالك 2026-08-21:
   «في الجوال التصميم قبيح… يعاد ترتيبه بحيث يكون ناعم متوازن جميل».
   ⛔ الديسكتوب معتمدٌ نصاً ولا يُمسّ — كل ما هنا محصور في هذا النطاق.
   عرض العمود في شبكة الجوال ~160–180px، فالمقاسات مشتقة منه.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {

	/* الصورة: أخفض قليلاً، والأيقونة تبقى سيدة المشهد */
	.esh-card a.product-image-link { height: 118px; }
	.esh-card .esh-card-img img { width: 52px; height: 52px; }

	/* ① الشارة أصغر من الأيقونة لا أكبر منها */
	.esh-card .esh-gbadge {
		top: 8px;
		right: 8px;
		font-size: 8.5px;
		gap: 3px;
		padding: 2px 8px;
	}
	.esh-card .esh-gbadge svg { width: 8px; height: 8px; }

	/* جسم أضيق يتنفّس */
	.esh-card .product-element-bottom { padding: 12px; }

	/* ② الوسمان معاً في سطر واحد — أمر المالك: «اختفى تفعيل على حسابك… أعيدوه».
	   الصيغة المضغوطة التي اعتمدها: صغيران بلا أيقونات — أطول زوج (اشتراك +
	   تفعيل على حسابك) ≈ 114px والعمود 121px، فالسطر الواحد مضمون حساباً */
	.esh-card .esh-tags {
		flex-wrap: nowrap;
		gap: 4px;
		margin: 0 0 8px;
		overflow: hidden;
	}
	.esh-card .esh-tag { font-size: 8px; gap: 0; padding: 2px 6px; white-space: nowrap; }
	.esh-card .esh-tag svg { display: none; }

	/* الاسم: سطران محجوزان دائماً — فالعنوان الطويل لا يجعل بطاقته أطول من أخواتها */
	.esh-card h3.wd-entities-title {
		font-size: 13.5px !important;
		line-height: 1.45 !important;
		margin: 0 0 5px;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		min-height: 39px; /* 13.5 × 1.45 × سطران */
	}

	/* ⚖️ وزن الكتل: البطاقة عمود مرن يدفع الزر والتذييل للقاع —
	   فتتساوى بطاقات الصفّ الواحد مهما اختلفت أطوال محتواها */
	/* 🚨 حارس الصفحة المفردة (حادث 2026-08-21): غلافها يحمل esh-card أيضاً،
	   وflex بلا اتجاه شطرها عمودين على الجوال — فالقاعدة على عنصر الشبكة حصراً */
	.esh-card.product-grid-item { display: flex; }
	.esh-card.product-grid-item .wd-product-wrapper { display: flex; flex-direction: column; width: 100%; }
	.esh-card.product-grid-item .product-element-bottom { display: flex; flex-direction: column; flex: 1 1 auto; }
	.esh-card.product-grid-item .wd-add-btn { margin-top: auto; }
	.esh-card .esh-foot {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		line-height: 1.7;
		min-height: 31px; /* سطران محجوزان */
	}
	/* والسعر قبل الزر يحتاج فاصلاً ثابتاً حين يعلو الزر */
	.esh-card .esh-price { margin: 0 0 10px; }

	/* ③ التقييم: النجوم والرقم في سطر واحد دائماً */
	.esh-card .esh-stars {
		flex-wrap: nowrap;
		white-space: nowrap;
		gap: 4px;
		margin: 0 0 8px;
		min-height: 15px;
		font-size: 11px;
	}
	.esh-card .esh-star-track,
	.esh-card .esh-star-fill { letter-spacing: 0; font-size: 10px; }
	.esh-card .esh-stars { gap: 3px; }
	.esh-card .esh-stars small {
		font-size: 8px;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.esh-card .esh-stars { overflow: hidden; }

	/* ④ «يعمل على:» والأيقونات في سطر واحد */
	.esh-card .esh-plats {
		flex-wrap: nowrap;
		gap: 4px;
		margin: 0 0 8px;
		overflow: hidden;
	}
	.esh-card .esh-plats-lbl {
		font-size: 9px;
		white-space: nowrap;
		flex: 0 0 auto;
	}
	.esh-card .esh-plat { width: 18px; height: 18px; flex: 0 0 18px; }
	.esh-card .esh-plat svg { width: 10px; height: 10px; }
	.esh-card .esh-plats { gap: 3px; }

	/* السعر والزر والتذييل بمقاس الكفّ */
	.esh-card .esh-price { font-size: 17px; margin: 0 0 9px; }
	.esh-card .esh-price .esh-price-from,
	.esh-card .esh-price .esh-price-unit { font-size: 10px; }
	.esh-card .wd-add-btn > a {
		min-height: 37px !important;
		padding: 9px 12px !important;
		font-size: 12.5px !important;
		border-radius: 10px !important;
	}
	.esh-card .wd-add-btn > a .wd-action-text { font-size: 12.5px !important; }
	.esh-card .esh-foot { font-size: 9px; margin-top: 8px; }

	/* شاشات أندرويد الضيقة (≤390px): قياس المدقّق كشف قصّ الأيقونة الرابعة عند 360 */
	@media (max-width: 389.98px) {
		.esh-card .esh-tag { padding: 2px 5px; }
		.esh-card .esh-tags { gap: 3px; }
		.esh-card .esh-plat { width: 16px; height: 16px; flex: 0 0 16px; }
		.esh-card .esh-plat svg { width: 9px; height: 9px; }
		.esh-card .esh-plats { gap: 2px; }
		.esh-card .esh-plats-lbl { font-size: 8.5px; }
	}

	/* أضيق من آيفون القياسي (<375px): السعر بسطر واحد كي لا يعلو صفٌّ عن جيرانه */
	@media (max-width: 374.98px) {
		.esh-card .esh-price { font-size: 15px; }
		.esh-card .esh-price .esh-price-from,
		.esh-card .esh-price .esh-price-unit { font-size: 9px; }
	}
}


/* ═══ إصلاحات موقع-عامة — جرد آيفون 16 (2026-08-21) ═══ */

/* ① واتساب العائم (68px) كان يغطي زرّ الشراء بتقاطع 87.6٪ — يصغُر ويبتعد عن منطقة الشراء */
@media (max-width: 767.98px) {
	#ht-ctc-chat { bottom: 14px !important; left: 10px !important; right: auto !important; width: fit-content !important; }
	#ht-ctc-chat img, #ht-ctc-chat svg { width: 46px !important; height: 46px !important; }

	/* ⑨ زرّ الصعود كان خارج الشاشة 28px يساراً */
	a.scrollToTop { left: 12px !important; right: auto !important; }
}

/* ⑩ لا أسعار مشطوبة في القوائم والدرج الجانبي — «السعر النهائي فقط» (قاعدة 14) */
.widget del, .wd-sidebar del, .widget .price del { display: none !important; }

/* ═══════════════════════════════════════════════════════════════
   إصلاح الجوال بعد قياس 393px (2026-08-22) — أمر المالك «أصلح كل النقاط».
   🪤 القياس صحّح تقديراً سابقاً: عرض البطاقة **177px** لا 121، فالمقاسات
   المزدحمة (8px) كانت مبنيّة على عمودٍ أضيق من الواقع — ولا مبرّر لها.
   قاعدة 24: الحدّ الأدنى 10px · لا معلومة خلف التحويم · هدف لمس 44px.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {

	/* ① خطوط فوق أرضية العشرة */
	.esh-card .esh-tag        { font-size: 10.5px; padding: 3px 8px; }
	.esh-card .esh-tags       { flex-wrap: wrap; gap: 5px; overflow: visible; }
	.esh-card .esh-stars small{ font-size: 10.5px; }
	.esh-card .esh-gbadge     { font-size: 10.5px; padding: 3px 9px; }
	.esh-card .esh-gbadge svg { width: 10px; height: 10px; }
	.esh-card .esh-plats-lbl  { font-size: 10.5px; }
	.esh-card .esh-foot       { font-size: 10.5px; }
	.esh-card .esh-price-from { font-size: 10.5px; }

	/* ② اللون من اللوحة: #444444 لم يكن فيها، و#6B6B6B وظيفته النصّ الثانوي (§05) */
	.esh-card .esh-tag { color: #6B6B6B; }

	/* ③ اسم النظام مرئي دائماً — التحويم ميّت على اللمس، والتلميح المعلّق يُبطَل */
	.esh-card .esh-plats { flex-wrap: wrap; overflow: visible; gap: 5px; }
	.esh-card .esh-plat {
		width: auto; height: auto; flex: 0 0 auto;
		border-radius: 999px; padding: 3px 8px 3px 6px; gap: 4px;
		display: inline-flex; align-items: center; }
	.esh-card .esh-plat svg { width: 11px; height: 11px; }
	.esh-card .esh-plat[data-tip]::after {
		content: attr(data-tip); position: static; opacity: 1; visibility: visible;
		transform: none; background: none; box-shadow: none; padding: 0;
		font-size: 10px; font-weight: 600; color: inherit; white-space: nowrap; }
	.esh-card .esh-plat[data-tip]::before { display: none; }
	.esh-card .esh-plat[data-tip]:hover::after { content: attr(data-tip); }

	/* ④ هدف اللمس 44 (كان 43 — ناقصاً بكسلاً واحداً) */
	.esh-card a.button, .esh-card .add_to_cart_button {
		min-height: 44px; display: flex; align-items: center; justify-content: center; }
}
/* ⑤ الزرّ بقي 43px — قاعدة الثيم أقوى تخصيصاً؛ نحسمها بمُحدِّد أعلى (هدف اللمس 44) */
@media (max-width: 767.98px) {
	.esh-card .product-element-bottom a.button,
	.esh-card .product-element-bottom .add_to_cart_button,
	.esh-card a.button.add_to_cart_button { min-height: 44px !important; }
}
/* ⑥ «/ سنوياً» و«مدى الحياة» كانت 9px — وحدة السعر معلومة شرائية لا زخرفة (الحدّ 10) */
@media (max-width: 767.98px) { .esh-card .esh-price-unit { font-size: 10.5px; } }
