@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700&display=swap');
:root{
  --primary:#1e3a8a;
  --accent:#6d28d9;
  --muted:#dbeafe;
  --card:#ffffff;
}
*{box-sizing:border-box}
body{font-family:'Cairo',sans-serif;background:linear-gradient(135deg,#e6f0ff,#f8fbff);margin:0;color:#0b1220;direction:rtl}
.container{max-width:1200px;margin:28px auto;padding:18px}
.header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.title{font-size:22px;color:var(--primary);font-weight:700}
.controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
select,input,button{padding:8px 10px;border-radius:8px;border:1px solid var(--muted);font-size:14px}
button.btn{background:var(--primary);color:#fff;border:none;cursor:pointer;padding:9px 12px;border-radius:10px;font-weight:700;box-shadow:0 6px 18px rgba(30,58,138,0.08)}
button.ghost{background:transparent;border:1px solid rgba(30,58,138,0.08);color:var(--primary)}
.toolbar{display:flex;gap:8px;align-items:center}
.main{margin-top:18px}
.group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.card{background:var(--card);padding:12px;border-radius:12px;box-shadow:0 6px 22px rgba(12,25,50,0.06)}
.card h3{margin:0 0 8px 0;color:var(--accent);font-size:16px}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;margin-top:8px}
thead th{background:#eef6ff;padding:8px;text-align:center;font-weight:700;color:#0b2340;border-bottom:1px solid #edf3fb}
td,th{padding:6px;text-align:center;border-bottom:1px solid #f3f6fb}
.input-num{width:72px;padding:6px;border-radius:8px;border:1px solid #e6eefb;text-align:center}
.total-cell{font-weight:800;color:#13407a}
.percent-cell{font-weight:700;color:#0b8a4d}
.actions-row{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}
.small{padding:6px 8px;font-size:13px;border-radius:8px}
.chart-mini{height:160px;width:100%}
.popup-backdrop{position:fixed;inset:0;background:rgba(11,17,32,0.45);display:flex;align-items:center;justify-content:center;z-index:9999}
.popup{width:420px;background:rgba(255,255,255,0.9);backdrop-filter:blur(6px);border-radius:12px;padding:18px;box-shadow:0 10px 40px rgba(13,22,47,0.15)}
.popup h2{margin:0 0 8px 0;color:var(--primary)}
.popup .row{display:flex;gap:8px;align-items:center;margin-top:10px}
.footer{margin-top:14px;text-align:center;color:#48607f;font-weight:600}