/* ============ الفوترة الإلكترونية ============ */
.ei-disclaimer { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted); background: var(--surface-2); border: 1px dashed var(--border); border-radius: 10px; padding: 8px 12px; margin-bottom: 14px; }
.ei-disclaimer .ic { width: 16px; height: 16px; color: var(--primary); }

/* الجاهزية */
.ei-onb { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ei-onb > div { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); font-size: 13px; }
.ei-onb .muted { font-size: 12px; }
.ei-onb b { overflow-wrap: anywhere; }
.ei-pid { color: var(--primary); }
.ei-req { gap: 10px; }
.ei-req .li-title { white-space: normal; }
.ei-band .seg button { white-space: nowrap; }
.ei-tick-btn { border: 0; background: none; padding: 0; cursor: pointer; flex: none; border-radius: 50%; }
.ei-tick-btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.ei-tick { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--warn-soft); color: var(--warn); border: 1px solid transparent; }
.ei-tick.on { background: var(--ok-soft); color: var(--ok); }
.ei-tick .ic { width: 15px; height: 15px; }
.ei-tick-btn:hover .ei-tick { border-color: currentColor; }

/* الجدول الزمني */
.ei-band { flex-wrap: wrap; margin-bottom: 12px; }
.ei-band .seg { flex-wrap: wrap; }
.ei-countdown { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 12px; background: var(--info-soft); margin-bottom: 12px; }
.ei-countdown b { font-size: 22px; line-height: 1.2; }
.ei-phases { display: flex; flex-direction: column; gap: 8px; }
.ei-phase { display: flex; flex-direction: column; gap: 2px; padding: 9px 12px; border: 1px solid var(--border); border-inline-start: 3px solid var(--border); border-radius: 10px; font-size: 12.5px; color: var(--muted); }
.ei-phase b { color: var(--text); font-size: 13px; }
.ei-phase.past { border-inline-start-color: var(--ok); }
.ei-phase.on { border-color: var(--primary); border-inline-start-color: var(--primary); background: var(--primary-soft); }
.ei-src { margin: 10px 0 0; font-size: 11.5px; color: var(--faint); line-height: 1.6; }

/* السجل */
.ei-reason { max-width: 240px; white-space: normal; color: var(--bad); }

/* الأركان الخمسة */
.ei-corners { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; counter-reset: c; }
.ei-corner { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; padding: 14px 8px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); font-size: 12.5px; }
.ei-corner .ic { width: 22px; height: 22px; color: var(--primary); }
.ei-corner.fta { background: var(--primary-soft); border-color: var(--primary); }
.ei-corner-n { position: absolute; top: 6px; inset-inline-start: 8px; font-size: 11px; font-weight: 700; color: var(--faint); }

/* التفاصيل */
.ei-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; font-size: 13px; }
.ei-meta > div { min-width: 0; }
.ei-meta .muted { display: block; font-size: 12px; }
.ei-uuid { font-size: 11.5px; overflow-wrap: anywhere; }
.ei-h4 { margin: 18px 0 8px; font-size: 13.5px; }
.ei-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ei-chk { display: flex; gap: 10px; align-items: flex-start; padding: 9px 11px; border-radius: 10px; border: 1px solid var(--border); font-size: 13px; min-width: 0; }
.ei-chk > div { min-width: 0; }
.ei-chk .cell-sub { overflow-wrap: anywhere; }
.ei-chk-ic { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.ei-chk-ic .ic { width: 14px; height: 14px; }
.ei-chk.ok .ei-chk-ic { background: var(--ok-soft); color: var(--ok); }
.ei-chk.warn .ei-chk-ic { background: var(--warn-soft); color: var(--warn); }
.ei-chk.bad { border-color: var(--bad); }
.ei-chk.bad .ei-chk-ic { background: var(--bad-soft); color: var(--bad); }
.ei-reject { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: var(--bad-soft); color: var(--bad); font-size: 13px; }
.ei-events { display: flex; flex-direction: column; gap: 0; border-inline-start: 2px solid var(--border); margin-inline-start: 16px; padding-inline-start: 14px; }
.ei-ev { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 13px; margin-inline-start: -32px; }
.ei-ev .li-ic { width: 32px; height: 32px; background: var(--surface); border: 1px solid var(--border); color: var(--ok); }
.ei-ev.bad .li-ic { color: var(--bad); border-color: var(--bad); }

/* خطوات الإرسال */
.ei-steps { display: flex; flex-direction: column; gap: 8px; }
.ei-step { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--border); color: var(--faint); font-size: 13.5px; transition: color .25s, border-color .25s, background .25s; }
.ei-step-dot { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--surface-2); border: 1px solid var(--border); font-size: 12px; font-weight: 700; }
.ei-step.run { color: var(--text); border-color: var(--primary); background: var(--primary-soft); }
.ei-step.run .ei-step-dot { border-color: var(--primary); color: var(--primary); animation: ei-pulse 1s ease-in-out infinite; }
.ei-step.done { color: var(--text); }
.ei-step.done .ei-step-dot { background: var(--ok); border-color: var(--ok); color: var(--surface); }
@keyframes ei-pulse { 50% { box-shadow: 0 0 0 5px var(--primary-soft); } }

/* معاينة XML */
.ei-xml { margin: 0; max-height: 52vh; overflow: auto; padding: 14px 16px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--border); font: 12px/1.65 ui-monospace, SFMono-Regular, Consolas, 'Courier New', monospace; color: var(--text); text-align: start; white-space: pre; tab-size: 2; }
.ei-xml .x-tag { color: var(--primary); }
.ei-xml .x-attr { color: var(--accent); }
.ei-xml .x-val { color: var(--warn); }
.ei-xml .x-com { color: var(--faint); font-style: italic; }

/* شارة صفحة الحسابات */
.ei-banner { display: flex; align-items: center; gap: 12px; padding: 10px 14px; margin-bottom: 14px; border-radius: 12px; border: 1px solid var(--info); background: var(--info-soft); color: var(--text); text-decoration: none; transition: box-shadow .15s; }
.ei-banner:hover { box-shadow: var(--shadow); }
.ei-banner.ok { border-color: var(--ok); background: var(--ok-soft); }
.ei-banner-t { display: flex; flex-direction: column; min-width: 0; flex: 1; font-size: 13.5px; }
.ei-banner-t .muted { font-size: 12px; }
.ei-banner-go { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--info); white-space: nowrap; }
.ei-banner.ok .ei-banner-go { color: var(--ok); }
.ei-banner-go .ic { width: 14px; height: 14px; }

@media (max-width: 900px) {
  .ei-corners { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .ei-onb, .ei-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ei-checks { grid-template-columns: minmax(0, 1fr); }
  .ei-corners { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ei-banner { flex-wrap: wrap; }
  .ei-banner-go { margin-inline-start: auto; }
}

/* حالة الفاتورة الإلكترونية داخل جدول الحسابات */
.ei-pill-btn { border: 0; background: none; padding: 0; cursor: pointer; }
.ei-pill-btn:hover .pill { filter: brightness(.95); text-decoration: underline; }