/* طبقة قسورة المشتركة لكل المواقع: لوحة الأوامر، الوضع الداكن، شريط التقدم، الأزرار العائمة، الوصولية */
:root { --q-pill: #1A130F; --q-panel: #FFFCF8; --q-ink: #1F1712; --q-muted: #7B6F66; --q-line: #EEE3D8; --q-brand: #F27A1A; --q-hover: #FFF4E9; --q-acc: #B44F05; --q-shadow: 0 24px 60px -20px rgba(31, 23, 18, .55); }
html[data-q-theme="gray"] { --q-panel: #F5F6F7; --q-ink: #1B1C1F; --q-muted: #6B6F76; --q-line: #D3D6DB; --q-hover: #E8EAEE; }
html[data-q-theme="dark"] { --q-panel: #231A14; --q-ink: #F1E8DF; --q-muted: #9C8F84; --q-line: #3A2E26; --q-hover: #33200F; --q-acc: #FFB06B; --q-shadow: 0 24px 60px -20px rgba(0, 0, 0, .9); }

/* ---- الوضع الداكن (يشتغل على كل مواقع قسورة لأنها تشترك في نفس متغيرات الألوان) ---- */
html[data-q-theme="dark"] { color-scheme: dark; --ink: #F1E8DF; --ink-2: #CDBFB3; --muted: #9C8F84; --line: #3A2E26; --bg: #17110D; --brand-50: #33200F; --brand-100: #4A2E14; --brand-700: #FF9E4D; --none: #3A2E26; }
html[data-q-theme="dark"] body { background: var(--bg, #17110D); color: var(--ink, #F1E8DF); }
html[data-q-theme="dark"] :is(.card, .chips, .dg, .nav2, .note, .quiz, .search, .tbl, .f, .sub, .swap, .tabs, .tabs button, .back, .bar2, .gc, .add, .cur, .banner, .box, .demo, .faq, .feat, .step, .notes, .panel, .site-card, .plan, .kpi, .form-card, .chart-card, .feature-row, .feature-nav, .pain, .float-card, .special-card, .contact-list, .act-tile, .act-chips, .act-tabs, .rows, .btn-light, .plain, .sites-ribbon, .cat, .ad, .sc, .empty, .my, .seg label, .subs button, .searchbox, .filters select, .btn.ghost, .modal, .sheet, .tile, .item, .row, .list-item, .stat, .kpi-card, .pricing, .faq-item, .accordion, details, pre, code, blockquote) { background-color: #231A14 !important; color: var(--ink, #F1E8DF); border-color: var(--line, #3A2E26); }
html[data-q-theme="dark"] :is(input, select, textarea, table, th, td) { background-color: #1F1611 !important; color: var(--ink, #F1E8DF); border-color: var(--line, #3A2E26); }
html[data-q-theme="dark"] :is(.btn.ghost, .btn-light) { color: var(--brand-700, #FF9E4D) !important; border-color: var(--brand, #F27A1A); }
html[data-q-theme="dark"] :is(h1, h2, h3, h4, p, li, label, small, dd, dt, span, td, th) { color: inherit; }
html[data-q-theme="dark"] :is(.ad, .card, .tile):hover { box-shadow: none; }
html[data-q-theme="dark"] img:not([src*="logo"]):not(.q-keep) { filter: brightness(.9); }
html[data-q-theme="dark"] .section.alt, html[data-q-theme="dark"] .alt { background: #1F1611 !important; }

/* ---- الوضع الرمادي: خلفية رمادية هادئة مريحة للعين مع بطاقات فاتحة ---- */
html[data-q-theme="gray"] { --bg: #E9EBEE; --ink: #1B1C1F; --ink-2: #3F4248; --muted: #6B6F76; --line: #D3D6DB; --brand-50: #F3F4F6; --brand-100: #E4E6EA; --night: #26282D; }
html[data-q-theme="gray"] body { background: var(--bg, #E9EBEE); color: var(--ink, #1B1C1F); }
html[data-q-theme="gray"] :is(.card, .ad, .cat, .tile, .site-card, .plan, .kpi, .box, .note, .tbl, .search, .searchbox, .form-card, .chart-card, .feature-row, .pain, .float-card, .special-card, .faq, .step, .feat, .demo, .gc, .sc, .empty, .my, .panel, .quiz, .dg, .nav2) { background-color: #F7F8F9 !important; border-color: var(--line, #D3D6DB); box-shadow: none; }
html[data-q-theme="gray"] :is(input, select, textarea) { background-color: #fff !important; border-color: var(--line, #D3D6DB); }
html[data-q-theme="gray"] .section.alt, html[data-q-theme="gray"] .alt { background: #DFE2E6 !important; }

/* ---- زر الثيم العائم ---- */
.q-th { position: fixed; bottom: 18px; left: 18px; z-index: 9990; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .12); background: var(--q-pill); color: #F4ECE4; font-size: 1.15rem; cursor: pointer; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .6); display: inline-flex; align-items: center; justify-content: center; }
.q-th:hover { background: #2A1F18; }
.q-thm { position: fixed; bottom: 68px; left: 18px; z-index: 9991; background: var(--q-panel); color: var(--q-ink); border: 1px solid var(--q-line); border-radius: 14px; padding: 6px; box-shadow: var(--q-shadow); display: none; flex-direction: column; gap: 2px; min-width: 200px; direction: rtl; font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif; }
.q-thm.on { display: flex; }
.q-thm button { display: flex; align-items: center; gap: 10px; width: 100%; text-align: start; background: transparent; border: 0; color: inherit; font: 700 .9rem/1.6 inherit; padding: 8px 10px; border-radius: 10px; cursor: pointer; }
.q-thm button:hover, .q-thm button[aria-checked="true"] { background: var(--q-hover); }
.q-thm button[aria-checked="true"]::after { content: "✓"; margin-inline-start: auto; color: var(--q-brand); }
.q-thm .q-sw { width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--q-line); flex: none; }

/* ---- الوصولية ---- */
.q-skip { position: fixed; top: -60px; inset-inline-start: 12px; background: var(--q-brand); color: #fff; padding: 10px 16px; border-radius: 10px; z-index: 10000; font-weight: 800; transition: top .15s; }
.q-skip:focus { top: 12px; outline: 3px solid #fff; }
:focus-visible { outline: 3px solid var(--q-brand); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }

/* ---- شريط تقدم القراءة ---- */
.q-prog { position: fixed; top: 0; inset-inline-start: 0; height: 3px; width: 0; background: linear-gradient(90deg, var(--q-brand), #FFB06B); z-index: 9999; pointer-events: none; transition: width .08s linear; }

/* ---- الزر العائم ---- */
.q-pill { position: fixed; bottom: 18px; left: 68px; z-index: 9990; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 10px; border-radius: 99px; background: var(--q-pill); color: #F4ECE4; border: 1px solid rgba(255, 255, 255, .12); font: 700 .88rem/1 'Almarai', 'Segoe UI', Tahoma, sans-serif; cursor: pointer; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .6); direction: rtl; }
.q-pill:hover { background: #2A1F18; }
.q-pill img { width: 22px; height: 22px; display: block; }
.q-pill kbd { font: 700 .72rem/1 ui-monospace, Consolas, monospace; background: rgba(255, 255, 255, .14); padding: 3px 6px; border-radius: 6px; color: #FFD9B8; }
.q-top { position: fixed; bottom: 18px; right: 18px; z-index: 9990; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--q-line); background: var(--q-panel); color: var(--q-ink); font-size: 1.2rem; cursor: pointer; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .5); opacity: 0; transform: translateY(12px); pointer-events: none; transition: .2s; }
.q-top.on { opacity: 1; transform: none; pointer-events: auto; }
@media (max-width: 600px) { .q-pill span.q-lbl, .q-pill kbd { display: none; } .q-pill { padding: 9px; } }

/* ---- لوحة الأوامر ---- */
.q-ov { position: fixed; inset: 0; background: rgba(20, 12, 8, .55); backdrop-filter: blur(4px); z-index: 9995; display: none; align-items: flex-start; justify-content: center; padding: 8vh 12px; }
.q-ov.on { display: flex; }
.q-pal { width: min(680px, 100%); max-height: 80vh; display: flex; flex-direction: column; background: var(--q-panel); color: var(--q-ink); border-radius: 18px; box-shadow: var(--q-shadow); overflow: hidden; direction: rtl; font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif; border: 1px solid var(--q-line); }
.q-in { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--q-line); }
.q-in input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: inherit; font: 500 1.05rem/1.6 inherit; }
.q-in input::placeholder { color: var(--q-muted); }
.q-in kbd { font: 700 .72rem/1 ui-monospace, Consolas, monospace; border: 1px solid var(--q-line); padding: 3px 7px; border-radius: 6px; color: var(--q-muted); }
.q-res { overflow: auto; padding: 8px; }
.q-grp { font-size: .74rem; color: var(--q-muted); font-weight: 800; padding: 10px 10px 4px; letter-spacing: .02em; }
.q-it { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; cursor: pointer; text-decoration: none; color: inherit; }
.q-it[aria-selected="true"], .q-it:hover { background: var(--q-hover); }
.q-it i { font-style: normal; width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--q-hover); flex: none; font-size: 1rem; }
.q-it b { font-weight: 800; font-size: .95rem; line-height: 1.5; display: block; }
.q-it small { display: block; color: var(--q-muted); font-size: .78rem; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.q-it .q-site { margin-inline-start: auto; font-size: .7rem; color: var(--q-muted); border: 1px solid var(--q-line); border-radius: 99px; padding: 1px 8px; flex: none; }
.q-it mark { background: #FFE4C8; color: #B44F05; border-radius: 3px; padding: 0 1px; }
html[data-q-theme="dark"] .q-it mark { background: #4A2E14; color: #FFB06B; }
.q-ft { display: flex; gap: 14px; padding: 8px 16px; border-top: 1px solid var(--q-line); color: var(--q-muted); font-size: .74rem; flex-wrap: wrap; }
.q-ft kbd { font: 700 .7rem/1 ui-monospace, Consolas, monospace; border: 1px solid var(--q-line); padding: 2px 5px; border-radius: 5px; }
.q-empty { padding: 30px 12px; text-align: center; color: var(--q-muted); }

/* ---- توست ---- */
.q-toast { position: fixed; bottom: 72px; left: 50%; transform: translate(-50%, 20px); background: var(--q-pill); color: #fff; padding: 10px 18px; border-radius: 99px; z-index: 9998; font: 700 .9rem/1.4 'Almarai', 'Segoe UI', Tahoma, sans-serif; opacity: 0; transition: .2s; pointer-events: none; max-width: 92vw; text-align: center; direction: rtl; }
.q-toast.on { opacity: 1; transform: translate(-50%, 0); }
.q-toast.bad { background: #C8381F; }

/* ---- وقت القراءة ---- */
.q-rt { display: inline-block; font-size: .8rem; color: var(--muted, #7B6F66); background: var(--brand-50, #FFF4E9); border: 1px solid var(--line, #EEE3D8); border-radius: 99px; padding: 2px 10px; margin: 6px 0 10px; font-weight: 700; }

/* ---- الطباعة ---- */
@media print { .q-pill, .q-top, .q-prog, .q-ov, .q-toast, .q-skip, nav, footer, .foot, .top, .hero .actions, button, .btn { display: none !important; } body { background: #fff !important; color: #000 !important; } a::after { content: "" !important; } }

/* ---- هل كانت الصفحة مفيدة؟ ---- */
.q-fb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 28px auto 8px; padding: 12px 16px; border: 1px dashed var(--line, #D3D6DB); border-radius: 14px; background: var(--brand-50, #F3F4F6); color: var(--ink, #1B1C1F); font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif; font-size: .95rem; max-width: 720px; direction: rtl; }
.q-fb .q-fbt { font-weight: 800; }
.q-fb button { font: 700 .9rem/1 inherit; padding: 8px 14px; border-radius: 99px; border: 1.5px solid var(--brand, #F27A1A); background: transparent; color: var(--brand-700, #B44F05); cursor: pointer; }
.q-fb button:hover { background: var(--brand, #F27A1A); color: #fff; }
.q-fb .q-fbf { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.q-fb .q-fbf input { flex: 1; min-width: 200px; padding: 8px 12px; border: 1.5px solid var(--line, #D3D6DB); border-radius: 10px; font: inherit; background: #fff; color: inherit; }
html[data-q-theme="dark"] .q-fb .q-fbf input { background: #1F1611; }
.q-fb .q-fbx { border-color: var(--line, #D3D6DB); color: var(--muted, #6B6F76); }
@media print { .q-fb { display: none !important; } }

/* ---- تجربة القراءة: فهرس، روابط عناوين، مشاركة، اقرأ أيضًا ---- */
.q-toc { margin: 10px 0 18px; padding: 10px 16px; border: 1px solid var(--line, #D3D6DB); border-radius: 14px; background: var(--brand-50, #F3F4F6); font-size: .95rem; direction: rtl; }
.q-toc summary { cursor: pointer; font-weight: 800; list-style: none; display: flex; align-items: center; gap: 6px; }
.q-toc summary::-webkit-details-marker { display: none; }
.q-toc summary::after { content: "▾"; margin-inline-start: auto; color: var(--muted, #6B6F76); transition: .15s; }
.q-toc[open] summary::after { transform: rotate(180deg); }
.q-toc summary small { color: var(--muted, #6B6F76); font-weight: 400; }
.q-toc ol { margin: 8px 0 0; padding-inline-start: 20px; columns: 2; column-gap: 24px; }
.q-toc li { margin: 3px 0; break-inside: avoid; }
.q-toc a { color: var(--brand-700, #B44F05); text-decoration: none; }
.q-toc a:hover { text-decoration: underline; }
@media (max-width: 700px) { .q-toc ol { columns: 1; } }
.q-anc { margin-inline-start: 8px; font-size: .7em; opacity: 0; text-decoration: none; transition: .15s; vertical-align: middle; }
h2:hover .q-anc, h3:hover .q-anc, .q-anc:focus { opacity: .7; }
.q-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 26px 0 0; direction: rtl; font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif; font-size: .9rem; }
.q-share .q-fbt { font-weight: 800; }
.q-share a, .q-share button { font: 700 .85rem/1 inherit; padding: 8px 14px; border-radius: 99px; border: 1.5px solid var(--line, #D3D6DB); background: var(--q-panel, #fff); color: var(--ink, #1B1C1F); text-decoration: none; cursor: pointer; }
.q-share a:hover, .q-share button:hover { border-color: var(--brand, #F27A1A); color: var(--brand-700, #B44F05); }
.q-rel { margin: 22px 0 0; direction: rtl; font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif; }
.q-rel h3 { font-size: 1.05rem; margin: 0 0 10px; }
.q-relg { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.q-reli { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--line, #D3D6DB); border-radius: 14px; background: var(--q-panel, #fff); color: var(--ink, #1B1C1F); text-decoration: none; transition: .15s; }
.q-reli:hover { border-color: var(--brand, #F27A1A); transform: translateY(-1px); }
.q-reli i { font-style: normal; font-size: 1.3rem; flex: none; }
.q-reli b { display: block; font-size: .95rem; line-height: 1.5; }
.q-reli small { display: block; color: var(--muted, #6B6F76); font-size: .78rem; line-height: 1.4; margin-top: 2px; }
@media print { .q-share, .q-rel, .q-anc { display: none !important; } .q-toc { break-inside: avoid; } }

/* ---- اللغات داخل قائمة الوضع + اتجاه الطبقة في الصفحات اللاتينية ---- */
.q-thl { font-size: .74rem; color: var(--q-muted); font-weight: 800; padding: 8px 10px 2px; border-top: 1px solid var(--q-line); margin-top: 4px; }
.q-thn { font-size: .7rem; color: var(--q-muted); padding: 2px 10px 6px; }
.q-thm button small { color: var(--q-muted); font-weight: 400; }
html[dir="ltr"] :is(.q-pal, .q-thm, .q-fb, .q-share, .q-rel, .q-toc, .q-toast, .q-pill, .q-it) { direction: ltr; }
html[dir="ltr"] .q-pill, html[dir="ltr"] .q-th { left: auto; }
html[dir="ltr"] .q-th { right: 18px; }
html[dir="ltr"] .q-pill { right: 68px; }
html[dir="ltr"] .q-thm { left: auto; right: 18px; }
html[dir="ltr"] .q-top { right: auto; left: 18px; }
/* الفهرس والمشاركة: ألوان صريحة من الطبقة نفسها حتى لا يرث لون نص فاتح من خلفية داكنة (مثل هيرو الأكاديمية) */
.q-toc { background: var(--q-panel) !important; color: var(--q-ink) !important; border-color: var(--q-line) !important; text-align: start; }
.q-toc summary, .q-toc li { color: var(--q-ink) !important; }
.q-toc summary small, .q-toc li::marker { color: var(--q-muted) !important; }
.q-toc a { color: var(--q-acc) !important; }
.q-share .q-fbt, .q-rel h3 { color: inherit; }
.q-share a, .q-share button, .q-reli { background: var(--q-panel) !important; color: var(--q-ink) !important; border-color: var(--q-line) !important; }

/* أزرار المشاركة بلوجو كل تطبيق */
.q-share a, .q-share button { display: inline-flex !important; align-items: center; gap: 7px; font-family: 'Almarai', 'Segoe UI', Tahoma, sans-serif !important; font-size: .88rem !important; font-weight: 700 !important; line-height: 1 !important; padding: 8px 14px 8px 12px !important; }
.q-si { width: 18px; height: 18px; flex: none; }
.q-s-wa .q-si { color: #25D366; } .q-s-tg .q-si { color: #229ED9; } .q-s-x .q-si { color: var(--q-ink); } .q-s-li .q-si { color: #0A66C2; } .q-cp .q-si { color: var(--q-brand); }
.q-share a.q-s-wa:hover { background: #25D366 !important; border-color: #25D366 !important; color: #fff !important; }
.q-share a.q-s-tg:hover { background: #229ED9 !important; border-color: #229ED9 !important; color: #fff !important; }
.q-share a.q-s-x:hover { background: #000 !important; border-color: #000 !important; color: #fff !important; }
.q-share a.q-s-li:hover { background: #0A66C2 !important; border-color: #0A66C2 !important; color: #fff !important; }
.q-share .q-cp:hover { background: var(--q-brand) !important; border-color: var(--q-brand) !important; color: #fff !important; }
.q-share a:hover .q-si, .q-share button:hover .q-si { color: #fff; }
/* لوجو قسورة بدل إيموجي الأسد في الكروت ونتائج البحث */
.q-lion { width: 1.35em; height: 1.35em; object-fit: contain; vertical-align: middle; border-radius: 6px; }
.q-reli i .q-lion { width: 30px; height: 30px; }

/* زر حساب قسورة الموحّد */
.q-ac { position: fixed; bottom: 68px; left: 18px; z-index: 9990; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .12); background: var(--q-pill); color: #F4ECE4 !important; font: 800 1.05rem/1 'Almarai', 'Segoe UI', Tahoma, sans-serif; display: grid; place-items: center; text-decoration: none !important; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .6); }
.q-ac:hover { background: #2A1F18; }
.q-ac.in { background: linear-gradient(135deg, #F27A1A, #B44F05); border-color: transparent; }
html[dir="ltr"] .q-ac { left: auto; right: 18px; }
@media print { .q-ac { display: none !important; } }
/* بطاقات داخل الأقسام الداكنة (مثل «حلولنا» في الموقع الرئيسي) تبقى على خلفيتها الداكنة في كل الأوضاع، وإلا تصبح عناوينها البيضاء غير مقروءة */
html[data-q-theme="gray"] .section.dark .card, html[data-q-theme="dark"] .section.dark .card, html[data-q-theme="gray"] .dark .card { background-color: transparent !important; border-color: rgba(255, 255, 255, .14) !important; }
html[data-q-theme="gray"] .section.dark :is(h2, h3, h4), html[data-q-theme="dark"] .section.dark :is(h2, h3, h4) { color: #fff; }
html[data-q-theme="gray"] .section.dark :is(p, li, span, small):not(.btn):not(.eyebrow), html[data-q-theme="dark"] .section.dark :is(p, li, span, small):not(.btn):not(.eyebrow) { color: #E9DDD2; }