/* Enterprise UI — shared with the HR System Pro visual language */
:root{
  --bg:#f4f7fb;--surface:#fff;--ink:#172033;--muted:#68758a;--line:#e2e8f0;
  --teal:#2563eb;--teal-dark:#14213d;--teal-tint:#eef4ff;
  --amber:#d99a2b;--amber-tint:#fff7e6;--red:#dc3f4f;--red-tint:#fff0f2;
  --green:#168a67;--green-tint:#eaf8f3;--radius:14px;
  --shadow:0 1px 2px rgba(15,23,42,.03),0 8px 24px rgba(15,23,42,.055);
}
*{scrollbar-color:#cbd5e1 transparent;scrollbar-width:thin}
body{font-family:'Cairo','Tajawal',sans-serif;background:var(--bg);font-size:14px;line-height:1.65}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(37,99,235,.025),transparent 38%);z-index:-1}
button,input,select,textarea{font-family:inherit}

/* Login */
#loginScreen{padding:32px;background:linear-gradient(135deg,#eef3fb 0%,#f8fafc 52%,#eaf1fb 100%);position:relative;overflow:hidden}
#loginScreen:before,#loginScreen:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}
#loginScreen:before{width:460px;height:460px;background:rgba(37,99,235,.08);right:-170px;top:-190px}
#loginScreen:after{width:360px;height:360px;background:rgba(20,33,61,.06);left:-120px;bottom:-170px}
.login-card{position:relative;width:920px;min-height:525px;max-width:96vw;padding:54px 64px 46px 520px;border:1px solid rgba(203,213,225,.9);border-radius:24px;box-shadow:0 30px 80px rgba(20,33,61,.16);overflow:hidden;background:#fff;z-index:1}
.login-card:before{content:"نظام إدارة المخزون والعُهد\A\A رؤية موحّدة للمخزون، العُهد، الصلاحية والتقارير.\A\A • تحكم دقيق بالصلاحيات\A • متابعة فورية للحركات والأرصدة\A • قرارات أسرع ببيانات واضحة";white-space:pre-line;position:absolute;inset:0 auto 0 0;width:455px;padding:70px 54px;color:#fff;font-size:15px;line-height:2.05;background:linear-gradient(155deg,#14213d 0%,#18345f 52%,#2563eb 135%);box-sizing:border-box;z-index:0}
.login-card:after{content:"INV  /  ENTERPRISE";position:absolute;left:54px;bottom:43px;color:rgba(255,255,255,.55);font-size:11px;font-weight:700;letter-spacing:2px}
.login-lang{position:absolute;top:18px;right:20px;z-index:3;height:32px;min-width:42px;padding:0 10px;border:1px solid #dce4ef;border-radius:8px;background:#fff;color:#334155;font-size:11px;font-weight:800;cursor:pointer}.login-lang:hover{border-color:#8fb0f5;color:#1d4ed8;background:#f6f9ff}
.login-brand{position:relative;margin-bottom:24px;align-items:center;z-index:1}
.login-brand .logo,.side-brand .logo{font-size:0;background:linear-gradient(145deg,#2f76ff,#174cb6);box-shadow:0 8px 22px rgba(37,99,235,.28);position:relative}
.login-brand .logo:before,.side-brand .logo:before{content:"";width:22px;height:22px;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8'%3E%3Cpath d='M4 7.5 12 3l8 4.5v9L12 21l-8-4.5z'/%3E%3Cpath d='m4 7.5 8 4.5 8-4.5M12 12v9'/%3E%3C/svg%3E")}
.login-brand .logo{width:52px;height:52px;border-radius:15px}
.login-brand h1{font-size:20px;color:var(--teal-dark);letter-spacing:-.25px}
.login-brand p{font-size:12.5px;margin-top:3px}
.login-heading{margin-bottom:22px}.login-heading h2{font-size:18px;color:#172033;margin-bottom:3px}.login-heading p{font-size:12px;color:#7a879a}
.password-field{position:relative}.password-field input{padding-left:48px}.password-toggle{position:absolute;left:7px;top:7px;width:32px;height:30px;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:#708096;cursor:pointer}.password-toggle:hover{background:#eef4ff;color:#2563eb}.password-toggle svg{width:18px;height:18px;stroke:currentColor}
.login-security{display:flex;align-items:center;gap:7px;margin-top:17px;color:#8390a2;font-size:10.5px;justify-content:center}.login-security svg{width:14px;height:14px;stroke:#168a67}
.login-error{padding:9px 11px;border:1px solid #fecdd3;border-radius:8px;background:#fff1f2;color:#b42336;font-size:11.5px}
.field label{font-size:12.5px;color:#475569;margin-bottom:7px}
.field input,.field select,.field textarea,.toolbar input,.toolbar select{border:1px solid #d7dfeb;border-radius:10px;background:#fbfdff;min-height:43px;padding:10px 13px;transition:border-color .18s,box-shadow .18s,background .18s}
.field input:focus,.field select:focus,.field textarea:focus,.toolbar input:focus,.toolbar select:focus{border-color:#4d7ff0;box-shadow:0 0 0 3px rgba(37,99,235,.11);background:#fff}
.btn{min-height:40px;padding:9px 16px;border-radius:9px;box-shadow:none;transition:transform .16s,box-shadow .16s,background .16s,border-color .16s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 8px 18px rgba(37,99,235,.2)}
.btn-primary:hover{background:linear-gradient(135deg,#1d4ed8,#1743b0);box-shadow:0 10px 22px rgba(37,99,235,.25)}
.btn-amber{background:#14213d}.btn-amber:hover{background:#1e3158;filter:none}
.btn-outline{color:#334155;border-color:#d7dfeb}.btn-outline:hover{color:#1d4ed8;border-color:#7da2f4;background:#f7faff}
.login-hint{border:1px solid #dbeafe;background:#f2f7ff;color:#426083}

/* Application shell */
#app{grid-template-columns:264px minmax(0,1fr)}
.sidebar{padding:20px 15px 16px;background:linear-gradient(180deg,#14213d 0%,#15294d 58%,#10203c 100%);box-shadow:-1px 0 0 rgba(255,255,255,.04) inset;z-index:40}
.side-brand{min-height:66px;padding:0 7px 18px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}
.side-brand .logo{width:40px;height:40px;border-radius:11px}
.side-brand .logo:before{width:19px;height:19px}
.side-brand div h2{font-size:14.5px;letter-spacing:-.2px}.side-brand div p{font-size:10.5px;color:#a9bad5;opacity:1}
.nav-label{padding:15px 12px 6px;font-size:10px;color:#8094b5;opacity:1;font-weight:700;letter-spacing:.7px}
.nav-item{position:relative;min-height:42px;padding:9px 11px;margin-bottom:3px;border-radius:9px;color:#cbd6e8;font-size:13px;font-weight:600;gap:11px}
.nav-item:hover{background:rgba(255,255,255,.075);color:#fff}
.nav-item.active{background:linear-gradient(90deg,rgba(37,99,235,.98),rgba(63,125,245,.92));color:#fff;box-shadow:0 7px 16px rgba(0,0,0,.15)}
.nav-item.active:after{content:"";position:absolute;left:-15px;top:10px;bottom:10px;width:3px;background:#8bb3ff;border-radius:0 3px 3px 0}
.nav-item .ic{display:grid;place-items:center;width:20px;height:20px;color:currentColor}.nav-item .ic svg{width:18px;height:18px;stroke:currentColor}
.side-foot{padding-top:13px;border-color:rgba(255,255,255,.1)}
.user-chip{padding:10px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.07);border-radius:10px}
.user-chip .av{width:34px;height:34px;background:linear-gradient(135deg,#f1b844,#d88d17);box-shadow:0 4px 12px rgba(0,0,0,.17)}
.logout-btn{min-height:36px;border:1px solid rgba(255,255,255,.09);background:transparent;color:#b9c7dc}
.logout-btn:hover{background:rgba(255,255,255,.075);color:#fff}
.main{height:100vh;padding:0 30px 34px;overflow-x:hidden}
.workspace-header{height:68px;display:flex;align-items:center;justify-content:space-between;margin:0 -30px 25px;padding:0 30px;background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);box-shadow:0 1px 9px rgba(15,23,42,.035);backdrop-filter:blur(12px);position:sticky;top:0;z-index:30}
.header-context,.header-actions{display:flex;align-items:center;gap:10px}.header-context{color:#64748b;font-size:12px}.status-dot{width:7px;height:7px;background:#18a77c;border-radius:50%;box-shadow:0 0 0 4px rgba(22,167,124,.11)}
.header-icon,.menu-toggle{width:36px;height:36px;display:grid;place-items:center;border:1px solid #e1e7ef;border-radius:9px;background:#fff;color:#536178;cursor:pointer;position:relative}.header-icon svg,.menu-toggle svg{width:18px;height:18px;stroke:currentColor}.header-icon:hover,.menu-toggle:hover{color:#2563eb;border-color:#b9cef9;background:#f7faff}.header-icon .notification-dot{position:absolute;top:7px;right:8px;width:6px;height:6px;border-radius:50%;background:#dc3f4f;border:1px solid #fff}.lang-chip{height:36px;padding:0 11px;border:1px solid #e1e7ef;border-radius:9px;background:#fff;color:#334155;font-size:11px;font-weight:800;cursor:default}.menu-toggle{display:none}
.lang-chip{cursor:pointer}.lang-chip:hover{color:#1d4ed8;border-color:#b9cef9;background:#f7faff}
[dir="ltr"] body{font-family:'Segoe UI',Arial,Tahoma,sans-serif}[dir="ltr"] .login-card{padding:54px 520px 46px 64px}[dir="ltr"] .login-card:before{content:"Inventory & Custody Management\A\A One unified view of inventory, custody, expiry dates and reports.\A\A • Precise access control\A • Live movement and balance tracking\A • Faster decisions with clear data";left:auto;right:0;text-align:left}[dir="ltr"] .login-card:after{left:auto;right:54px}[dir="ltr"] .login-lang{right:auto;left:20px}[dir="ltr"] .stat-card:before,[dir="ltr"] .import-step:before{right:auto;left:0}[dir="ltr"] th{text-align:left}[dir="ltr"] .nav-item.active:after{left:auto;right:-15px;border-radius:3px 0 0 3px}
.topbar{min-height:58px;margin-bottom:18px;align-items:flex-start}.topbar h1{font-size:22px;line-height:1.35;color:#14213d;letter-spacing:-.45px}.topbar .sub{font-size:12.5px;color:#748196;margin-top:4px}
.view.active{animation:enterpriseFade .22s ease}@keyframes enterpriseFade{from{opacity:.35;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Data surfaces */
.stat-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:15px;margin-bottom:20px}
.stat-card{position:relative;overflow:hidden;min-height:112px;padding:18px 19px;border:1px solid #e2e8f0;border-right:0;border-radius:13px;box-shadow:var(--shadow);background:#fff}
.stat-card:before{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:#2563eb}.stat-card.warn:before{background:#d99a2b}.stat-card.danger:before{background:#dc3f4f}.stat-card.ok:before{background:#168a67}
.stat-card:after{content:"";position:absolute;width:74px;height:74px;border-radius:50%;left:-26px;top:-31px;background:rgba(37,99,235,.045)}
.stat-card .lbl{font-size:12px;color:#6b778b}.stat-card .val{font-size:28px;color:#172033;margin-top:9px;line-height:1.2;letter-spacing:-.5px}
.card{border:1px solid #e2e8f0;border-radius:13px;box-shadow:var(--shadow);padding:20px 21px;margin-bottom:18px}.card h3{font-size:15px;color:#233554;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #edf1f6}
.toolbar{padding:12px;margin-bottom:14px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 10px rgba(15,23,42,.03)}
.toolbar input{min-width:230px}.toolbar select{min-width:150px}
table{font-size:13px;border-collapse:separate;border-spacing:0;width:100%}th{height:43px;padding:10px 13px;background:#f5f8fc;color:#475569;border-top:1px solid #e5eaf1;border-bottom:1px solid #e5eaf1;font-size:11.5px;letter-spacing:.1px}th:first-child{border-radius:0 9px 9px 0;border-right:1px solid #e5eaf1}th:last-child{border-radius:9px 0 0 9px;border-left:1px solid #e5eaf1}td{height:48px;padding:10px 13px;border-bottom:1px solid #edf1f5;color:#334155}tbody tr:last-child td{border-bottom:0}tr:hover td{background:#f8faff}
.badge{padding:4px 9px;border-radius:6px;font-size:10.5px}.badge-neutral{background:#edf4ff;color:#2455bb}.badge-ok{background:#e9f8f2;color:#117052}.badge-warn{background:#fff5de;color:#996512}.badge-danger{background:#ffedf0;color:#b82737}
.tabs{gap:7px;border:0;margin-bottom:16px;padding:5px;background:#eaf0f8;border-radius:11px}.tab-btn{padding:8px 13px;border:0!important;margin:0;border-radius:8px;font-size:12px}.tab-btn.active{background:#fff;color:#1d4ed8;box-shadow:0 2px 7px rgba(15,23,42,.08)}
.modal-overlay{background:rgba(10,20,39,.64);backdrop-filter:blur(3px)}.modal{border-radius:16px;border:1px solid rgba(255,255,255,.35);box-shadow:0 28px 80px rgba(3,12,28,.3)}.modal-head{padding:19px 22px;background:#f8fafc}.modal-head h3{color:#14213d}.modal-foot{background:#f8fafc}.file-picker{border-color:#cbd6e5;background:#f8fafc}.cost-box{background:#eef4ff;color:#254c91;border:1px solid #dae7ff}.import-step{border-right:0;position:relative}.import-step:before{content:"";position:absolute;right:0;top:18px;bottom:18px;width:4px;background:#2563eb;border-radius:4px 0 0 4px}
.optional-label{display:inline-flex;align-items:center;margin-inline-start:7px;padding:2px 8px;border-radius:999px;background:#eaf2ff;color:#2557a7;font-size:11px;font-weight:700}.attachment-panel{padding:16px;border-width:1.5px;background:linear-gradient(135deg,#f8fbff,#f5f8fc)}.attachment-panel input[type="file"]{width:100%;padding:10px;border:1px solid #dce5f0;border-radius:10px;background:#fff}.item-media-cell{display:flex;align-items:center;gap:8px;min-width:128px}.item-primary-thumb{width:54px;height:54px;object-fit:cover;border-radius:12px;border:1px solid #d8e2ef;background:#fff;box-shadow:0 3px 10px rgba(15,23,42,.08)}.item-file-placeholder{display:grid;place-items:center;width:54px;height:54px;border-radius:12px;background:#eef3fa;border:1px dashed #c8d5e5;font-size:22px}.attachment-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}.attachment-card{min-width:0;overflow:hidden;border:1px solid #dce5f0;border-radius:14px;background:#fff;box-shadow:0 5px 16px rgba(15,23,42,.06)}.attachment-card>img,.attachment-doc{width:100%;height:150px;object-fit:contain;background:#f5f8fc}.attachment-doc{display:grid;place-items:center;font-size:48px}.attachment-card-info{display:grid;gap:7px;padding:12px}.attachment-card-info b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-card-info .btn{justify-content:center}

@media(max-width:900px){
  #loginScreen{padding:16px}.login-card,[dir="ltr"] .login-card{width:430px;min-height:auto;padding:34px 28px}.login-card:before,.login-card:after{display:none}
  #app.show{display:block}.sidebar{position:fixed;right:0;top:0;bottom:0;width:270px;height:100vh;transform:translateX(105%);transition:transform .22s ease;box-shadow:-18px 0 45px rgba(10,20,39,.25)}body.sidebar-open .sidebar{transform:translateX(0)}body.sidebar-open:after{content:"";position:fixed;inset:0;background:rgba(8,18,36,.46);z-index:35}
  [dir="ltr"] .sidebar{right:auto;left:0;transform:translateX(-105%);box-shadow:18px 0 45px rgba(10,20,39,.25)}[dir="ltr"] body.sidebar-open .sidebar{transform:translateX(0)}
  .main{height:auto;min-height:100vh;padding:0 16px 24px}.workspace-header{height:62px;margin:0 -16px 20px;padding:0 16px}.menu-toggle{display:grid}.header-context span:not(.status-dot){display:none}.topbar{gap:12px;flex-wrap:wrap}.topbar h1{font-size:19px}.topbar>.btn,.topbar>div:last-child{max-width:100%}.grid2,.grid3{grid-template-columns:1fr}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-card{min-height:100px}.toolbar{align-items:stretch}.toolbar input,.toolbar select{min-width:0;width:100%}.card{padding:16px;overflow-x:auto}
}
@media(max-width:520px){.stat-grid{grid-template-columns:1fr}.login-card{padding:30px 22px}.header-actions{gap:6px}.lang-chip{display:inline-flex;min-width:42px;padding:0 9px}.attachment-gallery{grid-template-columns:1fr}.item-primary-thumb,.item-file-placeholder{width:46px;height:46px}}
@media print{.workspace-header{display:none!important}.main{padding:0!important}.card{box-shadow:none}.stat-card{box-shadow:none}}