/* ===== الاستقدام الذكي — نظام التصميم المشترك (محدّث) ===== */
@import url('https://fonts.googleapis.com/css2?family=Readex+Pro:wght@400;500;600;700&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');

:root{
  /* الهوية */
  --primary:#0F4C81; --primary-dark:#0A3A62; --primary-deep:#072B4A; --primary-light:#EAF2FB;
  --secondary:#00A86B; --secondary-dark:#008C55; --secondary-light:#E4F7EF; --mint:#7CF0C0;
  --warning:#F59E0B; --warning-light:#FEF3E2; --danger:#E5484D; --danger-light:#FDECED;
  /* الحبر والرمادي */
  --ink:#0C1E2E; --body:#39505F; --sub:#6B7E8C;
  --g50:#F8FAFC; --g100:#F1F5F9; --g200:#E6EDF3; --g300:#D2DDE6; --g400:#AFC0CC;
  --bg:#F4F8FB; --card:#fff; --line:#E6EDF3;
  /* الشكل */
  --radius:16px; --radius-sm:11px; --radius-lg:22px;
  --shadow-sm:0 1px 2px rgba(12,30,46,.05), 0 1px 3px rgba(12,30,46,.04);
  --shadow-md:0 10px 30px -12px rgba(15,76,129,.22);
  --shadow-lg:0 30px 70px -28px rgba(15,76,129,.38);
  --ring:0 0 0 4px rgba(15,76,129,.13);
  --grad-primary:linear-gradient(135deg,var(--primary),var(--primary-dark));
  --grad-secondary:linear-gradient(135deg,var(--secondary),var(--secondary-dark));
  --grad-hero:linear-gradient(140deg,#072B4A 0%,#0F4C81 52%,#0C6E72 100%);
  --font-display:'Readex Pro',system-ui,sans-serif;
  --font-body:'IBM Plex Sans Arabic','Readex Pro',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{background:var(--bg);color:var(--body);line-height:1.75;font-family:var(--font-body);
  font-size:15px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
h1,h2,h3,h4,h5,.brand,.page-head h1{font-family:var(--font-display);color:var(--ink);font-weight:700;letter-spacing:-.2px;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;}
::selection{background:var(--mint);color:var(--primary-deep);}
.container{max-width:1240px;margin:0 auto;padding:0 22px;}

/* أزرار */
.btn{display:inline-flex;align-items:center;gap:8px;justify-content:center;border:0;cursor:pointer;font-weight:600;
  font-size:14px;padding:11px 20px;border-radius:var(--radius-sm);transition:.2s cubic-bezier(.4,0,.2,1);
  white-space:nowrap;font-family:var(--font-body);line-height:1;}
.btn:active{transform:translateY(0) scale(.985);}
.btn-primary{background:var(--grad-primary);color:#fff;box-shadow:0 10px 22px -10px rgba(15,76,129,.65);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(15,76,129,.7);}
.btn-secondary{background:var(--grad-secondary);color:#fff;box-shadow:0 10px 22px -10px rgba(0,168,107,.6);}
.btn-secondary:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(0,168,107,.65);}
.btn-ghost{background:#fff;color:var(--primary);border:1.5px solid var(--g200);}
.btn-ghost:hover{border-color:var(--primary);background:var(--primary-light);}
.btn-danger{background:#fff;color:var(--danger);border:1.5px solid #f3c9cd;}
.btn-danger:hover{background:var(--danger-light);}
.btn-sm{padding:7px 13px;font-size:12.5px;border-radius:9px;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.6;cursor:not-allowed;transform:none;}

/* الشريط العلوي */
.topbar{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.78);backdrop-filter:blur(16px) saturate(160%);
  border-bottom:1px solid var(--line);}
.topbar-in{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px;}
.brand{display:flex;align-items:center;gap:11px;font-weight:700;font-size:18px;color:var(--ink);font-family:var(--font-display);}
.brand img{width:40px;height:40px;border-radius:11px;box-shadow:var(--shadow-sm);}
.brand small{display:block;font-size:9.5px;letter-spacing:.24em;color:var(--secondary);font-weight:600;font-family:var(--font-body);}
.topnav{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.topnav a{color:var(--sub);font-weight:600;font-size:14px;padding:8px 13px;border-radius:10px;transition:.18s;}
.topnav a:hover,.topnav a.active{color:var(--primary);background:var(--primary-light);}

/* العناوين */
.page-head{padding:34px 0 12px;}
.page-head h1{font-size:27px;font-weight:700;letter-spacing:-.5px;}
.page-head p{color:var(--sub);margin-top:4px;}

/* البطاقات */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;
  box-shadow:var(--shadow-sm);margin-bottom:20px;transition:box-shadow .25s,transform .25s;}
.card h2,.card h3{font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:9px;font-size:17px;color:var(--ink);}
.card h2 i,.card h3 i{color:var(--primary);}
.grid{display:grid;gap:18px;}
.grid-2{grid-template-columns:repeat(2,1fr);}.grid-3{grid-template-columns:repeat(3,1fr);}.grid-4{grid-template-columns:repeat(4,1fr);}

/* بطاقات إحصائية */
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-sm);
  position:relative;overflow:hidden;transition:.25s;}
.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.stat::after{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--grad-primary);}
.stat.green::after{background:var(--grad-secondary);}.stat.gold::after{background:linear-gradient(180deg,#F59E0B,#E07B00);}
.stat .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:20px;color:#fff;
  background:var(--grad-primary);margin-bottom:12px;box-shadow:0 8px 16px -8px rgba(15,76,129,.5);}
.stat.green .ic{background:var(--grad-secondary);}
.stat.gold .ic{background:linear-gradient(135deg,#F59E0B,#E07B00);}
.stat b{font-size:25px;font-weight:700;display:block;color:var(--ink);font-family:var(--font-display);}
.stat span{color:var(--sub);font-size:13px;}

/* الجداول */
table{width:100%;border-collapse:collapse;font-size:14px;}
th{text-align:right;color:var(--sub);font-weight:600;font-size:12px;padding:12px;border-bottom:1px solid var(--g200);
  background:var(--g50);letter-spacing:.01em;}
th:first-child{border-radius:0 10px 0 0;}th:last-child{border-radius:10px 0 0 0;}
td{padding:13px 12px;border-bottom:1px solid var(--g100);color:var(--body);}
tr:hover td{background:#fbfdff;}
tr:last-child td{border-bottom:0;}

/* الشارات */
.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:30px;font-size:12px;font-weight:600;}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8;}
.pill.on{background:var(--secondary-light);color:var(--secondary-dark);}
.pill.off{background:var(--danger-light);color:var(--danger);}
.pill.warn{background:var(--warning-light);color:#b45c00;}
.pill.info{background:var(--primary-light);color:var(--primary);}

/* النماذج */
label{display:block;font-size:13px;font-weight:600;margin:12px 0 6px;color:var(--ink);}
input,select,textarea{width:100%;padding:12px 14px;border:1.5px solid var(--g200);border-radius:var(--radius-sm);
  font-size:14.5px;color:var(--ink);font-family:var(--font-body);transition:.18s;background:#fff;}
input::placeholder,textarea::placeholder{color:var(--g400);}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--primary);box-shadow:var(--ring);}
.field-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.msg{display:none;padding:12px 14px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;margin-top:12px;
  border:1px solid transparent;}
.msg.err{background:var(--danger-light);color:var(--danger);border-color:#f3c9cd;}
.msg.ok{background:var(--secondary-light);color:var(--secondary-dark);border-color:#bfe9d6;}

/* شاشة الدخول */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px;position:relative;overflow:hidden;
  background:var(--grad-hero);}
.auth::before{content:"";position:absolute;inset:0;opacity:.5;
  background:radial-gradient(circle at 82% 12%,rgba(0,168,107,.4),transparent 42%),
             radial-gradient(circle at 12% 88%,rgba(124,240,192,.18),transparent 46%);}
.auth::after{content:"";position:absolute;inset:0;opacity:.05;
  background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);
  background-size:44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 75%);}
.auth-card{background:#fff;border-radius:24px;box-shadow:var(--shadow-lg);padding:40px 34px;width:100%;max-width:410px;
  text-align:center;position:relative;z-index:2;animation:authIn .55s cubic-bezier(.16,1,.3,1);}
@keyframes authIn{from{opacity:0;transform:translateY(18px) scale(.98);}to{opacity:1;transform:none;}}
.auth-card .logo{width:66px;height:66px;margin:0 auto 14px;filter:drop-shadow(0 10px 18px rgba(15,76,129,.28));}
.auth-card h1{font-size:22px;font-weight:700;}
.auth-card .sub{color:var(--sub);font-size:14px;margin-bottom:18px;}
.auth-card label{text-align:right;}
.muted{color:var(--sub);font-size:13px;}
.back-link{color:#fff;opacity:.85;font-size:14px;margin-top:18px;display:inline-block;position:relative;z-index:2;}
.back-link:hover{opacity:1;}

.ghost{background:#fff;color:var(--primary);border:1.5px solid var(--g200);border-radius:9px;padding:7px 13px;
  font-size:13px;font-weight:600;cursor:pointer;font-family:var(--font-body);transition:.18s;}
.ghost:hover{border-color:var(--primary);background:var(--primary-light);}

/* ===== زر الهامبرغر + القائمة الجانبية (الجوال) ===== */
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);
  background:#fff;border-radius:12px;color:var(--ink);font-size:19px;cursor:pointer;}
.sidebar-overlay{position:fixed;inset:0;background:rgba(7,32,50,.5);backdrop-filter:blur(2px);z-index:60;opacity:0;visibility:hidden;transition:.25s;}
.sidebar-overlay.open{opacity:1;visibility:visible;}
.sidebar{position:fixed;top:0;right:0;height:100%;width:284px;max-width:84vw;background:#fff;z-index:70;
  box-shadow:-12px 0 40px -12px rgba(7,32,50,.3);transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;padding:18px 16px;overflow-y:auto;}
.sidebar.open{transform:translateX(0);}
.sidebar .sb-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding-bottom:14px;border-bottom:1px solid var(--line);}
.sidebar .sb-user{font-weight:700;color:var(--ink);font-family:var(--font-display);}
.sidebar .sb-user small{display:block;font-size:11.5px;color:var(--sub);font-weight:600;margin-top:2px;}
.sidebar .sb-close{border:0;background:none;font-size:22px;color:var(--sub);cursor:pointer;line-height:1;}
.sidebar a{display:flex;align-items:center;gap:11px;color:var(--body);font-weight:600;font-size:15px;padding:12px 12px;border-radius:11px;margin-top:4px;transition:.16s;}
.sidebar a i{width:20px;text-align:center;color:var(--sub);font-size:15px;}
.sidebar a:hover,.sidebar a.active{background:var(--primary-light);color:var(--primary);}
.sidebar a.active i{color:var(--primary);}
.sidebar .sb-logout{margin-top:auto;color:#b3261e;}
.sidebar .sb-logout i{color:#b3261e;}

@media(max-width:820px){
  .container{padding:0 14px;}
  .grid-2,.grid-3,.grid-4,.field-row{grid-template-columns:1fr;}
  .topbar-in{height:64px;}
  .topnav{display:none !important;}
  .nav-toggle{display:inline-flex;}
  .card{padding:18px;}
  table{display:block;overflow-x:auto;white-space:nowrap;}
}
@media(min-width:821px){
  .sidebar,.sidebar-overlay,.nav-toggle{display:none !important;}
}

/* بطاقة دور (صفحة المستخدمين) */
.role-card{flex:1 1 150px;min-width:140px;background:var(--g100);border:1px solid var(--line);border-radius:13px;padding:14px;}
.role-card b{display:block;margin-bottom:2px;}

/* إحصائية تحذيرية */
.stat.danger .ic{background:#FDECED;color:#b3261e;}