:root {
	--apf-focus: #0b57d0;
	--apf-trust-bg: #f5f8fc;
	--apf-trust-border: #1f6f5c;
}

.apf-skip-link {
	position: fixed;
	top: 8px;
	right: 8px;
	z-index: 100000;
	padding: 10px 14px;
	border-radius: 6px;
	background: #111;
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	transform: translateY(-160%);
	transition: transform 120ms ease;
}

.apf-skip-link:focus {
	color: #fff;
	transform: translateY(0);
}

.apf-remove-top-ads .stream-item-below-header,
.apf-remove-top-ads .stream-item-above-post-content {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}

.apf-hide-unfilled-ads ins.adsbygoogle[data-ad-status="unfilled"],
.apf-hide-unfilled-ads .apf-ad-unfilled,
.apf-no-ads ins.adsbygoogle,
.apf-no-ads .stream-item {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}

/* ------------------------------------------------------------------
 * v1.1.0 — الإعلانات داخل نص المقالة
 * ----------------------------------------------------------------*/

.apf-ad {
	display: block;
	clear: both;
	margin: 30px auto;
	padding: 0;
	text-align: center;
	/* حجز المساحة مسبقًا حتى لا يدفع الإعلان المحتوى عند وصوله */
	min-height: 280px;
	contain-intrinsic-size: auto 280px;
}

.apf-ad--end {
	margin-top: 38px;
	margin-bottom: 8px;
}

.apf-ad__label {
	display: block;
	margin-bottom: 6px;
	color: #8a8f98;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	line-height: 1.4;
	text-align: center;
	text-transform: uppercase;
	user-select: none;
}

.apf-ad__unit {
	display: block;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
}

/* الإعلان الأول داخل النص يأتي بعد المقدمة مباشرة، فيحتاج مسافة أقل من الأعلى */
.entry-content > .apf-ad:first-of-type {
	margin-top: 22px;
}

/* لا نترك مساحة محجوزة بعد أن يتأكد أن الوحدة لم تُملأ */
.apf-ad.apf-ad--empty {
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.apf-ad.apf-ad--empty .apf-ad__label {
	display: none;
}

@media (max-width: 767px) {
	.apf-ad {
		margin: 24px auto;
		min-height: 260px;
		contain-intrinsic-size: auto 260px;
	}
}

@media (prefers-color-scheme: dark) {
	.apf-ad__label { color: #767b84; }
}

.dark-skin .apf-ad__label {
	color: #767b84;
}

/* ------------------------------------------------------------------
 * v1.5.0 — فهرس المحتويات · المصادر · اقرأ أيضًا
 * ----------------------------------------------------------------*/

.apf-toc {
	margin: 0 0 26px;
	padding: 14px 18px;
	border: 1px solid #dde2e6;
	border-radius: 8px;
	background: #f7f9fa;
}

.apf-toc summary {
	cursor: pointer;
	font-size: 1.02rem;
	font-weight: 700;
	line-height: 1.7;
	list-style: none;
}

.apf-toc summary::-webkit-details-marker { display: none; }

.apf-toc summary::after {
	content: '⌄';
	display: inline-block;
	margin-inline-start: 8px;
	font-size: 0.9em;
	transition: transform 150ms ease;
}

.apf-toc details[open] > summary::after { transform: rotate(180deg); }

.apf-toc ol {
	margin: 12px 0 0;
	padding-inline-start: 24px;
	counter-reset: apf-toc;
	list-style: none;
}

.apf-toc li {
	position: relative;
	margin: 0 0 7px;
	counter-increment: apf-toc;
	line-height: 1.85;
}

/* القالب يلغي ::marker، فنرسم الترقيم يدويًا */
.apf-toc li::before {
	content: counter(apf-toc) '.';
	position: absolute;
	inset-inline-start: -24px;
	color: #6b7280;
	font-size: 0.9em;
	font-variant-numeric: tabular-nums;
}

.apf-toc a { text-decoration: none; }
.apf-toc a:hover, .apf-toc a:focus-visible { text-decoration: underline; }

/* عناوين المقالة تحتاج مساحة تحت الهيدر الثابت عند القفز إليها */
.entry-content h2[id] { scroll-margin-top: 90px; }

.apf-sources {
	margin: 30px 0 0;
	padding: 16px 18px;
	border: 1px solid #d5e2df;
	border-inline-start: 4px solid #1f6f5c;
	border-radius: 8px;
	background: #f5f8fc;
}

.apf-sources__title { margin: 0 0 10px; font-size: 1.03rem; font-weight: 700; line-height: 1.6; }
.apf-sources ul { margin: 0; padding: 0; list-style: none; }
.apf-sources li { position: relative; margin: 0 0 8px; padding-inline-start: 16px; line-height: 1.8; }

.apf-sources li::before {
	content: '';
	position: absolute;
	inset-inline-start: 2px;
	top: 0.72em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #1f6f5c;
}

.apf-sources__host {
	color: #6b7280;
	font-size: 0.85em;
	direction: ltr;
	unicode-bidi: isolate;
}

.apf-sources__note { margin: 12px 0 0; color: #4b5563; font-size: 0.9rem; line-height: 1.8; }

.apf-related { margin: 34px 0 0; }
.apf-related__title { margin: 0 0 14px; font-size: 1.15rem; font-weight: 700; line-height: 1.6; }

.apf-related ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.apf-related li { margin: 0; }

.apf-related a {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 10px;
	border: 1px solid #e2e5e9;
	border-radius: 8px;
	background: #fff;
	line-height: 1.75;
	text-decoration: none;
}

.apf-related a:hover, .apf-related a:focus-visible { border-color: #1f6f5c; }

.apf-related__thumb { flex: none; }

.apf-related__thumb img {
	display: block;
	width: 72px;
	height: 54px;
	border-radius: 5px;
	object-fit: cover;
}

.apf-related__text { min-width: 0; font-size: 0.95rem; }

.dark-skin .apf-toc { border-color: #33383d; background: #1d2126; }
.dark-skin .apf-sources { border-color: #2c4a43; background: #17211f; }
.dark-skin .apf-sources__note { color: #9aa1a8; }
.dark-skin .apf-related a { border-color: #33383d; background: #1d2126; }

/* ------------------------------------------------------------------
 * v1.3.0 — صفحات التصنيفات المحورية
 * ----------------------------------------------------------------*/

.apf-hub {
	margin: 0 0 28px;
	text-align: start;
}

.apf-hub__intro p {
	margin: 0 0 14px;
	font-size: 1.02rem;
	line-height: 2;
}

.apf-hub__intro p:last-child {
	margin-bottom: 0;
}

.apf-hub__guides,
.apf-hub__tags {
	margin-top: 24px;
	padding: 16px 18px;
	border: 1px solid #e2e5e9;
	border-radius: 8px;
	background: #fafbfc;
}

.apf-hub__title {
	margin: 0 0 12px;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.6;
}

.apf-hub__guides ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 8px 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.apf-hub__guides li {
	position: relative;
	margin: 0;
	padding-inline-start: 16px;
	line-height: 1.8;
}

/* القالب يلغي ::marker، فنرسم النقطة يدويًا */
.apf-hub__guides li::before {
	content: '';
	position: absolute;
	inset-inline-start: 2px;
	top: 0.72em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #1f6f5c;
}

.apf-hub__tags ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.apf-hub__tags li {
	margin: 0;
}

.apf-hub__tags a {
	display: inline-block;
	padding: 5px 12px;
	border: 1px solid #d5dbe0;
	border-radius: 999px;
	background: #fff;
	font-size: 0.88rem;
	line-height: 1.6;
	text-decoration: none;
}

.apf-hub__tags a:hover,
.apf-hub__tags a:focus-visible {
	border-color: #1f6f5c;
}

.dark-skin .apf-hub__guides,
.dark-skin .apf-hub__tags {
	border-color: #33383d;
	background: #1d2126;
}

.dark-skin .apf-hub__tags a {
	border-color: #3a4046;
	background: #23272c;
}

.apf-trust-note {
	margin: 0 0 24px;
	padding: 16px 18px;
	border: 1px solid #d5e2df;
	border-right: 4px solid var(--apf-trust-border);
	border-radius: 8px;
	background: var(--apf-trust-bg);
	color: #17202a;
	font-size: 0.94rem;
	line-height: 1.75;
}

.apf-trust-note > strong {
	display: block;
	margin-bottom: 4px;
	color: #174f42;
}

.apf-trust-note p {
	margin: 5px 0 0;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--apf-focus) !important;
	outline-offset: 3px !important;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}


/* ==========================================================================
   v1.6.0 — تعظيم المساحات الإعلانية
   قياس على 793 صفحة: صفر وحدة داخل نص المقالة، و4 وحدات كلها داخل شريط جانبي
   قيمته display:none على الجوال — أي صفر ظهور فعلي على أغلب الزيارات.
   ========================================================================== */

/* حجز ارتفاع أدنى لكل وحدة لتفادي إزاحة التخطيط (CLS) أثناء تحميل الإعلان. */
.apf-ad--top .apf-ad__unit,
.apf-ad--mid .apf-ad__unit {
	min-height: 280px;
}

.apf-ad--multiplex {
	margin: 32px 0 8px;
}

.apf-ad--multiplex .apf-ad__unit {
	min-height: 320px;
}

/* الإعلانات داخل قوائم المقالات. */
.apf-ad-feed-item {
	list-style: none;
}

.apf-ad-feed-item .apf-ad {
	margin: 0 0 24px;
}

.apf-ad--feed .apf-ad__unit {
	min-height: 250px;
}

/* الإعلان المثبّت أسفل الشاشة — الجوال فقط. */
.apf-anchor {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 1000000;
	background: #fff;
	box-shadow: 0 -2px 12px rgba(0, 0, 0, .16);
	padding: 2px 0 0;
	display: none;
}

.apf-anchor.is-visible {
	display: block;
}

.apf-anchor .apf-ad {
	/* v1.7.7 — لا نرث حجز المساحة (min-height) الخاص بوحدات النص:
	   الشريط المثبّت مقاسه ثابت 320×50، وكان يحجز 262px من أسفل الشاشة. */
	margin: 0;
	min-height: 0;
	padding: 0;
}

.apf-anchor .apf-ad__unit {
	min-height: 50px;
	max-height: 100px;
}

.apf-anchor__close {
	position: absolute;
	top: -26px;
	inset-inline-end: 8px;
	width: 26px;
	height: 26px;
	line-height: 24px;
	border: 1px solid rgba(0, 0, 0, .18);
	border-bottom: 0;
	border-radius: 6px 6px 0 0;
	background: #fff;
	color: #333;
	font-size: 18px;
	cursor: pointer;
	padding: 0;
}

/* حجز مساحة أسفل الصفحة حتى لا يحجب الإعلان المثبّت آخر سطر من المحتوى. */
body.apf-has-anchor {
	padding-bottom: 110px;
}

@media (min-width: 1000px) {
	.apf-anchor { display: none !important; }
	body.apf-has-anchor { padding-bottom: 0; }
}

.dark-skin .apf-anchor,
.dark-skin .apf-anchor__close {
	background: #1f2024;
	color: #e6e6e6;
}

/* ==========================================================================
   v1.6.0 — تباين روابط المتن
   قياس فعلي: لون الرابط rgb(242,193,0) على خلفية بيضاء = 1.69:1 مقابل 4.5:1
   المطلوبة، و text-decoration:none يعني أن الرابط يُعرَّف باللون وحده.
   ========================================================================== */
.entry-content a:not(.apf-ad):not([class*="button"]):not(.apf-toc a) {
	color: #8a6d00;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.entry-content a:not(.apf-ad):not([class*="button"]):hover {
	color: #6b5400;
}

.dark-skin .entry-content a:not(.apf-ad):not([class*="button"]) {
	color: #f2c100;
}

/* ------------------------------------------------------------------
 * v1.6.3 — تايبوغرافي عربي (تم قياسه على 390px كزائر)
 * ------------------------------------------------------------------
 * 1) صندوق الحرف العربي أعرض من اللاتيني بنحو 1.9× حجم الخط، فالمتن
 *    كان يُعرض عند line-height 1.75 والعناوين عند 1.40 — أقل من الحد
 *    المريح للقراءة بالعربية. 77 عنصر متن في مقال واحد.
 * 2) letter-spacing يكسر وصل الحروف العربية؛ كان مطبَّقًا على وسم
 *    «إعلان» فوق الوحدات الإعلانية.
 * ----------------------------------------------------------------*/
html[lang^="ar"] .entry-content p,
html[lang^="ar"] .entry-content li,
html[lang^="ar"] .entry-content td {
	line-height: 1.95;
}

html[lang^="ar"] .entry-content h2,
html[lang^="ar"] .entry-content h3,
html[lang^="ar"] .entry-content h4 {
	line-height: 1.5;
}

html[lang^="ar"] .apf-ad__label,
.apf-ad__label {
	letter-spacing: normal;
}

/* v1.8.0 — شريط المشاركة المثبّت كان يغطّي الإعلان المثبّت.
   قياس حي (2026-09-07، جوال 375×812): .share-buttons-mobile عند z-index 999999
   ويشغل 772–812px، وهو نطاق الإعلان المثبّت نفسه (z-index 9990) ⇒ الإعلان
   محجوب جزئيًا. تغطية وحدة إعلانية تخفض قابلية المشاهدة وتخالف سياسة أدسنس،
   وقد تسبب نقرات غير مقصودة. الحل: رفع طبقة الإعلان، وإزاحة شريط المشاركة
   وزر «إلى الأعلى» فوقه بارتفاع الإعلان الفعلي الذي يضبطه frontend.js. */
body.apf-has-anchor .share-buttons-mobile,
body.apf-has-anchor .go-to-top-button {
	bottom: calc(var(--apf-anchor-h, 82px) + 8px) !important;
}

/* =========================================================================
   apx-2026-09-09 — مخرجات تدقيق السرعة والتجاوب
   ========================================================================= */

/* 1) متن المقال على الجوال.
   قِيس: 20px بارتفاع سطر 1.75 يعطي 5–6 كلمات في السطر على شاشة 390px،
   فيصير المقال 16,547px أي 19.6 شاشة. وزمن «الرسم والتخطيط» هو 222 من
   أصل 472 مللي في قياس INP الميداني، ومصدره طول الشجرة لا بطء السكربتات.
   القاعدة الأصلية تخرج inline من خيارات قالب Jannah بمحدّد
   «#the-post .entry-content, #the-post .entry-content p» (1,0,2) وتُطبع
   بعد هذا الملف في الرأس، فالتفوّق عليها يحتاج body لا ترتيبًا. */
@media (max-width: 767px) {
	body #the-post .entry-content,
	body #the-post .entry-content p,
	body #the-post .entry-content li {
		font-size: 18px;
		line-height: 1.8;
	}
}

/* 2) وحدات الإعلان كانت تُقصّ من الطرفين.
   قِيس على 320px: <ins> عرضه 320 داخل حاوية عرضها 262 (وعلى 360: 302)،
   وscrollWidth 320 مقابل clientWidth 302 ⇒ حواف الإعلان مقطوعة، بلا تمرير.
   نفس نمط full-bleed الذي تستعمله جوجل نفسها في google-auto-placed على
   هذه الصفحة. الهامشان كلاهما مطلوبان تحت RTL وإلا بقيت فجوة ميتة. */
/* تصحيح 2026-09-09: ابن مباشر فقط. الوحدة داخل بطاقة .ap-live-metal
   (صفحة الذهب) كانت تخرج من البطاقة فتُقصّ: sectionSW 303 مقابل
   clientWidth 286. البطاقة يجب أن تحتوي إعلانها. */
@media (max-width: 480px) {
	.entry-content > .apf-ad {
		margin-inline-start: calc(50% - 50vw);
		margin-inline-end: calc(50% - 50vw);
		width: auto;
		max-width: none;
	}
}

/* 3) أيقونات رأس الجوال: قِيست 20px عرضًا × 45 ارتفاعًا.
   الحدّ الأدنى الموصى به 24، والمريح 44. الارتفاع سليم، العرض وحده يُصلَح.
   (روابط .apf-hub__intro بارتفاع 22px تُركت عمدًا: هي روابط داخل جملة
   نصّية، وتوسيع مساحة لمسها يجعل مناطق النقر تتداخل.) */
/* تصحيح 2026-09-09: min-width:44px على ثلاث أيقونات يجعل شريط الرأس
   352px داخل شاشة 320px (قِيس). نبدأ من 360px فأعلى — وهو مقاس كل
   الهواتف الحديثة — ونترك 320px كما كان. */
@media (min-width: 360px) and (max-width: 991px) {
	.mobile-header-components .components > li > a#mobile-menu-icon,
	.mobile-header-components .components > li > a.change-skin,
	.mobile-header-components .components > li > a.tie-search-trigger-mobile {
		min-width: 44px;
		text-align: center;
	}
}

/* apx-toc-marker-fix (2026-09-09)
   فهرس المقالة كان يطبع الرقم مرتين: علامة <ol> الأصلية + عدّاد الإضافة.
   قِيس: ol تحسب list-style-type:none (تضبطها الإضافة) لكن li تحسب
   decimal، فتُرسم العلامة الأصلية بجانب ::before. القاعدة أدناه بمحدّد
   (0,2,3) لتتفوّق على قاعدة القالب .entry-content ol li (0,1,2).
   العدّاد اليدوي هو المطلوب لأنه يوضع inset-inline-start:-24px تحت RTL. */
.entry-content .apf-toc ol > li,
.entry-content .apf-toc ol > li::marker {
	list-style: none;
	list-style-type: none;
}