/* SnapCashier 2026 Design System | scalable across MVC screens */
:root { --sc-ink:#192338; --sc-muted:#758198; --sc-border:#e8edf4; --sc-bg:#f5f7fb; --sc-panel:#fff; --sc-blue:#3568e7; --sc-blue-dark:#2352c8; --sc-radius:16px; --sc-shadow:0 7px 28px rgba(35,50,90,.045); }
html {scroll-behavior:smooth} body {font-family:Inter,"Segoe UI Variable","Segoe UI",Tahoma,Arial,sans-serif !important;color:var(--sc-ink);font-size:13px} body.app-body {background:var(--sc-bg)}
button,input,select,textarea {font:inherit} a,button { -webkit-tap-highlight-color:transparent } a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {outline:3px solid #83a6ff;outline-offset:2px}
.sidebar {background:#101a2e !important;color:#bec8d9 !important;border-left:1px solid #1e304a !important;box-shadow:none;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#354966 transparent;z-index:60}
.brand {padding:28px 24px 24px !important;border-bottom:1px solid #ffffff13;flex-shrink:0}.brand-copy strong{color:#fff !important}.brand-copy small{letter-spacing:2px;color:#899cba !important}
.workspace-card {margin:23px 17px 17px!important;background:#18263e!important;border:1px solid #34445d!important;border-radius:14px!important;box-shadow:none!important}.workspace-card strong{color:white!important}.workspace-card .subdued{color:#93a3bc!important}.workspace-chevron{color:#9db5da}
.side-menu{padding:0 12px 16px;flex:1}.side-menu .menu-label{color:#7d8fab!important;font-size:10px!important;letter-spacing:1.3px;margin:24px 15px 10px!important;font-weight:700}
.side-menu .nav-link,.nav-group-toggle{width:100%;box-sizing:border-box;min-height:44px;padding:11px 13px;margin:3px 0;display:flex;align-items:center;gap:13px;color:#b5c2d7!important;text-align:right;background:transparent;border:0;border-radius:10px;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .16s,color .16s;line-height:1.3;text-decoration:none}
.side-menu .nav-link:hover,.nav-group-toggle:hover{background:#1d2e49!important;color:white!important}.side-menu .nav-link.active,.nav-group-toggle.active{background:#24426f!important;color:white!important}.nav-symbol{width:24px;min-width:24px;display:inline-grid;place-items:center;font-size:19px;color:#8ca5d4}.nav-group-toggle.active .nav-symbol,.nav-link.active .nav-symbol{color:#b4cfff}.nav-chevron{margin-right:auto;font-size:17px;transition:transform .2s ease;color:#92a7c7}.nav-group.expanded .nav-chevron{transform:rotate(180deg)}.nav-group-content{padding:3px 28px 7px 0;border-right:1px solid #345174;margin:0 24px 8px 0}.nav-group-content[hidden]{display:none!important}.nav-sub-link{display:flex;align-items:center;justify-content:space-between;min-height:35px;padding:8px 13px;color:#9db0ce!important;border-radius:9px;font-size:11.5px;text-decoration:none;transition:.15s}.nav-sub-link:hover{background:#1b3253;color:#fff!important}.nav-sub-link.active{background:#203d68;color:#fff!important;font-weight:700}.nav-sub-link.is-pending{opacity:.52;cursor:not-allowed}.nav-sub-link small{font-size:9px}
.sidebar-bottom{position:static!important;margin-top:auto!important;padding:15px!important}.help-card{background:#1a2d4a!important;border:1px solid #2b4367!important}.help-card strong{color:white!important}.help-card p{color:#a1b5d0!important}.side-version{color:#8094b3!important}
.main-area{background:var(--sc-bg)!important;min-width:0}.topbar{background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--sc-border)!important;backdrop-filter:blur(12px);height:72px!important}.topbar-left strong{font-size:13px;color:#27354f}.topbar-date{font-size:11px;color:var(--sc-muted)}.avatar{background:#e9efff!important;color:#3159ad!important;border:1px solid #dce5ff!important}.content{max-width:1720px;padding:32px 38px 55px!important;margin-inline:auto;width:100%;box-sizing:border-box}
.page-heading h1,.inv-title h1{font-size:26px!important;font-weight:800!important;letter-spacing:-.5px;color:var(--sc-ink)!important}.page-heading p,.inv-title p{font-size:12px!important;color:var(--sc-muted)!important;line-height:1.9!important}.inv-kicker{letter-spacing:1.5px!important;color:#6482b5!important}
.panel,.inv-panel,.stat-card,.inv-metric,.settings-form,.card,.preview-panel{background:white!important;border:1px solid var(--sc-border)!important;border-radius:var(--sc-radius)!important;box-shadow:var(--sc-shadow)!important}.inv-panel h2{font-size:15px!important;font-weight:750!important}.inv-table-scroll{overflow-x:auto;scrollbar-width:thin}.inv-table{border-collapse:separate!important;border-spacing:0;width:100%}.inv-table th{text-align:right!important;font-size:11px!important;font-weight:700!important;color:#77849a!important;background:#f8fafd!important;border-bottom:1px solid #eaf0f6!important;padding:14px 16px!important;white-space:nowrap}.inv-table td{padding:15px 16px!important;font-size:12px!important;border-bottom:1px solid #f0f3f8!important;vertical-align:middle}.inv-table tbody tr:hover{background:#f9fbff}.inv-table tbody tr:last-child td{border-bottom:0}.inv-table code{background:#edf2fc!important;color:#35559c!important;padding:5px 8px;border-radius:6px;direction:ltr;display:inline-block}
.btn,.inv-link,button{transition:background .16s,transform .16s,border-color .16s}.btn.primary,button.btn.primary{background:var(--sc-blue)!important;border-color:var(--sc-blue)!important;color:#fff!important;box-shadow:0 3px 8px #315ad020!important}.btn.primary:hover{background:var(--sc-blue-dark)!important;transform:translateY(-1px)}.btn.outline{border:1px solid #dce4f2!important;color:#344f7b!important;background:#fff!important}.btn.outline:hover{background:#f1f5fc!important}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{background:#fff;border-color:#dfe6f0!important;border-radius:10px!important;color:#26344c!important;min-height:40px}input:focus,select:focus,textarea:focus{border-color:#7194ef!important;box-shadow:0 0 0 3px #3568e71a!important;outline:none!important}label{color:#56637a}.inv-status,.pill{font-weight:650!important;border-radius:8px!important}
.inv-tabs{background:transparent!important;border:0!important;box-shadow:none!important;display:flex;gap:7px;overflow-x:auto;white-space:nowrap;margin-bottom:24px;padding-bottom:3px}.inv-tabs a{flex-shrink:0;border:1px solid #e0e8f2;border-radius:9px;padding:9px 14px!important;background:white;color:#65728b;font-size:11px;font-weight:650;text-decoration:none}.inv-tabs a:hover{color:#315ecb;background:#eff4ff}
.alert{font-size:12px!important;border-radius:12px!important;padding:14px 18px!important}.inv-empty,.empty-state{padding:35px 18px!important;color:#8a97a9!important;text-align:center}.inv-footnote{color:#8694a8!important;font-size:11px!important;line-height:1.9}.inv-small{color:#8c99ae!important}
.sc-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.sc-row-actions form{display:inline-flex}.sc-row-actions .inv-link,.sc-row-actions a{background:#f1f5fd;border:1px solid #e1e9f6;border-radius:8px;color:#3459a0!important;font-size:11px;padding:6px 9px;cursor:pointer;text-decoration:none}.sc-row-actions .sc-danger{color:#bc4855!important;background:#fff3f4;border-color:#f9dade}.sc-row-actions .sc-danger:hover{background:#ffe5e8}.sc-action-form{display:flex;gap:8px;flex-wrap:wrap;align-items:end;background:#f9fbff;border:1px solid #e8eef7;padding:14px;border-radius:12px;margin:13px 0}.sc-action-form label{min-width:110px;flex:1}.sc-action-form input,.sc-action-form select{width:100%}.sc-action-form .btn{align-self:end}.sc-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:17px 18px;color:#7d8ca5;font-size:11px;border-top:1px solid #e9edf5}.sc-page-buttons{display:flex;align-items:center;gap:8px}.sc-page-buttons a,.sc-page-buttons span{border:1px solid #e2e9f5;border-radius:8px;padding:8px 12px;min-width:45px;text-align:center;background:#fff;text-decoration:none;color:#48618d}.sc-page-buttons .current{background:#eef3ff;color:#3156ac;font-weight:750}.sc-page-buttons .disabled{color:#b5bfce;background:#f9fafd}.nav-scrim{display:none}.is-saving{opacity:.72;cursor:progress}
@media(max-width:1200px){.content{padding:25px!important}.topbar-date{display:none}}
@media(max-width:1030px){.sidebar{width:230px!important}.main-area{margin-right:230px!important}}
@media(max-width:700px){.sidebar{width:275px!important;transform:translateX(100%);transition:transform .22s}.sidebar.mobile-open{transform:translateX(0)}.main-area{margin-right:0!important}.content{padding:18px 12px 35px!important}.topbar{height:62px!important}.nav-scrim{display:none;position:fixed;inset:0;background:#08101e91;border:none;z-index:55}.sidebar-open .nav-scrim{display:block}.inv-table{min-width:650px}.sc-pagination{justify-content:center}.inv-title{gap:16px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

.sc-row-editor{position:relative;display:inline-block}.sc-row-editor summary,.sc-inline-editor summary{display:inline-flex;align-items:center;cursor:pointer;color:#3559a0;background:#f1f5fd;padding:7px 11px;border-radius:8px;font-size:11px;font-weight:650;border:1px solid #e1e9f6;list-style:none}.sc-row-editor[open]{display:block}.sc-row-editor[open] .sc-action-form{min-width:285px;max-width:520px}.sc-inline{display:inline-flex;margin-inline:4px}.sc-inline button{background:transparent;border:0;color:#be5260;cursor:pointer;font-size:11px}.sc-inline-editor{display:inline-block;margin-inline:7px}.sc-inline-editor[open]{display:block;margin:10px 0}.inv-simple-list li{line-height:2.3}.inv-form label{font-weight:600}
