/* ══════════════════════════════════════════════════════════════════
   فريد — ثيمة «فُسيفساء»
   طبقة هويةٍ بصرية مبنيّة على شعار جمعية رعاية الأجيال (المعيّنات الأربعة).
   تُحمَّل بعد platform.css وبعد أنماط الصفحة، فتغلبها بالترتيب لا بالتخصيص.
   لا تمسّ منطق الحساب ولا الحفظ ولا نصوص المقياس — أنماطٌ فقط.
   ══════════════════════════════════════════════════════════════════ */

@font-face{font-family:"Messiri";src:url("fonts/ElMessiri-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Messiri";src:url("fonts/ElMessiri-600.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Messiri";src:url("fonts/ElMessiri-700.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  /* الأساس */
  --bg:#FBF6EC;              /* رمليّ دافئ */
  --card:#FFFFFF;
  --ink:#223B2A;             /* حبر زيتونيّ */
  --muted:#6B7A6C;
  --line:#E5DCC9;

  /* ألوان شعار أجيال — نظام النطاقات */
  --aj-red:#D8351C; --aj-amber:#F0B000; --aj-green:#62962F; --aj-blue:#3E6FB0; --aj-plum:#8E4585;

  /* إعادة ربط رموز المنصّة القديمة بلوحة فُسيفساء */
  --teal:#62962F; --teal-2:#4C7A22; --deep:#223B2A; --deep-2:#2E4A38;
  --gold:#C98A00; --gold-2:#F0B000;
  --ring:rgba(98,150,47,.20);
  --r:18px; --r-s:12px;
  --shadow:none; --shadow-lg:none;

  --hfont:"Messiri","PlexAr",Tahoma,system-ui,sans-serif;
}

body{background:var(--bg);color:var(--ink)}

/* ── الطباعة: العناوين بخطّ المصيري، والمتن بـPlex ── */
h1,h2,h3,.display,.sec h3,.hero h2,.g2pname,.idname,.g2stepm,.g2ask b,.stat .x{font-family:var(--hfont);font-weight:700}
.display{letter-spacing:0}
.brandbar h1{font-family:var(--hfont);font-weight:700}

/* ── البطاقات: حدودٌ صريحة بدل الظلال الضبابية ── */
.card{border:2px solid var(--ink);border-radius:20px;box-shadow:none;background:var(--card)}
.note{background:#FDF9F0;border:1.5px dashed var(--line);border-radius:14px;color:var(--muted)}

/* ── الأزرار ── */
.btn{background:var(--ink);border:2px solid var(--ink);border-radius:14px;color:#FBF6EC;
  box-shadow:none;font-family:var(--hfont);font-weight:700;font-size:16px}
.btn:hover{background:#2E4A38;border-color:#2E4A38;transform:none;box-shadow:none}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--ink);border:2px solid var(--ink);box-shadow:none}
.btn.ghost:hover{background:rgba(34,59,42,.06)}
.btn:disabled{opacity:.4}

/* ── الحقول ── */
input[type=text],input[type=email],input[type=password],input[type=tel],select.fx-sel{
  border:1.5px solid var(--line);border-radius:12px;background:#fff}
input:focus,select.fx-sel:focus{border-color:var(--aj-green);box-shadow:0 0 0 4px var(--ring)}
label{font-family:var(--hfont);font-weight:600;font-size:14px}

/* ── الشارة العلوية (eyebrow): معيّنٌ بدل النقطة ── */
.eyebrow{background:#FDF3DC;color:#8A5A00;border:1.5px solid #F0D79A;font-weight:700}
.eyebrow::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--aj-red);transform:rotate(45deg)}

/* ── التبويبات ── */
.tabs{background:#F3EEE2;border:1.5px solid var(--line);border-radius:999px}
.tab[aria-selected=true]{background:#fff;color:var(--ink);border:1.5px solid var(--ink);box-shadow:none}

/* ── الشريط العلويّ ── */
.topnav,.fx-topnav{background:rgba(251,246,236,.94);border-bottom:2px solid var(--ink)}
.topnav a,.fx-topnav a{color:var(--ink)}
.fx-out,.out{color:var(--aj-red)}

/* ── شرائح الاختيار وخيارات المقياس ── */
.chip{border:2px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#FBF6EC;font-weight:700}
.opt{border:2px solid #D9D2C0;border-radius:12px;background:#fff;color:#4A5B4C;box-shadow:none}
.opt:hover{border-color:var(--ink);background:#fff}
.opt[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:none;font-weight:700}

/* ── شريط التقدّم ── */
.prog{background:#EDE5D5;border-radius:999px}
.prog>i{background:linear-gradient(90deg,var(--aj-green),var(--aj-amber))}

/* ══ التقرير — الجيل الثاني ══ */
.g2sec-t{font-family:var(--hfont);font-weight:700;font-size:18px;color:var(--ink)}
.g2sec-t::before{content:"";width:12px;height:12px;background:var(--aj-red);border-radius:2px;transform:rotate(45deg)}
.g2page{border:2px solid var(--ink);border-radius:18px;background:#fff}
.g2rank{color:var(--aj-green);font-weight:700}
.g2pname{color:var(--ink)}
.g2ttl{font-family:var(--hfont);font-size:15px;font-weight:700;color:var(--ink)}
.g2ttl.green{color:var(--aj-green)}
.g2ttl.mut2{color:var(--muted)}
.g2ins{background:#F6F9F1;border-right:3px solid var(--aj-green);border-radius:10px}
.g2ins.soft{border-right-color:var(--aj-amber);background:#FDF7E8}
.g2ins.mut{border-right-color:#C4CBBF;background:#F7F6F2}
.g2act{background:#FDF7E8;border:2px solid var(--aj-amber);border-radius:12px}
.g2succ{background:#F1F7E9;border:1.5px solid #CFE0B8;border-radius:12px}
.g2bal{border:1.5px dashed #C9CFC2;border-radius:12px;background:#FAF8F3}
.g2badge.yes span{background:#F1F7E9;border:2px solid var(--aj-green);color:#3E6218}
.g2badge.near span{background:#FDF7E8;border:2px solid var(--aj-amber);color:#7A5A00}
.g2badge.tie span{background:#F3F2ED;border:2px solid #CFCBBE;color:var(--muted)}
.g2grp{border:2px solid var(--line);border-radius:12px}
.g2grp.ok{background:#F1F7E9;border-color:var(--aj-green)}
.g2grp.em{background:#FDF7E8;border-color:var(--aj-amber)}
.g2grp.no{background:#FAF8F3;border-color:#DCD5C4}
.g2grp.ok .g2gh{color:#3E6218}.g2grp.ok .ic{background:var(--aj-green)}
.g2grp.em .g2gh{color:#7A5A00}.g2grp.em .ic{background:var(--aj-amber)}
.g2grp.no .g2gh{color:var(--muted)}.g2grp.no .ic{background:#B9B4A6}
.g2nopred,.g2lead,.pairbox{background:#FDF7E8;border:2px solid var(--aj-amber);border-radius:14px}
.g2lead b{color:var(--aj-green)}
.pairttl{font-family:var(--hfont);color:#8A5A00;font-weight:700;font-size:14px}

/* بطاقة القوّة والبصمة */
.idcard{background:var(--ink);border-radius:20px}
.idcard::before{background:var(--aj-amber);opacity:.16}
.idcard::after{background:var(--aj-green);opacity:.14}
.idkick{color:var(--aj-amber)}
.g2stamp{background:#fff;border:2px solid var(--ink);border-radius:16px}
.g2slot{background:#EDE5D5;border:1px solid #E0D7C4;border-radius:6px}
.g2slot.on{border:none;border-radius:7px}
.g2slot.on.yes{background:var(--aj-green)}
.g2slot.on.near{background:var(--aj-amber)}
.g2slot.on.tie{background:var(--aj-blue)}
.g2ms.hot.yes{background:var(--aj-green)}
.g2ms.hot.near{background:var(--aj-amber)}
.g2ms.hot.tie{background:var(--aj-blue)}
.g2step{background:linear-gradient(150deg,#223B2A,#2E4A38);border-radius:18px}
.g2step .glow{background:rgba(240,176,0,.20)}
.g2stepk{color:var(--aj-amber)}
.g2stepm b{color:#A8D97A}
.g2ask{background:var(--ink);border-radius:14px}
.g2ask b{color:var(--aj-amber);font-family:var(--hfont)}
.envrow .envdot,.g2whr span:first-child{color:var(--aj-red)}
.threshold{color:var(--muted)}

/* ══ الهبوط ══ */
.sitenav{background:rgba(251,246,236,.94);border-bottom:2px solid var(--ink)}
.sitenav .cta{background:var(--ink);color:#FBF6EC;border-radius:12px;font-family:var(--hfont)}
.sitenav .logochip{border:1.5px solid var(--line);box-shadow:none;border-radius:12px}
.hero{background:
   radial-gradient(760px 420px at 88% -8%, rgba(240,176,0,.13), transparent 60%),
   radial-gradient(620px 380px at 6% 108%, rgba(216,53,28,.10), transparent 58%),
   var(--bg)}
.hero .logos .chip{box-shadow:none;border:2px solid var(--ink);border-radius:18px}
.hero .kick{background:#FDF3DC;border:1.5px solid #F0D79A;color:#8A5A00;font-weight:700}
.hero .facts b{color:var(--ink);font-family:var(--hfont)}
.dom{border:2px solid var(--ink);border-radius:18px;box-shadow:none}
.dom .ic{border-radius:11px}
.dom .chips span{background:#F5F1E6;color:#4A5B4C;border-radius:8px}
.jstep{background:#fff;border:2px solid var(--ink);border-radius:16px}
.jstep .n{background:#FDF3DC;color:#8A5A00;box-shadow:none;border:1.5px solid #F0D79A;font-family:var(--hfont)}
.jstep b{color:var(--ink);font-family:var(--hfont)}
.jstep.now{background:#F1F7E9;border-color:var(--aj-green)}
.jstep.now::after{background:var(--aj-green)}
.ri{background:#fff;border:1.5px solid var(--line);border-radius:12px}
.ri b{color:var(--aj-green);font-family:var(--hfont)}
.stat{background:#fff;border:2px solid var(--ink);border-radius:18px}
.stat .x{color:var(--aj-green)}
.step .sn{background:#FDF3DC;color:#8A5A00;font-family:var(--hfont)}
.ajial .lchip{border:2px solid var(--ink);box-shadow:none;border-radius:18px}
.mv .m{background:#fff;border:1.5px solid var(--line);border-radius:12px}
.mv .m b{color:var(--aj-red);font-family:var(--hfont)}
.dom:nth-of-type(1) .ic{background:#EAF1FB !important}
.dom:nth-of-type(2) .ic{background:#FDF3DC !important}
.dom:nth-of-type(3) .ic{background:#FBEBE8 !important}
.dom:nth-of-type(4) .ic{background:#F3EAF3 !important}
.dom:nth-of-type(5) .ic{background:#F1F7E9 !important}

/* ══ واجهة الحملة (تظهر أيام المناسبة فقط) ══ */
.cmp{background:
  radial-gradient(900px 520px at 12% 18%, rgba(96,140,235,.30), transparent 62%),
  radial-gradient(700px 460px at 88% 82%, rgba(38,60,140,.42), transparent 60%),
  linear-gradient(160deg,#0B1030 0%,#151F52 45%,#0E1533 100%);
  color:#EDF1FF;position:relative;overflow:hidden;border-bottom:3px solid var(--aj-amber)}
.cmp-in{max-width:1000px;margin:0 auto;padding:34px 20px 0;display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:end}
@media(max-width:820px){.cmp-in{grid-template-columns:1fr;padding:26px 18px 0;gap:6px}}
.cmp-txt{padding-bottom:34px}
.cmp-logo{height:74px;width:auto;display:block;margin-bottom:18px}
@media(max-width:560px){.cmp-logo{height:58px}}
@media(max-width:560px){.cmp-logo{height:42px}}
.cmp h1{font-family:var(--hfont);font-weight:700;font-size:40px;line-height:1.3;margin:0 0 14px;color:#fff}
@media(max-width:820px){.cmp h1{font-size:30px}}
.cmp h1 em{font-style:normal;color:var(--aj-amber)}
.cmp p{font-size:15.5px;line-height:2;color:#C3CCF2;margin:0 0 22px;max-width:430px}
.cmp p b{color:#fff}
.cmp-cta{display:inline-block;background:var(--aj-amber);color:#2A1F00;font-family:var(--hfont);font-weight:700;
  font-size:17px;padding:14px 32px;border-radius:14px;text-decoration:none;border:2px solid var(--aj-amber)}
.cmp-cta:hover{background:#FFC22B;border-color:#FFC22B}
.cmp-fig{position:relative;min-height:300px;display:flex;align-items:flex-end;justify-content:center}
.cmp-fig>img{width:100%;max-width:330px;height:auto;display:block;filter:drop-shadow(0 18px 40px rgba(0,0,0,.45))}
@media(max-width:820px){.cmp-fig>img{max-width:250px}.cmp-fig{min-height:230px}}
.cmp .ch{position:absolute;font-size:12.5px;font-weight:700;line-height:1.5;padding:9px 13px;border-radius:12px;
  background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.34);color:#fff;
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);max-width:135px;text-align:center}
.cmp .ch1{top:12%;inset-inline-start:0}
.cmp .ch2{top:34%;inset-inline-end:2%;border-color:rgba(120,160,255,.6);background:rgba(60,90,200,.28)}
.cmp .ch3{bottom:24%;inset-inline-start:2%;border-color:rgba(240,140,60,.55);background:rgba(200,90,30,.24)}
.cmp .ch4{bottom:6%;inset-inline-end:6%}
@media(max-width:520px){.cmp .ch{font-size:11px;padding:7px 10px;max-width:110px}}
/* لافتة الحملة القديمة تُخفى حين تظهر الواجهة الكبرى */
.cmp-on #ydstrip{display:none !important}


/* ══════════════════════════════════════════════════════════════
   التقرير: خلفياتٌ فاتحة لا داكنة — أوضح للقراءة، وأنظف للطباعة،
   ويظهر فيها شعار الجمعية على أرضيته البيضاء كما صُمِّم.
   ══════════════════════════════════════════════════════════════ */
.idcard{background:#FFFDF7;border:2px solid var(--ink);box-shadow:none}
.idcard::before,.idcard::after{display:none}
.idkick{color:#8A5A00}
.idname{color:var(--ink)}
.iddate{color:var(--muted)}
.idlbl{color:var(--muted)}
.idavatar{background:#FDF3DC;color:#8A5A00;border:2px solid #F0D79A}
.idfoot{border-top:1.5px solid var(--line)}
.idfoot span{color:var(--muted)}
.logochip{background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:7px 12px;gap:12px}
.logochip img{height:38px}
@media(max-width:560px){.logochip img{height:30px}}

.g2step{background:#FDF7E8;border:2px solid var(--aj-amber);color:var(--ink)}
.g2step .glow{display:none}
.g2stepk{color:#8A5A00}
.g2stepm{color:var(--ink)}
.g2stepm b{color:#3E6218}
.g2steps{color:var(--muted);border-top:1.5px dashed #E4CF9C}
.g2ask{background:#F4F8F0;border:2px solid var(--aj-green);color:var(--ink)}
.g2ask b{color:#3E6218}

/* ترويسة الشعارين في أعلى التقرير */
.fx-brandhead{border-bottom:2px solid var(--aj-amber);gap:26px}
.fx-brandhead img{height:70px}
@media(max-width:560px){.fx-brandhead img{height:52px}}
