:root{
  --bg:#f4f7fb;--surface:#ffffff;--surface2:#f8fbff;--ink:#0f172a;--muted:#64748b;--line:#e5edf6;
  --primary:#2563eb;--primary2:#1d4ed8;--primarySoft:#eff6ff;--success:#16a34a;--successSoft:#ecfdf3;--warning:#f59e0b;--warningSoft:#fff7ed;--danger:#ef4444;--dangerSoft:#fef2f2;--purple:#7c3aed;--purpleSoft:#f4f3ff;
  --dark:#0b1220;--dark2:#111827;--radius:22px;--shadow:0 14px 35px rgba(15,23,42,.07);--shadow2:0 25px 70px rgba(15,23,42,.14)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Tajawal,Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px}a{text-decoration:none;color:inherit}button,input,select,textarea{font-family:inherit}img{max-width:100%}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 12% 10%,rgba(37,99,235,.10),transparent 28%),radial-gradient(circle at 90% 5%,rgba(34,197,94,.08),transparent 24%);pointer-events:none;z-index:-1}
.sx-admin{min-height:100vh;display:flex;direction:rtl}.sx-sidebar{position:fixed;right:0;top:0;bottom:0;width:296px;background:linear-gradient(180deg,#08111f 0%,#0e1728 52%,#111827 100%);color:#cbd5e1;padding:22px 18px;z-index:40;box-shadow:-16px 0 42px rgba(2,6,23,.14);overflow:auto}.sx-main{margin-right:296px;width:calc(100% - 296px);min-height:100vh;padding:24px}.sx-content{max-width:1520px;margin:0 auto}.sx-brand{display:flex;gap:12px;align-items:center;padding:8px 8px 20px;margin-bottom:14px;border-bottom:1px solid rgba(255,255,255,.08)}.sx-logo{width:48px;height:48px;border-radius:17px;background:linear-gradient(135deg,#2563eb,#06b6d4);display:grid;place-items:center;color:#fff;font-weight:950;box-shadow:0 18px 36px rgba(37,99,235,.32);letter-spacing:.5px}.sx-brand strong{display:block;color:#fff;font-size:24px;font-weight:950}.sx-brand span{display:block;color:#94a3b8;font-size:12px;margin-top:3px}.sx-nav-label{font-size:11px;color:#64748b;font-weight:950;letter-spacing:.13em;text-transform:uppercase;margin:18px 12px 8px}.sx-nav a,.sx-nav button{width:100%;border:0;background:transparent;color:#cbd5e1;display:flex;align-items:center;gap:12px;padding:12px 12px;border-radius:15px;margin:5px 0;font-weight:850;font-size:14px;cursor:pointer;text-align:right;transition:.18s}.sx-nav a:hover,.sx-nav button:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(-2px)}.sx-nav a.active{background:linear-gradient(90deg,rgba(37,99,235,.30),rgba(37,99,235,.08));border:1px solid rgba(96,165,250,.24);color:#fff;box-shadow:inset 4px 0 0 #3b82f6}.sx-nav .ico{width:32px;height:32px;border-radius:12px;background:rgba(255,255,255,.08);display:grid;place-items:center;flex:0 0 32px}.sx-sidebar-card{margin:18px 6px 8px;padding:16px;border-radius:20px;background:linear-gradient(135deg,rgba(37,99,235,.28),rgba(8,145,178,.14));border:1px solid rgba(255,255,255,.09)}.sx-sidebar-card b{color:#fff}.sx-sidebar-card p{margin:6px 0 13px;color:#9ca3af;font-size:12px;line-height:1.6}.sx-topbar{background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;position:sticky;top:14px;z-index:20}.sx-title h1{font-size:30px;line-height:1.1;margin:0;font-weight:950;letter-spacing:-.5px}.sx-title p{margin:8px 0 0;color:var(--muted);font-size:14px}.sx-top-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sx-user{display:flex;align-items:center;gap:10px;background:#f8fafc;border:1px solid var(--line);padding:8px 12px;border-radius:18px}.sx-avatar{width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg,#0ea5e9,#2563eb);color:#fff;display:grid;place-items:center;font-weight:950}.sx-btn,.btn{border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 15px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px;color:#344054;cursor:pointer;transition:.18s;min-height:42px}.sx-btn:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(15,23,42,.08)}.sx-btn.primary,.btn.primary,.sx-btn-primary{background:linear-gradient(135deg,#2563eb,#1d4ed8);border-color:#2563eb;color:#fff;box-shadow:0 14px 24px rgba(37,99,235,.20)}.sx-btn.green,.btn.green{background:#16a34a;border-color:#16a34a;color:#fff}.sx-btn.danger,.btn.danger{background:#ef4444;border-color:#ef4444;color:#fff}.sx-btn.light,.btn.light{background:#f8fafc}.sx-btn.small,.btn.small{min-height:34px;padding:7px 11px;border-radius:12px;font-size:13px}.sx-alert{border-radius:16px;background:#ecfdf3;color:#067647;border:1px solid #abefc6;padding:13px 16px;margin-bottom:15px;font-weight:800}.sx-error{background:#fef3f2;color:#b42318;border-color:#fecdca}.sx-grid,.grid{display:grid;gap:18px}.sx-grid-2,.grid-2,.two{grid-template-columns:repeat(2,minmax(0,1fr))}.sx-grid-3,.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sx-grid-4,.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sx-card,.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;position:relative;overflow:hidden}.sx-card.elevated,.card.elevated{box-shadow:var(--shadow2)}.sx-card.soft,.card.soft{box-shadow:none;background:#f8fbff}.sx-card h2,.sx-card h3,.card h2,.card h3{margin:0 0 12px;font-weight:950}.sx-card p,.card p,.muted{color:var(--muted);line-height:1.75}.sx-stat,.stat{padding:20px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);position:relative;overflow:hidden;min-height:150px}.sx-stat:after,.stat:after{content:"";position:absolute;left:-28px;bottom:-42px;width:125px;height:125px;border-radius:50%;background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(14,165,233,.06))}.sx-stat .top,.stat .top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.sx-stat span,.stat span{color:var(--muted);font-weight:850}.sx-stat strong,.stat strong{display:block;font-size:34px;line-height:1;margin:15px 0 7px;font-weight:950;letter-spacing:-.4px}.sx-stat small,.stat small{color:#98a2b3}.sx-stat-icon,.mini-icon{width:48px;height:48px;border-radius:17px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#2563eb,#1d4ed8);font-size:20px;box-shadow:0 14px 28px rgba(37,99,235,.24);margin-bottom:8px}.sx-stat.green .sx-stat-icon,.stat.green .mini-icon{background:linear-gradient(135deg,#22c55e,#16a34a)}.sx-stat.orange .sx-stat-icon,.stat.orange .mini-icon{background:linear-gradient(135deg,#f59e0b,#ea580c)}.sx-stat.purple .sx-stat-icon,.stat.purple .mini-icon{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.sx-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.sx-toolbar form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sx-search{height:44px;border:1px solid var(--line);border-radius:14px;padding:0 14px;background:#fff;min-width:230px;outline:0}.sx-search:focus,.input:focus,input:focus,select:focus,textarea:focus{border-color:#93c5fd!important;box-shadow:0 0 0 4px rgba(37,99,235,.10);outline:0}.sx-table-wrap,.table-wrap{overflow:auto;border-radius:20px;border:1px solid var(--line);background:#fff}.sx-table,.table{width:100%;border-collapse:separate;border-spacing:0;min-width:780px}.sx-table th,.table th{text-align:right;color:#667085;font-size:12px;letter-spacing:.02em;font-weight:950;padding:14px;border-bottom:1px solid var(--line);background:#f8fbff;white-space:nowrap}.sx-table td,.table td{padding:15px 14px;border-bottom:1px solid #eef2f7;color:#344054;vertical-align:middle}.sx-table tr:hover td,.table tr:hover td{background:#fbfdff}.sx-table tr:last-child td,.table tr:last-child td{border-bottom:0}.sx-code{font-weight:950;color:#1d4ed8}.sx-badge,.badge,.pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:950;background:#eef4ff;color:#1d4ed8;white-space:nowrap}.sx-badge:before,.badge:before,.pill:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.created,.new,.pending,.quoted,.reviewing{background:var(--warningSoft);color:#c2410c}.paid,.delivered,.completed,.approved,.converted{background:var(--successSoft);color:#067647}.out_for_delivery,.in_transit,.processing,.purchased,.received{background:#eef4ff;color:#175cd3}.rejected,.cancelled,.failed{background:var(--dangerSoft);color:#b42318}.in_warehouse,.review{background:var(--purpleSoft);color:#5925dc}.sx-form-grid,.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.sx-form-grid .full,.form-grid .full{grid-column:1/-1}.sx-form label,.sx-form-grid label,.form-grid label{display:block;color:#344054;font-weight:900}.sx-form input,.sx-form select,.sx-form textarea,.form-grid input,.form-grid select,.form-grid textarea,.input{width:100%;margin-top:8px;border:1px solid var(--line);border-radius:15px;padding:12px 13px;background:#fff;color:#101828;outline:0;min-height:46px}.sx-form textarea,.form-grid textarea{min-height:115px;resize:vertical}.sx-actions,.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}.sx-page-head,.page-head,.head-row{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:16px}.sx-page-head h1,.sx-page-head h2,.page-head h1,.page-head h2,.head-row h1{margin:0;font-weight:950}.sx-page-head p,.page-head p,.head-row p{margin:6px 0 0;color:var(--muted)}.sx-list,.stack{display:grid;gap:11px}.sx-list-item,.wizard-step{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px;border-radius:17px;border:1px solid var(--line);background:#fff;transition:.16s}.sx-list-item:hover,.wizard-step:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(15,23,42,.06)}.sx-list-item b,.wizard-step b{display:block}.sx-list-item span,.wizard-step span{color:var(--muted);font-size:13px}.sx-chart{height:300px;border-radius:22px;background:linear-gradient(180deg,#ffffff,#f8fbff);border:1px solid var(--line);padding:18px;display:flex;align-items:end;gap:14px}.sx-bar{flex:1;background:linear-gradient(180deg,#60a5fa,#2563eb);border-radius:14px 14px 6px 6px;min-height:28px;position:relative;box-shadow:0 12px 22px rgba(37,99,235,.14)}.sx-bar:after{content:attr(data-label);position:absolute;bottom:-27px;right:50%;transform:translateX(50%);font-size:11px;color:#667085}.sx-donut{width:190px;height:190px;border-radius:50%;background:conic-gradient(#2563eb 0 42%,#16a34a 42% 70%,#f59e0b 70% 84%,#ef4444 84% 93%,#cbd5e1 93%);display:grid;place-items:center;margin:auto;position:relative}.sx-donut:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;background:#fff}.sx-donut div{position:relative;z-index:1;text-align:center}.sx-timeline{display:grid;gap:0;margin-top:10px}.sx-time{display:flex;gap:12px;position:relative;padding:0 0 18px}.sx-time:not(:last-child):before{content:"";position:absolute;right:13px;top:28px;bottom:0;width:2px;background:#dbeafe}.sx-dot{width:28px;height:28px;border-radius:50%;background:#2563eb;color:#fff;display:grid;place-items:center;flex:0 0 28px;z-index:1;box-shadow:0 0 0 5px #eff6ff}.sx-map{height:310px;border-radius:24px;background:radial-gradient(circle at 30% 35%,rgba(37,99,235,.18),transparent 25%),radial-gradient(circle at 70% 60%,rgba(34,197,94,.17),transparent 25%),linear-gradient(135deg,#f8fbff,#eef4ff);border:1px solid var(--line);position:relative;overflow:hidden}.sx-map:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(15,23,42,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.05) 1px,transparent 1px);background-size:30px 30px}.sx-pin{position:absolute;width:34px;height:34px;border-radius:50% 50% 50% 0;background:#2563eb;transform:rotate(-45deg);display:grid;place-items:center;color:#fff;box-shadow:0 12px 24px rgba(37,99,235,.25)}.sx-pin span{transform:rotate(45deg);font-size:12px;font-weight:950}.sx-empty{padding:40px;text-align:center;color:var(--muted)}.pagination{display:flex;gap:6px;list-style:none;padding:0;margin:16px 0 0;justify-content:center}.page-link{display:block;border:1px solid var(--line);background:#fff;border-radius:10px;padding:7px 10px}.active>.page-link{background:#2563eb;color:#fff;border-color:#2563eb}.disabled>.page-link{opacity:.45}
.sx-site{background:#f8fafc;min-height:100vh}.sx-site-top{height:82px;display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:auto;padding:0 22px}.sx-site-logo{display:flex;align-items:center;gap:10px;font-weight:950;font-size:24px}.sx-hero{max-width:1200px;margin:10px auto;padding:54px 22px 70px;display:grid;grid-template-columns:1.06fr .94fr;gap:36px;align-items:center}.sx-hero h1{font-size:60px;line-height:1.07;margin:14px 0 18px;font-weight:950;letter-spacing:-1.5px}.sx-hero p{font-size:19px;line-height:1.85;color:#667085}.sx-hero-card{background:#0b1220;border-radius:36px;padding:30px;color:#fff;box-shadow:var(--shadow2);position:relative;overflow:hidden}.sx-hero-card:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;background:rgba(37,99,235,.35);top:-85px;left:-85px}.sx-phone{position:relative;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:27px;padding:19px;backdrop-filter:blur(12px)}.sx-login{min-height:100vh;display:grid;grid-template-columns:1fr 460px;background:#fff}.sx-login-art{background:linear-gradient(135deg,#0b1220,#1e3a8a);color:#fff;padding:52px;display:flex;flex-direction:column;justify-content:space-between}.sx-login-art h1{font-size:48px;line-height:1.12}.sx-login-art p{color:#cbd5e1;line-height:1.8}.sx-login-box{display:flex;align-items:center;justify-content:center;padding:30px;background:#f8fafc}.sx-login-box .sx-card{width:100%;max-width:405px}.sx-customer-shell{min-height:100vh;background:#f8fafc}.sx-portal-wrap{max-width:1200px;margin:auto;padding:24px}.sx-footer{padding:24px;text-align:center;color:#98a2b3}.no-print{}@media print{.no-print,.sx-sidebar,.sx-topbar{display:none!important}.sx-main{margin:0;width:100%;padding:0}.sx-card,.card{box-shadow:none;border:0}}
@media(max-width:1180px){.sx-grid-4,.grid-4{grid-template-columns:repeat(2,1fr)}.sx-grid-3,.grid-3{grid-template-columns:repeat(2,1fr)}.sx-hero{grid-template-columns:1fr}.sx-hero h1{font-size:44px}}
@media(max-width:860px){.sx-sidebar{position:static;width:100%;height:auto}.sx-admin{display:block}.sx-main{margin-right:0;width:100%;padding:12px}.sx-topbar{position:static;border-radius:18px;align-items:flex-start;flex-direction:column}.sx-grid-2,.sx-grid-3,.sx-grid-4,.grid-2,.grid-3,.grid-4,.two,.sx-form-grid,.form-grid{grid-template-columns:1fr}.sx-page-head,.page-head,.head-row{flex-direction:column}.sx-login{grid-template-columns:1fr}.sx-login-art{display:none}.sx-hero h1{font-size:36px}.sx-hero{padding-top:20px}.sx-site-top{height:auto;padding:16px}.sx-site-top nav{display:flex;gap:8px;flex-wrap:wrap}.sx-table,.table{min-width:760px}}
.sx-btn.danger{background:#fff1f2;color:#b42318;border-color:#fecdd3}.sx-btn.light{background:#f8fafc}.sx-card.soft{background:#f8fbff;box-shadow:none}.sx-toolbar{margin-bottom:18px}.sx-search{border:1px solid var(--line);border-radius:15px;padding:13px 16px;min-width:280px}.sx-form-grid select,.sx-form-grid input,.sx-form-grid textarea{width:100%}.sx-stat strong .sx-badge{font-size:14px}.sx-form-grid button{align-self:end}.sx-table td small{color:var(--muted)}

/* v30 additions */
.sx-brand-logo{width:50px;height:50px;object-fit:contain;border-radius:16px;background:#fff;padding:6px;box-shadow:0 14px 30px rgba(37,99,235,.18)}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select,textarea{appearance:none;-webkit-appearance:none;width:100%;border:1px solid var(--line);border-radius:16px;background:#fff;color:#0f172a;padding:13px 15px;min-height:48px;font-weight:700;transition:.18s;box-shadow:0 2px 0 rgba(15,23,42,.02)}
input[type="file"]{width:100%;border:1px dashed #bcd3f7;border-radius:16px;background:#f8fbff;color:#64748b;padding:12px 15px;min-height:48px;font-weight:700}
select{background-image:linear-gradient(45deg,transparent 50%,#64748b 50%),linear-gradient(135deg,#64748b 50%,transparent 50%);background-position:18px 21px,12px 21px;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-left:34px}
.sx-field-title{display:flex;align-items:center;gap:8px;color:#344054;font-weight:950;margin-bottom:8px}.sx-field-hint{font-size:12px;color:#98a2b3;margin-top:7px}.sx-section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px}.sx-section-title h2{margin:0;font-size:24px}.sx-kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.sx-progress{height:10px;border-radius:99px;background:#eef2f7;overflow:hidden}.sx-progress span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2563eb,#06b6d4)}.sx-print-logo{height:58px;max-width:160px;object-fit:contain}.sx-site-footer{color:#667085}.sx-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px;max-width:1200px;margin:0 auto;padding:32px 22px;border-top:1px solid var(--line)}.sx-site-footer h4{margin:0 0 10px;color:#0f172a}.sx-site-footer a{display:block;color:#667085;margin:7px 0}.sx-site-footer-bottom{text-align:center;padding:16px;color:#98a2b3}
@media(max-width:1180px){.sx-kpi-row{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.sx-kpi-row,.sx-footer-grid{grid-template-columns:1fr}.sx-hero h1{font-size:34px}}