:root {
  /* الوضع الفاتح الافتراضي أو كخيار */
  --bg: #f4f6fb;
  --surface: #ffffff;
  --surface-2: #f8f9fc;
  --ink: #0f172a;
  --muted: #64748b;
  --line: #e2e8f0;
  --primary: #0ea5e9;
  --primary-dark: #0284c7;
  --indigo: #6366f1;
  --emerald: #10b981;
  --amber: #eab308;
  --rose: #f43f5e;
  --sidebar: #0f172a;
  --sidebar-2: #1e293b;
  --radius: 22px;
  --shadow: 0 10px 40px rgba(15, 23, 42, 0.05);
  --glow: transparent;
}

html[data-theme="dark"] {
  /* الوضع الداكن الفاخر - مستوحى من صورة AL-HOSN */
  --bg: #0b0f19;
  --surface: #111726;
  --surface-2: #162035;
  --ink: #ffffff;
  --muted: #94a3b8;
  --line: #1e293b;
  --primary: #00d2ff;
  --primary-dark: #00a2c7;
  --indigo: #6366f1;
  --emerald: #10b981;
  --amber: #f59e0b;
  --rose: #ef4444;
  --sidebar: #070a12;
  --sidebar-2: #0b0f18;
  --radius: 22px;
  --shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
  --glow: rgba(0, 210, 255, 0.15);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:'Cairo',sans-serif;font-size:14px;overflow-x:hidden}.ambient{position:fixed;filter:blur(80px);border-radius:50%;opacity:.17;z-index:-1}.ambient-one{width:420px;height:420px;background:#7158ff;top:-200px;right:15%}.ambient-two{width:360px;height:360px;background:#00c99b;bottom:-180px;left:5%}.app-shell{min-height:100vh}.sidebar{position:fixed;right:0;top:0;bottom:0;width:265px;background:linear-gradient(160deg,var(--sidebar),var(--sidebar-2));padding:24px 18px;color:#fff;z-index:1040;display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(17,24,42,.12)}.brand-wrap{display:flex;align-items:center;gap:12px;padding:0 8px 28px;border-bottom:1px solid rgba(255,255,255,.08)}.brand-wrap strong,.login-brand strong{display:block;font-size:19px;letter-spacing:2px}.brand-wrap small,.login-brand small{display:block;color:#9ba6c2;font-size:10px;letter-spacing:.5px}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#7869ff,#4b3ed0);display:grid;place-items:center;box-shadow:0 10px 30px rgba(91,77,232,.45);position:relative;overflow:hidden}.brand-mark:after{content:"";position:absolute;width:30px;height:70px;background:rgba(255,255,255,.18);transform:rotate(35deg);left:-20px;animation:shine 4s infinite}.brand-mark span{font-size:22px;font-weight:800}.brand-mark.lg{width:54px;height:54px;border-radius:18px}.sidebar-close{color:#fff;margin-right:auto}.sidebar-nav{display:flex;flex-direction:column;gap:7px;margin-top:28px}.nav-item{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:14px;color:#aeb7cd;text-decoration:none;transition:.25s}.nav-item i{font-size:18px;width:24px}.nav-item:hover{color:#fff;background:rgba(255,255,255,.06);transform:translateX(-3px)}.nav-item.active{color:#fff;background:linear-gradient(90deg,rgba(101,88,245,.25),rgba(101,88,245,.08));box-shadow:inset -3px 0 #8075ff}.sidebar-insight{margin-top:auto;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:16px;text-align:center}.sidebar-insight strong{display:block;margin-top:8px}.sidebar-insight small{display:block;color:#aab4ca;font-size:11px;margin-top:4px}.pulse-ring{margin:auto;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(18,168,121,.16);color:#54ddb5;position:relative}.pulse-ring:after{content:"";position:absolute;inset:-6px;border:1px solid rgba(84,221,181,.35);border-radius:50%;animation:pulse 2s infinite}.app-main{margin-right:265px;min-height:100vh}.topbar{height:84px;padding:0 30px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:1030;background:rgba(244,246,251,.82);backdrop-filter:blur(16px);border-bottom:1px solid rgba(232,235,242,.8)}.page-heading span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.page-heading h1{font-size:20px;margin:2px 0 0;font-weight:800}.top-actions{display:flex;align-items:center;gap:12px}.icon-btn{width:40px;height:40px;border-radius:13px;border:1px solid var(--line);background:#fff;display:inline-grid;place-items:center;color:var(--ink);transition:.2s;text-decoration:none}.icon-btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(36,43,74,.12);color:var(--primary)}.notification-dot{position:absolute;top:8px;right:9px;width:7px;height:7px;background:#ef5b78;border:2px solid #fff;border-radius:50%}.user-chip button{display:flex;align-items:center;gap:10px;padding:4px 8px}.avatar,.mini-avatar{display:inline-grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,#e9e6ff,#d9d4ff);color:var(--primary-dark);font-weight:800}.avatar{width:42px;height:42px}.mini-avatar{width:31px;height:31px;border-radius:10px}.user-chip strong{display:block;font-size:12px}.user-chip small{display:block;font-size:10px;color:var(--muted)}.page-stage{padding:26px 30px 50px;max-width:1800px;margin:auto}.hero-strip,.page-hero,.workspace-hero{border-radius:var(--radius);padding:28px 30px;background:linear-gradient(125deg,#3f34b8,#6658f3 58%,#8b76ff);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:0 24px 55px rgba(91,77,232,.22);position:relative;overflow:hidden}.hero-strip:before,.page-hero:before,.workspace-hero:before{content:"";position:absolute;width:280px;height:280px;border:55px solid rgba(255,255,255,.08);border-radius:50%;left:-80px;top:-110px}.hero-strip:after,.page-hero:after,.workspace-hero:after{content:"";position:absolute;width:170px;height:170px;background:rgba(255,255,255,.08);border-radius:45px;transform:rotate(30deg);right:42%;bottom:-140px}.hero-strip>* ,.page-hero>* ,.workspace-hero>*{position:relative;z-index:1}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.8px;text-transform:uppercase;font-weight:700;opacity:.84}.hero-strip h2,.page-hero h2,.workspace-hero h2{font-size:31px;margin:7px 0 4px;font-weight:800}.hero-strip p,.page-hero p,.workspace-hero p{margin:0;opacity:.78}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:22px 0}.metric-grid.compact{margin-top:22px}.metric-card{background:#fff;border:1px solid rgba(232,235,242,.8);padding:20px;border-radius:20px;display:flex;align-items:center;gap:16px;box-shadow:0 10px 36px rgba(35,43,77,.055);position:relative;overflow:hidden;min-height:120px}.metric-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;left:-35px;bottom:-40px;opacity:.08;background:currentColor}.metric-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;font-size:22px}.metric-card span{display:block;color:var(--muted);font-size:12px}.metric-card strong{display:block;font-size:27px;line-height:1.35;margin-top:2px}.metric-card small{color:var(--muted);font-size:10px}.metric-money{font-size:18px!important}.metric-indigo{color:var(--indigo)}.metric-indigo .metric-icon{background:#eeecff}.metric-amber{color:#d58b0c}.metric-amber .metric-icon{background:#fff5df}.metric-emerald{color:var(--emerald)}.metric-emerald .metric-icon{background:#e4faf3}.metric-rose{color:var(--rose)}.metric-rose .metric-icon{background:#ffe9ee}.panel{background:#fff;border:1px solid rgba(232,235,242,.9);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}.panel-head,.table-toolbar,.pane-header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px}.panel-head span,.pane-header span{font-size:10px;color:var(--muted);letter-spacing:.8px;text-transform:uppercase}.panel-head h3,.table-toolbar h3,.pane-header h3{font-size:17px;margin:3px 0 0;font-weight:800}.table-toolbar span{font-size:11px;color:var(--muted)}.soft-link{font-size:12px;color:var(--primary);text-decoration:none}.chart-box{min-height:300px}.chart-box.small{min-height:260px}.finance-orb{height:145px;width:145px;margin:18px auto;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#fff 47%,transparent 49%),conic-gradient(var(--primary) 0 66%,#eceafc 66%);position:relative}.finance-orb div{text-align:center}.finance-orb span{display:block;font-size:10px;color:var(--muted)}.finance-orb strong{font-size:14px}.mini-finance{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.mini-finance div{background:var(--surface-2);border-radius:13px;padding:10px;text-align:center}.mini-finance span{display:block;font-size:9px;color:var(--muted)}.mini-finance strong{font-size:11px}.attention-list{display:flex;flex-direction:column}.attention-item{display:flex;align-items:center;gap:14px;padding:13px 4px;text-decoration:none;color:inherit;border-bottom:1px solid var(--line)}.attention-item:last-child{border-bottom:0}.attention-item:hover h4{color:var(--primary)}.attention-date{min-width:70px;padding:8px;border-radius:13px;background:#f0efff;text-align:center;color:var(--primary)}.attention-date.urgent{background:#fff5df;color:#c98000}.attention-date.late{background:#ffe9ee;color:#d94060}.attention-date strong{display:block;font-size:19px}.attention-date small{font-size:8px}.attention-item h4{font-size:13px;margin:6px 0 3px;transition:.2s}.attention-item p{margin:0;color:var(--muted);font-size:10px}.status-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:700;white-space:nowrap}.status-sky{background:#e8f7ff;color:#1685b6}.status-violet{background:#eeeaff;color:#6550d9}.status-amber{background:#fff4dd;color:#bd7700}.status-orange{background:#fff0e3;color:#d46712}.status-emerald{background:#e6f9f2;color:#06875f}.status-slate{background:#edf0f5;color:#697386}.task-list,.task-board{display:flex;flex-direction:column}.task-item,.task-board-item{display:flex;align-items:flex-start;gap:11px;padding:14px 2px;border-bottom:1px solid var(--line)}.task-item:last-child,.task-board-item:last-child{border:0}.task-check{border:0;background:none;color:var(--primary);font-size:18px;padding:0}.task-item strong,.task-board-item strong{display:block;font-size:12px}.task-item small,.task-board-item span{display:block;color:var(--muted);font-size:9px;margin-top:3px}.task-board-item>small{margin-right:auto;color:var(--muted)}.task-board-item.done{opacity:.55}.task-board-item.done strong{text-decoration:line-through}.empty-state{padding:28px;text-align:center;color:var(--muted)}.empty-state i{font-size:35px;color:#c5cbe0}.empty-state p{margin:8px 0 0}.empty-state.wide{grid-column:1/-1;width:100%;background:#fafbfe;border:1px dashed #d9deea;border-radius:18px}.quick-filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.filter-chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 13px;font-size:11px;color:var(--muted);transition:.2s}.filter-chip i{margin-left:6px}.filter-chip:hover,.filter-chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}.orspra-table{margin:0!important}.orspra-table thead th{background:#f7f8fc!important;color:#6f788c;font-size:10px;font-weight:700;border:0;padding:13px 11px;white-space:nowrap}.orspra-table thead th:first-child{border-radius:0 13px 13px 0}.orspra-table thead th:last-child{border-radius:13px 0 0 13px}.orspra-table tbody td{padding:14px 11px;border-bottom:1px solid #edf0f5;font-size:11px;vertical-align:middle}.orspra-table tbody tr{transition:.2s}.orspra-table tbody tr:hover{background:#fafaff}.row-expander{width:32px;height:32px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--primary);transition:.25s}.row-expander.open{transform:rotate(45deg);background:var(--primary);color:#fff}.code-cell span,.tender-link strong,.subject-cell strong,.due-cell strong{display:block;font-size:11px}.code-cell small,.tender-link small,.subject-cell span,.due-cell small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.tender-link{text-decoration:none;color:inherit}.tender-link:hover strong{color:var(--primary)}.subject-cell{max-width:260px}.subject-cell span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.due-cell.is-late strong,.due-cell.is-late small{color:#dd3d60}.due-cell.is-urgent strong,.due-cell.is-urgent small{color:#c47d05}.owner-cell{display:flex;align-items:center;gap:8px}.count-badge{width:30px;height:30px;border-radius:10px;display:inline-grid;place-items:center;background:#f0efff;color:var(--primary);font-weight:800}.btn-primary{--bs-btn-bg:var(--primary);--bs-btn-border-color:var(--primary);--bs-btn-hover-bg:var(--primary-dark);--bs-btn-hover-border-color:var(--primary-dark);box-shadow:0 10px 22px rgba(91,77,232,.17)}.btn-soft{background:#f0efff;color:var(--primary);border:0}.btn-soft:hover{background:var(--primary);color:#fff}.dt-container .dt-search input,.dt-container .dt-length select{border:1px solid var(--line)!important;border-radius:11px!important;padding:7px 10px!important;background:#fafbfe!important}.dt-container .dt-search label,.dt-container .dt-length label,.dt-container .dt-info{font-size:10px;color:var(--muted)}.dt-container .pagination{gap:4px}.dt-container .page-link{border:0;border-radius:10px!important;color:var(--ink);font-size:11px}.dt-container .active>.page-link{background:var(--primary)}.tender-expanded{padding:12px!important;background:#f8f9fd!important}.expanded-shell{display:grid;grid-template-columns:1.25fr repeat(3,1fr) .9fr;gap:12px;padding:12px}.expand-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;min-height:105px}.expand-card span{display:block;color:var(--muted);font-size:9px}.expand-card strong{display:block;font-size:13px;margin:4px 0}.expand-card p{font-size:10px;color:var(--muted);margin:0}.expand-action{display:flex;align-items:center;justify-content:center}.expand-timeline{display:flex;flex-direction:column;gap:5px;margin-top:7px}.expand-timeline div{display:flex;gap:6px;align-items:center;font-size:9px}.modal-premium{border:0;border-radius:24px;overflow:hidden;box-shadow:0 30px 100px rgba(28,36,70,.22)}.modal-premium .modal-header{padding:20px 24px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,#fbfbff,#f4f2ff)}.modal-header span{display:block;font-size:9px;color:var(--primary);text-transform:uppercase;letter-spacing:1px}.modal-header h5{font-weight:800;margin:3px 0 0}.modal-premium .modal-body{padding:24px}.modal-premium .modal-footer{padding:15px 24px;border-top:1px solid var(--line)}label{font-size:10px;color:#60697c;margin-bottom:6px;font-weight:700}.form-control,.form-select{border:1px solid #dde2ec;border-radius:12px;padding:10px 12px;font-size:12px;background:#fbfcfe}.form-control:focus,.form-select:focus{border-color:#988eff;box-shadow:0 0 0 4px rgba(91,77,232,.09);background:#fff}.form-section{border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:16px}.form-section h6{font-size:12px;font-weight:800;margin:0 0 15px}.form-section h6 span{display:inline-grid;place-items:center;width:27px;height:27px;border-radius:9px;background:#efedff;color:var(--primary);font-size:9px;margin-left:8px}.workspace-hero{padding:23px 28px}.workspace-title h2{font-size:28px}.back-chip{display:inline-flex;gap:5px;align-items:center;color:#fff;text-decoration:none;font-size:10px;opacity:.75;margin-bottom:7px}.workspace-actions{display:flex;align-items:center;gap:10px}.workspace-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.workspace-kpis>div{background:#fff;border:1px solid var(--line);border-radius:17px;padding:15px 17px}.workspace-kpis span{display:block;color:var(--muted);font-size:9px}.workspace-kpis strong{display:block;margin:4px 0;font-size:13px}.workspace-kpis small{color:var(--muted);font-size:9px}.workspace-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start}.workspace-rail{background:#fff;border:1px solid var(--line);border-radius:20px;padding:10px;position:sticky;top:104px;box-shadow:var(--shadow)}.workspace-tab{width:100%;display:flex;align-items:center;gap:11px;border:0;background:transparent;border-radius:13px;padding:11px;color:#737d91;font-size:11px;text-align:right;transition:.2s}.workspace-tab i{font-size:16px;width:20px}.workspace-tab b{margin-right:auto;background:#f1f2f6;border-radius:8px;padding:2px 7px;font-size:9px}.workspace-tab:hover,.workspace-tab.active{background:#efedff;color:var(--primary);font-weight:700}.workspace-content{min-width:0}.workspace-pane{display:none}.workspace-pane.active{display:block;animation:fadeUp .35s ease}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.detail-grid>div{background:#f9fafc;border-radius:14px;padding:13px}.detail-grid .span-2{grid-column:span 2}.detail-grid span{display:block;color:var(--muted);font-size:9px}.detail-grid strong{display:block;font-size:11px;margin-top:4px;white-space:pre-line}.detail-grid small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.last-notes>div{display:flex;gap:9px;padding:10px 0;border-bottom:1px solid var(--line)}.last-notes p{font-size:10px;margin:0;white-space:pre-line}.last-notes strong,.last-notes small{display:block}.last-notes small{color:var(--muted);font-size:8px;margin-top:3px}.card-grid-list,.execution-list{display:flex;flex-direction:column;gap:10px}.item-card,.execution-card{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 8px 28px rgba(33,42,74,.04);transition:.2s}.item-card:hover,.execution-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.item-index{font-size:18px;font-weight:800;color:#c2c7d7;width:40px}.item-card span{font-size:8px;color:var(--muted)}.item-card h4,.execution-card h4{font-size:12px;margin:4px 0;white-space:pre-line}.item-card small{color:var(--muted);font-size:9px}.supply-card,.shipment-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;height:100%;box-shadow:0 8px 28px rgba(33,42,74,.04)}.supply-top{display:flex;justify-content:space-between}.pn-chip,.code-chip,.soft-badge{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:9px;font-weight:700}.pn-chip,.code-chip{background:#efedff;color:var(--primary)}.soft-badge{background:#f1f3f7;color:#687186}.soft-badge.green{background:#e6f9f2;color:#06875f}.supply-card h4,.shipment-card h4{font-size:13px;margin:14px 0}.supply-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.supply-meta div{background:#f8f9fc;border-radius:11px;padding:9px}.supply-meta span{display:block;color:var(--muted);font-size:8px}.supply-meta strong{font-size:9px}.supply-card p,.shipment-card p{font-size:9px;color:var(--muted);margin:12px 0 0}.execution-icon{width:45px;height:45px;border-radius:14px;background:#efedff;color:var(--primary);display:grid;place-items:center;font-size:19px}.execution-meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:9px}.execution-meta i{margin-left:4px}.premium-progress{height:7px;border-radius:99px;background:#eceef5}.premium-progress .progress-bar{border-radius:99px;background:linear-gradient(90deg,#5b4de8,#12a879)}.finance-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.finance-summary>div{background:linear-gradient(135deg,#fff,#f9f9ff);border:1px solid var(--line);border-radius:18px;padding:18px}.finance-summary span{display:block;color:var(--muted);font-size:9px}.finance-summary strong{display:block;font-size:17px;margin-top:5px}.files-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.file-card{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;text-decoration:none;color:inherit;transition:.2s}.file-card:hover{border-color:#aaa2ff;transform:translateY(-2px)}.file-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#fff0f2;color:#e44f69;font-size:20px}.file-card div:nth-child(2){min-width:0;flex:1}.file-card strong,.file-card span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-card strong{font-size:10px}.file-card span{font-size:8px;color:var(--muted);margin-top:3px}.timeline{position:relative;padding-right:20px}.timeline:before{content:"";position:absolute;right:19px;top:0;bottom:0;width:2px;background:#e5e8f0}.timeline-item{position:relative;display:flex;gap:15px;margin-bottom:15px}.timeline-dot{width:39px;height:39px;min-width:39px;border-radius:13px;display:grid;place-items:center;z-index:1}.timeline-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;flex:1}.timeline-card span{font-size:8px;color:var(--muted)}.timeline-card h4{font-size:11px;margin:4px 0}.timeline-card p{font-size:10px;margin:0;color:#5f687c;white-space:pre-line}.supplier-list{display:flex;flex-direction:column;gap:7px}.supplier-list>div{background:#f8f9fc;border-radius:12px;padding:10px 12px;font-size:11px}.shipment-board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.shipment-board-card{background:#fff;border:1px solid var(--line);border-radius:21px;padding:18px;box-shadow:var(--shadow)}.shipment-card-head{display:flex;justify-content:space-between;gap:12px}.shipment-card-head h3{font-size:14px;margin:11px 0 3px}.shipment-card-head p{font-size:9px;color:var(--muted);margin:0}.radial-progress{--value:0;width:65px;height:65px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#fff 59%,transparent 61%),conic-gradient(var(--primary) calc(var(--value)*1%),#eceef5 0)}.radial-progress strong{font-size:10px}.shipment-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:15px}.shipment-stats div{background:#f8f9fc;border-radius:11px;padding:9px;text-align:center}.shipment-stats span{display:block;color:var(--muted);font-size:8px}.shipment-stats strong{font-size:10px}.shipment-action{font-size:9px;color:#616b7e;background:#faf7ed;border-radius:11px;padding:9px;margin:12px 0}.shipment-action i{color:#f0a21b;margin-left:5px}.shipment-buttons{display:flex;gap:7px}.shipment-buttons .btn{flex:1}.money-stack strong,.money-stack span,.money-stack small{display:block}.money-stack small{color:var(--muted);font-size:8px}.collection-cell{min-width:140px}.collection-cell>div:first-child{display:flex;justify-content:space-between;font-size:9px}.collection-cell .progress{height:5px;margin:5px 0}.collection-cell .progress-bar{background:var(--emerald)}.collection-cell>small{color:var(--muted);font-size:8px}.invoice-status{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:9px;font-weight:700}.invoice-status.collected{background:#e6f9f2;color:#06875f}.invoice-status.overdue{background:#ffe9ee;color:#d94060}.invoice-status.partial{background:#fff4dd;color:#bd7700}.invoice-status.pending{background:#edf0f5;color:#697386}.report-money-list{display:flex;flex-direction:column}.report-money-list div{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line)}.report-money-list span{color:var(--muted);font-size:10px}.report-money-list strong{font-size:11px}.rank-list>div{display:grid;grid-template-columns:30px 120px 1fr 30px;align-items:center;gap:10px;padding:9px 0}.rank{width:25px;height:25px;border-radius:8px;display:grid;place-items:center;background:#f0efff;color:var(--primary);font-size:9px}.rank-list strong{font-size:10px}.rank-bar{height:6px;background:#eef0f5;border-radius:99px;overflow:hidden}.rank-bar i{display:block;height:100%;background:linear-gradient(90deg,#5b4de8,#12a879);border-radius:99px}.rank-list b{font-size:10px}.user-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.user-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow)}.user-avatar{width:54px;height:54px;border-radius:17px;background:linear-gradient(135deg,#6658f3,#9d8cff);color:#fff;display:grid;place-items:center;font-size:21px;font-weight:800}.user-card>div:nth-child(2){flex:1}.user-card h3{font-size:13px;margin:5px 0 2px}.user-card p,.user-card small{font-size:9px;color:var(--muted);margin:0}.role-badge{font-size:8px;border-radius:999px;padding:3px 7px;background:#edf0f5}.role-badge.admin{background:#ffe9ee;color:#d94060}.role-badge.supervisor{background:#fff4dd;color:#bd7700}.error-page{text-align:center;padding:80px 20px}.error-code{font-size:110px;font-weight:800;line-height:1;color:#dedafc}.error-page h2{font-weight:800}.error-page p{color:var(--muted)}
/* Login */
.login-body{min-height:100vh;background:#0c1222;color:#fff;overflow:hidden;position:relative}.login-grid{position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:45px 45px;mask-image:linear-gradient(to bottom,black,transparent)}.login-orbit{position:fixed;border-radius:50%;filter:blur(80px);opacity:.28}.orbit-a{width:560px;height:560px;background:#6558f5;top:-260px;right:-130px}.orbit-b{width:500px;height:500px;background:#00bd91;bottom:-300px;left:-120px}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;position:relative;z-index:2}.login-story{padding:55px 8vw;display:flex;flex-direction:column;justify-content:space-between}.login-brand{display:flex;align-items:center;gap:13px}.story-copy h1{font-size:58px;line-height:1.22;font-weight:800;margin:18px 0}.story-copy h1 em{font-style:normal;color:#8f83ff}.story-copy p{max-width:510px;color:#aab4c9;font-size:15px}.story-cards{display:flex;gap:10px}.story-cards div{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);border-radius:13px;color:#b9c1d4;font-size:11px}.login-card-wrap{display:grid;place-items:center;padding:35px}.login-card{width:min(440px,100%);background:rgba(255,255,255,.97);color:var(--ink);border-radius:28px;padding:36px;box-shadow:0 40px 120px rgba(0,0,0,.38);position:relative}.login-card:before{content:"";position:absolute;inset:0;border-radius:28px;padding:1px;background:linear-gradient(135deg,#a49aff,transparent,#51d9b6);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none}.login-card-head span{font-size:10px;color:var(--primary);font-weight:800;letter-spacing:.7px}.login-card-head h2{font-size:25px;font-weight:800;margin:6px 0}.login-card-head p{color:var(--muted);font-size:11px;margin-bottom:25px}.login-form label{margin-top:12px}.input-shell{display:flex;align-items:center;border:1px solid #dde2ec;border-radius:14px;background:#f8f9fc;padding:0 13px;transition:.2s}.input-shell:focus-within{background:#fff;border-color:#988eff;box-shadow:0 0 0 4px rgba(91,77,232,.09)}.input-shell>i{color:#8d95a7}.input-shell input{flex:1;border:0;outline:0;background:transparent;padding:13px;font-family:inherit;font-size:12px}.input-shell button{border:0;background:none;color:#8d95a7}.login-submit{width:100%;border:0;border-radius:15px;background:linear-gradient(135deg,#5b4de8,#7567f5);color:#fff;padding:14px 17px;margin-top:24px;display:flex;justify-content:space-between;align-items:center;font-family:inherit;font-weight:700;box-shadow:0 15px 35px rgba(91,77,232,.25);transition:.25s}.login-submit:hover{transform:translateY(-2px);box-shadow:0 20px 40px rgba(91,77,232,.34)}.login-security{text-align:center;margin-top:20px;color:#9199aa;font-size:9px}.login-security i{color:var(--emerald);margin-left:5px}
.reveal{animation:fadeUp .55s ease both}.delay-1{animation-delay:.08s}.delay-2{animation-delay:.16s}.delay-3{animation-delay:.24s}@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes pulse{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.25);opacity:0}}@keyframes shine{0%,65%{left:-30px}85%,100%{left:70px}}
@media(max-width:1300px){.metric-grid{grid-template-columns:repeat(2,1fr)}.shipment-board,.user-grid{grid-template-columns:repeat(2,1fr)}.expanded-shell{grid-template-columns:repeat(2,1fr)}}
@media(max-width:991px){.sidebar{transform:translateX(110%);transition:.3s}.sidebar.open{transform:none}.sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(10,15,28,.45);z-index:1039}.sidebar.open+.sidebar-backdrop{display:block}.app-main{margin-right:0}.topbar{padding:0 18px}.page-stage{padding:20px 16px 40px}.workspace-grid{grid-template-columns:1fr}.workspace-rail{position:static;display:flex;overflow:auto}.workspace-tab{min-width:max-content;width:auto}.login-shell{grid-template-columns:1fr}.login-story{display:none}.login-card-wrap{padding:20px}.shipment-board{grid-template-columns:1fr 1fr}.workspace-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.hero-strip,.page-hero,.workspace-hero{padding:22px;align-items:flex-start;flex-direction:column}.hero-strip h2,.page-hero h2,.workspace-hero h2{font-size:24px}.metric-grid,.workspace-kpis,.finance-summary,.shipment-board,.user-grid{grid-template-columns:1fr}.metric-card{min-height:100px}.files-grid{grid-template-columns:1fr}.detail-grid{grid-template-columns:1fr}.detail-grid .span-2{grid-column:auto}.supply-meta{grid-template-columns:repeat(2,1fr)}.topbar{height:72px}.page-heading h1{font-size:16px}.user-chip .dropdown-toggle:after{display:none}.story-copy h1{font-size:40px}.login-card{padding:25px}.expanded-shell{grid-template-columns:1fr}.workspace-actions{flex-wrap:wrap}.workspace-hero{align-items:stretch}.workspace-rail{border-radius:15px}.modal-dialog{margin:10px}.modal-premium{border-radius:19px}}

/* Accessibility - Font Size Increases */
body {
  font-size: 18px !important;
}
.orspra-table thead th {
  font-size: 14.5px !important;
}
.orspra-table tbody td {
  font-size: 15.5px !important;
}
label {
  font-size: 14.5px !important;
}
.form-control, .form-select {
  font-size: 16px !important;
}
.code-cell span, .tender-link strong, .subject-cell strong, .due-cell strong {
  font-size: 15.5px !important;
}
.code-cell small, .tender-link small, .subject-cell span, .due-cell small {
  font-size: 12.5px !important;
}
.eyebrow {
  font-size: 14.5px !important;
}
.workspace-tab {
  font-size: 15.5px !important;
}
.workspace-tab b {
  font-size: 12px !important;
}
.detail-grid strong {
  font-size: 15.5px !important;
}
.detail-grid span, .detail-grid small {
  font-size: 12.5px !important;
}
.expand-card span {
  font-size: 12.5px !important;
}
.expand-card strong {
  font-size: 17px !important;
}
.expand-card p {
  font-size: 14px !important;
}
.panel-head h3, .table-toolbar h3, .pane-header h3 {
  font-size: 21.5px !important;
}
.page-hero h2, .workspace-hero h2 {
  font-size: 36px !important;
}
.nav-item {
  font-size: 17.5px !important;
}
.nav-item i {
  font-size: 22px !important;
}
.brand-wrap strong {
  font-size: 23px !important;
}
.brand-wrap small {
  font-size: 13.5px !important;
}
.user-chip strong {
  font-size: 15.5px !important;
}
.user-chip small {
  font-size: 13.5px !important;
}
.metric-card span {
  font-size: 15.5px !important;
}
.metric-card strong {
  font-size: 32px !important;
}
.status-pill, .role-badge, .pn-chip, .code-chip, .soft-badge, .invoice-status {
  font-size: 13px !important;
}

/* ==========================================================================
   Dark Theme Adjustments & Glassmorphism (Inspired by user design reference)
   ========================================================================== */
html[data-theme="dark"] body {
  background-color: var(--bg);
  color: var(--ink);
}

/* Glassmorphism & Muted Dark Overrides */
html[data-theme="dark"] .panel,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .workspace-kpis > div,
html[data-theme="dark"] .expand-card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .modal-premium .modal-header,
html[data-theme="dark"] .modal-premium .modal-footer,
html[data-theme="dark"] .workspace-rail,
html[data-theme="dark"] .expanded-shell,
html[data-theme="dark"] .tender-expanded,
html[data-theme="dark"] .shipment-board-card,
html[data-theme="dark"] .user-card,
html[data-theme="dark"] .supply-card,
html[data-theme="dark"] .shipment-card {
  background: #0e1320 !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35) !important;
  color: #ffffff !important;
}

/* Cyan glows for specific elements to match references */
html[data-theme="dark"] .metric-indigo .metric-icon {
  background: rgba(0, 210, 255, 0.1) !important;
  color: var(--primary) !important;
  box-shadow: 0 0 15px rgba(0, 210, 255, 0.2);
}
html[data-theme="dark"] .code-chip, 
html[data-theme="dark"] .pn-chip {
  background: rgba(0, 210, 255, 0.1) !important;
  color: var(--primary) !important;
  border: 1px solid rgba(0, 210, 255, 0.2);
}

/* Form inputs & selections styling in Dark mode */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .input-shell {
  background: rgba(10, 15, 26, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus,
html[data-theme="dark"] .input-shell:focus-within {
  border-color: var(--primary) !important;
  box-shadow: 0 0 15px rgba(0, 210, 255, 0.3) !important;
  background: rgba(10, 15, 26, 0.9) !important;
}
html[data-theme="dark"] label {
  color: #cbd5e1 !important;
}

/* Tables custom styling for Dark Theme */
html[data-theme="dark"] .orspra-table thead th {
  background: rgba(22, 30, 49, 0.9) !important;
  color: #94a3b8 !important;
}
html[data-theme="dark"] .orspra-table tbody td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  color: #e2e8f0 !important;
}
html[data-theme="dark"] .orspra-table tbody tr:hover {
  background: rgba(255, 255, 255, 0.02) !important;
}

/* Topbar & Sidebar Overrides */
html[data-theme="dark"] .topbar {
  background: rgba(11, 15, 25, 0.8) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
html[data-theme="dark"] .icon-btn {
  background: rgba(17, 23, 38, 0.8) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #cbd5e1 !important;
}
html[data-theme="dark"] .icon-btn:hover {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  box-shadow: 0 0 12px rgba(0, 210, 255, 0.25);
}

/* Sidebar dark links */
html[data-theme="dark"] .nav-item:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}
html[data-theme="dark"] .nav-item.active {
  background: linear-gradient(90deg, rgba(0, 210, 255, 0.2), rgba(0, 210, 255, 0.05)) !important;
  box-shadow: inset -3px 0 var(--primary) !important;
  color: #ffffff !important;
}

/* SweetAlert customization for dark theme */
html[data-theme="dark"] .swal2-popup {
  background: #111726 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Theme Switcher Icons display rules */
html[data-theme="dark"] #themeSunIcon {
  display: inline-block;
  color: #eab308; /* Yellow sun */
}
html[data-theme="dark"] #themeMoonIcon {
  display: none;
}
html[data-theme="light"] #themeSunIcon {
  display: none;
}
html[data-theme="light"] #themeMoonIcon {
  display: inline-block;
  color: #6366f1; /* Purple moon */
}
#themeSunIcon {
  display: none;
}
#themeMoonIcon {
  display: inline-block;
}

/* ==========================================================================
   Gold Theme Integration & Table Readability Overrides
   ========================================================================== */

/* ألوان وتنسيقات عامة للجداول واللوحات في كلا الوضعين لتجنب تداخل الألوان */
.panel,
.metric-card,
.workspace-kpis > div,
.expand-card,
.modal-content,
.shipment-board-card,
.user-card,
.supply-card,
.shipment-card {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}

/* إصلاح وضوح الخطوط والنصوص في الجداول والروابط */
.orspra-table tbody td {
  color: var(--ink) !important;
}
.orspra-table thead th {
  color: var(--muted) !important;
  background: var(--surface-2) !important;
}
.code-cell span, 
.tender-link strong, 
.subject-cell strong, 
.due-cell strong {
  color: var(--ink) !important;
}
.code-cell small, 
.tender-link small, 
.subject-cell span, 
.due-cell small {
  color: var(--muted) !important;
}
.form-control, 
.form-select {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
}

/* دمج اللون الذهبي الملكي الفاخر (Gold Accents) */
:root {
  --gold: #b58a22;
  --gold-glow: rgba(181, 138, 34, 0.1);
}

html[data-theme="dark"] {
  --gold: #e5c060;
  --gold-glow: rgba(229, 192, 96, 0.2);
}

/* تطبيق الذهبي على عناصر مختارة لزيادة الجاذبية */
.brand-mark {
  background: linear-gradient(135deg, var(--gold), #8f670c) !important;
  box-shadow: 0 10px 30px var(--gold-glow) !important;
}
.brand-wrap strong {
  color: var(--gold) !important;
}
.nav-item.active {
  box-shadow: inset -3px 0 var(--gold) !important;
}
html[dir="ltr"] .nav-item.active {
  box-shadow: inset 3px 0 var(--gold) !important;
}

/* جعل الكود والرموز تظهر باللون الذهبي الأنيق */
.code-chip, 
.pn-chip,
.code-cell span {
  color: var(--gold) !important;
  background: var(--gold-glow) !important;
  border: 1px solid rgba(229, 192, 96, 0.15) !important;
}

/* أزرار الإضافة والتفاعل الأساسية باللون الذهبي الفاخر */
.btn-primary {
  background-color: var(--gold) !important;
  border-color: var(--gold) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px var(--gold-glow) !important;
}
.btn-primary:hover {
  background-color: #9d7415 !important;
  border-color: #9d7415 !important;
}

/* تظليل متوهج خفيف في الوضع الداكن حول الكروت واللوحات الجانبية */
html[data-theme="dark"] .panel,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .modal-content {
  border: 1px solid rgba(229, 192, 96, 0.1) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4), 0 0 15px rgba(229, 192, 96, 0.03) !important;
}

/* ==========================================================================
   Detailed Dark Theme Table Styling & High Contrast Readability Overrides
   ========================================================================== */
html[data-theme="dark"] .panel {
  background: #0e1320 !important; /* أسود خافت كحلي للوحة الحاوية */
  border: 1px solid #1e293b !important;
}

html[data-theme="dark"] .orspra-table {
  background: transparent !important;
}

/* خلفية أسود خافت لصفوف وخلايا الجدول */
html[data-theme="dark"] .orspra-table tbody td {
  background: #0b0f19 !important; /* لون الخلفية أسود خافت للجدول */
  color: #f8fafc !important; /* أبيض ناصع للنصوص العادية */
  border-bottom: 1px solid #1c2333 !important; /* حدود ناعمة بين الصفوف */
}

/* خلفية مميزة لرأس الجدول */
html[data-theme="dark"] .orspra-table thead th {
  background: #121826 !important; /* أسود خافت مائل للزرقة أغمق قليلاً للرأس */
  color: #94a3b8 !important; /* رمادي فاتح مقروء جداً للعناوين */
  font-weight: 700 !important;
  border-bottom: 2px solid #1c2333 !important;
}

/* توضيح نصوص الخلايا والعناوين والتفاصيل */
html[data-theme="dark"] .code-cell span,
html[data-theme="dark"] .tender-link strong,
html[data-theme="dark"] .subject-cell strong,
html[data-theme="dark"] .due-cell strong {
  color: #ffffff !important; /* أبيض ناصع تماماً للعناوين الرئيسية للوضوح الأقصى */
}

html[data-theme="dark"] .code-cell small,
html[data-theme="dark"] .tender-link small,
html[data-theme="dark"] .subject-cell span,
html[data-theme="dark"] .due-cell small,
html[data-theme="dark"] .orspra-table td small {
  color: #94a3b8 !important; /* رمادي فاتح مائل للأزرق واضح ومقروء للمعلومات الثانوية */
}

/* تأثير التمرير (Hover) على صفوف الجدول */
html[data-theme="dark"] .orspra-table tbody tr:hover td {
  background: #111726 !important; /* تفتيح خفيف جداً عند التمرير للإشارة للمكان */
}

/* تعديل ألوان الروابط التفاعلية بداخل الخلايا */
html[data-theme="dark"] .tender-link:hover strong {
  color: var(--gold) !important; /* يتحول للذهبي عند التمرير لتوضيح أنه قابل للضغط */
}

/* تحسين وضوح الفلترة السريعة (Filter Chips) */
html[data-theme="dark"] .filter-chip {
  background: #111726 !important;
  border-color: #1e293b !important;
  color: #94a3b8 !important;
}
html[data-theme="dark"] .filter-chip:hover,
html[data-theme="dark"] .filter-chip.active {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: #070a12 !important; /* نص داكن على خلفية ذهبية */
  font-weight: 700 !important;
}

/* تحسين أزرار الإجراءات داخل الجدول */
html[data-theme="dark"] .row-expander {
  background: #111726 !important;
  border-color: #1e293b !important;
  color: var(--gold) !important;
}
html[data-theme="dark"] .row-expander:hover {
  background: var(--gold) !important;
  color: #070a12 !important;
  border-color: var(--gold) !important;
}
html[data-theme="dark"] .row-expander.open {
  background: var(--gold) !important;
  color: #070a12 !important;
}

/* ==========================================================================
   Animated Premium Gold Hero Banners (.page-hero, .workspace-hero, .hero-strip)
   ========================================================================== */
.page-hero, 
.workspace-hero, 
.hero-strip {
  background: linear-gradient(135deg, #bf953f, #fcf6ba 25%, #b38728 50%, #fbf5b7 75%, #aa771c) !important;
  background-size: 400% 400% !important;
  animation: goldGradientShift 15s ease infinite !important;
  color: #0c1222 !important; /* نصوص داكنة كحلية للتباين الفاخر والوضوح الأقصى */
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  box-shadow: 0 20px 45px rgba(179, 135, 40, 0.25) !important;
  position: relative;
  overflow: hidden;
}

/* حركة التدرج الذهبي بنعومة */
@keyframes goldGradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* تأثير البريق اللامع المتوهج المار عبر البانر كل 6 ثوانٍ */
.page-hero::before, 
.workspace-hero::before, 
.hero-strip::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -150% !important;
  width: 50% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.4) 50%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
  transform: skewX(-25deg) !important;
  animation: goldShineSweep 6s infinite ease-in-out !important;
  z-index: 2 !important;
}

@keyframes goldShineSweep {
  0% { left: -150%; }
  50% { left: 150%; }
  100% { left: 150%; }
}

/* ضمان وضوح النصوص والأيقونات والتفاصيل بلون داكن ملكي بداخل الهيرو */
.page-hero h2, 
.workspace-hero h2, 
.hero-strip h2 {
  color: #0c1222 !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) !important;
}

.page-hero p, 
.workspace-hero p, 
.hero-strip p {
  color: #1e293b !important;
  font-weight: 500 !important;
}

.page-hero .eyebrow, 
.workspace-hero .eyebrow, 
.hero-strip .eyebrow,
.workspace-hero .back-chip {
  color: #3f2f05 !important;
  font-weight: 700 !important;
  opacity: 0.9 !important;
}

/* أزرار الهيرو لكي لا تفقد تباينها */
.workspace-hero .btn-soft,
.page-hero .btn-soft {
  background: rgba(12, 18, 34, 0.12) !important;
  color: #0c1222 !important;
  border: 1px solid rgba(12, 18, 34, 0.15) !important;
  font-weight: 700 !important;
}
.workspace-hero .btn-soft:hover,
.page-hero .btn-soft:hover {
  background: #0c1222 !important;
  color: #ffffff !important;
}