/* ═══════════════════════════════════════════════════════════════════
   statistics.css — تعريف الأرقام (ⓘ) + تتبّع المعاملات + كتلة الخزنتين + الاستعلام
   يستخدم نفس الرموز اللونية الدلالية لـ admin-expenses.css (تُعرَّف على .ae):
     sky = رصيد حالي (لقطة) · indigo = إجمالي فترة · slate = عدد
     teal = عادي · violet = إداري · amber = خزنة التشغيل · emerald = إيجابي · red = عجز
   ═══════════════════════════════════════════════════════════════════ */
.st-kind { display: inline-flex; align-items: center; gap: 5px; border-radius: 20px; padding: 2px 10px; font-size: .72rem; font-weight: 800; line-height: 1.7; white-space: nowrap; }
.st-kind.balance { background: var(--ae-info-bg); color: var(--ae-info); }
.st-kind.period { background: var(--ae-action-bg); color: var(--ae-action); }
.st-kind.count { background: var(--ae-surface); color: var(--ae-mute); border: 1px solid var(--ae-line); }
.st-kind.basis { background: var(--ae-oper-bg); color: var(--ae-oper); }
.st-kind.group { background: var(--ae-surface); color: var(--ae-mute); border: 1px solid var(--ae-line); }
.st-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* زر ⓘ */
.st-info { border: none; background: transparent; color: var(--ae-faint); cursor: pointer; padding: 2px 4px; border-radius: 50%; font-size: .95rem; line-height: 1; min-width: 26px; min-height: 26px; display: inline-grid; place-items: center; vertical-align: middle; transition: color .12s, background .12s; }
.st-info:hover, .st-info:focus-visible { color: var(--ae-info); background: var(--ae-info-bg); }
.st-trace { border: 1px solid var(--ae-line); background: var(--ae-card); color: var(--ae-action); cursor: pointer; width: 30px; height: 30px; border-radius: 9px; display: inline-grid; place-items: center; font-size: .78rem; flex-shrink: 0; transition: background .12s, border-color .12s; }
.st-trace:hover { background: var(--ae-action-bg); border-color: var(--ae-action); }
.st-trace-sp { display: inline-block; width: 30px; flex-shrink: 0; }

/* نافذة التعريف */
.st-def { display: flex; flex-direction: column; gap: 14px; }
.st-def section h4 { margin: 0 0 6px; font-size: .86rem; font-weight: 800; color: var(--ae-ink); display: flex; align-items: center; gap: 8px; }
.st-def section h4 i { color: var(--ae-faint); font-size: .8rem; }
.st-def section p { margin: 0; line-height: 1.9; font-size: .9rem; color: var(--ae-ink); }
.st-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.st-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.st-list li { display: flex; gap: 8px; align-items: flex-start; font-size: .85rem; line-height: 1.7; }
.st-list.yes li i { color: var(--ae-pos); margin-top: 5px; } .st-list.no li i { color: var(--ae-debt); margin-top: 5px; }
.st-none { color: var(--ae-faint); font-size: .82rem; }
.st-formula { background: var(--ae-surface); border: 1px dashed var(--ae-line); border-radius: 10px; padding: 10px 12px; font-weight: 700; font-size: .88rem; line-height: 1.9; }
.st-now { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; background: var(--ae-oper-soft); border: 1px solid color-mix(in srgb, var(--ae-oper) 30%, var(--ae-line)); border-radius: 12px; padding: 10px 14px; }
.st-now > span { font-size: .78rem; color: var(--ae-mute); font-weight: 700; } .st-now b { font-size: 1.3rem; color: var(--ae-oper); } .st-now small { color: var(--ae-mute); }
.st-kindnote { display: flex; gap: 10px; align-items: flex-start; border-radius: 12px; padding: 10px 14px; font-size: .84rem; line-height: 1.8; font-weight: 700; }
.st-kindnote.balance { background: var(--ae-info-bg); color: var(--ae-info); } .st-kindnote.period { background: var(--ae-action-bg); color: var(--ae-action); } .st-kindnote.count { background: var(--ae-surface); color: var(--ae-mute); }
.st-kindnote i { margin-top: 5px; }

/* نافذة التتبّع */
.st-trace-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.st-trace-total { margin-top: 8px; display: flex; align-items: baseline; gap: 10px; } .st-trace-total > span { font-size: .8rem; color: var(--ae-mute); font-weight: 700; } .st-trace-total b { font-size: 1.7rem; font-weight: 900; color: var(--ae-action); }
.st-recon { display: flex; gap: 8px; align-items: center; border-radius: 10px; padding: 8px 12px; font-size: .82rem; font-weight: 700; margin-bottom: 12px; }
.st-recon.ok { background: var(--ae-pos-bg); color: var(--ae-pos); } .st-recon.warn { background: var(--ae-warn-bg); color: var(--ae-warn); } .st-recon.bad { background: var(--ae-debt-bg); color: var(--ae-debt); }
.st-comp { background: var(--ae-card); border: 1px solid var(--ae-line); border-radius: 14px; overflow: hidden; }
.st-comp-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--ae-line); } .st-comp-row span:first-child { flex: 1; font-weight: 700; font-size: .9rem; }
.st-comp-row b { font-size: 1.05rem; white-space: nowrap; } .st-comp-row b.neg { color: var(--ae-debt); }
.st-comp-row.total { background: var(--ae-surface); border-bottom: none; font-weight: 900; } .st-comp-row.total b { font-size: 1.2rem; color: var(--ae-action); }
.ae-num.neg { color: var(--ae-debt); }

/* كتلة الخزنتين */
.st-mount { font-family: 'Cairo', sans-serif; }
.st-block { background: var(--ae-card); border: 1px solid var(--ae-line); border-radius: 18px; padding: 18px; box-shadow: 0 3px 14px rgba(15,23,42,.05); display: flex; flex-direction: column; gap: 14px; }
.st-block-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.st-block-head h3 { margin: 0; font-size: 1.02rem; font-weight: 800; display: flex; align-items: center; gap: 10px; }
.st-sub { font-size: .76rem; color: var(--ae-mute); line-height: 1.7; }
.st-bal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.st-bal { border: 2px solid var(--ae-line); border-radius: 16px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; background: var(--ae-card); min-width: 0; }
.st-bal.normal { border-color: color-mix(in srgb, var(--ae-normal) 35%, var(--ae-line)); background: linear-gradient(180deg, var(--ae-normal-soft), var(--ae-card) 70%); }
.st-bal.oper { border-color: color-mix(in srgb, var(--ae-oper) 40%, var(--ae-line)); background: linear-gradient(180deg, var(--ae-oper-soft), var(--ae-card) 70%); }
.st-bal.debt { border-color: color-mix(in srgb, var(--ae-debt) 50%, var(--ae-line)); background: linear-gradient(180deg, var(--ae-debt-soft), var(--ae-card) 70%); }
.st-bal-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.st-bal-name { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: .92rem; }
.st-bal-name .ae-ico { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; }
.st-bal-val { font-size: 2rem; font-weight: 900; line-height: 1.15; letter-spacing: -.3px; }
.st-bal-val small { font-size: .85rem; font-weight: 700; color: var(--ae-mute); }
.st-bal-val.normal { color: var(--ae-normal); } .st-bal-val.oper { color: var(--ae-oper); } .st-bal-val.debt { color: var(--ae-debt); }
.st-bal-sub { font-size: .8rem; color: var(--ae-mute); line-height: 1.9; }
.st-pill { display: inline-flex; align-items: center; gap: 5px; border-radius: 20px; padding: 1px 9px; font-weight: 800; font-size: .72rem; margin-inline-end: 4px; }
.st-pill.debt { background: var(--ae-debt-bg); color: var(--ae-debt); } .st-pill.pos { background: var(--ae-pos-bg); color: var(--ae-pos); } .st-pill.mute { background: var(--ae-surface); color: var(--ae-mute); border: 1px solid var(--ae-line); }
.st-link { align-self: flex-start; border: none; background: none; color: var(--ae-action); font-weight: 700; font-size: .78rem; cursor: pointer; padding: 4px 0; display: inline-flex; gap: 6px; align-items: center; margin-top: auto; }
.st-link:hover { text-decoration: underline; }
.st-foot { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; font-size: .82rem; font-weight: 700; padding: 0 2px; }
.st-foot-eq { color: var(--ae-mute); font-weight: 600; font-size: .76rem; }

/* الاستعلام عند الطلب */
.st-query { border-top: 1px dashed var(--ae-line); padding-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.st-qhead { display: flex; flex-direction: column; gap: 2px; } .st-qhead b { font-size: .92rem; font-weight: 800; }
.st-qhead b i { color: var(--ae-action); margin-inline-end: 6px; }
.st-qctl { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; justify-content: space-between; }
.st-qres { min-height: 20px; }
.st-hint { background: var(--ae-surface); border: 1px dashed var(--ae-line); border-radius: 12px; padding: 12px 14px; font-size: .8rem; color: var(--ae-mute); display: flex; gap: 10px; align-items: center; }
.st-res { border: 1px solid color-mix(in srgb, var(--ae-action) 28%, var(--ae-line)); background: color-mix(in srgb, var(--ae-action-bg) 35%, var(--ae-card)); border-radius: 16px; padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.st-res-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-weight: 800; font-size: .92rem; } .st-res-head > span:first-child i { color: var(--ae-action); margin-inline-end: 6px; }
.st-x { margin-inline-start: auto; border: none; background: var(--ae-card); border: 1px solid var(--ae-line); width: 30px; height: 30px; border-radius: 50%; cursor: pointer; color: var(--ae-mute); }
.st-x:hover { background: var(--ae-debt-bg); color: var(--ae-debt); }
.st-sec { background: var(--ae-card); border: 1px solid var(--ae-line); border-radius: 14px; padding: 12px 14px; }
.st-sec h4 { margin: 0 0 6px; font-size: .9rem; font-weight: 800; display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.st-sec h4 small { font-size: .7rem; font-weight: 700; color: var(--ae-mute); margin-inline-start: 4px; }
.st-sec h4 .ae-ico { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; font-size: .8rem; }
.st-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px dashed var(--ae-line); }
.st-row:last-child { border-bottom: none; }
.st-row.ind { padding-inline-start: 18px; position: relative; } .st-row.ind::before { content: ''; position: absolute; inset-inline-start: 4px; top: 50%; width: 8px; height: 1.5px; background: var(--ae-faint); }
.st-row.big .st-row-name { font-weight: 800; font-size: .95rem; } .st-row.big b { font-size: 1.35rem; }
.st-row-l { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; min-width: 0; flex: 1; }
.st-row-name { font-size: .86rem; font-weight: 700; } .st-row-l small { flex-basis: 100%; font-size: .72rem; color: var(--ae-mute); line-height: 1.6; }
.st-row-v { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } .st-row-v b { font-size: 1rem; font-weight: 900; white-space: nowrap; } .st-row-v b small { font-size: .68rem; font-weight: 700; color: var(--ae-mute); }
.st-row-v.oper b { color: var(--ae-oper); } .st-row-v.normal b { color: var(--ae-normal); } .st-row-v.admin b { color: var(--ae-admin); } .st-row-v.pos b { color: var(--ae-pos); } .st-row-v.debt b { color: var(--ae-debt); }
.st-asof { display: flex; gap: 10px; align-items: flex-start; font-size: .78rem; color: var(--ae-mute); line-height: 1.8; background: var(--ae-card); border: 1px dashed var(--ae-line); border-radius: 12px; padding: 10px 12px; } .st-asof i { margin-top: 5px; color: var(--ae-info); }
.st-qmodal-top { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; justify-content: space-between; margin-bottom: 14px; }
.st-res.full { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .st-res.full > .st-res-head, .st-res.full > .st-asof { grid-column: 1 / -1; }

/* الأرقام المحسوبة لمساحة العمل الإدارية: ملخص الفترة */
.st-period-card .st-row-name { font-size: .84rem; }

/* ── الهاتف ── */
@media (max-width: 1024px) {
    .st-bal-grid { grid-template-columns: 1fr; }
    .st-bal-val { font-size: 1.75rem; }
    .st-two { grid-template-columns: 1fr; }
    .st-res.full { grid-template-columns: 1fr; }
    .st-qctl { align-items: stretch; } .st-qctl .ae-btn { width: 100%; }
    .st-row-v b { font-size: .95rem; }
    .st-info { min-width: 34px; min-height: 34px; font-size: 1.05rem; }
    .st-trace { width: 36px; height: 36px; } .st-trace-sp { width: 36px; }
    .st-block { padding: 14px; }
}

/* وسم نوع الرقم داخل بطاقات لوحة التحكم القديمة */
.stat-card-v2 .st-info { color: currentColor; opacity: .55; margin-inline-start: 2px; } .stat-card-v2 .st-info:hover { opacity: 1; background: rgba(255,255,255,.22); color: inherit; }
.stat-kind-tag { display: inline-block; font-size: .66rem; font-weight: 800; border-radius: 20px; padding: 0 8px; line-height: 1.7; margin: 1px 0 2px; background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.28); }
.stats-group-cap { font-size: .68rem; font-weight: 700; opacity: .75; margin-inline-start: 8px; }

/* الموبايل: ⓘ داخل بطاقات الهيرو والبطاقات الصغيرة */
.mdash-hero .st-info, .mdash-stat-card .st-info { color: rgba(255,255,255,.85); }
.mdash-hero .st-info:hover, .mdash-stat-card .st-info:hover { background: rgba(255,255,255,.2); color: #fff; }
.mdash-hero .stat-kind-tag { margin-inline-start: 6px; }

/* الموبايل: ⓘ داخل بطاقات الهيرو والبطاقات الصغيرة */
.mdash-hero .st-info, .mdash-stat-card .st-info { color: rgba(255,255,255,.85); }
.mdash-hero .st-info:hover, .mdash-stat-card .st-info:hover { background: rgba(255,255,255,.2); color: #fff; }
.mdash-hero .stat-kind-tag { margin-inline-start: 6px; }