/* ============================================================================
   نظام أرشيف مجموعة البكري — واجهة v3 "Premium"
   Al-Bakri Group Archive — UI v3: glass shell, mesh background, rail sidebar,
   hero dashboard, rings, insights, dark mode, mobile. Legacy classes kept.
   ============================================================================ */
:root{
  --primary:#0f6b69;
  --primary-2:#12908c;
  --primary-600:#0b5654;
  --primary-dark:#083d3c;
  --primary-light:#e1f3f2;
  --primary-soft:rgba(15,107,105,.10);
  --accent:#d4a74a;
  --accent-2:#f0c96b;
  --accent-light:#fbf3df;
  --danger:#d64545;
  --danger-light:#fdecec;
  --warning:#d98f1b;
  --warning-light:#fff4e0;
  --success:#1f9d63;
  --success-light:#e6f8ee;
  --info:#2f6fd6;
  --muted:#6b7a78;
  --border:rgba(15,40,38,.10);
  --border-2:rgba(15,40,38,.16);
  --bg:#eef3f3;
  --bg-2:#e4ecec;
  --card:#ffffff;
  --card-2:#f6f9f9;
  --glass:rgba(255,255,255,.72);
  --glass-2:rgba(255,255,255,.55);
  --text:#14201f;
  --text-2:#3f4d4b;
  --radius:18px;
  --radius-sm:12px;
  --shadow-sm:0 1px 2px rgba(10,40,38,.05),0 2px 6px rgba(10,40,38,.05);
  --shadow:0 10px 30px rgba(10,40,38,.09),0 2px 6px rgba(10,40,38,.05);
  --shadow-lg:0 30px 70px rgba(8,61,60,.22);
  --glow:0 0 0 1px rgba(18,144,140,.25),0 12px 34px rgba(18,144,140,.22);
  --ring:0 0 0 4px rgba(18,144,140,.20);
  --sidebar-w:272px;
  --rail-w:84px;
  --sb-bg:linear-gradient(170deg,#0a3c3b 0%,#0f5c5b 55%,#0d6d69 100%);
  --sb-text:#cfe3e2;
  --font:"Cairo","Segoe UI","Tahoma",Arial,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --mesh:radial-gradient(900px 500px at 100% -10%,rgba(18,144,140,.16),transparent 60%),
         radial-gradient(700px 420px at -10% 110%,rgba(212,167,74,.14),transparent 60%),
         radial-gradient(600px 400px at 50% 50%,rgba(255,255,255,.5),transparent 70%);
  color-scheme:light;
}
html[data-theme="dark"]{
  --primary:#3fc3bf;
  --primary-2:#5ad6d1;
  --primary-600:#2fa8a4;
  --primary-dark:#083d3c;
  --primary-light:#0f2f2e;
  --primary-soft:rgba(63,195,191,.14);
  --accent:#e6bb5c;
  --accent-2:#f5d27f;
  --accent-light:#2b2413;
  --danger:#f27070;
  --danger-light:#3a1d1d;
  --warning:#f0b04a;
  --warning-light:#332810;
  --success:#5fd39a;
  --success-light:#12301f;
  --info:#6f9ff0;
  --muted:#93a3a1;
  --border:rgba(255,255,255,.08);
  --border-2:rgba(255,255,255,.14);
  --bg:#0b1414;
  --bg-2:#101c1b;
  --card:#131f1e;
  --card-2:#182726;
  --glass:rgba(19,31,30,.72);
  --glass-2:rgba(19,31,30,.55);
  --text:#e9f0ef;
  --text-2:#b9c6c4;
  --shadow-sm:0 1px 2px rgba(0,0,0,.5);
  --shadow:0 12px 30px rgba(0,0,0,.5);
  --shadow-lg:0 30px 70px rgba(0,0,0,.7);
  --glow:0 0 0 1px rgba(63,195,191,.3),0 12px 34px rgba(63,195,191,.18);
  --ring:0 0 0 4px rgba(63,195,191,.25);
  --sb-bg:linear-gradient(170deg,#0b1c1b 0%,#0e2726 100%);
  --sb-text:#aac4c2;
  --mesh:radial-gradient(900px 500px at 100% -10%,rgba(63,195,191,.14),transparent 60%),
         radial-gradient(700px 420px at -10% 110%,rgba(230,187,92,.10),transparent 60%);
  color-scheme:dark;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font);background:var(--bg);background-image:var(--mesh);background-attachment:fixed;
  color:var(--text);direction:rtl;font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased;
  transition:background-color .3s var(--ease),color .3s var(--ease);
}
a{color:var(--primary);text-decoration:none;cursor:pointer;transition:color .15s;}
a:hover{text-decoration:underline;}
::selection{background:var(--primary);color:#fff;}
*:focus-visible{outline:none;box-shadow:var(--ring);border-radius:8px;}
svg.ic{width:1.15em;height:1.15em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:-.2em;}

/* ---------- الهيكل / Shell ---------- */
.app-shell{display:flex;min-height:100vh;gap:0;}
.sidebar{
  width:var(--sidebar-w);flex-shrink:0;background:var(--sb-bg);color:#fff;
  position:sticky;top:0;align-self:flex-start;height:100vh;overflow:hidden auto;
  display:flex;flex-direction:column;padding:18px 14px;
  box-shadow:inset -1px 0 0 rgba(255,255,255,.06),8px 0 30px rgba(8,61,60,.12);
  transition:width .28s var(--ease),padding .28s var(--ease);
}
.sidebar::-webkit-scrollbar{width:5px;} .sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:6px;}
.sb-brand{display:flex;align-items:center;gap:12px;padding:8px 6px 16px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:12px;}
.sb-logo{
  width:44px;height:44px;border-radius:14px;flex-shrink:0;display:grid;place-items:center;font-weight:800;font-size:20px;color:#083d3c;
  background:linear-gradient(135deg,var(--accent-2),var(--accent));box-shadow:0 8px 20px rgba(212,167,74,.35),inset 0 1px 0 rgba(255,255,255,.6);
}
.sb-brand .t{font-weight:800;font-size:15px;line-height:1.25;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-brand .s{font-size:11.5px;color:var(--sb-text);opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-section{font-size:10.5px;letter-spacing:.12em;color:rgba(255,255,255,.45);padding:10px 12px 6px;font-weight:700;white-space:nowrap;}
.sidebar nav a{
  display:flex;align-items:center;gap:12px;color:var(--sb-text);padding:11px 12px;border-radius:13px;margin-bottom:3px;
  font-size:14px;font-weight:700;position:relative;white-space:nowrap;overflow:hidden;
  transition:background .18s var(--ease),color .18s,transform .18s var(--ease);
}
.sidebar nav a .nav-ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.07);flex-shrink:0;transition:background .18s,transform .18s;}
.sidebar nav a .nav-ic svg{width:19px;height:19px;}
.sidebar nav a .nav-t{overflow:hidden;text-overflow:ellipsis;}
.sidebar nav a .nav-t small{display:block;font-size:11px;font-weight:500;opacity:.7;}
.sidebar nav a:hover{background:rgba(255,255,255,.08);color:#fff;text-decoration:none;transform:translateX(-2px);}
.sidebar nav a:hover .nav-ic{background:rgba(255,255,255,.14);}
.sidebar nav a.active{background:rgba(255,255,255,.13);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
.sidebar nav a.active .nav-ic{background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#083d3c;}
.sidebar nav a.active::before{content:"";position:absolute;inset-inline-start:0;top:10px;bottom:10px;width:4px;border-radius:4px;background:var(--accent);}
.sb-user{margin-top:auto;padding:12px;border-radius:16px;background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.06);}
.sb-user .row{display:flex;align-items:center;gap:10px;}
.avatar{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:800;font-size:15px;color:#fff;flex-shrink:0;background:linear-gradient(135deg,#12908c,#0f5c5b);box-shadow:inset 0 1px 0 rgba(255,255,255,.25);}
.sb-user .n{font-weight:800;font-size:13.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-user .r{font-size:11px;color:var(--accent-2);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-user .links{display:flex;gap:6px;margin-top:10px;}
.sb-user .links a{flex:1;text-align:center;font-size:12px;font-weight:700;color:var(--sb-text);padding:7px 6px;border-radius:9px;background:rgba(255,255,255,.06);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-user .links a:hover{background:rgba(255,255,255,.12);color:#fff;text-decoration:none;}
.sb-user .links a.out{color:#ffb4b4;}
#railToggle{position:absolute;top:20px;inset-inline-start:-13px;z-index:45;width:26px;height:26px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--muted);cursor:pointer;display:none;place-items:center;box-shadow:var(--shadow-sm);}
#railToggle svg{width:14px;height:14px;}
@media(min-width:901px){#railToggle{display:grid;}}
.app-shell.rail .sidebar{width:var(--rail-w);padding:18px 12px;}
.app-shell.rail .sb-brand .t,.app-shell.rail .sb-brand .s,.app-shell.rail .nav-t,.app-shell.rail .sb-section,.app-shell.rail .sb-user .n,.app-shell.rail .sb-user .r,.app-shell.rail .sb-user .links{display:none;}
.app-shell.rail .sidebar nav a{justify-content:center;padding:10px;}
.app-shell.rail .sidebar nav a.active::before{display:none;}
.app-shell.rail .sb-brand{justify-content:center;padding-bottom:12px;}
.app-shell.rail .sb-user{padding:8px;} .app-shell.rail .sb-user .row{justify-content:center;}
.app-shell.rail #railToggle svg{transform:rotate(180deg);}

.main{flex:1;min-width:0;display:flex;flex-direction:column;position:relative;}
.topbar{
  background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  border-bottom:1px solid var(--border);padding:12px 26px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  position:sticky;top:0;z-index:40;
}
.topbar .tb-title{min-width:0;}
.topbar h1{font-size:20px;margin:0;font-weight:800;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.topbar .crumb{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.topbar-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.icon-btn{
  height:40px;min-width:40px;padding:0 10px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--text);
  cursor:pointer;font-size:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;font-weight:700;position:relative;
  transition:background .15s,transform .15s var(--ease),box-shadow .15s,border-color .15s;
}
.icon-btn svg{width:18px;height:18px;}
.icon-btn:hover{background:var(--card-2);transform:translateY(-1px);box-shadow:var(--shadow-sm);border-color:var(--border-2);}
.icon-btn.qs-btn{padding:0 12px 0 8px;color:var(--muted);font-size:13px;min-width:210px;justify-content:flex-start;}
.icon-btn.qs-btn kbd{font-family:inherit;font-size:11px;background:var(--bg-2);border:1px solid var(--border);border-radius:6px;padding:1px 7px;margin-inline-start:auto;color:var(--muted);}
.icon-btn .dot{position:absolute;top:6px;inset-inline-start:6px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px var(--card);}
#navToggle{display:none;}
.content{padding:24px 26px 40px;animation:pageIn .4s var(--ease) both;flex:1;}
@keyframes pageIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.stagger>*{animation:pageIn .5s var(--ease) both;}
.stagger>*:nth-child(1){animation-delay:.02s}.stagger>*:nth-child(2){animation-delay:.07s}.stagger>*:nth-child(3){animation-delay:.12s}.stagger>*:nth-child(4){animation-delay:.17s}.stagger>*:nth-child(5){animation-delay:.22s}.stagger>*:nth-child(6){animation-delay:.27s}.stagger>*:nth-child(7){animation-delay:.32s}.stagger>*:nth-child(8){animation-delay:.37s}.stagger>*:nth-child(9){animation-delay:.42s}

/* ---------- الرسائل / Flash ---------- */
.flash-box{margin-bottom:16px;}
.flash{padding:12px 16px;border-radius:14px;margin-bottom:8px;font-size:14px;font-weight:600;display:flex;gap:10px;align-items:flex-start;animation:pageIn .3s var(--ease);white-space:pre-line;backdrop-filter:blur(8px);}
.flash::before{font-size:16px;line-height:1.4;}
.flash-success{background:var(--success-light);color:var(--success);border:1px solid color-mix(in srgb,var(--success) 30%,transparent);} .flash-success::before{content:"✅";}
.flash-danger{background:var(--danger-light);color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 30%,transparent);} .flash-danger::before{content:"⛔";}
.flash-warning{background:var(--warning-light);color:var(--warning);border:1px solid color-mix(in srgb,var(--warning) 30%,transparent);} .flash-warning::before{content:"⚠️";}

/* ---------- الكروت / Cards ---------- */
.card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin-bottom:20px;
  box-shadow:var(--shadow-sm);transition:box-shadow .25s var(--ease),transform .25s var(--ease),border-color .25s;
}
.card h2{margin:0 0 12px;font-size:17px;font-weight:800;display:flex;align-items:center;gap:10px;}
.card h3{font-size:14px;color:var(--muted);margin-top:0;font-weight:700;}
.card.glass{background:var(--glass);backdrop-filter:blur(14px);}
.grid{display:grid;gap:16px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-3>.card{margin-bottom:0;display:flex;flex-direction:column;}

/* ---------- البطل / Hero ---------- */
.hero{
  position:relative;overflow:hidden;border-radius:24px;padding:28px 30px;margin-bottom:20px;color:#fff;
  background:linear-gradient(120deg,#083d3c 0%,#0f5c5b 45%,#12908c 100%);box-shadow:var(--shadow-lg);
  display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:center;min-height:210px;
}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 90% 0%,rgba(240,201,107,.25),transparent 60%),radial-gradient(400px 260px at 0% 100%,rgba(255,255,255,.12),transparent 60%);pointer-events:none;}
.hero::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;border:1px solid rgba(255,255,255,.08);inset-inline-start:-160px;bottom:-320px;pointer-events:none;}
.hero>*{position:relative;}
.hero .greet{font-size:13px;font-weight:700;color:rgba(255,255,255,.75);letter-spacing:.02em;}
.hero h2{font-size:28px;font-weight:800;margin:6px 0 8px;line-height:1.25;letter-spacing:-.01em;}
.hero h2 em{font-style:normal;background:linear-gradient(90deg,#fff,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero p{margin:0;font-size:14px;color:rgba(255,255,255,.85);line-height:1.8;max-width:56ch;}
.hero .actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;}
.hero .btn-light{background:#fff;color:#0a413f;border-color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.18);}
.hero .btn-light:hover{color:#0a413f;background:#fff;}
.hero .btn-ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff;box-shadow:none;}
.hero .btn-ghost:hover{background:rgba(255,255,255,.2);color:#fff;}
.hero-ring{display:flex;align-items:center;justify-content:flex-start;gap:22px;}
.ring{position:relative;width:170px;height:170px;flex-shrink:0;}
.ring svg{width:100%;height:100%;transform:rotate(-90deg);}
.ring circle{fill:none;stroke-width:14;stroke-linecap:round;}
.ring .track{stroke:rgba(255,255,255,.14);}
.ring .seg{transition:stroke-dasharray 1.2s var(--ease);}
.ring .c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;}
.ring .c b{display:block;font-size:34px;font-weight:800;line-height:1;}
.ring .c small{font-size:11px;font-weight:700;opacity:.8;}
.ring-legend{display:grid;gap:8px;font-size:13px;font-weight:700;}
.ring-legend span{display:flex;align-items:center;gap:8px;white-space:nowrap;}
.ring-legend i{width:11px;height:11px;border-radius:4px;display:inline-block;}
.ring-legend b{font-size:16px;margin-inline-start:auto;padding-inline-start:12px;font-variant-numeric:tabular-nums;}

/* ---------- KPIs ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;}
.kpi{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px 18px 16px;position:relative;overflow:hidden;
  box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:14px;transition:transform .25s var(--ease),box-shadow .25s var(--ease);
}
.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.kpi .kic{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;flex-shrink:0;color:#fff;box-shadow:0 8px 18px rgba(0,0,0,.12);}
.kpi .kic svg{width:24px;height:24px;}
.kpi.k-danger .kic{background:linear-gradient(135deg,#f0776a,#d64545);} .kpi.k-warning .kic{background:linear-gradient(135deg,#f5b74a,#d98f1b);}
.kpi.k-primary .kic{background:linear-gradient(135deg,#12908c,#0f5c5b);} .kpi.k-success .kic{background:linear-gradient(135deg,#43c58a,#1f9d63);}
.kpi .kv{min-width:0;}
.kpi .num{font-size:30px;font-weight:800;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.kpi.k-danger .num{color:var(--danger);} .kpi.k-warning .num{color:var(--warning);} .kpi.k-success .num{color:var(--success);} .kpi.k-primary .num{color:var(--primary);}
.kpi .label{color:var(--muted);font-size:12.5px;font-weight:700;margin-top:2px;line-height:1.4;}
.kpi::after{content:"";position:absolute;inset-inline-end:-40px;bottom:-40px;width:120px;height:120px;border-radius:50%;background:currentColor;opacity:.05;}
.kpi.k-danger::after{color:var(--danger);} .kpi.k-warning::after{color:var(--warning);} .kpi.k-success::after{color:var(--success);} .kpi.k-primary::after{color:var(--primary);}

/* الإحصائيات القديمة / legacy stat tiles */
.stat{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 18px;text-align:center;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);}
.stat .num{font-size:32px;font-weight:800;color:var(--primary);line-height:1.1;letter-spacing:-.02em;}
.stat .label{color:var(--muted);font-size:12.5px;margin-top:8px;font-weight:700;}
.stat.danger .num{color:var(--danger);} .stat.warning .num{color:var(--warning);} .stat.success .num{color:var(--success);}

/* ---------- رؤى ذكية / Insights ---------- */
.insights{display:grid;gap:10px;}
.insight{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--card-2);border:1px solid var(--border);font-size:13.5px;line-height:1.6;transition:transform .2s var(--ease),border-color .2s;}
.insight:hover{transform:translateX(-3px);border-color:var(--border-2);}
.insight .iic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;font-size:16px;}
.insight.i-danger .iic{background:var(--danger-light);color:var(--danger);} .insight.i-warning .iic{background:var(--warning-light);color:var(--warning);}
.insight.i-success .iic{background:var(--success-light);color:var(--success);} .insight.i-info .iic{background:var(--primary-light);color:var(--primary);}
.insight b{font-weight:800;}
.insight a{font-weight:700;}
.ai-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;padding:3px 10px;border-radius:20px;background:linear-gradient(90deg,var(--primary-soft),var(--accent-light));color:var(--primary);border:1px solid var(--border);letter-spacing:.02em;}

/* ---------- الجداول / Tables ---------- */
table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--card);}
table th,table td{padding:11px 14px;border-bottom:1px solid var(--border);text-align:right;vertical-align:middle;}
table th{background:var(--card-2);color:var(--muted);font-weight:700;font-size:12.5px;position:sticky;top:0;}
table tbody tr:last-child td{border-bottom:none;}
table tbody tr{transition:background .12s;}
table tbody tr:hover{background:var(--primary-soft);}
table td a{font-weight:700;}
table td:last-child,table th:last-child{white-space:nowrap;}

/* ---------- الشارات / Badges ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 11px;border-radius:20px;font-size:12px;font-weight:800;line-height:1.5;white-space:nowrap;}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;}
.badge-valid,.badge-completed{background:var(--success-light);color:var(--success);}
.badge-expired{background:var(--danger-light);color:var(--danger);}
.badge-warning,.badge-under_review,.badge-awaiting_response{background:var(--warning-light);color:var(--warning);}
.badge-not_applicable,.badge-not_started{background:var(--bg-2);color:var(--muted);}
.pill{display:inline-flex;align-items:center;gap:6px;background:var(--primary-light);color:var(--primary);padding:3px 11px;border-radius:20px;font-size:12px;font-weight:800;}

/* ---------- الأزرار / Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:10px 20px;border-radius:12px;border:1px solid transparent;
  background:linear-gradient(135deg,var(--primary-2) 0%,var(--primary) 60%,var(--primary-600) 100%);color:#fff;cursor:pointer;font-size:14px;font-weight:800;
  font-family:inherit;box-shadow:0 6px 16px rgba(15,107,105,.28),inset 0 1px 0 rgba(255,255,255,.2);line-height:1.4;position:relative;overflow:hidden;
  transition:transform .18s var(--ease),box-shadow .18s,filter .18s;
}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s var(--ease);}
.btn:hover::after{transform:translateX(120%);}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(15,107,105,.34);text-decoration:none;color:#fff;}
html[data-theme="dark"] .btn{color:#06201f;} html[data-theme="dark"] .btn:hover{color:#06201f;}
.btn:active{transform:translateY(0);}
.btn-outline{background:var(--card);color:var(--primary);border-color:var(--border-2);box-shadow:var(--shadow-sm);}
.btn-outline:hover{background:var(--primary-soft);color:var(--primary);box-shadow:var(--shadow-sm);}
html[data-theme="dark"] .btn-outline,html[data-theme="dark"] .btn-outline:hover{color:var(--primary);}
.btn-danger{background:linear-gradient(135deg,#f0776a,var(--danger));color:#fff;box-shadow:0 6px 16px rgba(214,69,69,.28);}
.btn-danger:hover{color:#fff;}
.btn-sm{padding:7px 14px;font-size:13px;border-radius:10px;}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none;}

/* ---------- النماذج / Forms ---------- */
.form-group{margin-bottom:16px;}
.form-group label{display:block;margin-bottom:6px;font-size:13px;font-weight:800;color:var(--text-2);}
.form-control, select.form-control, textarea.form-control{
  width:100%;padding:11px 14px;border:1px solid var(--border-2);border-radius:12px;font-size:14px;font-family:inherit;background:var(--card);color:var(--text);
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.form-control:hover{border-color:color-mix(in srgb,var(--primary) 45%,var(--border-2));}
.form-control:focus{border-color:var(--primary);box-shadow:var(--ring);outline:none;}
textarea.form-control{min-height:90px;resize:vertical;}
.form-row{display:flex;gap:16px;flex-wrap:wrap;} .form-row .form-group{flex:1;min-width:220px;}
input[type="file"].form-control{padding:9px;}

/* ---------- التنقل / Breadcrumb & Tabs ---------- */
.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:12px;font-weight:700;}
.breadcrumb a{color:var(--muted);} .breadcrumb a:hover{color:var(--primary);} .breadcrumb .sep{margin:0 6px;opacity:.5;}
.tabs{display:flex;gap:4px;background:var(--glass);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;padding:5px;margin-bottom:22px;flex-wrap:wrap;box-shadow:var(--shadow-sm);position:sticky;top:66px;z-index:30;}
.tabs a{padding:9px 16px;border-radius:10px;color:var(--muted);font-weight:800;font-size:13.5px;transition:background .15s,color .15s,box-shadow .15s;}
.tabs a:hover{background:var(--card);color:var(--text);text-decoration:none;}
.tabs a.active{background:linear-gradient(135deg,var(--primary-2),var(--primary));color:#fff;box-shadow:0 4px 12px rgba(15,107,105,.3);}
html[data-theme="dark"] .tabs a.active{color:#06201f;}

/* ---------- الأقسام / Category blocks ---------- */
.category-block{margin-bottom:28px;}
.category-block h3{color:var(--text);font-size:15.5px;font-weight:800;margin:0 0 14px;display:flex;align-items:center;gap:10px;}
.category-block h3::before{content:"";width:8px;height:24px;border-radius:4px;background:linear-gradient(180deg,var(--accent-2),var(--primary));}
.category-block h3 .cnt{font-size:11.5px;color:var(--muted);font-weight:700;background:var(--bg-2);padding:2px 9px;border-radius:20px;}
.subcat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;}
.subcat-card{
  border:1px solid var(--border);border-radius:var(--radius);padding:16px;background:var(--card);display:flex;flex-direction:column;gap:8px;
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s;
}
.subcat-card::before{content:"";position:absolute;top:0;inset-inline:0;height:3px;background:linear-gradient(90deg,var(--primary-2),var(--accent));opacity:0;transition:opacity .25s;}
.subcat-card:hover{transform:translateY(-4px);box-shadow:var(--glow);border-color:transparent;}
.subcat-card:hover::before{opacity:1;}
.subcat-card.st-expired::before{background:var(--danger);opacity:1;} .subcat-card.st-warning::before{background:var(--warning);opacity:1;}
.subcat-card .head{display:flex;align-items:center;gap:10px;}
.subcat-card .sic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--primary-light);color:var(--primary);flex-shrink:0;}
.subcat-card .sic svg{width:20px;height:20px;}
.subcat-card .name{font-weight:800;font-size:14.5px;line-height:1.35;}
.subcat-card .meta{font-size:12.5px;color:var(--muted);font-weight:600;}
.subcat-card .flags{display:flex;gap:6px;margin-top:2px;flex-wrap:wrap;}
.subcat-card .btn{align-self:flex-start;margin-top:auto;}

/* ---------- كروت الشركات / Company cards ---------- */
.co-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;}
.co-card{
  background:var(--card);border:1px solid var(--border);border-radius:22px;padding:20px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  display:flex;flex-direction:column;gap:12px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s;
}
.co-card::before{content:"";position:absolute;inset-inline-end:-60px;top:-60px;width:180px;height:180px;border-radius:50%;background:var(--primary-soft);transition:transform .4s var(--ease);}
.co-card:hover{transform:translateY(-5px);box-shadow:var(--glow);border-color:transparent;}
.co-card:hover::before{transform:scale(1.4);}
.co-card>*{position:relative;}
.co-head{display:flex;align-items:center;gap:12px;}
.co-ic{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;font-size:24px;flex-shrink:0;background:linear-gradient(135deg,var(--primary-light),var(--card));border:1px solid var(--border);box-shadow:var(--shadow-sm);}
.co-head h2{font-size:16.5px;margin:0;font-weight:800;line-height:1.3;}
.co-head .ty{font-size:12px;color:var(--muted);font-weight:700;}
.co-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.co-stat{background:var(--card-2);border:1px solid var(--border);border-radius:12px;padding:8px 6px;text-align:center;}
.co-stat b{display:block;font-size:19px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums;}
.co-stat small{font-size:10.5px;color:var(--muted);font-weight:700;}
.co-stat.d b{color:var(--danger);} .co-stat.w b{color:var(--warning);} .co-stat.p b{color:var(--primary);}
.co-health{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);font-weight:700;}
.co-health .bar{flex:1;height:8px;border-radius:6px;background:var(--bg-2);overflow:hidden;display:flex;gap:2px;}
.co-health .bar i{display:block;height:100%;} .co-health .bar .e{background:var(--danger);} .co-health .bar .w{background:var(--warning);} .co-health .bar .o{background:var(--success);}
.co-foot{display:flex;gap:8px;margin-top:auto;}
.co-foot .btn{flex:1;}
.co-meta{font-size:12px;color:var(--muted);font-weight:600;display:flex;gap:12px;flex-wrap:wrap;}
.co-meta span{display:inline-flex;align-items:center;gap:5px;}

.empty-state{text-align:center;padding:50px 20px;color:var(--muted);font-weight:700;}
.empty-state .icon{font-size:44px;margin-bottom:10px;}

/* ---------- الدخول / Login ---------- */
.login-wrap{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;background:var(--bg);position:relative;overflow:hidden;}
.login-side{
  position:relative;overflow:hidden;color:#fff;padding:56px 54px;display:flex;flex-direction:column;justify-content:space-between;
  background:radial-gradient(900px 500px at 15% 10%,#16a39e 0%,transparent 55%),radial-gradient(700px 500px at 90% 95%,#083d3c 0%,transparent 60%),linear-gradient(135deg,#0a413f,#0f5c5b 55%,#0d6d69);
}
.login-side::before,.login-side::after{content:"";position:absolute;border-radius:50%;filter:blur(50px);opacity:.4;pointer-events:none;animation:float 16s ease-in-out infinite;}
.login-side::before{width:460px;height:460px;background:#3fc3bf;top:-140px;inset-inline-end:-120px;}
.login-side::after{width:380px;height:380px;background:var(--accent);bottom:-160px;inset-inline-start:-80px;animation-delay:-8s;}
@keyframes float{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-34px) scale(1.07);}}
.login-side>*{position:relative;z-index:1;}
.login-side .lg{display:flex;align-items:center;gap:12px;font-weight:800;font-size:17px;}
.login-side .lg .sb-logo{width:48px;height:48px;font-size:22px;}
.login-side h2{font-size:38px;font-weight:800;line-height:1.25;margin:0 0 14px;letter-spacing:-.01em;}
.login-side h2 em{font-style:normal;background:linear-gradient(90deg,#fff,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;}
.login-side p{font-size:15px;color:rgba(255,255,255,.85);line-height:1.9;max-width:52ch;margin:0;}
.login-feats{display:grid;gap:12px;margin-top:26px;}
.login-feats div{display:flex;align-items:center;gap:12px;font-weight:700;font-size:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);padding:10px 14px;border-radius:14px;backdrop-filter:blur(6px);}
.login-feats div i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.14);font-style:normal;flex-shrink:0;}
.login-side .foot{font-size:12px;color:rgba(255,255,255,.6);font-weight:600;}
.login-form-col{display:flex;align-items:center;justify-content:center;padding:32px 24px;background-image:var(--mesh);}
.login-card{width:100%;max-width:440px;background:var(--card);padding:36px 34px;border-radius:24px;box-shadow:var(--shadow-lg);border:1px solid var(--border);animation:pageIn .5s var(--ease);}
.login-card h1{font-size:22px;margin:0 0 6px;font-weight:800;line-height:1.35;}
.login-card p.subtitle{color:var(--muted);font-size:13px;margin:0 0 22px;font-weight:600;}
.login-card .switch{text-align:center;margin-top:14px;font-size:13px;color:var(--text-2);font-weight:600;}
.login-card .btn{width:100%;padding:12px;}
.login-card .small-muted{font-weight:600;}

/* ---------- الملفات / Files ---------- */
.file-list{list-style:none;padding:0;margin:0;}
.file-list li{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border:1px solid var(--border);border-radius:13px;margin-bottom:8px;font-size:13px;gap:8px;flex-wrap:wrap;background:var(--card-2);transition:border-color .15s,background .15s,transform .15s;}
.file-list li:hover{border-color:var(--border-2);background:var(--card);transform:translateX(-2px);}
.file-list .fname{font-weight:800;} .file-list .fmeta{color:var(--muted);font-size:12px;font-weight:600;}

.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px;}
.toolbar .filters{display:flex;gap:8px;flex-wrap:wrap;}
.small-muted{color:var(--muted);font-size:12.5px;}
hr{border:none;border-top:1px solid var(--border);margin:18px 0;}
.spinner{text-align:center;padding:40px;color:var(--muted);}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 14px;}
.section-title h2{margin:0;font-size:17px;font-weight:800;display:flex;align-items:center;gap:10px;}
.section-title .sub{font-size:12.5px;color:var(--muted);font-weight:600;}

/* ---------- هيكل التحميل / Skeleton ---------- */
.skeleton{display:grid;gap:16px;}
.sk{border-radius:16px;background:linear-gradient(90deg,var(--bg-2) 25%,var(--card) 50%,var(--bg-2) 75%);background-size:400% 100%;animation:shimmer 1.4s infinite;border:1px solid var(--border);}
.sk-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.sk-hero{height:200px;border-radius:24px;} .sk-stat{height:88px;} .sk-card{height:220px;}
@keyframes shimmer{0%{background-position:100% 0;}100%{background-position:0 0;}}

/* ---------- الرسوم البيانية / Charts ---------- */
.chart-bars{display:grid;gap:11px;}
.chart-row{display:grid;grid-template-columns:minmax(170px,300px) 1fr auto;gap:12px;align-items:center;font-size:13px;}
.chart-row .lbl{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .chart-row .lbl a{color:var(--text);}
.chart-row .bar{height:16px;background:var(--bg-2);border-radius:8px;overflow:hidden;display:flex;gap:2px;}
.chart-row .bar span{height:100%;transition:width 1s var(--ease);}
.chart-row .bar .seg-exp{background:linear-gradient(90deg,#f0776a,var(--danger));border-radius:8px 0 0 8px;} .chart-row .bar .seg-warn{background:linear-gradient(90deg,#f5b74a,var(--warning));}
.chart-row .val{color:var(--muted);font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:700;}
.chart-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin-bottom:12px;font-weight:700;}
.chart-legend span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;margin-inline-end:6px;vertical-align:-1px;}
.chart-legend .lg-exp::before{background:var(--danger);} .chart-legend .lg-warn::before{background:var(--warning);}

/* ---------- البحث السريع / Quick search ---------- */
.qs-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:90px 16px 16px;background:rgba(4,20,19,.55);backdrop-filter:blur(6px);animation:fadeIn .15s;}
.qs-modal[hidden]{display:none;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.qs-panel{width:100%;max-width:660px;background:var(--card);border:1px solid var(--border-2);border-radius:20px;box-shadow:var(--shadow-lg);overflow:hidden;animation:pageIn .2s var(--ease);}
.qs-input{width:100%;border:none;outline:none;padding:18px 20px;font-size:16px;font-family:inherit;background:transparent;color:var(--text);border-bottom:1px solid var(--border);font-weight:600;}
.qs-results{max-height:60vh;overflow-y:auto;padding:8px;}
.qs-group{font-size:11px;color:var(--muted);font-weight:800;padding:10px 12px 4px;letter-spacing:.06em;}
.qs-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;color:var(--text);text-decoration:none;}
.qs-item:hover,.qs-item.sel{background:var(--primary-soft);text-decoration:none;}
.qs-item .ic{width:36px;height:36px;border-radius:10px;background:var(--bg-2);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.qs-item .t{font-weight:800;font-size:14px;} .qs-item .s{font-size:12px;color:var(--muted);font-weight:600;}
.qs-empty{padding:26px;text-align:center;color:var(--muted);font-size:13.5px;font-weight:600;}
.qs-hint{padding:8px 16px;border-top:1px solid var(--border);font-size:11.5px;color:var(--muted);display:flex;gap:14px;font-weight:600;}

/* ---------- الموبايل / Mobile ---------- */
.nav-overlay{display:none;}
@media(max-width:1180px){.kpis{grid-template-columns:repeat(2,1fr);} .hero{grid-template-columns:1fr;} .hero-ring{justify-content:center;}}
@media(max-width:900px){
  html,body{overflow-x:hidden;}
  .grid-3,.grid-2,.grid-4{grid-template-columns:1fr;} .sk-row{grid-template-columns:1fr 1fr;}
  .sidebar{position:fixed;top:0;bottom:0;inset-inline-start:0;z-index:60;width:min(300px,86vw);height:100vh;transform:translateX(100%);transition:transform .28s var(--ease);box-shadow:var(--shadow-lg);}
  [dir="ltr"] .sidebar{transform:translateX(-100%);}
  .app-shell.nav-open .sidebar{transform:none;}
  .app-shell.rail .sidebar{width:min(300px,86vw);padding:18px 14px;}
  .app-shell.rail .sb-brand .t,.app-shell.rail .sb-brand .s,.app-shell.rail .nav-t,.app-shell.rail .sb-section,.app-shell.rail .sb-user .n,.app-shell.rail .sb-user .r,.app-shell.rail .sb-user .links{display:block;}
  .app-shell.rail .sb-user .links{display:flex;} .app-shell.rail .sidebar nav a{justify-content:flex-start;padding:11px 12px;}
  .nav-overlay{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:55;opacity:0;pointer-events:none;transition:opacity .25s;backdrop-filter:blur(2px);}
  .app-shell.nav-open .nav-overlay{opacity:1;pointer-events:auto;}
  #navToggle{display:inline-flex;}
  .icon-btn.qs-btn{min-width:40px;padding:0 10px;} .icon-btn.qs-btn span,.icon-btn.qs-btn kbd{display:none;}
  .topbar{padding:10px 14px;} .topbar h1{font-size:16px;} .topbar .crumb{display:none;}
  .content{padding:14px 14px 30px;} .card{padding:16px;border-radius:16px;}
  .hero{padding:22px 18px;border-radius:20px;} .hero h2{font-size:22px;} .ring{width:140px;height:140px;} .ring .c b{font-size:28px;}
  .kpis{grid-template-columns:1fr 1fr;gap:10px;} .kpi{padding:14px;gap:10px;} .kpi .kic{width:42px;height:42px;border-radius:13px;} .kpi .num{font-size:24px;}
  .chart-row{grid-template-columns:100px 1fr auto;}
  table{display:block;overflow-x:auto;white-space:nowrap;}
  .tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;top:60px;} .tabs::-webkit-scrollbar{display:none;}
  .tabs a{flex:0 0 auto;white-space:nowrap;padding:8px 12px;font-size:12.5px;margin-inline-start:0 !important;}
  .qs-modal{padding:12px;}
  .login-wrap{grid-template-columns:1fr;} .login-side{display:none;} .login-form-col{min-height:100vh;background:radial-gradient(800px 400px at 50% -10%,rgba(18,144,140,.25),transparent 60%),var(--bg);}
  .co-grid{grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none !important;transition:none !important;}}

/* ---------- الطباعة / Print ---------- */
.print-only{display:none;}
@media print{
  html[data-theme="dark"]{--bg:#fff;--card:#fff;--card-2:#fafafa;--text:#000;--text-2:#222;--muted:#555;--border:#ddd;--glass:#fff;}
  body{background:#fff !important;background-image:none !important;color:#000 !important;}
  .sidebar,.no-print,.flash-box,#logoutBtn,.topbar-actions,.nav-overlay,.qs-modal,#railToggle,.hero .actions{display:none !important;}
  .app-shell{display:block !important;} .main{flex:none !important;width:100% !important;}
  .content{padding:0 !important;animation:none !important;}
  .topbar{position:static !important;border:none !important;padding:0 0 6px !important;background:#fff !important;backdrop-filter:none !important;}
  .topbar h1{font-size:18px;}
  .card,.kpi,.co-card{box-shadow:none !important;border:1px solid #ddd !important;page-break-inside:avoid;margin-bottom:10px !important;padding:12px !important;}
  .hero{background:#0f5c5b !important;-webkit-print-color-adjust:exact;print-color-adjust:exact;box-shadow:none !important;}
  .stat{border:1px solid #ddd !important;padding:10px !important;box-shadow:none !important;}
  table{font-size:11px !important;border-radius:0;} table th,table td{padding:5px 7px !important;}
  thead{display:table-header-group;} tr,td,th{page-break-inside:avoid;} tr:hover{background:transparent !important;}
  .print-only{display:block !important;} a{color:#000 !important;text-decoration:none !important;}
  @page{size:A4 landscape;margin:12mm;}
}
.login-wrap>.login-card{grid-column:1/-1;justify-self:center;align-self:center;margin:40px 16px;}
/* ---------- الشعارات / Company logos ---------- */
.co-ic.has-logo{background:#fff;padding:5px;overflow:hidden;display:grid;place-items:center;}
.co-ic img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:6px;display:block;}
.co-ic-lg{width:auto;min-width:84px;max-width:240px;height:84px;padding:0 12px;border-radius:22px;font-size:38px;}
.co-ic-lg.has-logo{padding:8px 14px;} .co-ic-lg.has-logo img{max-height:66px;max-width:210px;}
.co-ic-xs{width:30px;height:30px;border-radius:9px;font-size:14px;box-shadow:none;}
.co-ic-xs.has-logo{padding:2px;} .co-ic-xs img{border-radius:6px;}
.co-inline{display:inline-flex;align-items:center;gap:9px;color:inherit;}
.co-hero{display:flex;align-items:center;gap:16px;margin:2px 0 18px;padding:16px 18px;border-radius:20px;background:var(--glass);border:1px solid var(--border);backdrop-filter:blur(10px);box-shadow:var(--shadow-sm);}
.co-hero-name{font-size:20px;font-weight:800;line-height:1.3;}
html[data-theme="dark"] .co-ic.has-logo{background:#f4f7f7;}
.co-band{height:110px;border-radius:16px;background:#fff;border:1px solid var(--border);display:grid;place-items:center;overflow:hidden;font-size:44px;}
.co-band img{max-height:88px;max-width:84%;width:auto;height:auto;object-fit:contain;display:block;transition:transform .35s var(--ease);}
.co-card:hover .co-band img{transform:scale(1.06);}
html[data-theme="dark"] .co-band{background:#f4f7f7;}
/* ---------- دليل الاستخدام / User guide ---------- */
.help-wrap{max-width:1000px;margin:0 auto;}
.help-toc{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px;position:sticky;top:66px;z-index:30;}
.help-toc a{font-size:13px;font-weight:800;padding:7px 12px;border-radius:10px;background:var(--card);border:1px solid var(--border);color:var(--text);}
.help-toc a:hover{background:var(--primary-soft);text-decoration:none;color:var(--primary);}
.help-sec h2{align-items:center;flex-wrap:wrap;}
.help-sec h2 .sic{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--primary-light);font-size:19px;}
.help-sec h2 .sub{font-size:13px;color:var(--muted);font-weight:700;}
.help-sec p{margin:0 0 8px;line-height:1.9;font-size:14.5px;}
.help-sec p.en{color:var(--muted);font-size:13.5px;}
.help-tips{display:grid;gap:8px;margin-top:10px;}
.help-tips>div{padding:10px 14px;border-radius:12px;background:var(--card-2);border:1px solid var(--border);font-size:13.5px;line-height:1.8;}
.help-list{margin:0;padding:0 18px 0 0;line-height:1.9;font-size:14px;}
.help-list li{margin-bottom:6px;}
@media(max-width:900px){.help-toc{top:60px;}}
/* ---------- توحيد الشعارات / Unified logo treatment: monochrome, colour on hover ---------- */
.co-band img,.co-ic.has-logo img{filter:grayscale(1) contrast(1.05);opacity:.82;transition:filter .35s var(--ease),opacity .35s,transform .35s var(--ease);}
.co-card:hover .co-band img,.co-hero:hover .co-ic-lg img,.co-inline:hover img,.qs-item:hover img,.qs-item.sel img{filter:none;opacity:1;}
.co-band{background:#fff;}
html[data-theme="dark"] .co-band,html[data-theme="dark"] .co-ic.has-logo{background:#e9eeee;}
/* ---------- فقاعات الشعارات في شاشة الدخول / login logo bubbles ---------- */
.login-form-col{position:relative;overflow:hidden;}
.login-card{position:relative;z-index:2;}
.bubbles{position:absolute;inset:0;pointer-events:none;z-index:1;}
.bubble{
  position:absolute;border-radius:50%;background:rgba(255,255,255,.92);border:1px solid rgba(15,92,91,.10);
  box-shadow:0 14px 34px rgba(8,61,60,.12),inset 0 1px 0 #fff;display:grid;place-items:center;padding:12px;
  animation:bubbleFloat 20s ease-in-out infinite alternate;will-change:transform;opacity:.9;
}
.bubble img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1);opacity:.75;}
@keyframes bubbleFloat{
  0%{transform:translate3d(0,0,0) rotate(0deg) scale(1);}
  33%{transform:translate3d(18px,-26px,0) rotate(3deg) scale(1.04);}
  66%{transform:translate3d(-14px,-46px,0) rotate(-2deg) scale(.98);}
  100%{transform:translate3d(10px,-70px,0) rotate(2deg) scale(1.03);}
}
html[data-theme="dark"] .bubble{background:rgba(233,238,238,.92);border-color:rgba(255,255,255,.08);}
@media(max-width:900px){.bubble{opacity:.55;} .bubble:nth-child(n+8){display:none;}}
/* ---------- قائمة السجلات: فلاتر الحالة + تمييز المنتهي والقريب / entity list: status filters + expiry highlighting ---------- */
.ent-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.ent-head .form-control{max-width:280px;}
.ent-filter{display:inline-flex;gap:6px;flex-wrap:wrap;background:var(--bg-2);border:1px solid var(--border);border-radius:14px;padding:5px;}
.ent-filter button{
  font-family:inherit;font-size:13px;font-weight:800;color:var(--muted);background:transparent;border:1px solid transparent;border-radius:10px;
  padding:7px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .15s,color .15s,box-shadow .15s;
}
.ent-filter button b{font-size:11.5px;min-width:22px;padding:1px 7px;border-radius:20px;background:var(--card);border:1px solid var(--border);color:var(--text);font-variant-numeric:tabular-nums;}
.ent-filter button:hover{background:var(--card);color:var(--text);}
.ent-filter button.active{background:var(--card);color:var(--text);box-shadow:var(--shadow-sm);border-color:var(--border-2);}
.ent-filter button.f-exp.active{color:var(--danger);} .ent-filter button.f-exp.active b{background:var(--danger-light);color:var(--danger);border-color:transparent;}
.ent-filter button.f-warn.active{color:var(--warning);} .ent-filter button.f-warn.active b{background:var(--warning-light);color:var(--warning);border-color:transparent;}
.ent-filter button.f-ok.active{color:var(--success);} .ent-filter button.f-ok.active b{background:var(--success-light);color:var(--success);border-color:transparent;}
table tbody tr.row-expired td:first-child{box-shadow:inset 4px 0 0 var(--danger);}
table tbody tr.row-warning td:first-child{box-shadow:inset 4px 0 0 var(--warning);}
table tbody tr.row-expired{background:color-mix(in srgb,var(--danger-light) 55%,transparent);}
table tbody tr.row-warning{background:color-mix(in srgb,var(--warning-light) 55%,transparent);}
.exp-d,.exp-w{display:inline-flex;flex-direction:column;line-height:1.3;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;}
.exp-d{color:var(--danger);} .exp-w{color:var(--warning);}
.exp-d small,.exp-w small{font-size:11px;font-weight:700;opacity:.85;}
@media(max-width:900px){.ent-head{align-items:stretch;} .ent-head .form-control{max-width:none;} .ent-filter button{padding:6px 9px;font-size:12px;}}