/* =========================================================
   SHA SYSTEM POS — UI cloned from uploaded reference design
   Keeps all old pages/modules, only upgrades the shell/theme.
   ========================================================= */
:root{
  --surface:#fff;--surface-2:#f8fafc;--text:#172033;--muted:#718096;--line:#e7ebf1;
  --danger:var(--theme-danger,#dc2626);--danger-soft:#fee2e2;--warning:#d97706;--warning-soft:#fef3c7;
  --success:var(--theme-success,#059669);--success-soft:#d1fae5;--blue:var(--theme-secondary,#2563eb);--blue-soft:#dbeafe;
  --rose:#e11d48;--rose-soft:#ffe4e6;--shadow:0 10px 30px rgba(15,23,42,.06);--radius:18px;--sidebar-width:286px;
  --sidebar:var(--theme-sidebar,#0d1d2f);--font:'Speda','Noto Kufi Arabic','Inter',Tahoma,Arial,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}.app-body{margin:0!important;font-family:var(--font)!important;background:var(--theme-background,var(--bg,#f5f7fb))!important;color:var(--text)!important;font-size:14px;line-height:1.7}.app-body.theme-dark{--bg:#0c1320;--surface:#121b2b;--surface-2:#182235;--text:#f2f6fb;--muted:#9ba9bd;--line:#26334a;--shadow:0 10px 30px rgba(0,0,0,.18);background:#0c1320!important;color:#f2f6fb!important}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer}svg{vertical-align:middle;flex:0 0 auto}.ltr{direction:ltr}.mobile-only{display:none!important}

/* Layout shell */
.premium-app.app{display:block!important;min-height:100vh}.sidebar.side{position:fixed!important;inset-block:0!important;inset-inline-start:0!important;width:var(--sidebar-width)!important;background:var(--theme-sidebar,#0d1d2f)!important;color:#d6e3ee!important;z-index:50!important;display:flex!important;flex-direction:column!important;padding:0!important;overflow:hidden!important;box-shadow:8px 0 30px rgba(5,16,29,.08)!important}.brand{height:84px!important;padding:15px 18px!important;display:flex!important;align-items:center!important;gap:12px!important;border-bottom:1px solid rgba(255,255,255,.08)!important;margin:0!important}.brand-mark,.brand-logo{width:50px!important;height:50px!important;border-radius:15px!important;background:linear-gradient(135deg,var(--primary,#14b8a6),var(--theme-secondary,#0f766e))!important;display:grid!important;place-items:center!important;color:#fff!important;box-shadow:0 8px 20px rgba(20,184,166,.25)!important;object-fit:cover!important;padding:3px!important}.brand strong,.brand h2{display:block!important;color:#fff!important;font-size:14px!important;line-height:1.55!important;max-width:175px!important;margin:0!important}.brand small{display:block!important;color:#7f95aa!important;font-family:Inter,var(--font)!important;font-size:10px!important;letter-spacing:.7px!important}.brand .icon-btn{margin-inline-start:auto}.side-search{padding:12px 13px 0!important}.side-search-input{width:100%!important;border:1px solid rgba(255,255,255,.09)!important;background:rgba(255,255,255,.06)!important;color:#e8f2fb!important;border-radius:13px!important;padding:10px 12px!important;outline:none!important}.side-search-input::placeholder{color:#7f95aa!important}.side-nav,.side-scroll{padding:15px 11px 25px!important;overflow:auto!important;flex:1!important}.side-nav::-webkit-scrollbar{width:5px}.side-nav::-webkit-scrollbar-thumb{background:#33445b;border-radius:10px}.nav-group,.menu-group{margin-bottom:7px!important}.nav-group-title,.menu-group-title{width:100%!important;background:transparent!important;border:0!important;color:#8aa1b8!important;display:flex!important;align-items:center!important;gap:9px!important;padding:9px 12px!important;font-size:11px!important;font-weight:800!important;text-align:start!important;border-radius:10px!important}.nav-group-title:hover{background:rgba(255,255,255,.04)!important;color:#c6d5e4!important}.nav-group-title svg:last-child{margin-inline-start:auto!important;transition:.2s!important;width:15px!important;height:15px!important}.nav-group.collapsed .nav-group-title svg:last-child{transform:rotate(-90deg)!important}.nav-group.collapsed .nav-items{display:none!important}.nav-items{display:grid!important;gap:3px!important}.side a.nav-link,.nav-link{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:11px!important;color:#b8c8d8!important;padding:9px 12px!important;margin:0!important;border-radius:11px!important;font-size:12px!important;transition:.18s!important;position:relative!important}.nav-link:hover{background:rgba(255,255,255,.06)!important;color:#fff!important;transform:translateX(-2px)!important}[dir=ltr] .nav-link:hover{transform:translateX(2px)!important}.nav-link.active{background:linear-gradient(90deg,rgba(20,184,166,.22),rgba(20,184,166,.08))!important;color:#5eead4!important;font-weight:800!important}.nav-link.active:before{content:"";position:absolute;inset-block:8px;inset-inline-start:-11px;width:3px;border-radius:5px;background:#2dd4bf}.menu-icon{width:18px!important;height:18px!important;display:inline-grid!important;place-items:center!important}.menu-icon svg,.nav-group-title svg{width:18px;height:18px}.sidebar-footer{padding:12px 16px!important;border-top:1px solid rgba(255,255,255,.07)!important}.mini-status{display:flex!important;align-items:center!important;gap:10px!important}.status-dot{width:9px;height:9px;background:#22c55e;border-radius:50%;box-shadow:0 0 0 4px rgba(34,197,94,.12)}.mini-status strong,.mini-status small{display:block}.mini-status strong{font-size:11px;color:#cde4db}.mini-status small{font-size:10px;color:#6f8297}

.main.app-shell{margin-inline-start:var(--sidebar-width)!important;margin-inline-end:0!important;min-height:100vh!important;width:auto!important;display:flex!important;flex-direction:column!important;background:var(--theme-background,var(--bg,#f5f7fb))!important}.topbar.top{height:84px!important;background:var(--surface)!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 28px!important;position:sticky!important;top:0!important;z-index:30!important}.topbar-start{display:flex!important;align-items:center!important;gap:12px!important;min-width:0}.topbar h1{font-size:18px!important;margin:0!important;font-weight:800!important;color:var(--text)!important}.topbar p{margin:1px 0 0!important;color:var(--muted)!important;font-size:10px!important}.topbar-actions{display:flex!important;align-items:center!important;gap:9px!important}.icon-btn,.theme-toggle{border:1px solid var(--line)!important;background:var(--surface-2)!important;width:39px!important;height:39px!important;border-radius:11px!important;display:inline-grid!important;place-items:center!important;color:var(--muted)!important;padding:0!important;transition:.18s!important}.icon-btn:hover,.theme-toggle:hover{color:var(--primary)!important;border-color:var(--primary)!important;background:var(--primary-soft,#ccfbf1)!important}.notification-btn{position:relative}.notification-btn span{position:absolute;top:7px;inset-inline-end:7px;width:7px;height:7px;border-radius:50%;background:#ef4444;border:2px solid var(--surface)}.lang-switch{display:flex!important;border:1px solid var(--line)!important;border-radius:11px!important;padding:3px!important;background:var(--surface-2)!important}.lang-switch a,.topbar .lang{padding:5px 8px!important;font-family:Inter,var(--font)!important;font-size:10px!important;font-weight:800!important;border-radius:8px!important;color:var(--muted)!important;background:transparent!important}.lang-switch a.active,.topbar .lang.active{background:var(--surface)!important;color:var(--primary)!important;box-shadow:0 2px 8px #0000000c!important}.topbar .search{background:var(--surface-2)!important;border:1px solid var(--line)!important;border-radius:11px!important;padding:8px 12px!important;width:220px!important;color:var(--text)!important}.user-menu{position:relative}.user-trigger{border:0!important;background:transparent!important;display:flex!important;align-items:center!important;gap:8px!important;padding:3px 5px!important;border-radius:12px!important;color:var(--text)!important}.avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--primary),#14b8a6);color:#fff;display:grid;place-items:center;font-weight:800}.user-copy{text-align:start}.user-copy strong,.user-copy small{display:block}.user-copy strong{font-size:11px;color:var(--text)!important}.user-copy small{font-size:9px;color:var(--muted)!important}.user-dropdown{display:none;position:absolute;inset-inline-end:0;top:49px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);min-width:180px;padding:6px;z-index:70}.user-menu.open .user-dropdown{display:grid}.user-dropdown a{padding:9px 10px;display:flex;align-items:center;gap:8px;border-radius:9px;font-size:11px;color:var(--text)!important}.user-dropdown a:hover{background:var(--surface-2)}.user-dropdown a.danger{color:var(--danger)!important}
.main-content.content{padding:25px 28px 45px!important;flex:1!important}.app-footer.app-credit{display:flex!important;justify-content:space-between!important;gap:15px!important;padding:17px 28px!important;color:var(--muted)!important;border-top:1px solid var(--line)!important;background:transparent!important;font-size:10px!important}.app-credit a{color:var(--primary)!important;font-weight:800}.menu-hidden .sidebar{transform:translateX(105%)!important}.menu-hidden[dir=ltr] .sidebar,.menu-hidden .main.app-shell{margin-inline-start:0!important}.menu-hidden .main.app-shell{width:100%!important}

/* Cards, forms, tables: reference design style */
.card,.video-card,.finance-panel,.quick-currency,.cashbox-capital-overview,.table-wrap,.sale-table,.invoice-table,.settings-section-card,.reports-hero-card,.reports-table-card{background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:var(--radius)!important;box-shadow:var(--shadow)!important;color:var(--text)!important}.card{padding:18px!important}.section-title,.page-header{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:20px!important;margin-bottom:20px!important}.section-title h2,.page-header h2{margin:0!important;font-size:20px!important;font-weight:800!important;color:var(--text)!important}.section-title p,.page-header p,.muted,.helper-text{margin:3px 0 0!important;color:var(--muted)!important;font-size:11px!important}.btn{min-height:38px!important;padding:8px 14px!important;border-radius:11px!important;border:1px solid transparent!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;font-weight:800!important;font-size:11px!important;transition:.18s!important;text-decoration:none!important}.btn:hover{transform:translateY(-1px)!important}.btn:not(.gray):not(.red):not(.green):not(.dark),.btn-primary,.dock-btn{background:linear-gradient(135deg,var(--primary),#0d9488)!important;color:#fff!important;box-shadow:0 8px 18px rgba(15,118,110,.18)!important}.btn.gray,.btn-secondary,.btn-ghost{background:var(--surface)!important;border-color:var(--line)!important;color:var(--text)!important}.btn.green{background:var(--success)!important;color:#fff!important}.btn.red,.btn-danger{background:var(--danger)!important;color:#fff!important}.btn.dark{background:var(--theme-sidebar,#0d1d2f)!important;color:#fff!important}input,select,textarea{border:1px solid var(--line)!important;border-radius:12px!important;background:var(--surface)!important;color:var(--text)!important;padding:10px 12px!important;outline:none!important;transition:.18s!important}input:focus,select:focus,textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px rgba(20,184,166,.10)!important}label{color:var(--muted)!important;font-size:12px!important;font-weight:800!important}.row,.row3{gap:12px!important}.grid{gap:16px!important}.stats,.stats-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:15px!important;margin-bottom:18px!important}.stat,.stat-card{background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:17px!important;padding:17px!important;box-shadow:var(--shadow)!important;position:relative!important;overflow:hidden!important}.stat:after,.stat-card:after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;inset-inline-end:-25px;inset-block-end:-35px;background:var(--primary);opacity:.06}.stat .n,.stat-copy strong{font-family:Inter,var(--font)!important;display:block!important;font-size:21px!important;line-height:1.45!important;color:var(--text)!important}.stat .t,.stat-copy span{color:var(--muted)!important;font-size:10px!important;font-weight:800!important}table{width:100%!important;border-collapse:separate!important;border-spacing:0!important;background:var(--surface)!important;border-radius:14px!important;overflow:hidden!important;border:1px solid var(--line)!important}th,td{padding:10px 12px!important;border-bottom:1px solid var(--line)!important;text-align:start!important;font-size:12px!important;color:var(--text)!important;vertical-align:middle!important}th{background:var(--surface-2)!important;color:var(--muted)!important;font-weight:900!important;white-space:nowrap!important}tr:hover td{background:var(--surface-2)!important}.table-wrap{overflow:auto!important;padding:0!important}.table-wrap table{border:0!important}.pill,.status-chip{border-radius:999px!important;padding:5px 10px!important;font-size:11px!important;font-weight:800!important;display:inline-flex!important;align-items:center!important}.pill.green,.status-chip.green{background:var(--success-soft)!important;color:var(--success)!important}.pill.red{background:var(--danger-soft)!important;color:var(--danger)!important}.pill.blue{background:var(--blue-soft)!important;color:var(--blue)!important}.notice,.alert{display:flex;align-items:center;gap:10px;padding:12px 14px!important;border-radius:14px!important;background:var(--blue-soft)!important;color:var(--blue)!important;margin-bottom:12px!important;border:1px solid rgba(37,99,235,.14)!important}.danger,.alert-danger{background:var(--danger-soft)!important;color:var(--danger)!important;border-color:rgba(220,38,38,.15)!important}

/* POS/product areas keep functionality with cleaner UI */
.pos{display:grid!important;grid-template-columns:minmax(0,1.5fr) minmax(330px,.95fr)!important;gap:18px!important}.products{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))!important;gap:12px!important}.prod,.solar-tile2{border:1px solid var(--line)!important;border-radius:17px!important;padding:12px!important;background:var(--surface)!important;cursor:pointer!important;transition:.15s!important;box-shadow:0 6px 18px rgba(15,23,42,.04)!important}.prod:hover,.solar-tile2:hover{transform:translateY(-2px)!important;box-shadow:var(--shadow)!important}.prod .price{color:var(--primary)!important;font-weight:900!important}.totals,.expense-editor,.details-grid div,.purchase-summary div,.sales-summary article{background:var(--surface-2)!important;border:1px solid var(--line)!important;border-radius:14px!important;color:var(--text)!important}.total{font-size:22px!important;font-weight:900!important;color:var(--primary)!important}.action-dock{background:linear-gradient(135deg,var(--theme-sidebar,#0d1d2f),#123451)!important;border-radius:20px!important;border:1px solid rgba(255,255,255,.08)!important}

/* Dark mode details */
.theme-dark .sidebar{background:#07111f!important}.theme-dark .topbar,.theme-dark .card,.theme-dark table,.theme-dark .table-wrap,.theme-dark input,.theme-dark select,.theme-dark textarea,.theme-dark .prod,.theme-dark .solar-tile2{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}.theme-dark th,.theme-dark .totals,.theme-dark .purchase-summary div,.theme-dark .details-grid div{background:var(--surface-2)!important}.theme-dark td,.theme-dark th{color:var(--text)!important}.theme-dark .money-alt,.theme-dark small,.theme-dark .muted{color:var(--muted)!important}

/* Responsive */
@media(max-width:1100px){.stats,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.topbar .search{display:none!important}.pos{grid-template-columns:1fr!important}}
@media(max-width:900px){.mobile-only{display:inline-grid!important}.sidebar.side{inset-inline-start:auto!important;inset-inline-end:0!important;transform:translateX(105%)!important;transition:.25s!important;width:min(88vw,315px)!important}.menu-open .sidebar.side{transform:translateX(0)!important}.sidebar-backdrop,.menu-shade{display:none;position:fixed;inset:0;background:rgba(2,8,23,.45);z-index:40}.menu-open .sidebar-backdrop,.menu-open .menu-shade{display:block!important}.main.app-shell{margin-inline-start:0!important;width:100%!important}.menu-hide-toggle{display:none!important}.topbar.top{height:auto!important;min-height:72px!important;padding:12px 14px!important;gap:10px!important}.topbar-actions{gap:7px!important}.user-copy,.user-arrow{display:none!important}.main-content.content{padding:16px!important}.row,.row3{grid-template-columns:1fr!important}.stats,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.app-footer{flex-direction:column!important}.side-search{padding-top:8px!important}}
@media(max-width:560px){.stats,.stats-grid,.products{grid-template-columns:1fr!important}.topbar h1{font-size:15px!important}.lang-switch a{padding:5px 6px!important}.content.main-content{padding:12px!important}.btn{width:auto}.action-dock{display:grid!important;grid-template-columns:1fr 1fr!important}.action-dock .dock-btn{width:100%!important;min-width:0!important}}

/* Print remains clean. */
@media print{.sidebar,.topbar,.no-print,.menu-shade,.sidebar-backdrop,.app-footer{display:none!important}.main.app-shell{margin:0!important;width:100%!important;background:#fff!important}.content.main-content{padding:0!important}.card,.table-wrap{box-shadow:none!important;border:0!important}.receipt.a4,.receipt{max-width:100%!important;box-shadow:none!important;border:0!important}}
html[dir="ltr"] .menu-hidden .sidebar{transform:translateX(-105%)!important}
@media(max-width:900px){html[dir="ltr"] .sidebar.side{inset-inline-start:0!important;inset-inline-end:auto!important;transform:translateX(-105%)!important}html[dir="ltr"] .menu-open .sidebar.side{transform:translateX(0)!important}}