/* app.css — طبقة الهوية لصفحات الباقات وابدأ وحسابي (body.page-app) فوق brand.css.
   تُحمَّل بعد الأنماط المضمّنة في الصفحة وتعيد ألوانها إلى رموز الهوية؛ لا تغيّر التخطيط. حلّت محل app-theme.css في 21/10/2026. */
:root{--soft:var(--muted);--gold-bg:var(--sunk);--ok:#1F5A3A;--warn:var(--ochre-ink)}
body.page-app{display:block;min-height:auto;padding:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);line-height:1.85}
body.page-app main{max-width:1040px;margin:0 auto;padding:1.5rem clamp(16px,3vw,28px) 3rem}
body.page-app .wrap{max-width:860px;margin:0 auto}
body.page-app main.card{max-width:600px;margin:2rem auto 3rem}
body.page-app h1{font-family:var(--f-display);font-weight:700;color:var(--heading);font-size:clamp(1.4rem,2.6vw,1.9rem);line-height:1.3;margin:.2em 0 .5em}
body.page-app h2{font-family:var(--f-display);color:var(--heading)}
body.page-app .head{margin-bottom:4px}
body.page-app .card{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 30px rgba(31,58,95,.08)}
body.page-app p.wel,body.page-app .muted{color:var(--ink2)}
body.page-app .btn{background:var(--accent-fill);color:var(--on-accent);font-family:var(--f-body);box-shadow:none}
body.page-app .btn:hover{background:var(--accent-hover);filter:none}
body.page-app .btn.alt{background:var(--ochre-ink);color:var(--on-accent)}
body.page-app .btn.gold{background:var(--ochre);color:#16253B}
body.page-app .btn.ghost{background:var(--sunk);color:var(--ink);border:1px solid var(--line)}
body.page-app .prod{border-color:var(--line);background:var(--surface)}
body.page-app .prod.hi,body.page-app .prod.cur{border-color:var(--ochre);box-shadow:0 0 0 3px rgba(200,137,43,.18)}
body.page-app .prod .nm{color:var(--heading)}
body.page-app .prod .pts{color:var(--ink2)}
body.page-app td.n{color:var(--heading)}
body.page-app th{color:var(--muted)}
body.page-app th,body.page-app td{border-color:var(--line)}
body.page-app .steps,body.page-app .kv div{background:var(--sunk);color:var(--ink)}
body.page-app .meter{background:var(--sunk)} body.page-app .meter i{background:var(--accent-fill)} body.page-app .meter.warn i{background:var(--ochre)}
body.page-app .url{background:var(--surface);border-color:var(--line)} body.page-app .url code{color:var(--ink)}
body.page-app .url button{background:var(--accent-fill);color:var(--on-accent)}
body.page-app .ok,body.page-app .note,body.page-app .pill.ok{background:rgba(31,90,58,.12);color:var(--ok)}
body.page-app .warn{background:rgba(200,137,43,.14);color:var(--ochre-ink)}
body.page-app .badge{background:var(--sunk);color:var(--ochre-ink)}
body.page-app .foot{color:var(--muted)} body.page-app .foot a{color:var(--link)}
body.page-app a.sw{color:var(--muted)}
body.page-app .langs{display:none}
body.page-app .faq p{color:var(--heading)} body.page-app .faq div{color:var(--ink2)}
/* الوضع الليلي: الرموز تتبدّل في brand.css؛ هنا ما كان لونه ثابتًا فقط */
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.page-app .ok,html:not([data-theme="light"]) body.page-app .note,html:not([data-theme="light"]) body.page-app .pill.ok{background:rgba(31,90,58,.35);color:#BFE3CC}
html:not([data-theme="light"]) body.page-app .warn{color:#E2B26A} html:not([data-theme="light"]) body.page-app .card{box-shadow:none}
html:not([data-theme="light"]) body.page-app .btn.gold{color:#16253B}}
html[data-theme="dark"] body.page-app .ok,html[data-theme="dark"] body.page-app .note,html[data-theme="dark"] body.page-app .pill.ok{background:rgba(31,90,58,.35);color:#BFE3CC}
html[data-theme="dark"] body.page-app .warn{color:#E2B26A} html[data-theme="dark"] body.page-app .card{box-shadow:none}
/* إطار البطاقة أوضح في الوضع الليلي */
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.page-app .card{border-color:#2E4260;background:#162335}}
html[data-theme="dark"] body.page-app .card{border-color:#2E4260;background:#162335}
/* المرحلة الثانية — الباقات (21/10) */
body.page-app .prod{position:relative}
body.page-app .badge-hi{position:absolute;top:-.8rem;inset-inline-start:50%;transform:translateX(50%);background:var(--ochre);color:#16253B;font-size:.78rem;font-weight:700;padding:.2rem .8rem;border-radius:999px;white-space:nowrap}
[dir="ltr"] body.page-app .badge-hi{transform:translateX(-50%)}
body.page-app .prod .who{font-size:.82rem;color:var(--muted);margin-top:-.3rem}
body.page-app .trustline{text-align:center;font-size:.86rem;color:var(--ink2);margin:0 0 1rem;padding:.5rem .8rem;background:var(--sunk);border-radius:10px}
body.page-app details.fold summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:.5rem}
body.page-app details.fold summary::-webkit-details-marker{display:none}
body.page-app details.fold summary h2{margin:0;display:inline}
body.page-app details.fold summary::before{content:"+";font-weight:700;color:var(--ochre-ink);width:1.2rem;display:inline-block;text-align:center}
body.page-app details.fold[open] summary::before{content:"−"}
body.page-app details.fold[open] summary{margin-bottom:.6rem}
body.page-app details.trouble{text-align:start;background:var(--sunk);border-radius:12px;padding:.8rem 1rem;margin:14px 0 6px}
body.page-app details.trouble summary{cursor:pointer;font-weight:700;color:var(--heading)}
body.page-app details.trouble ul{margin:.5rem 0 0;padding-inline-start:1.2rem;line-height:1.9;font-size:.9rem}

/* 23/10/2026: داخل summary يصير h2 سطريًّا فتنهار نقطة main h2::before إلى مستطيل خلف أول حرف؛ علامة +/− تكفي */
body.page-app details.fold summary h2::before{display:none}
/* 23/10/2026: شريط العنوان (hero) في صفحة الباقات على نمط صفحات المحتوى */
body.page-app .hero{text-align:center;padding:2.4rem 1.2rem}
body.page-app .hero h1{font-size:1.9rem;margin:0;color:var(--on-band)}
body.page-app .hero p{color:var(--on-band-soft);max-width:760px;margin:.7rem auto 0;font-size:1.05rem;line-height:1.9}
body.page-app .hero + main{padding-top:1.5rem}