/* أنماطُ partials/header — نُقلت 2026-08-20 (CLAUDE.md قاعدة 1). ⚖ تُحمَّل عبر @once+@push('style-override') — والدفعُ من جسم التخطيط مُثبَتُ الوصول: اختُبر على partials/footer فظهرت الوصلةُ داخلَ . */ /* Neobrutalist Header & Ticker Styles */ /* ---- 1. Ticker Tape ---- */ .fv-tape /* ⛔ **`--fnv-surface` ينقلب مع الثيم**: على سطحٍ أسودَ **ثابتٍ** يصير النصُّ `#0A0A0A` في الوضع الداكن ⇒ أسودُ على أسود. والرمزُ الصحيحُ `--fnv-dark-text` — لا ينقلب (‏`#FFFFFF` في الثيمين). قِيس في متصفّحٍ حقيقيّ 2026-08-22 · `contrast-audit`. */ { background: var(--fnv-dark-bg); color: var(--fnv-dark-text); padding: 6px 24px; display: flex; align-items: center; overflow: hidden; position: relative; border-bottom: 1px solid var(--fnv-ink); } /* ⛔ **شارةٌ معكوسةٌ فوق شريطٍ داكنٍ دائماً** — فلونُها ثابتٌ لا يتبع السمة. كانت `background:var(--fnv-surface)` و`color:var(--fnv-ink)`: في الوضع الداكن يصير كلاهما `var(--fnv-dark-bg)` ⇒ **1.00:1، اختفاءٌ تامّ**. (نفسُ عائلة `--fnv-grid` كلونِ نصّ: رمزٌ في غير موضعه يصحّ بالمصادفة ثمّ ينهار.) */ .fv-tape__live { /* ⚖ رمزا اللوحة **الثابتة** (`--fnv-dark-*`) لا رموزُ السمة: الشريطُ داكنٌ في الحالتين، فالشارةُ معكوسةٌ دائماً ولا تنقلب معه. */ background: var(--fnv-surface); color: var(--fnv-ink) !important; font-size: .8125rem; font-weight: 800; padding: 2px 8px; display: flex; align-items: center; gap: 6px; z-index: 2; margin-left: 15px; flex-shrink: 0; } .fv-tape__fresh { font-family:'Readex Pro', sans-serif; font-size:.8125rem; font-weight:700; color:var(--fnv-up); letter-spacing:0; } .fv-tape__dot { width: 6px; height: 6px; background: var(--fnv-tint-neg); border-radius:0; /* ⛔ كانت 50% — §4أ (2026-09-05) */ animation: fv-blink 1s infinite alternate; } /* خارجَ الجلسة: نقطةٌ ساكنةٌ محايدة — لا نبضَ فوق بياناتٍ مجمّدة (أتمتة 2026-09-02) */ /* ⛔ كان رمزَ «على الداكن» فوق سطحٍ فاتح — تباين 2.64:1 على ختم «UTC» (أوّل صيد للأداة السريعة 2026-09-03) */ .fv-tape__live.is-closed .fv-tape__dot { animation: none; background: var(--fnv-ink-3); } .fv-tape__live.is-closed .fv-tape__fresh { color: var(--fnv-ink-3); } @keyframes fv-blink { 0% { opacity: 1; } 100% { opacity: 0.3; } } /* تمرير عبر JS على حاوية overflow-x → حركة بطيئة + توقف عند التفاعل + سحب/عجلة/لمس للرجوع وقراءة أي عنصر مرّ، ثم استئناف تلقائي بعد سكون. (لا CSS marquee). */ .fv-tape__scroll { display: flex; align-items: center; white-space: nowrap; overflow-x: auto; scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* IE/Edge */ cursor: grab; /* تلاشٍ عند طرفَي النافذة بدل قطعٍ حادّ. القصّ الحادّ يبتر الرقم في منتصفه («‎…0%‎» ملاصقةً لشارة الغد) فيُقرأ **قيمةً مكسورة** لا عنصراً يمرّ — وعلى شريطٍ ماليّ الرقمُ الناقص أسوأ من غيابه. القناع يُذيب الداخل والخارج فيُفهم الحدّ حركةً لا عطباً. */ -webkit-mask-image: linear-gradient(to right, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%); } .fv-tape__scroll::-webkit-scrollbar { display: none; } /* WebKit */ .fv-tape__scroll:active { cursor: grabbing; } .fv-tape__seg { display: flex; align-items: center; gap: 8px; padding: 0 15px; border-left: 1px solid var(--fnv-ink); font-family:'Readex Pro', sans-serif; font-size: .8125rem; font-weight: 500; position: relative; cursor: default; } .fv-tape__seg:last-child { border-left: none; } .fv-tape__sym { color: var(--fnv-dark-text) !important; font-weight: 800; } /* ⛔ **`--fnv-grid` رمزُ خطوطِ الشبكة لا لونُ نصّ.** كان يُستعمَل هنا لأنّ قيمتَه في الفاتح (var(--fnv-grid)) تصادف أن تصلح فوق شريطٍ أسود — وهو **صوابٌ بالمصادفة**. وأوّلُ ما أُعيد ربطُه للوضع الداكن (#1A1A1A) صار النصُّ **1.14:1 فوق var(--fnv-dark-bg)**. ⚖ والشريطُ داكنٌ في السمتين ⇒ لونُه من لوحة الداكن صراحةً، لا من رمزِ شبكة. */ .fv-tape__val { color: var(--fnv-on-dark-1); font-weight: 700; direction: ltr; unicode-bidi: isolate; } /* ⛔ **الرمزُ الداكنُ كان معرَّفاً ولم يُستعمل** (قِيس 2026-08-14: 3.95:1 دون 4.5): `is-dn` تستعمل `--fnv-down-on-dark` و`is-up` بقيت على `--fnv-up` الفاتح — نصفُ تطبيقٍ في سطرين متجاورين. و`--fnv-up-on-dark: #22C55E` معرَّفٌ منذ البداية ونسبتُه على `#0a0a0a` ‏**9.5:1**. */ .fv-tape__chg.is-up { color: var(--fnv-up-on-dark); font-weight: 700; direction: ltr; unicode-bidi: isolate; } .fv-tape__chg.is-dn { color: var(--fnv-down-on-dark); font-weight: 700; direction: ltr; unicode-bidi: isolate; } .fv-tape__chg.is-neutral { color: var(--fnv-on-dark-2); direction: ltr; unicode-bidi: isolate; } /* Tomorrow reminder on left of tape */ .fv-tape__tomorrow { flex-shrink: 0; margin-right: auto; display: flex; align-items: center; gap: 5px; font-family: 'Readex Pro', sans-serif; font-size: .8125rem; font-weight: 700; /* ⛔ كان var(--fnv-down) (أحمرُ الفاتح) فوق .fv-tape الداكن الثابت — 2.73:1 (صيدُ الأداة على /performance 2026-09-03)؛ والصبغةُ الكهرمانيّة rgba خامّ. رمزُ الأحمر على الداكن وحدٌّ من الرمز. */ color: var(--fnv-down-on-dark); background: transparent; border: 1px solid var(--fnv-dark-border); padding: 2px 10px; white-space: nowrap; } /* Ticker Tooltip */ /* Tooltip تعريفيّ للشريط — position:fixed يتخطّى overflow:hidden للشريط (كان يقصّه فيختفي). عنصر واحد مشترك مُلحَق بـbody يُحرّكه JS إلى موضع الرمز الذي عليه المؤشّر. */ .fv-tape__seg[data-tip] { cursor: help; } .fv-tape__seg[data-tip]:hover .fv-tape__sym { text-decoration: underline; text-underline-offset: 3px; } /* ⛔ **وكانت أربعٌ وأربعون محطّةَ تنقّلٍ بلا مؤشّرِ تركيزٍ إطلاقاً** (قِيس حيّاً 2026-08-30): كلُّ قطعةٍ تحمل `tabindex="0"` — وهو **صوابٌ** لأنّ التلميحَ يُفتَح بـ`focusin`، فبلا مدخلٍ للوحة المفاتيح يكون التلميحُ حكراً على الفأرة (‏WCAG 1.4.13). لكنّ الأثرَ البصريَّ كان **على `:hover` وحدَه**، فمَن يتنقّل بلوحة المفاتيح يقرأ تلميحاً **ولا يرى أيَّ رمزٍ يقرأ عنه**. ⚖ **والمرآةُ لا الاختراع**: يُنسَخ أثرُ التمرير نفسُه (تسطيرُ الرمز) ويُضاف إطارٌ يحدّد القطعة — فالمظهران متطابقان بين الفأرة ولوحة المفاتيح. ⚖ **وإزاحةٌ داخليّةٌ `-2px`**: الشريطُ `overflow-x:auto` فإطارٌ خارجيٌّ يُقصّ عند الحافّة ويتداخل مع القطعة المجاورة. ⛔ ولا `!important`. */ .fv-tape__seg[data-tip]:focus-visible .fv-tape__sym { text-decoration: underline; text-underline-offset: 3px; } .fv-tape__seg[data-tip]:focus-visible { outline: 2px solid var(--fnv-ink); outline-offset: -2px; } #fvTapeTip { position: fixed; z-index: 100000; max-width: 300px; background: var(--fnv-dark-bg); border: 1px solid var(--fnv-ink); /* ⛔ نصٌّ فوق لوحٍ داكنٍ صراحةً ⇒ لوحةُ الداكن لا رمزُ الشبكة (العلّةُ نفسُها أعلاه). */ color: var(--fnv-on-dark-1); font-family: 'Readex Pro', sans-serif; font-size: .8125rem; font-weight: 600; line-height: 1.75; letter-spacing: normal; padding: 11px 14px; text-align: start; direction: rtl; box-shadow: none; pointer-events: none; opacity: 0; transform: translateY(-4px); transition: opacity 0.15s ease, transform 0.15s ease; } #fvTapeTip.is-visible { opacity: 1; transform: translateY(0); } #fvTapeTip .fvtt-sym { display: block; font-family:'Readex Pro', sans-serif; font-size: .8125rem; font-weight: 800; color: var(--fnv-dark-text); letter-spacing: 0.05em; direction: ltr; text-align: start; border-bottom: 1px solid var(--fnv-on-dark-2); padding-bottom: 5px; margin-bottom: 6px; } @media (prefers-reduced-motion: reduce) { #fvTapeTip { transition: opacity 0.15s ease; transform: none; } } /* Neobrutalist Buttons in Header */ .btn-fnv-outline-light.neo { border: 1.5px solid var(--fnv-dark-bg) !important; background: transparent !important; color: var(--fnv-ink) !important; font-family: 'Readex Pro', sans-serif !important; font-size: .8125rem !important; font-weight: 700 !important; padding: 6px 16px !important; border-radius: 0 !important; text-decoration: none !important; transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.2s !important; } .btn-fnv-outline-light.neo:hover { background: var(--fnv-surface-2) !important; } .btn-fnv-institutional.neo { border: 1.5px solid var(--fnv-dark-bg) !important; background: var(--fnv-dark-bg) !important; color: var(--fnv-dark-text) !important; font-family: 'Readex Pro', sans-serif !important; font-size: .8125rem !important; font-weight: 700 !important; padding: 6px 16px !important; border-radius: 0 !important; text-decoration: none !important; transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.2s !important; } .btn-fnv-institutional.neo:hover { background: var(--fnv-dark-bg) !important; color: var(--fnv-dark-text) !important; } body { padding-top: 148px; /* احتياطي للنافبار بالشعار الكبير. JS يضبطه ديناميكياً */ } .fnv-header { background: var(--fnv-surface); transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease; z-index: 1020; position: fixed; top: 0; width: 100%; } /* إزاحة anchor: الهيدر الثابت لا يخفي عناوين الأقسام عند النقر على روابط #section ⛔ **وكانت القيمةُ دون 1200 أقصرَ من الرأس بثمانٍ وعشرين بكسلاً** (قِيس حيّاً 2026-08-30 في متصفّح): الرأسُ **98 بكسلاً** بعد التمرير عند 375 و657، والحشوةُ **70** ⇒ **32.4 بكسل من العنوان المقصود محجوبةٌ تحته** عند كلّ قفزٍ إلى مرساة. صامتاً: القارئُ يظنّ أنّه هبط في وسط الفقرة. ⚖ **والقيمةُ 106 تغطّي الحالتين**: 98 بعد التمرير و**102 أعلى الصفحة** (‏فتحُ رابطٍ يحمل `#hash` مباشرةً) — فأربعةُ بكسلاتٍ متنفَّسٌ لا زينة. ⚖ **وقيمةُ سطح المكتب لم تُمَسّ**: قِيست 99 مقابل 100 ⇒ سليمةٌ فعلاً، وتغييرُها تعديلٌ بلا عطبٍ يبرّره. */ html { scroll-padding-top: 100px; } @media (max-width: 1199.98px) { html { scroll-padding-top: 106px; } } /* Shrinking Sticky */ .fnv-header.scrolled { border-bottom: 1px solid var(--fnv-border); } .fnv-header.scrolled .main-navbar-wrapper nav { padding-top: 0.2rem !important; padding-bottom: 0.2rem !important; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease; } .fnv-header.scrolled .sub-navbar-wrapper { /* يبقى نافبار الأكاديمية ظاهراً أثناء التصفّح (كان يُخفى عند السكرول) — فقط يصبح أكثر إحكاماً */ } .fnv-header.scrolled .sub-navbar-wrapper nav { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; } /* ── شعار الثور "FINVIRO" الدائريّ المركزي: B&W، يتقلّص بسلاسة عند السكرول (لا شعار SignalLab، لا ظلال §4) ── */ .fnv-brand-logo { height: 52px; width: 52px; object-fit: contain; display: block; transition: height 0.3s ease, width 0.3s ease; filter: none; } .fnv-header.scrolled .fnv-brand-logo { height: 40px; width: 40px; } @media (max-width: 1199.98px) { /* الشعار يتناسب مع ارتفاع النافبار (56px) بدل أن يبرز خارجه */ .fnv-brand-logo { height: 42px; width: 42px; } .fnv-header.scrolled .fnv-brand-logo { height: 36px; width: 36px; } /* مساحة لمس زر القائمة ≥44px */ .navbar-toggler.d-xl-none { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; } } /* Neo Pills */ /* ══ تبويبات القطاع (خدماتنا · مدرسة السوق) — هوية Editorial أبيض/أسود ══ أبيض/أسود صرف · حواف حادّة (0 radius) · Readex Pro · قواعد العربية: letter-spacing:normal (لا تباعد حروف يكسر الوصل) + line-height مريح. */ .btn-neo-pill { display: inline-flex; align-items: center; padding: 8px 20px; border-radius: 0; font-family: 'Readex Pro', sans-serif; font-size: .86rem; font-weight: 700; line-height: 1.7; letter-spacing: normal; color: var(--fnv-ink); text-decoration: none; border: 1.5px solid var(--fnv-dark-bg); background: var(--fnv-surface); transition: background 0.2s ease, color 0.2s ease; } /* الأسود محجوز للتبويب النشط (القسم الحاليّ) فقط — يوضّح أين أنت */ .btn-neo-pill.active { background: var(--fnv-dark-bg); color: var(--fnv-dark-text); } /* hover خفيف رماديّ (لا أسود كامل) — تغذية راجعة نظيفة دون أن يبدو الزرّ «مُختاراً» */ .btn-neo-pill:hover:not(.active) { background: var(--fnv-grid); color: var(--fnv-ink); } .btn-neo-pill.neo-badge-tab { border: 1.5px solid var(--fnv-dark-bg); color: var(--fnv-ink); } /* ⚠ الحالة النشطة تُعيد الأبيض. `neo-badge-tab` تأتي **بعد** `.active` وبالتخصّص نفسه (0,2,0) فتدهس `color:#fff` بينما تبقى الخلفيّة سوداء ⇒ «مدرسة السوق» أسودُ على أسود في /academy و/glossary وكلّ صفحات المدرسة (قيس 1.00:1 — bug-267). */ .btn-neo-pill.neo-badge-tab.active { color: var(--fnv-dark-text); } /* نصّ "مدرسة السوق": أسود واضح (يرث لون الزرّ) + وزن أعرض — لا ألوان (هوية أبيض/أسود) */ .fnv-academy-label { font-weight: 800; letter-spacing: normal; } /* مؤشّر "قيد التطوير" — مربّع أسود حادّ (Editorial) بنبضة شفافية أحاديّة اللون */ .fnv-academy-live-dot { display: inline-block; width: 7px; height: 7px; background: var(--fnv-dark-bg); border-radius: 0; margin-right: 8px; flex-shrink: 0; vertical-align: middle; animation: academyDotPulse 2.4s ease-in-out infinite; } @keyframes academyDotPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } } /* المؤشّر أبيض فقط على التبويب النشط (خلفية سوداء)؛ على hover الرماديّ يبقى أسود ظاهراً */ .btn-neo-pill.active .fnv-academy-live-dot { background: var(--fnv-surface); } @media (prefers-reduced-motion: reduce) { .fnv-academy-live-dot { animation: none; } } .fnv-dot-neutral { width: 8px; height: 8px; display: inline-block; border-radius: 0; background: var(--fnv-ink); box-shadow: none; animation: fnvPulseNeutral 1.8s infinite; flex: 0 0 auto; } @keyframes fnvPulseNeutral { 0% { transform: scale(.95); } 70% { transform: scale(1); } 100% { transform: scale(.95); } } /* Main Nav Links */ .nav-link-custom { font-family: 'Readex Pro', sans-serif; font-weight: 700; font-size: .95rem; color: var(--fnv-ink) !important; text-decoration: none; position: relative; padding: 5px 0; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease; } .nav-link-custom:after { content: ''; position: absolute; bottom: -2px; right: 0; width: 0; height: 2px; background: var(--fnv-ink); transition: width 0.3s ease; } .nav-link-custom:hover:after, .nav-link-custom.active-nav:after { width: 100%; } /* ⛔ **`.sub-nav-link` نُقل إلى `finviro-base.css` (2026-08-17)** — ولم يكن تكراراً محايداً: الورقةُ ترسم للحالة النشطة **قضيباً سفليّاً**، وهذه الكتلةُ كانت ترسم لها **إطاراً محيطاً**، فيظهر المؤشّران معاً (قِيس حيّاً: `كلاهما_يظهر: true`). مصدران لحالةٍ واحدة ⇒ لغتان بصريّتان. ⚖ وكانت تُثبّت `'Readex Pro'` نصّاً — فأفلتت من توحيد الخطوط أمسِ. */ /* Standard Editorial Breadcrumb */ .editorial-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-family: 'Readex Pro', sans-serif; font-size: .85rem; font-weight: 600; margin-bottom: 1.5rem; list-style: none; padding: 0; } .editorial-breadcrumb li { display: flex; align-items: center; gap: 8px; } .editorial-breadcrumb li:not(:last-child)::after { content: '\f104'; font-family: 'Line Awesome Free'; font-weight: 900; color: var(--fnv-ink-3); font-size: .8125rem; } .editorial-breadcrumb a { color: var(--fnv-ink); text-decoration: none; transition: color 0.2s; } .editorial-breadcrumb a:hover { color: var(--fnv-ink-3); text-decoration: underline; } .editorial-breadcrumb .active { color: var(--fnv-ink-3); } /* ⛔ `.sub-nav-link.active` نُقلت كذلك — كانت `font-weight: 800` تغلب الـ700 في الورقة، فيصير **المستوى الثاني أثقلَ من الأوّل** (‏`.btn-neo-pill` عند 700): تدرّجٌ مقلوب. والخلفيّةُ `--fnv-surface` كانت بلا أثرٍ مرئيّ أصلاً (‏قِيس: الشريطُ شفّافٌ فوق أبيض). */ /* Mega Menu */ .mega-menu-wrapper:hover .mega-menu { display: block; margin-top: 0; } .mega-menu { border-radius: 0; box-shadow: none; min-width: 350px; border: 1px solid var(--fnv-ink) !important; padding: 0; } .mega-column { flex: 1; } .mega-title { font-family: 'Readex Pro', sans-serif; font-weight: 900; font-size: 1.1rem; border-bottom: 1px solid var(--fnv-border); padding-bottom: 8px; margin-bottom: 10px; color: var(--fnv-ink); } .mega-link { display: block; font-family: 'Readex Pro', sans-serif; font-size: .9rem; color: var(--fnv-ink-2); text-decoration: none; padding: 4px 0; transition: color 0.2s ease; } .mega-link:hover { color: var(--fnv-ink); font-weight: 700; } /* Buttons */ .btn-fnv-institutional { background: var(--fnv-ink); color: var(--fnv-surface) !important; border: 2px solid var(--fnv-ink); padding: 8px 24px; border-radius: 0; font-family: 'Readex Pro', sans-serif; font-weight: 800; font-size: .95rem; text-decoration: none; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease; display: inline-flex; align-items: center; justify-content: center; box-shadow: none; } .btn-fnv-institutional:hover { transform: translate(-1px, -1px); box-shadow: none; } .btn-fnv-outline-light { background: var(--fnv-surface); color: var(--fnv-ink) !important; border: 2px solid var(--fnv-ink); padding: 8px 24px; border-radius: 0; font-family: 'Readex Pro', sans-serif; font-weight: 800; font-size: .95rem; text-decoration: none; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease; } .btn-fnv-outline-light:hover { background: var(--fnv-surface-2); transform: translate(-1px, -1px); box-shadow: none; } /* ═══════════════════════════════════════════════════ Editorial B&W Mobile Navigation — Full Redesign ═══════════════════════════════════════════════════ */ /* Outer container — black panel */ .fnv-mn { background: var(--fnv-surface); color: var(--fnv-ink); border-top: 2px solid var(--fnv-dark-bg); box-shadow: none; overflow: hidden; animation: fnvMnSlide 0.3s cubic-bezier(0.22,1,0.36,1); } @keyframes fnvMnSlide { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } } /* Top strip — label */ .fnv-mn-strip { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; border-bottom: 1px solid var(--fnv-border); background: var(--fnv-surface-2); font-family:'Readex Pro', sans-serif; font-size: .8125rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--fnv-ink-3); } /* Segment tabs */ .fnv-mn-tabs { display: flex; border-bottom: 1px solid var(--fnv-border); } .fnv-mn-tab { flex: 1; padding: 14px 16px; background: var(--fnv-surface); border: none; border-left: 1px solid var(--fnv-border); color: var(--fnv-ink-3); font-family: 'Readex Pro', sans-serif; font-size: .9rem; font-weight: 700; cursor: pointer; text-align: center; transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.2s; display: flex; align-items: center; justify-content: center; gap: 8px; } .fnv-mn-tab:first-child { border-left: none; } .fnv-mn-tab:hover:not(.fnv-mn-tab--active) { color: var(--fnv-ink); background: var(--fnv-surface-2); } .fnv-mn-tab--active { background: var(--fnv-dark-bg) !important; color: var(--fnv-dark-text) !important; } .fnv-mn-new { font-family: var(--fnv-font-body); /* نصّه عربيّ خالص، لا خطّ أحاديّ (bug-145) */ font-size: .8125rem; font-weight: 800; letter-spacing: normal; /* عربيّة: التباعد يفصل الحروف */ background: var(--fnv-dark-bg); color: var(--fnv-dark-text); padding: 2px 6px; border: 1px solid var(--fnv-dark-bg); } .fnv-mn-tab--active .fnv-mn-new { background: var(--fnv-surface); color: var(--fnv-ink); border-color: var(--fnv-dark-text); } /* Nav links */ .fnv-mn-link { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; color: var(--fnv-ink) !important; text-decoration: none !important; font-family: 'Readex Pro', sans-serif; font-size: .98rem; font-weight: 700; border-bottom: 1px solid var(--fnv-grid); transition: background-color 0.18s, color 0.18s, border-color 0.18s, transform 0.18s; } .fnv-mn-link:last-child { border-bottom: none; } .fnv-mn-link:hover { background: var(--fnv-surface-2); color: var(--fnv-ink) !important; padding-right: 26px; } .fnv-mn-link--active { color: var(--fnv-ink) !important; background: var(--fnv-surface-2); box-shadow: inset 3px 0 0 var(--fnv-dark-bg); } .fnv-mn-link--active .fnv-mn-arrow { opacity: 1; } .fnv-mn-arrow { font-family:'Readex Pro', sans-serif; font-size: .8125rem; color: var(--fnv-ink-3); flex-shrink: 0; transition: background-color 0.18s, color 0.18s, border-color 0.18s, transform 0.18s; } .fnv-mn-link:hover .fnv-mn-arrow { color: var(--fnv-ink); } /* New-report dot in mobile */ .fnv-mn-dot { width: 7px; height: 7px; background: var(--fnv-tint-neg); border-radius:0; /* ⛔ كانت 50% — §4أ (2026-09-05) */ flex-shrink: 0; animation: fnvMnDotPulse 1.6s ease-in-out infinite; } @keyframes fnvMnDotPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.3; } } /* صفُّ السمة — أهدأُ من منطقة الدعوة: بلا خلفيّةٍ مميّزة ولا وزنٍ ثقيل. */ .fnv-mn-theme { display: flex; align-items: center; gap: 12px; padding: 12px 20px 18px; border-top: 1px solid var(--fnv-border); } .fnv-mn-theme span { font-family:'Readex Pro', sans-serif; font-size: .9rem; color: var(--fnv-ink-2); } /* CTA zone */ .fnv-mn-cta { padding: 16px 20px 20px; border-top: 1px solid var(--fnv-border); background: var(--fnv-surface-2); display: flex; flex-direction: column; gap: 10px; } .fnv-mn-btn-primary { display: block; width: 100%; padding: 14px 20px; background: var(--fnv-dark-bg); color: var(--fnv-dark-text) !important; text-decoration: none !important; text-align: center; font-family: 'Readex Pro', sans-serif; font-weight: 700; font-size: .95rem; border: 2px solid var(--fnv-dark-bg); transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.2s; letter-spacing: normal; /* عربيّة: التباعد يفصل الحروف */ } .fnv-mn-btn-primary:hover { background: var(--fnv-surface); color: var(--fnv-ink) !important; } .fnv-mn-btn-outline { display: block; width: 100%; padding: 12px 20px; background: transparent; color: var(--fnv-ink) !important; text-decoration: none !important; text-align: center; font-family: 'Readex Pro', sans-serif; font-weight: 600; font-size: .88rem; border: 1px solid var(--fnv-border); transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.2s; } .fnv-mn-btn-outline:hover { color: var(--fnv-ink) !important; border-color: var(--fnv-ink); background: var(--fnv-surface-2); } /* Mobile body padding — قيمة احتياطية فقط؛ JS يضبطها ديناميكياً (بلا !important حتى لا يتغلّب على JS) */ @media (max-width: 1199px) { body { padding-top: 118px; } } /* Mobile Nav */ .btn-editorial { background-color: transparent; color: var(--fnv-ink); transition: background-color 0.3s, color 0.3s, border-color 0.3s, transform 0.3s; } .btn-editorial:hover { background-color: var(--fnv-surface-2); } .btn-editorial.active { background-color: var(--fnv-dark-bg) !important; color: var(--fnv-dark-text) !important; } .m-nav-link { color: var(--fnv-ink) !important; font-family: 'Readex Pro', sans-serif; font-weight: 700; font-size: 1.1rem; text-decoration: none; display: block; } @keyframes pulse-red-dot { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 4px rgba(225, 29, 72, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); } } /* ── الشعار المركزي: توسيط على الموبايل (الزر على الجانب) ── */ @media (max-width: 1199.98px) { .main-navbar-wrapper .navbar { position: relative; min-height: 56px; } .main-navbar-wrapper .navbar-brand { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0 !important; z-index: 1; } /* ⛔ **العطبُ المقيس 2026-08-30 على 375 بكسل**: `z-index: 2` وُضعت لترفع أزرارَ هذا الغلاف فوق الشعار المطلق (‏`z-index: 1`) — **فرفعت فراغَه معها**. والغلافُ يمتدّ **351 بكسلاً بعرض الترويسة كلِّها**، فيغطّي الشعارَ (‏166–210) تغطيةً تامّة: **0 من 25 نقطةً تصل إليه** ⇒ **رابطُ العودة إلى الرئيسة معطَّلٌ في كلّ صفحة**. ⚖ **والقياسُ يُبطل مبرّرَ الرفع أصلاً على الهاتف**: أبناؤه الثمانيةُ **كلُّهم 0×0** (القائمةُ داخل الدُّرج) و**صفرُ تداخلٍ** مع الشعار، ولا `onclick` على الغلاف. أي أنّ الطبقةَ تحجب ولا تخدم. ⚖ **و`pointer-events` لا خفضُ `z-index`**: الترتيبُ البصريُّ يبقى كما هو (فلو ظهر ابنٌ يوماً بقي فوق الشعار)، والنقرُ وحدَه يعبر الفراغ. ✅ سطحُ المكتب لم يُمَسّ: قِيس **25/25** هناك قبلَ وبعد. */ .main-navbar-wrapper .header-action { position: relative; z-index: 2; pointer-events: none; } .main-navbar-wrapper .header-action > * { pointer-events: auto; } }