@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@400;500;600;700;800&family=Noto+Sans+Arabic:wght@400;500;600;700;800;900&display=swap');

/* FTOON Inventory UI v3 — Glass Morphism / Sorani-first. Additive UI override. */
:root,
html[data-theme="light"]{
  color-scheme:light;
  --bg:#eaf1f5;--bg2:#dce8ee;
  --surface:rgba(255,255,255,.72);--surface2:rgba(248,252,254,.66);--surface3:rgba(236,246,250,.78);
  --burg:#28576f;--burg2:#3f7792;--burg3:#17394b;--burg-soft:rgba(40,87,111,.10);
  --indigo:#28576f;--indigo2:#3f7792;--indigo3:#17394b;--indigo-soft:rgba(40,87,111,.09);--indigo-mid:#5e92aa;
  --sidebar-bg:rgba(244,250,252,.78);--sidebar-bg2:rgba(232,242,247,.78);
  --sidebar-border:rgba(47,92,113,.13);--sidebar-text:#28495a;--sidebar-text-muted:#68808c;
  --navy:#102f40;--navy2:#173f54;--navy3:#28576f;--navy4:#0b2230;--charcoal:#173443;--charcoal2:#23495d;
  --gold:#ae8953;--gold2:#c9a66b;--gold3:#806238;--champagne:#eadab9;--beige:#d7c6a3;
  --rose:#28576f;--rose2:#3f7792;--rose3:#17394b;--rose-soft:rgba(40,87,111,.10);
  --white:#172d38;--gray:#68808c;--gray2:#263f4b;--gray3:#869aa4;--ink-light:#f5fbfd;--ink-light-2:#d9eaf0;
  --red:#b84f5e;--green:#3f8b6b;--orange:#c88236;--blue:#3c7898;--purple:#756598;--teal:#2f817b;
  --border:rgba(39,81,101,.14);--border-soft:rgba(39,81,101,.08);
  --glass:rgba(255,255,255,.64);--glass-strong:rgba(255,255,255,.80);--glass-soft:rgba(247,252,254,.54);
  --glass-input:rgba(255,255,255,.74);
  --glass-shadow:0 18px 55px rgba(31,65,82,.10),0 2px 10px rgba(31,65,82,.05);
  --glass-shadow-hover:0 22px 65px rgba(31,65,82,.16),0 4px 14px rgba(31,65,82,.07);
  --focus-ring:0 0 0 3px rgba(58,119,146,.18);
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#07131b;--bg2:#0b1b25;
  --surface:rgba(12,29,39,.72);--surface2:rgba(15,36,48,.72);--surface3:rgba(20,45,58,.76);
  --burg:#7bb6cf;--burg2:#91c7db;--burg3:#c9e5ef;--burg-soft:rgba(123,182,207,.12);
  --indigo:#7bb6cf;--indigo2:#91c7db;--indigo3:#c9e5ef;--indigo-soft:rgba(123,182,207,.11);--indigo-mid:#77aabd;
  --sidebar-bg:rgba(8,22,31,.78);--sidebar-bg2:rgba(10,27,38,.80);
  --sidebar-border:rgba(167,211,227,.12);--sidebar-text:#d5e9f1;--sidebar-text-muted:#86a3b0;
  --navy:#061019;--navy2:#0a1a24;--navy3:#123042;--navy4:#040c12;--charcoal:#0b1d27;--charcoal2:#102b39;
  --gold:#d0aa6b;--gold2:#e2c087;--gold3:#f0d9a9;--champagne:#decba4;--beige:#b9a985;
  --rose:#7bb6cf;--rose2:#91c7db;--rose3:#c9e5ef;--rose-soft:rgba(123,182,207,.12);
  --white:#edf8fc;--gray:#8fa9b5;--gray2:#d7e8ef;--gray3:#708c98;--ink-light:#f3fbfe;--ink-light-2:#bdd5de;
  --red:#ef8190;--green:#76c69f;--orange:#e5a45d;--blue:#75add0;--purple:#a995d1;--teal:#6fc1b9;
  --border:rgba(176,218,232,.14);--border-soft:rgba(176,218,232,.08);
  --glass:rgba(10,27,37,.66);--glass-strong:rgba(12,31,42,.84);--glass-soft:rgba(15,38,51,.54);
  --glass-input:rgba(12,30,40,.80);
  --glass-shadow:0 22px 65px rgba(0,0,0,.28),0 3px 12px rgba(0,0,0,.18);
  --glass-shadow-hover:0 26px 75px rgba(0,0,0,.36),0 4px 16px rgba(0,0,0,.22);
  --focus-ring:0 0 0 3px rgba(123,182,207,.20);
}
html{background:var(--bg);}
body{
  font-family:'Noto Sans Arabic','Noto Kufi Arabic',Tahoma,Arial,sans-serif !important;
  background:
    radial-gradient(900px 520px at 88% -5%,rgba(79,151,181,.16),transparent 66%),
    radial-gradient(760px 540px at 0% 100%,rgba(197,162,105,.10),transparent 68%),
    linear-gradient(145deg,var(--bg) 0%,var(--bg2) 100%) !important;
  background-attachment:fixed !important;color:var(--white);
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:42px 42px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 82%);
}
.pgt,.ct,.mt,.sb-logo .an,.llogo h1,h1,h2,h3,h4,.sc .sv,.scv{
  font-family:'Noto Kufi Arabic','Noto Sans Arabic',Tahoma,sans-serif !important;
}
.card,.sc,.pcard,.lbox,.md,.chk-item,.notif-item,.audit-card,.wh-card,.report-card,.cat-card,.product-card,.order-card{
  background:var(--glass) !important;border-color:var(--border) !important;box-shadow:var(--glass-shadow) !important;
  backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%);
}
.card:hover,.sc:hover,.pcard:hover{box-shadow:var(--glass-shadow-hover) !important;}
.ch,.mh,.mf{
  background:var(--glass-soft) !important;border-color:var(--border-soft) !important;
  backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%);
}
#app{position:relative}.main{background:transparent !important}
.sb{
  background:linear-gradient(180deg,var(--sidebar-bg),var(--sidebar-bg2)) !important;border-color:var(--sidebar-border) !important;
  box-shadow:-12px 0 44px rgba(7,24,33,.08) !important;backdrop-filter:blur(26px) saturate(145%);-webkit-backdrop-filter:blur(26px) saturate(145%);
}
html[data-theme="dark"] .sb{box-shadow:-14px 0 48px rgba(0,0,0,.25) !important}
.sb-logo,.sb-user{background:rgba(255,255,255,.18) !important;border-color:var(--sidebar-border) !important}
html[data-theme="dark"] .sb-logo,html[data-theme="dark"] .sb-user{background:rgba(2,13,19,.16) !important}
.ni{border:1px solid transparent}
.ni:hover{background:rgba(255,255,255,.32) !important;border-color:var(--border-soft);color:var(--burg3) !important;box-shadow:none !important}
html[data-theme="dark"] .ni:hover{background:rgba(128,190,214,.08) !important;color:var(--burg3) !important}
.ni.active{
  background:linear-gradient(135deg,rgba(38,92,118,.96),rgba(62,125,153,.90)) !important;color:#fff !important;
  border-color:rgba(255,255,255,.14);box-shadow:0 10px 28px rgba(27,76,98,.26) !important;
}
html[data-theme="dark"] .ni.active{background:linear-gradient(135deg,rgba(49,103,128,.84),rgba(74,139,165,.72)) !important;box-shadow:0 12px 34px rgba(0,0,0,.26) !important}
.sb-logout{background:rgba(184,79,94,.08) !important}
.topbar{
  position:sticky;top:0;z-index:80;padding:10px 12px;margin:-6px -6px 18px !important;border:1px solid var(--border-soft);border-radius:18px;
  background:rgba(255,255,255,.28);box-shadow:0 8px 32px rgba(31,65,82,.06);
  backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);
}
html[data-theme="dark"] .topbar{background:rgba(5,18,26,.42);box-shadow:0 10px 35px rgba(0,0,0,.18)}
.tb-icon,.menu-btn,.theme-switch{
  background:var(--glass-strong) !important;color:var(--burg) !important;border:1px solid var(--border) !important;
  box-shadow:0 4px 14px rgba(31,65,82,.08) !important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
}
.tb-icon:hover,.menu-btn:hover,.theme-switch:hover{transform:translateY(-1px);background:var(--surface3) !important;box-shadow:0 8px 20px rgba(31,65,82,.13) !important}
.theme-switch{width:40px;height:40px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font:inherit;font-size:17px;transition:.2s ease}
.theme-switch-login{position:fixed;top:18px;left:18px;z-index:20}.theme-switch .theme-icon{line-height:1;transform:translateY(-1px)}
#loginPage{
  background:radial-gradient(820px 520px at 75% 15%,rgba(83,158,187,.18),transparent 68%),radial-gradient(700px 460px at 15% 90%,rgba(205,169,108,.11),transparent 68%),linear-gradient(145deg,var(--bg),var(--bg2)) !important;
}
#loginPage::before{opacity:.65}.lbox{border-radius:26px !important;box-shadow:0 34px 85px rgba(22,54,70,.15) !important}
html[data-theme="dark"] .lbox{box-shadow:0 35px 95px rgba(0,0,0,.38) !important}
.llogo .crown,.sb-logo .crown{background:linear-gradient(135deg,#28576f,#5c92aa) !important;box-shadow:0 12px 28px rgba(24,78,103,.27) !important}
.fg input,.fg select,.fg textarea,input[type="text"],input[type="password"],input[type="date"],input[type="email"],input[type="number"],select,textarea,.si2,.fs,input.num{
  background:var(--glass-input) !important;color:var(--gray2) !important;border-color:var(--border) !important;box-shadow:none !important;
}
.fg input:focus,.fg select:focus,.fg textarea:focus,input:focus,select:focus,textarea:focus,.si2:focus,.fs:focus{
  outline:none !important;border-color:var(--burg) !important;box-shadow:var(--focus-ring) !important;
}
::placeholder{color:var(--gray3) !important;opacity:.82}select option{background:var(--bg2) !important;color:var(--gray2) !important}
.btn{border-radius:11px !important;letter-spacing:0 !important}
.btn-p{background:linear-gradient(135deg,#28576f,#477f99) !important;color:#fff !important;box-shadow:0 7px 18px rgba(39,93,118,.22) !important}
.btn-s{background:var(--glass-strong) !important;color:var(--gray2) !important;border-color:var(--border) !important}
.btn-g,.btn-b,.btn-o,.btn-pur,.btn-d{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.tw{border-radius:12px}th{background:rgba(86,140,163,.08) !important;color:var(--burg3) !important;border-color:var(--border) !important}
html[data-theme="dark"] th{background:rgba(121,183,207,.07) !important}
td{color:var(--gray2) !important;border-color:var(--border-soft) !important}
tr:hover td{background:rgba(83,145,171,.055) !important}
html[data-theme="dark"] tr:hover td{background:rgba(124,185,208,.055) !important}
.pcard{border-radius:16px !important}.pcard .pcimg,.pimg{background:var(--glass-soft) !important;border-color:var(--border) !important}
.pcard .pcname{color:var(--gray2) !important}.pcard .pcqty{background:var(--indigo-soft) !important;color:var(--burg3) !important}
.cat-chip{background:var(--glass) !important;border-color:var(--border) !important;color:var(--gray2) !important;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
.cat-chip.active{background:linear-gradient(135deg,#28576f,#477f99) !important;color:#fff !important}
.al,.al-i,.al-w,.al-d,.al-g{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
html[data-theme="dark"] .al-i{color:#b9d9e8 !important}html[data-theme="dark"] .al-w{color:#f0c488 !important}
html[data-theme="dark"] .al-d{color:#f0a0ab !important}html[data-theme="dark"] .al-g{color:#9cdbbd !important}
code{background:var(--glass-soft) !important;color:var(--burg3) !important}
.mo{background:rgba(4,12,17,.48) !important;backdrop-filter:blur(10px) !important;-webkit-backdrop-filter:blur(10px) !important}
input[type="checkbox"],input[type="radio"]{accent-color:#3f7792}
button:focus-visible,a:focus-visible,.ni:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--burg) !important;outline-offset:2px}
::-webkit-scrollbar-thumb{background:rgba(74,126,150,.34) !important}
html[data-theme="dark"] ::-webkit-scrollbar-track{background:rgba(255,255,255,.025) !important}
@media (max-width:900px){.topbar{top:6px;margin:0 0 16px !important;border-radius:16px}.theme-switch-login{top:12px;left:12px}}
@media (max-width:520px){
  body{font-size:13.5px}.main{padding:10px !important}.topbar{padding:9px 10px;gap:8px;flex-direction:row !important;align-items:center !important}
  .topbar-left{min-width:0;flex:1}.topbar-left>div{min-width:0}.pgt{font-size:16px !important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pgs{max-width:62vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-right{flex-shrink:0}
  .tb-icon,.theme-switch,.menu-btn{width:38px !important;height:38px !important}.lbox{border-radius:22px !important;padding:30px 20px !important}
  .card,.sc,.pcard{border-radius:15px !important}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto !important;animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}}
@media print{
  html,body{background:#fff !important;color:#000 !important}.card,.sc,.pcard,.md{background:#fff !important;color:#000 !important;box-shadow:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
  td,th{color:#000 !important;background:#fff !important}.theme-switch{display:none !important}
}

.field-help{margin-top:6px;color:var(--gray);font-size:11.5px;line-height:1.8}