/* =========================================================
   Sabiq Theme — Main Stylesheet
   ========================================================= */

/* القالب مخصص حصريًا للمواقع العربية، لذا الاتجاه من اليمين لليسار
   مفروض دائمًا هنا (بدلاً من الاعتماد فقط على إعداد لغة ووردبريس) حتى
   تتطابق كل العناصر (الفوتر، الشريط الجانبي، الودجات) في نفس الاتجاه. */
html, body {
	direction: rtl;
	text-align: right;
}

:root {
	--sabiq-accent: #e02020;
	--sabiq-dark: #14161a;
	--sabiq-text: #1f2226;
	--sabiq-muted: #6b7280;
	--sabiq-bg: #f7f7f8;
	--sabiq-border: #e7e7ea;
	--sabiq-white: #ffffff;
	--font-body: 'Tajawal', 'Cairo', Tahoma, Arial, sans-serif;
	--font-heading: 'Cairo', 'Tajawal', Tahoma, Arial, sans-serif;
}

html {
	scroll-behavior: smooth;
}

* { box-sizing: border-box; }

body {
	font-family: var(--font-body);
	color: var(--sabiq-text);
	background: var(--sabiq-bg);
	margin: 0;
	line-height: 1.75;
	overflow-x: hidden;
	max-width: 100vw;
	font-size: 17px;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--sabiq-accent); }

img { max-width: 100%; height: auto; display: block; }

/* نص مخصص لقارئات الشاشة فقط - مخفي بصريًا بالكامل عن الشاشة العادية */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

h1, h2, h3, h4, h5 { font-family: var(--font-heading); font-weight: 800; line-height: 1.35; margin: 0 0 .5em; }

.container { max-width: 1400px; margin: 0 auto; padding: 0 14px; }
@media (max-width: 900px) {
	.container { padding: 0 12px; }
}
@media (max-width: 480px) {
	.container { padding: 0 10px; }
}

/* ---------- شريط الأخبار العاجلة ---------- */
.sabiq-breaking-news {
	background: var(--sabiq-dark);
	color: #fff;
	overflow: hidden;
}
.breaking-news-inner { display: flex; align-items: center; gap: 16px; padding: 10px 20px; }
.breaking-label {
	background: var(--sabiq-accent);
	color: #fff;
	font-weight: 800;
	padding: 4px 14px;
	border-radius: 4px;
	font-size: 13px;
	flex-shrink: 0;
}
.breaking-news-track-wrapper {
	overflow: hidden;
	flex: 1;
	-webkit-mask-image: linear-gradient(to left, transparent, #000 24px, #000 calc(100% - 24px), transparent);
	mask-image: linear-gradient(to left, transparent, #000 24px, #000 calc(100% - 24px), transparent);
}
.breaking-news-list {
	list-style: none;
	display: flex;
	gap: 40px;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	width: max-content;
	animation: sabiq-ticker 32s linear infinite;
}
.sabiq-breaking-news:hover .breaking-news-list {
	animation-play-state: paused;
}
@keyframes sabiq-ticker {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.breaking-news-list { animation: none; overflow-x: auto; }
}
.breaking-news-list li { white-space: nowrap; font-size: 14px; }
.breaking-news-list a { color: #e9e9ec; }
.breaking-news-list a:hover { color: #fff; text-decoration: underline; }

/* ---------- الهيدر ---------- */
.site-header { background: var(--sabiq-white); border-bottom: 3px solid var(--sabiq-dark); position: relative; z-index: 50; }
.header-inner { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; gap: 24px; flex-wrap: wrap; }

.site-title-link { display: flex; flex-direction: column; }
.site-title-mark { font-family: var(--font-heading); font-size: 32px; font-weight: 900; color: var(--sabiq-dark); }
.site-title-mark::after { content: ''; display: inline-block; width: 10px; height: 10px; background: var(--sabiq-accent); border-radius: 50%; margin-inline-start: 6px; }
.site-description { font-size: 12px; color: var(--sabiq-muted); }

.main-navigation ul { list-style: none; display: flex; gap: 26px; margin: 0; padding: 0; flex-wrap: wrap; }
.main-navigation a { font-weight: 700; font-size: 15px; padding: 6px 0; display: inline-block; position: relative; }
.main-navigation a::after {
	content: ''; position: absolute; bottom: 0; right: 0; left: auto; width: 0; height: 2px;
	background: var(--sabiq-accent); transition: width .2s ease;
}
.main-navigation a:hover::after { width: 100%; }
.main-navigation ul ul {
	display: none; position: absolute; background: #fff; flex-direction: column; min-width: 200px;
	box-shadow: 0 12px 24px rgba(0,0,0,.12); padding: 8px 0; border-radius: 6px; margin-top: 10px; z-index: 60;
}
.main-navigation li { position: relative; }
.main-navigation li:hover > ul { display: flex; }
.main-navigation ul ul li a { padding: 8px 18px; display: block; }

.menu-toggle { display: none; background: none; border: 0; cursor: pointer; flex-direction: column; gap: 5px; }
.menu-toggle span { width: 24px; height: 2px; background: var(--sabiq-dark); display: block; }

.header-search { position: relative; }
.search-toggle { background: var(--sabiq-dark); border: 0; color: #fff; width: 38px; height: 38px; border-radius: 50%; cursor: pointer; }
.icon-search::before { content: '\1F50D'; font-size: 14px; }
.header-search-box { display: none; position: absolute; left: 0; top: 46px; background: #fff; box-shadow: 0 12px 24px rgba(0,0,0,.15); border-radius: 8px; padding: 10px; z-index: 60; width: 260px; }
.header-search-box.active { display: block; }

/* ---------- التخطيط ---------- */
.content-layout { display: grid; grid-template-columns: 2.4fr 1fr; gap: 30px; padding: 30px 0 60px; max-width: 1400px; margin: 0 auto; padding-inline: 14px; }
@media (max-width: 900px) {
	.content-layout { grid-template-columns: 1fr; padding-inline: 12px; gap: 22px; }
}
@media (max-width: 480px) {
	.content-layout { padding-inline: 10px; padding-block: 20px 40px; }
}

.posts-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
@media (max-width: 640px) { .posts-grid { grid-template-columns: 1fr; } }

/* ---------- بطاقة المقال ---------- */
.sabiq-card { background: var(--sabiq-white); border-radius: 10px; overflow: hidden; border: 1px solid var(--sabiq-border); transition: transform .15s ease, box-shadow .15s ease; }
.sabiq-card:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(20,22,26,.08); }
.card-thumb { position: relative; display: block; aspect-ratio: 16/10; overflow: hidden; }
.card-thumb img { width: 100%; height: 100%; object-fit: cover; }
.card-cat { position: absolute; bottom: 10px; inset-inline-start: 10px; background: var(--sabiq-accent); color: #fff; font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 4px; }
.card-body { padding: 16px 18px 20px; }
.card-title { font-size: 19px; margin-bottom: 8px; }
.card-title a:hover { color: var(--sabiq-accent); }
.card-excerpt { font-size: 15px; line-height: 1.6; color: var(--sabiq-muted); margin: 0 0 12px; }
.card-meta { font-size: 13px; color: var(--sabiq-muted); display: flex; gap: 10px; flex-wrap: wrap; }
.card-meta a { color: var(--sabiq-muted); }
.card-meta a:hover { color: var(--sabiq-accent); }

/* ---------- المقال المفرد ---------- */
.single-post-content,
.single-page-content {
	background: var(--sabiq-white);
	border: 1px solid var(--sabiq-border);
	border-radius: 14px;
	padding: 32px 36px;
	box-shadow: 0 2px 10px rgba(20, 22, 26, .04);
	max-width: 100%;
	overflow-wrap: break-word;
	word-wrap: break-word;
}
@media (max-width: 640px) {
	.single-post-content,
	.single-page-content {
		padding: 18px 16px;
		border-radius: 10px;
	}
}
@media (max-width: 380px) {
	.single-post-content,
	.single-page-content {
		padding: 14px 12px;
		border-radius: 8px;
	}
}
/* منع أي عنصر جوه المقال (صورة، جدول، كود) من عمل تمدد أفقي للصفحة */
.entry-content img,
.entry-content table,
.entry-content pre,
.entry-content iframe {
	max-width: 100%;
}
.entry-content table {
	display: block;
	overflow-x: auto;
	white-space: nowrap;
}
.entry-cat { display: inline-block; background: var(--sabiq-accent); color: #fff; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 4px; margin-bottom: 14px; }

/* شريط التنقل (Breadcrumbs) */
.sabiq-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--sabiq-muted);
	margin-bottom: 16px;
}
.sabiq-breadcrumbs a { color: var(--sabiq-muted); }
.sabiq-breadcrumbs a:hover { color: var(--sabiq-accent); }
.sabiq-breadcrumbs .sep { opacity: .5; }
.sabiq-breadcrumbs .current { color: var(--sabiq-text); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }

/* جدول المحتويات التلقائي */
.sabiq-toc {
	background: var(--sabiq-bg);
	border: 1px solid var(--sabiq-border);
	border-radius: 10px;
	padding: 18px 22px;
	margin: 20px 0 28px;
}
.sabiq-toc-title {
	font-weight: 800;
	font-size: 15px;
	margin: 0 0 10px;
	color: var(--sabiq-text);
	display: flex;
	align-items: center;
	gap: 8px;
}
.sabiq-toc-title::before {
	content: '';
	width: 4px;
	height: 16px;
	background: var(--sabiq-accent);
	border-radius: 2px;
	display: inline-block;
}
.sabiq-toc ol {
	margin: 0;
	padding-inline-start: 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.sabiq-toc li { font-size: 14px; }
.sabiq-toc li.toc-level-3 { margin-inline-start: 18px; font-size: 13px; opacity: .9; }
.sabiq-toc a { color: var(--sabiq-text); }
.sabiq-toc a:hover { color: var(--sabiq-accent); text-decoration: underline; }
.entry-title { font-size: 36px; margin-bottom: 14px; }
.entry-meta { font-size: 14px; color: var(--sabiq-muted); display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--sabiq-border); }
.entry-meta a { color: var(--sabiq-muted); font-weight: 700; }
.entry-thumbnail { margin-bottom: 26px; border-radius: 10px; overflow: hidden; }
.entry-thumbnail figcaption { font-size: 14px; color: var(--sabiq-muted); padding: 8px 4px; }
.entry-content { font-size: 18px; }
.entry-content p { margin: 0 0 1.3em; }
.entry-content img { border-radius: 8px; margin: 1.2em 0; max-width: 100%; height: auto; }
.entry-content video { max-width: 100%; height: auto; border-radius: 8px; }

/* حاوية فيديو متجاوبة تلقائيًا (نسبة العرض للارتفاع تُحدَّد ديناميكيًا
   عبر padding-top مضمّن حسب أبعاد كل فيديو فعليًا من PHP) */
.sabiq-video-wrapper {
	position: relative;
	width: 100%;
	margin: 1.5em 0;
	border-radius: 8px;
	overflow: hidden;
	background: #000;
}
/* الفيديوهات الرأسية (يوتيوب شورتس / ريلز فيسبوك وإنستجرام) تُعرض
   بعرض محدود وتتوسّط الصفحة بدل ما تتمدد بعرض العمود بالكامل */
.sabiq-video-wrapper.is-portrait {
	max-width: 380px;
	margin-inline: auto;
}
/*
 * تصغير تدريجي لعرض الفيديو الرأسي (شورتس/ريلز) كل ما اتسعت الشاشة.
 * ارتفاع الفيديو محسوب كنسبة مئوية من عرضه (padding-top)، فتصغير
 * العرض هنا يصغّر الارتفاع تلقائيًا بنفس النسبة. من غير الميديا كويريز
 * دي، كان العرض بيفضل ثابت 380px حتى على شاشة كمبيوتر عريضة، فيظهر
 * الفيديو كشريط طويل جدًا وضيّق وسط عمود المقال العريض. على الجوال
 * عرض العمود أصلاً أضيق من 380px فمكانش بيتأثر، وده سبب إن المشكلة
 * كانت ظاهرة على الكمبيوتر بس.
 */
@media (min-width: 600px) {
	.sabiq-video-wrapper.is-portrait { max-width: 300px; }
}
@media (min-width: 1024px) {
	.sabiq-video-wrapper.is-portrait { max-width: 260px; }
}
.sabiq-video-wrapper iframe,
.sabiq-video-wrapper embed,
.sabiq-video-wrapper object {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* حماية إضافية: بلوك التضمين (Embed) في ووردبريس بيحط نسبة العرض
   للارتفاع الخاصة به (padding-top) على العنصر .wp-block-embed__wrapper
   نفسه — مش على الحاوية الخارجية (figure) فقط. وبما إن حاويتنا الخاصة
   (.sabiq-video-wrapper) بتحسب نفس النسبة تاني بشكل مستقل بالفعل،
   بيحصل احتساب مزدوج للـpadding-top يظهر كفراغ كبير فوق المشغل —
   سواء داخل محرر ووردبريس أو في المتصفح (خصوصًا فايرفوكس). الحل:
   إلغاء الـpadding-top/height بتاعة الغلاف الأصلي كليًا فور وجود
   حاويتنا بداخله، وترك حساب النسبة الفعلي لحاويتنا فقط. */
.wp-block-embed__wrapper:has(.sabiq-video-wrapper),
.wp-has-aspect-ratio:has(.sabiq-video-wrapper),
.wp-embed-aspect-21-9:has(.sabiq-video-wrapper),
.wp-embed-aspect-18-9:has(.sabiq-video-wrapper),
.wp-embed-aspect-16-9:has(.sabiq-video-wrapper),
.wp-embed-aspect-4-3:has(.sabiq-video-wrapper),
.wp-embed-aspect-1-1:has(.sabiq-video-wrapper),
.wp-embed-aspect-9-16:has(.sabiq-video-wrapper) {
	padding-top: 0 !important;
	height: auto !important;
}

/* ================================================================
   حماية شاملة على مستوى الموقع بالكامل: أي iframe فيديو يوتيوب/فيميو
   يظهر في أي صفحة - مقال، إعلان، ودجت، أو من أي إضافة خارجية -
   يصبح متجاوبًا تلقائيًا حتى لو لم يمر على فلاتر القالب البرمجية.
   لا نفرض هنا نسبة عرض/ارتفاع ثابتة لأن ده بيكسر الفيديوهات الرأسية؛
   الضبط الدقيق للنسبة بيتم بالجافاسكريبت (main.js) حسب أبعاد كل فيديو.
   ================================================================ */
iframe {
	max-width: 100%;
}
iframe[src*="youtube"],
iframe[src*="youtube-nocookie"],
iframe[src*="player.vimeo"],
iframe[src*="dailymotion"] {
	display: block;
}
.entry-content blockquote { border-inline-start: 4px solid var(--sabiq-accent); margin: 1.5em 0; padding: .6em 1.4em; background: #fafafa; font-style: italic; }
.entry-content h2 { font-size: 26px; margin: 1.4em 0 .6em; scroll-margin-top: 24px; }
.entry-content h3 { font-size: 21px; margin: 1.2em 0 .5em; scroll-margin-top: 24px; }

/* تذييل المقال: فاصل واضح ثم وسوم بشكل بطاقات جذابة */
.entry-footer {
	margin-top: 44px;
	padding-top: 26px;
	border-top: 1px solid var(--sabiq-border);
}
.entry-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}
.entry-tags-label {
	font-weight: 800;
	color: var(--sabiq-text);
	font-size: 14px;
	margin-inline-end: 4px;
}
.tag-pill {
	display: inline-flex;
	align-items: center;
	background: var(--sabiq-bg);
	border: 1px solid var(--sabiq-border);
	color: var(--sabiq-text);
	padding: 7px 18px;
	border-radius: 30px;
	font-size: 13px;
	font-weight: 700;
	transition: all .2s ease;
}
.tag-pill:hover {
	background: var(--sabiq-accent);
	border-color: var(--sabiq-accent);
	color: #fff;
	transform: translateY(-3px);
	box-shadow: 0 8px 16px rgba(224, 32, 32, .28);
}

/* أزرار المشاركة السريعة */
.sabiq-share-buttons {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 18px;
}
.share-label {
	font-weight: 800;
	font-size: 14px;
	color: var(--sabiq-text);
	margin-inline-end: 4px;
}
.share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	color: #fff;
	transition: all .2s ease;
}
.share-btn:hover { transform: translateY(-3px) scale(1.05); color: #fff; }
.share-x { background: #000; }
.share-x:hover { box-shadow: 0 8px 16px rgba(0,0,0,.3); }
.share-facebook { background: #1877f2; }
.share-facebook:hover { box-shadow: 0 8px 16px rgba(24,119,242,.35); }
.share-whatsapp { background: #25d366; }
.share-whatsapp:hover { box-shadow: 0 8px 16px rgba(37,211,102,.35); }

/* صندوق الكاتب (Author Box) */
.sabiq-author-box {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	background: var(--sabiq-bg);
	border: 1px solid var(--sabiq-border);
	border-radius: 14px;
	padding: 22px;
	margin-top: 28px;
}
.author-avatar img {
	border-radius: 50%;
	width: 72px;
	height: 72px;
	object-fit: cover;
	border: 3px solid var(--sabiq-white);
	box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.author-label {
	display: block;
	font-size: 12px;
	color: var(--sabiq-muted);
	font-weight: 700;
	margin-bottom: 2px;
}
.author-name {
	font-size: 18px;
	margin: 0 0 8px;
}
.author-bio {
	font-size: 14px;
	color: var(--sabiq-muted);
	line-height: 1.7;
	margin: 0 0 12px;
}
.author-social {
	display: flex;
	gap: 8px;
}
.author-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--sabiq-white);
	border: 1px solid var(--sabiq-border);
	color: var(--sabiq-text);
	transition: all .2s ease;
}
.author-social a:hover {
	background: var(--sabiq-accent);
	border-color: var(--sabiq-accent);
	color: #fff;
	transform: translateY(-2px);
}
@media (max-width: 480px) {
	.sabiq-author-box { flex-direction: column; align-items: center; text-align: center; }
	.author-social { justify-content: center; }
}

/* مقالات ذات صلة */
.sabiq-related-posts {
	margin-top: 32px;
	background: var(--sabiq-white);
	border: 1px solid var(--sabiq-border);
	border-radius: 14px;
	padding: 28px 32px;
}
.related-posts-title {
	font-size: 22px;
	margin: 0 0 20px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.related-posts-title::before {
	content: '';
	width: 4px;
	height: 20px;
	background: var(--sabiq-accent);
	border-radius: 2px;
	display: inline-block;
}
.related-posts-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (max-width: 480px) {
	.sabiq-related-posts { padding: 18px 16px; }
	.related-posts-grid { grid-template-columns: 1fr; }
}

/* ---------- الشريط الجانبي ---------- */
.widget-area .widget { background: #fff; border: 1px solid var(--sabiq-border); border-radius: 10px; padding: 22px 24px; margin-bottom: 26px; }
.widget-title {
	font-size: 16px;
	display: block;
	text-align: center;
	position: relative;
	padding-bottom: 14px;
	margin: 0 0 16px;
}
.widget-title::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 44px;
	height: 3px;
	border-radius: 3px;
	background: var(--sabiq-accent);
}

/* قوائم الودجات (تصنيفات، أرشيف، صفحات، أحدث المقالات...) — قائمة عادية أنيقة بدون أزرار */
.widget-area .widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.widget-area .widget ul ul { padding-inline-start: 16px; margin-top: 8px; }
.widget-area .widget li {
	border-bottom: 1px solid var(--sabiq-border);
}
.widget-area .widget li:last-child { border-bottom: 0; }
.widget-area .widget li a {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	padding: 11px 2px;
	color: var(--sabiq-text);
	font-size: 14.5px;
	font-weight: 600;
	transition: color .2s ease, padding-inline-start .2s ease;
}
.widget-area .widget li a::before {
	content: '\2039';
	color: var(--sabiq-accent);
	font-weight: 900;
	font-size: 18px;
	line-height: 1;
	flex-shrink: 0;
}
.widget-area .widget li a:hover {
	color: var(--sabiq-accent);
	padding-inline-start: 6px;
}
.widget-area .widget .children,
.widget-area .widget .sub-menu { padding-inline-start: 18px; }

/* عداد التصنيفات/الأرشيف داخل الودجت (يظهر تلقائيًا مع خيار "أظهر عدد المقالات") */
.widget-area .widget li a { position: relative; }

/* سحابة الوسوم كنص عادي بدون خلفيات/أزرار */
.widget-area .tagcloud { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.widget-area .tagcloud a {
	font-size: 13.5px !important;
	color: var(--sabiq-muted);
	border-bottom: 1px dashed var(--sabiq-border);
	font-weight: 600;
}
.widget-area .tagcloud a:hover { color: var(--sabiq-accent); border-color: var(--sabiq-accent); }

/* ==========================================================
   الفوتر — تصميم احترافي جديد: أعمدة بفواصل رأسية وعناوين بشريط جانبي
   ========================================================== */
.site-footer {
	background: #101218;
	color: #9799a3;
	margin-top: 70px;
}

/*
 * شبكة مرنة تلقائيًا: عدد الأعمدة (البراند + التصنيفات + الوسوم +
 * عمودان حرّان اختياريان) يتغيّر حسب ما فعّله المستخدم من الودجات،
 * فلا داعي لحساب العدد يدويًا. auto-fit يوزّع الأعمدة المتاحة على
 * العرض الحالي، وأي عمود غير مُفعّل يختفي بدون أن يترك فراغًا.
 */
.footer-main-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 0;
	padding: 0;
}
.footer-col {
	padding: 52px 40px;
	border-inline-start: 1px solid rgba(255,255,255,.07);
	min-width: 0; /* يمنع أي محتوى عريض (فيديو، صورة) من تكسير عرض العمود */
}
.footer-col-brand { border-inline-start: 0; }
@media (max-width: 900px) {
	.footer-main-grid { grid-template-columns: 1fr; }
	.footer-col { border-inline-start: 0; border-top: 1px solid rgba(255,255,255,.07); padding: 32px 20px; }
	.footer-col-brand { border-top: 0; }
}

/* عمود الودجات الحرّة: نفس مسافات ونمط بقية أعمدة الفوتر */
.footer-col-widgetarea .widget { margin: 0 0 28px; }
.footer-col-widgetarea .widget:last-child { margin-bottom: 0; }
.footer-col-widgetarea .widget img { max-width: 100%; height: auto; }
.footer-col-widgetarea .widget ul { list-style: none; margin: 0; padding: 0; }
.footer-col-widgetarea .widget li { padding: 6px 0; color: #a3a4ad; font-size: 13.5px; }
.footer-col-widgetarea .widget a { color: #a3a4ad; transition: color .2s ease; }
.footer-col-widgetarea .widget a:hover { color: var(--sabiq-accent); }
.footer-col-widgetarea .widget p { color: #7d7e87; font-size: 14px; line-height: 1.9; }

/* ==========================================================
   ودجت الفيديوهات/الريلز — شريط أفقي بارتفاع ثابت (نفس الارتفاع
   على الكمبيوتر والجوال، بدون أي تكديس رأسي يطوّل الفوتر)
   ========================================================== */
.sabiq-reels-widget {
	display: flex;
	gap: 10px;
	overflow-x: auto;
	overflow-y: hidden;
	padding-bottom: 6px;
	scroll-snap-type: x proximity;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: rgba(255,255,255,.2) transparent;
}
.sabiq-reels-widget::-webkit-scrollbar { height: 6px; }
.sabiq-reels-widget::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 10px; }

.sabiq-reel-item { flex: 0 0 auto; scroll-snap-align: start; }

.sabiq-reel-thumb {
	position: relative;
	display: block;
	width: 110px;
	aspect-ratio: 9 / 16;
	border: 0;
	border-radius: 10px;
	overflow: hidden;
	padding: 0;
	cursor: pointer;
	background: #1a1c24;
}
.sabiq-reels-widget--large .sabiq-reel-thumb { width: 150px; }

.sabiq-reel-thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.sabiq-reel-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: rgba(0,0,0,.25);
	transition: background .2s ease;
}
.sabiq-reel-play svg { filter: drop-shadow(0 1px 3px rgba(0,0,0,.5)); }
.sabiq-reel-thumb:hover .sabiq-reel-play,
.sabiq-reel-thumb:focus-visible .sabiq-reel-play { background: rgba(0,0,0,.45); }

/* بعد الضغط: الصورة تُستبدل بإطار فيديو حقيقي بنفس مقاس البطاقة تمامًا */
.sabiq-reel-item iframe {
	display: block;
	width: 110px;
	aspect-ratio: 9 / 16;
	height: auto;
	border: 0;
	border-radius: 10px;
}
.sabiq-reels-widget--large .sabiq-reel-item iframe { width: 150px; }

@media (max-width: 480px) {
	.sabiq-reel-thumb,
	.sabiq-reel-item iframe { width: 96px; }
	.sabiq-reels-widget--large .sabiq-reel-thumb,
	.sabiq-reels-widget--large .sabiq-reel-item iframe { width: 130px; }
}
/* ==================== نهاية ودجت الفيديوهات/الريلز ==================== */

.footer-col-brand .footer-logo img { max-height: 44px; width: auto; }
.footer-site-name {
	color: #fff;
	font-family: var(--font-heading);
	font-size: 21px;
	font-weight: 900;
	margin: 0 0 14px;
}
.footer-site-desc {
	color: #7d7e87;
	font-size: 14px;
	line-height: 1.9;
	margin: 0;
	max-width: 300px;
}

.footer-col-title {
	color: #fff;
	font-size: 14px;
	font-weight: 800;
	margin: 0 0 20px;
	padding-inline-start: 12px;
	border-inline-start: 3px solid var(--sabiq-accent);
	text-align: start;
}

/* تصنيفات ووسوم الفوتر — صفوف نظيفة بدون أي سهم */
.footer-pill-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.footer-pill-list li { border-bottom: 0; }
.footer-pill-list .tag-pill {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: transparent;
	border: 0;
	border-radius: 6px;
	padding: 9px 10px;
	color: #a3a4ad;
	font-size: 13.5px;
	font-weight: 600;
	transition: background .2s ease, color .2s ease;
}
.footer-pill-list .tag-pill:hover {
	background: rgba(255,255,255,.05);
	color: #fff;
}
.footer-pill-list .pill-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	background: rgba(255,255,255,.08);
	color: #8c8d96;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	padding: 3px 7px;
	border-radius: 20px;
}
.footer-pill-list .tag-pill:hover .pill-count { background: var(--sabiq-accent); color: #fff; }
/* ==================== نهاية شبكة الفوتر الرئيسية ==================== */

.site-info { border-top: 1px solid rgba(255,255,255,.07); background: #0b0c11; }
.site-info-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 22px 40px;
	flex-wrap: wrap;
	gap: 12px;
	font-size: 13px;
	color: #6f707a;
}
.site-info-inner p { margin: 0; }
.footer-navigation ul { list-style: none; display: flex; gap: 22px; margin: 0; padding: 0; }
.footer-navigation a { color: #9799a3; font-weight: 600; font-size: 13px; transition: color .2s ease; }
.footer-navigation a:hover { color: var(--sabiq-accent); }


/* ---------- 404 و بدون نتائج ---------- */
.error-404 { text-align: center; padding: 60px 20px; }
.error-code { font-size: 90px; color: var(--sabiq-accent); margin: 0; }
.btn-home { display: inline-block; margin-top: 18px; background: var(--sabiq-dark); color: #fff; padding: 10px 26px; border-radius: 30px; font-weight: 700; }
.no-results { text-align: center; padding: 40px 20px; }

/* ---------- نموذج البحث ---------- */
.search-form { display: flex; gap: 8px; }
.search-field { flex: 1; padding: 10px 14px; border: 1px solid var(--sabiq-border); border-radius: 6px; font-family: inherit; }
.search-submit { background: var(--sabiq-accent); color: #fff; border: 0; padding: 10px 18px; border-radius: 6px; font-weight: 700; cursor: pointer; }

/* ---------- الترقيم ---------- */
.pagination { display: flex; justify-content: center; gap: 8px; margin-top: 36px; }
.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; border-radius: 6px; background: #fff; border: 1px solid var(--sabiq-border); font-weight: 700; }
.pagination .page-numbers.current { background: var(--sabiq-accent); color: #fff; border-color: var(--sabiq-accent); }

/* ---------- التعليقات ---------- */
.comments-area { margin-top: 40px; padding-top: 30px; border-top: 1px solid var(--sabiq-border); }
.comment-list { list-style: none; padding: 0; }
.comment-list .comment-body { background: #fff; border: 1px solid var(--sabiq-border); border-radius: 10px; padding: 16px 18px; margin-bottom: 16px; }

@media (max-width: 900px) {
	.main-navigation { display: none; width: 100%; }
	.main-navigation.active { display: block; }
	.menu-toggle { display: flex; }
	.header-inner { justify-content: space-between; }
}