/*
	Theme Name:   Hello Elementor Child - المرجعية
	Theme URI:    https://www.marjaiaa.com/
	Description:  قالب فرعي لـ Hello Elementor خاص بموقع سماحة المرجع الشيخ صالح الطائي (دام ظله). كل التعديلات المخصصة تنكتب هنا حتى ما تنمسح عند تحديث القالب الأصلي.
	Author:       Marjaiaa
	Author URI:   https://www.marjaiaa.com/
	Template:     hello-elementor
	Version:      1.2.0
	Text Domain:  hello-elementor-child
	Tags:         rtl-language-support, custom-colors, custom-menu, custom-logo, translation-ready
	License:      GNU General Public License v3 or later
	License URI:  https://www.gnu.org/licenses/gpl-3.0.html
*/

/* ==========================================================================
   1) الهوية البصرية (Design Tokens)
   غيّر القيم هنا وتنعكس على كل الموقع تلقائياً.
   ========================================================================== */
:root {
	/* الكحلي — لون الهوية الأساسي */
	--mar-navy-900: #0A2240;   /* أغمق درجة: الهيدر والفوتر */
	--mar-navy-700: #123A63;   /* الكحلي الرئيسي: الأزرار والعناوين */
	--mar-navy-500: #1F5FA9;   /* أفتح: الروابط والتفاعل */

	/* الذهبي — لون التمييز */
	--mar-gold:      #C9A227;
	--mar-gold-soft: #E4C765;

	/* الأسطح */
	--mar-cream: #F8F6F1;      /* خلفية الأقسام الفاتحة */
	--mar-paper: #FFFFFF;

	/* النص */
	--mar-text:     #1C2430;
	--mar-text-mut: #5D6875;
	--mar-border:   #E4E8ED;

	/* أسماء قديمة — مُبقاة حتى لا ينكسر أي كود سابق */
	--mar-blue-900: var(--mar-navy-900);
	--mar-blue-700: var(--mar-navy-700);
	--mar-blue-500: var(--mar-navy-500);
	--mar-gray-700: #4A5261;
	--mar-gray-900: var(--mar-navy-900);

	/* الخطوط */
	--mar-font-head:  "El Messiri", "Cairo", "Segoe UI", sans-serif;
	--mar-font-body:  "Cairo", "Segoe UI", Tahoma, sans-serif;
	--mar-font-quran: "Amiri", "Traditional Arabic", serif;

	/* المقاسات */
	--mar-radius:    10px;
	--mar-radius-lg: 16px;
	--mar-shadow:    0 2px 10px rgba(10, 34, 64, .07);
	--mar-shadow-lg: 0 12px 34px rgba(10, 34, 64, .14);
	--mar-container: 1180px;
}

/* ==========================================================================
   2) الخطوط الأساسية
   ملاحظة مهمة: القالب الأب Hello Elementor يضبط خط body داخل reset.css
   بأولوية (0,0,1). لذلك نستخدم نفس مستوى الأولوية هنا — وبما أن ملفنا
   يُحمَّل بعده فهو الذي يفوز. وتبقى قواعد Elementor (0,1,x) أعلى منّا،
   فأي خط تحدده من Site Settings يتغلّب على هذا تلقائياً.
   ========================================================================== */
body {
	font-family: var(--mar-font-body);
	color: var(--mar-text);
	line-height: 1.8;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--mar-font-head);
	line-height: 1.45;
}

h1, h2, h3, h4 {
	color: var(--mar-navy-900);
}

input, select, textarea, button {
	font-family: inherit;
}

/* نص قرآني: ضع class="mar-quran" على أي فقرة */
.mar-quran {
	font-family: var(--mar-font-quran);
	font-size: 1.35em;
	line-height: 2.1;
	color: var(--mar-navy-900);
}

/* ==========================================================================
   3) الروابط — استبدال الوردي #CC3366 بالهوية الكحلية
   ========================================================================== */
a {
	transition: color .2s ease, background-color .2s ease, opacity .2s ease;
}

.entry-title a,
.post-title a,
h1 a, h2 a, h3 a, h4 a,
.elementor-post__title a,
.elementor-widget-theme-post-title a,
.elementor-post__read-more,
article a.more-link {
	color: var(--mar-navy-900);
}

.entry-title a:hover,
.post-title a:hover,
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover,
.elementor-post__title a:hover,
.elementor-widget-theme-post-title a:hover,
.elementor-post__read-more:hover,
article a.more-link:hover {
	color: var(--mar-navy-500);
}

/* روابط داخل نص المقال */
:where(.entry-content, .elementor-widget-text-editor) a:not(.mar-btn):not(.elementor-button) {
	color: var(--mar-navy-500);
	text-decoration-color: rgba(31, 95, 169, .35);
	text-underline-offset: 3px;
}

:where(.entry-content, .elementor-widget-text-editor) a:not(.mar-btn):not(.elementor-button):hover {
	color: var(--mar-gold);
}

/* ==========================================================================
   4) أساسيات عربية / RTL
   الخطوط العامة مضبوطة من Elementor (Site Settings → Global Fonts)
   والمتغيّرات أعلاه متاحة لأي عنصر تريد تخصيصه.
   ========================================================================== */
[dir="rtl"] body,
html[lang^="ar"] body {
	text-align: right;
}

/* الأرقام داخل نص عربي لا تنقلب */
time, .mar-num {
	unicode-bidi: isolate;
}

/* ==========================================================================
   5) تحسينات عامة (صور، جداول، اقتباس)
   ========================================================================== */
img {
	max-width: 100%;
	height: auto;
}

img:not([src]),
img[src=""] {
	visibility: hidden;
}

.entry-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: .95em;
}

.entry-content table th,
.entry-content table td {
	border: 1px solid var(--mar-border);
	padding: .6em .8em;
}

.entry-content table th {
	background: var(--mar-cream);
	font-family: var(--mar-font-head);
}

.entry-content blockquote {
	border-inline-start: 4px solid var(--mar-gold);
	background: var(--mar-cream);
	margin: 1.6em 0;
	padding: 1em 1.4em;
	border-radius: var(--mar-radius);
	color: var(--mar-navy-900);
}

/* ==========================================================================
   6) إمكانية الوصول (Accessibility)
   ========================================================================== */
.mar-skip-link {
	position: absolute;
	inset-inline-start: -9999px;
	top: 0;
	z-index: 100000;
	background: var(--mar-navy-900);
	color: #fff;
	padding: 12px 20px;
	border-radius: 0 0 var(--mar-radius) var(--mar-radius);
	font-family: var(--mar-font-head);
	text-decoration: none;
}

.mar-skip-link:focus {
	inset-inline-start: 12px;
	color: #fff;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--mar-gold);
	outline-offset: 2px;
}

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

/* ==========================================================================
   7) الطباعة (Print)
   ========================================================================== */
@media print {
	header, footer, nav,
	.elementor-location-header, .elementor-location-footer,
	.mar-skip-link, .mar-back-to-top {
		display: none !important;
	}

	body {
		color: #000;
		background: #fff;
	}
}

/* ==========================================================================
   8) تعديلاتك الخاصة — اكتب تحت هذا السطر
   ========================================================================== */