/* ستايل مشترك للصفحات العامة: الخصوصية / الشروط / أصحاب الأفكار (الألوان من theme.css) */
:root { color-scheme: dark; --bg:#0b0418; --bg2:#110826; --card:rgba(30,16,64,.72); --line:rgba(var(--accent-rgb,167,139,250),.2); --text:#f1edff; --muted:#a9a2c9; --v1:#7c3aed; --v2:#9d5cf6; --v3:#c4b5fd; }
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; scroll-padding-top:96px; max-width:100%; overflow-x:hidden; overflow-x:clip; }
body { background:linear-gradient(180deg,var(--bg-top,#14082b) 0%,var(--bg) 60%); color:var(--text); font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif; line-height:1.85; min-height:100vh; max-width:100%; overflow-x:hidden; overflow-x:clip; position:relative; }
body::before { content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background: linear-gradient(118deg,transparent 38%,rgba(var(--accent-rgb,167,139,250),.05) 50%,transparent 62%),
              radial-gradient(900px 520px at 50% -10%,rgba(var(--primary-rgb,124,58,237),.38),transparent 66%),
              radial-gradient(640px 440px at -5% 85%,rgba(var(--primary-rgb,124,58,237),.2),transparent 62%); }
a { color:var(--v3); text-decoration:none; } a:hover { filter:brightness(1.15); }
img { max-width:100%; }
.progress { position:fixed; top:0; inset-inline:0; height:3px; z-index:80; background:transparent; }
.progress > i { display:block; height:100%; width:0; background:linear-gradient(90deg,var(--v1),var(--v3)); box-shadow:0 0 12px rgba(var(--accent-rgb,167,139,250),.8); }

/* ===== Navbar ===== */
.nav { position:sticky; top:0; z-index:60; backdrop-filter:blur(18px) saturate(1.5); -webkit-backdrop-filter:blur(18px) saturate(1.5);
  background:linear-gradient(180deg,rgba(var(--nav-1-rgb,26,12,52),.88),rgba(var(--nav-2-rgb,15,7,32),.74)); box-shadow:0 12px 34px rgba(0,0,0,.35); }
.nav::after { content:''; position:absolute; inset-inline:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb,167,139,250),.55),transparent); }
.nav-in { max-width:1180px; margin:0 auto; padding:10px 20px; display:flex; align-items:center; gap:18px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:800; font-size:20px; color:var(--text); }
.brand-logo { width:40px; height:40px; object-fit:contain; filter:drop-shadow(0 4px 14px rgba(var(--accent-rgb,167,139,250),.55)); transition:transform .25s; } .brand:hover .brand-logo { transform:rotate(-6deg) scale(1.06); }
.links { display:flex; gap:2px; margin-inline-start:auto; align-items:center; padding:4px; border-radius:100px; background:rgba(var(--accent-rgb,167,139,250),.08); border:1px solid rgba(var(--accent-rgb,167,139,250),.2); }
.links a { color:var(--muted); height:34px; display:inline-flex; align-items:center; padding:0 15px; border-radius:100px; font-size:13.5px; font-weight:600; transition:.2s; }
.links a:hover { color:#fff; background:rgba(var(--accent-rgb,167,139,250),.16); }
.links a.cta:not(.active) { color:var(--v3); }
.links a.active { color:#fff; background:linear-gradient(135deg,var(--v1,#7c3aed),var(--v2,#9d5cf6) 55%,var(--v3,#b794fb)); box-shadow:0 4px 16px rgba(var(--primary-rgb,124,58,237),.5), inset 0 1px 0 rgba(255,255,255,.25); }
.lang { display:flex; gap:4px; padding:3px; border:1px solid var(--line); border-radius:100px; margin-inline-start:6px; }
.lang button { background:transparent; color:var(--muted); border:0; border-radius:100px; padding:5px 12px; cursor:pointer; font-family:inherit; font-size:13px; font-weight:700; }
.lang button.active { background:var(--v1); color:#fff; }
.burger { display:none; margin-inline-start:auto; background:transparent; border:1px solid var(--line); color:var(--text); width:42px; height:42px; border-radius:12px; font-size:18px; cursor:pointer; }
@media (max-width:820px) {
  .burger { display:block; }
  .links { position:absolute; top:100%; inset-inline:0; flex-direction:column; align-items:stretch; border-radius:0 0 18px 18px; background:rgba(var(--nav-2-rgb,15,7,32),.98); padding:12px 16px 18px; display:none; margin:0; gap:6px; }
  .links.open { display:flex; } .links a { justify-content:center; } .lang { align-self:center; margin:6px 0 0; }
}

/* ===== Hero ===== */
.hero { max-width:900px; margin:0 auto; padding:46px 20px 18px; text-align:center; position:relative; }
.hero-mascot { width:150px; height:150px; margin:0 auto 6px; display:block; object-fit:contain; filter:drop-shadow(0 16px 38px rgba(var(--primary-rgb,124,58,237),.65)); animation:float 5s ease-in-out infinite; }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } }
.badge { display:inline-flex; align-items:center; gap:8px; padding:6px 16px; border-radius:100px; border:1px solid var(--line); background:rgba(var(--accent-rgb,167,139,250),.1); color:var(--v3); font-size:13px; font-weight:700; margin-bottom:14px; }
.hero h1 { font-size:clamp(30px,5.4vw,48px); font-weight:800; line-height:1.25; background:linear-gradient(135deg,#fff 15%,var(--v3) 55%,var(--v2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero .lead { margin:12px auto 0; max-width:640px; color:var(--muted); font-size:16px; }
.meta { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 12px; margin-top:16px; }
.meta > span { font-size:12.5px; color:var(--muted); border:1px solid var(--line); border-radius:100px; padding:4px 13px; background:rgba(var(--accent-rgb,167,139,250),.06); }
.meta i { color:var(--v3); margin-inline-end:6px; }

/* ===== At a glance ===== */
.glance { max-width:1180px; margin:26px auto 8px; padding:0 20px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.g-card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; position:relative; overflow:hidden; backdrop-filter:blur(12px); transition:transform .25s, border-color .25s; }
.g-card:hover { transform:translateY(-4px); border-color:var(--v2); }
.g-card .ic { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; font-size:18px; color:#fff; background:linear-gradient(135deg,var(--v1),var(--v2)); box-shadow:0 8px 20px rgba(var(--primary-rgb,124,58,237),.45); margin-bottom:10px; }
.g-card h3 { font-size:15.5px; margin-bottom:4px; } .g-card p { color:var(--muted); font-size:13.5px; line-height:1.7; }

/* ===== Layout ===== */
.layout { max-width:1180px; margin:22px auto 0; padding:0 20px 70px; display:grid; grid-template-columns:250px minmax(0,1fr); gap:28px; align-items:start; }
.toc { position:sticky; top:92px; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:14px; max-height:calc(100vh - 120px); overflow:auto; backdrop-filter:blur(12px); }
.toc h4 { font-size:12px; letter-spacing:.5px; text-transform:uppercase; color:var(--muted); margin:2px 6px 8px; }
.toc a { display:block; padding:7px 10px; border-radius:10px; font-size:13.5px; color:var(--muted); font-weight:600; border-inline-start:2px solid transparent; transition:.15s; }
.toc a:hover { color:#fff; background:rgba(var(--accent-rgb,167,139,250),.1); }
.toc a.on { color:#fff; background:rgba(var(--primary-rgb,124,58,237),.25); border-inline-start-color:var(--v3); }
.toc .tools { display:flex; gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }
.toc .tools button { flex:1; font-family:inherit; font-size:12.5px; font-weight:700; color:var(--v3); background:rgba(var(--accent-rgb,167,139,250),.08); border:1px solid var(--line); border-radius:10px; padding:7px; cursor:pointer; }
.toc .tools button:hover { background:rgba(var(--accent-rgb,167,139,250),.18); }
@media (max-width:980px) { .layout { grid-template-columns:1fr; } .toc { position:static; max-height:none; display:flex; flex-wrap:wrap; gap:6px; } .toc h4, .toc .tools { display:none; } .toc a { border:1px solid var(--line); border-radius:100px; padding:5px 12px; font-size:12.5px; } }

/* ===== Content ===== */
.content { display:flex; flex-direction:column; gap:16px; min-width:0; }
.sec { counter-reset:s; display:flex; flex-direction:column; gap:16px; }
.sec-card { counter-increment:s; position:relative; background:var(--card); border:1px solid var(--line); border-radius:22px; padding:26px 28px; backdrop-filter:blur(14px); box-shadow:0 20px 60px rgba(0,0,0,.28); scroll-margin-top:96px; }
.sec-card::before { content:''; position:absolute; inset-block:22px; inset-inline-start:0; width:3px; border-radius:3px; background:linear-gradient(180deg,var(--v1),var(--v3)); }
.sec-card h2 { display:flex; align-items:center; gap:12px; font-size:19px; margin-bottom:10px; color:#fff; }
.sec-card h2 .num { flex:0 0 34px; height:34px; border-radius:11px; display:grid; place-items:center; font-size:14px; font-weight:800; background:linear-gradient(135deg,var(--v1),var(--v2)); box-shadow:0 6px 16px rgba(var(--primary-rgb,124,58,237),.45); }
.sec-card h2 .num::before { content:counter(s); }
.sec-card h2 i { color:var(--v3); font-size:16px; }
.sec-card p { color:#d8d3ef; margin-bottom:8px; } .sec-card b { color:#fff; }
.sec-card ul { padding-inline-start:22px; color:#d8d3ef; margin:6px 0 8px; } .sec-card li { margin:6px 0; } .sec-card li::marker { color:var(--v2); }
.callout { display:flex; gap:12px; align-items:flex-start; padding:12px 16px; border-radius:14px; margin:10px 0 4px; font-size:14px; border:1px solid; }
.callout i { margin-top:4px; }
.callout.good { background:rgba(59,165,92,.1); border-color:rgba(59,165,92,.4); color:#c8f5d6; } .callout.good i { color:#3ba55c; }
.callout.warn { background:rgba(250,166,26,.09); border-color:rgba(250,166,26,.4); color:#ffe2ad; } .callout.warn i { color:#faa61a; }
.callout.info { background:rgba(var(--primary-rgb,124,58,237),.14); border-color:rgba(var(--accent-rgb,167,139,250),.4); color:#e6dcff; } .callout.info i { color:var(--v3); }
.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:14px; margin:10px 0 4px; }
table { width:100%; border-collapse:collapse; min-width:560px; font-size:13.5px; }
th { text-align:start; padding:10px 14px; background:rgba(var(--primary-rgb,124,58,237),.22); color:#fff; font-weight:700; white-space:nowrap; }
td { padding:10px 14px; border-top:1px solid var(--line); color:#d8d3ef; vertical-align:top; } tr:hover td { background:rgba(var(--accent-rgb,167,139,250),.05); }
.tag { display:inline-block; font-size:11.5px; font-weight:700; padding:2px 10px; border-radius:100px; background:rgba(59,165,92,.15); color:#9be8b2; border:1px solid rgba(59,165,92,.4); }
.tag.no { background:rgba(237,66,69,.12); color:#ffb0b2; border-color:rgba(237,66,69,.4); }
.dd { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:8px; } @media (max-width:640px) { .dd { grid-template-columns:1fr; } }
.dd > div { border-radius:14px; padding:12px 16px; border:1px solid; } .dd .yes { background:rgba(59,165,92,.08); border-color:rgba(59,165,92,.35); } .dd .nope { background:rgba(237,66,69,.07); border-color:rgba(237,66,69,.35); }
.dd h5 { font-size:14px; margin-bottom:4px; } .dd ul { margin:0; padding-inline-start:20px; font-size:13.5px; }
.contact { text-align:center; background:linear-gradient(135deg,rgba(var(--primary-rgb,124,58,237),.35),rgba(var(--accent-rgb,167,139,250),.12)); border:1px solid rgba(var(--accent-rgb,167,139,250),.4); border-radius:24px; padding:30px 22px; box-shadow:0 24px 70px rgba(var(--primary-rgb,124,58,237),.25); }
.contact h3 { font-size:21px; margin-bottom:6px; } .contact p { color:#e6dcff; margin-bottom:16px; }
.btns { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.btn { display:inline-flex; align-items:center; gap:8px; padding:11px 24px; border-radius:100px; font-weight:700; font-size:14px; border:1px solid var(--line); color:#fff; background:rgba(255,255,255,.06); }
.btn.primary { background:linear-gradient(135deg,var(--v1),var(--v2) 55%,var(--v3)); border-color:transparent; box-shadow:0 8px 24px rgba(var(--primary-rgb,124,58,237),.5); }
.btn:hover { filter:brightness(1.12); transform:translateY(-1px); }

[data-lang] { display:none; } body.ar div[data-lang="ar"], body.en div[data-lang="en"] { display:block; } body.ar span[data-lang="ar"], body.en span[data-lang="en"] { display:inline; }
body.ar .sec[data-lang="ar"], body.en .sec[data-lang="en"] { display:flex; }

/* ===== Footer ===== */
.foot { border-top:1px solid var(--line); background:rgba(8,6,18,.7); }
.foot-in { max-width:1180px; margin:0 auto; padding:26px 20px; display:flex; flex-wrap:wrap; gap:14px 28px; align-items:center; justify-content:space-between; color:var(--muted); font-size:13.5px; }
.foot nav { display:flex; flex-wrap:wrap; gap:6px 18px; } .foot nav a { color:var(--muted); font-weight:600; } .foot nav a:hover { color:var(--v3); }
.top { position:fixed; bottom:22px; inset-inline-end:22px; width:44px; height:44px; border-radius:14px; border:1px solid var(--line); background:rgba(20,17,36,.92); color:var(--v3); cursor:pointer; font-size:17px; display:none; z-index:40; } .top.show { display:block; }
@media (max-width:600px) { .sec-card { padding:20px 18px; border-radius:18px; } .hero { padding-top:30px; } .hero-mascot { width:120px; height:120px; } }
@media print { .nav, .toc, .top, .progress, .foot, .glance, .contact, body::before { display:none !important; } body { background:#fff; color:#000; } .layout { display:block; } .sec-card { box-shadow:none; border:1px solid #bbb; background:#fff; break-inside:avoid; } .sec-card h2, .sec-card b { color:#000; } .sec-card p, .sec-card li, td { color:#222; } th { background:#eee; color:#000; } }

/* ===== مكوّنات الخصوصية والشروط ===== */
code { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; background:rgba(var(--accent-rgb,167,139,250),.12); color:var(--v3); padding:1px 7px; border-radius:7px; direction:ltr; unicode-bidi:isolate; white-space:nowrap; }
:focus-visible { outline:2px solid var(--v3); outline-offset:2px; }

/* رحلة الرسالة: خطوات متتابعة فعلاً */
.flow { list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:14px 0 12px; padding:0; }
.flow li { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; margin:0; }
.flow li::marker { content:''; }
.flow .fi { position:relative; z-index:1; width:52px; height:52px; border-radius:16px; display:grid; place-items:center; font-size:20px; color:#fff; background:linear-gradient(135deg,var(--v1),var(--v2)); box-shadow:0 8px 22px rgba(var(--primary-rgb,124,58,237),.45); }
.flow li:not(:last-child)::after { content:''; position:absolute; top:26px; inset-inline-start:calc(50% + 34px); width:calc(100% - 68px + 14px); height:2px; background:repeating-linear-gradient(90deg,var(--v3) 0 6px,transparent 6px 12px); opacity:.55; }
[dir="rtl"] .flow li:not(:last-child)::after { background:repeating-linear-gradient(270deg,var(--v3) 0 6px,transparent 6px 12px); }
.flow b { display:block; color:#fff; font-size:14.5px; margin-bottom:2px; }
.flow span:not(.fi) { display:block; color:var(--muted); font-size:13px; line-height:1.7; }
@media (max-width:760px) {
  .flow { grid-template-columns:1fr; gap:16px; }
  .flow li { flex-direction:row; text-align:start; align-items:flex-start; }
  .flow li:not(:last-child)::after { top:52px; bottom:-16px; height:auto; width:2px; inset-inline-start:25px; background:repeating-linear-gradient(180deg,var(--v3) 0 6px,transparent 6px 12px); }
  [dir="rtl"] .flow li:not(:last-child)::after { background:repeating-linear-gradient(180deg,var(--v3) 0 6px,transparent 6px 12px); }
  .flow .fi { flex:none; }
}

/* قاعدة مهمة في الشروط */
.rule { display:flex; gap:16px; align-items:flex-start; padding:16px 18px; border-radius:16px; margin:6px 0 10px; border:1px solid rgba(237,66,69,.45); background:linear-gradient(135deg,rgba(237,66,69,.13),rgba(237,66,69,.04)); }
.rule > i { flex:none; width:42px; height:42px; border-radius:12px; display:grid; place-items:center; font-size:18px; color:#fff; background:linear-gradient(135deg,#ed4245,#b3262a); box-shadow:0 8px 20px rgba(237,66,69,.35); }
.rule b { color:#fff; display:block; font-size:15.5px; margin-bottom:2px; } .rule p { margin:0; color:#f3d6d7; font-size:14px; }

/* معنى حالات الأفكار */
.states { display:flex; flex-wrap:wrap; gap:10px; margin:8px 0 4px; }
.states .st { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:700; padding:4px 12px; border-radius:100px; border:1px solid; }
.states .st-review { color:#ffe2ad; background:rgba(250,166,26,.12); border-color:rgba(250,166,26,.45); }
.states .st-progress { color:#bfe3ff; background:rgba(56,152,236,.14); border-color:rgba(56,152,236,.5); }
.states .st-done { color:#c8f5d6; background:rgba(59,165,92,.14); border-color:rgba(59,165,92,.5); }
@media print { .flow li:not(:last-child)::after { display:none; } .flow .fi { background:#eee; color:#000; box-shadow:none; } .flow b { color:#000; } .flow span:not(.fi) { color:#222; } .rule { background:#fff; border-color:#bbb; } .rule b, .rule p { color:#000; } code { background:#eee; color:#000; } }
