:root{font-family:Arial,Helvetica,sans-serif;color:#111827;background:#f3f3f3;font-size:14px;--green:#4caf50;--accent:#8bc34a;--line:#e4e4e4;--muted:#6b7280;--sidebar:74px}
*{box-sizing:border-box}
body{margin:0;min-height:100vh}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.icon{display:inline-block;width:20px;height:20px;flex:none;fill:currentColor;vertical-align:middle}
.button .icon,.export-button .icon,.text-button .icon{width:16px;height:16px;margin-right:5px}
.login-body{display:grid;min-height:100vh;place-items:center;background:#f4f4f4}
.login-card{width:min(410px,calc(100vw - 32px));padding:28px 28px 24px;background:#fff;border:1px solid #e5e5e5;box-shadow:0 2px 7px #00000018;border-radius:3px}
.brand-mark{display:flex;align-items:center;gap:9px;color:#1594d1;font-size:20px;font-weight:700;letter-spacing:.2px}
.brand-mark small{display:block;color:#969696;font-size:8px;font-weight:400;letter-spacing:2px}
.brand-symbol{display:grid;place-items:center;color:#ff7136}
.brand-symbol .icon{width:32px;height:32px}
h1{font-size:20px;font-weight:400;margin:24px 0}
.login-card label,.form-fields>label,.settings-card>label,.two-fields label{display:flex;flex-direction:column;gap:7px;color:#6b7280;font-size:12px}
.login-card input:not([type=checkbox]),.form-fields input,.form-fields select,.form-fields textarea,.settings-card input,.settings-card select,.list-toolbar input,.list-toolbar select{min-width:0;width:100%;border:0;border-bottom:1px solid #ccc;background:transparent;padding:8px 1px;color:#123354;outline:0}
.login-card input:focus,.form-fields input:focus,.form-fields select:focus,.settings-card input:focus{border-bottom:2px solid var(--accent)}
.login-card form>label{margin:18px 0 30px}
.login-bottom{display:flex;align-items:center;justify-content:space-between}
.login-bottom .check-label{display:flex;align-items:center;gap:8px;color:#253648}
.error-text{min-height:18px;color:#c62828;font-size:13px}
.muted,.small{color:var(--muted)}.small{font-size:12px}
.topbar{height:48px;position:fixed;top:0;left:0;right:0;background:var(--green);display:flex;align-items:center;color:#fff;z-index:10;box-shadow:0 2px 4px #0002}
.topbar strong{font-size:18px;font-weight:500}
.menu-toggle{height:48px;width:56px;border:0;background:transparent;color:white;display:grid;place-items:center}
.menu-toggle .icon{width:24px;height:24px}
.top-user{margin-left:auto;padding:0 22px;display:flex;gap:18px;align-items:center}
.top-logout{border:0;background:transparent;color:#fff;text-decoration:none;font-size:12px;padding:8px}
.sidebar{position:fixed;left:0;top:48px;bottom:0;width:var(--sidebar);background:#fff;border-right:1px solid #ddd;overflow:auto;z-index:9;transition:width .18s ease}
.profile{height:64px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line);white-space:nowrap}
.profile .avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#eee;color:#999}
.profile .avatar .icon{width:26px;height:26px}
.profile div{display:none;min-width:0}.profile strong,.profile small{display:block;overflow:hidden;text-overflow:ellipsis;max-width:180px}.profile small{font-size:11px;color:#777;margin-top:3px}
.sidebar:hover{width:245px}
.sidebar.open{width:245px}
.sidebar:hover .profile{justify-content:flex-start;padding:12px;gap:11px}
.sidebar:hover .profile div{display:block}
.sidebar.open .profile{justify-content:flex-start;padding:12px;gap:11px}
.sidebar.open .profile div{display:block}
.nav-item{height:54px;width:100%;display:flex;align-items:center;gap:14px;border:0;border-left:3px solid transparent;background:#fff;text-align:left;padding:0 18px;color:#222;white-space:nowrap}
.nav-item:hover,.nav-sub button:hover{background:#f3f3f3}
.nav-item.active,.nav-item.current{border-left-color:var(--green);background:#f1f1f1}
.nav-icon{width:24px;display:grid;place-items:center}
.nav-icon .icon{width:22px;height:22px}
.green{color:#4caf50}.pink{color:#f13370}.blue{color:#00a0e8}.teal{color:#009688}.violet{color:#5c6bc0}.brown{color:#8d6e63}.slate{color:#607d8b}
.nav-sub{display:none;padding:2px 0 8px 26px;background:#fff}
.nav-sub.expanded{display:block}
.nav-sub button{height:35px;width:100%;padding:0 10px;border:0;background:transparent;text-align:left;color:#333;white-space:nowrap;font-size:13px}
.nav-sub button.current{color:#4a9d39;font-weight:600}
.sidebar-foot{display:none;padding:16px 18px;color:#777;font-size:12px}
.sidebar:hover .sidebar-foot{display:block}
.sidebar.open .sidebar-foot{display:block}
.workspace{margin-left:var(--sidebar);padding:70px 24px 35px;transition:margin .18s ease}
.sidebar:hover~.workspace{margin-left:245px}
.sidebar.open~.workspace{margin-left:245px}
.toolbar{display:flex;align-items:center;gap:14px;margin:0 auto 16px;max-width:1500px;min-height:42px}
.toolbar[hidden]{display:none}
.date-control,.filter-control{height:38px;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e5e5e5;box-shadow:0 1px 4px #00000016}
.date-control button{height:100%;width:34px;border:0;background:#fff;color:#888;display:grid;place-items:center}
.date-control button .icon{width:19px;height:19px}
.date-control label{display:flex;align-items:center;gap:5px;color:#777}
.date-control label .icon,.filter-control>.icon{width:18px;height:18px}
.date-control input{border:0;color:#26364b;background:transparent;width:120px;outline:0;font-size:13px}
.filter-control{padding:0 10px;color:#777}
.filter-control select{border:0;background:#fff;min-width:125px;outline:0;color:#26364b}
.button{border:1px solid #ddd;background:#fff;color:#222;padding:9px 16px;font-weight:600;font-size:12px;box-shadow:0 1px 3px #0002}
.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.button:hover{filter:brightness(.97)}
.button:disabled{opacity:.55;cursor:wait}
.button.subtle{box-shadow:none;padding:8px 12px;color:#555}
#content{max-width:1500px;margin:0 auto}
.paper,.metric{background:#fff;border:1px solid #e5e5e5;box-shadow:0 2px 5px #0000001c;border-radius:2px}
.metric-strip{display:grid;grid-template-columns:repeat(5,minmax(125px,1fr));background:#fff}
.metric{padding:17px 22px;border:0;border-bottom:1px solid #eee;box-shadow:none;min-height:88px}
.metric>div{font-size:14px;color:#273647;margin-bottom:8px}
.metric strong{font-size:23px;font-weight:400;color:#101820;white-space:nowrap}
.metric-primary{border-bottom:2px solid var(--green)}
.green-card strong{color:#43a047}.pink-card strong{color:#ec407a}
.summary-paper{overflow:hidden}
.chart-heading{padding:18px 24px 5px;display:flex;gap:24px;color:#172333}
.chart-heading strong{font-weight:500;margin-right:auto}
.chart-heading span{color:#666;border-bottom:1px solid #999;padding:0 30px 7px}
.sales-chart{display:block;width:100%;height:auto;padding:5px 14px 14px;overflow:visible}
.chart-grid{stroke:#ddd;stroke-width:1}
.chart-label{fill:#28384c;font-size:12px}
.chart-area{fill:#8bc34a20}
.chart-line{fill:none;stroke:#7cbf28;stroke-width:2}
.chart-dot{fill:#fff;stroke:#7cbf28;stroke-width:2}
.data-table-wrap{width:100%;overflow:auto}
.pagination{display:flex;align-items:center;justify-content:center;gap:18px;padding:13px;border-top:1px solid var(--line);color:#566273;font-size:12px}
.pagination .button{min-width:40px;padding:4px 10px;display:grid;place-items:center}
.pagination .button .icon{width:20px;height:20px}
.danger-button{align-self:flex-start;border:1px solid #ddd;background:#fff;color:#a33;padding:9px 14px;font-size:12px;font-weight:600}
table{width:100%;border-collapse:collapse;min-width:650px;background:#fff}
th,td{padding:16px 22px;text-align:left;border-bottom:1px solid var(--line);font-size:13px;white-space:nowrap}
th{font-weight:400;color:#526174;background:#fff}
td{color:#0c223c}
tbody tr:nth-child(even){background:#fcfcfc}
tr:last-child td{border-bottom:0}
.empty-cell{text-align:center;color:#788392;padding:44px 18px}
.paper>.data-table-wrap{border-top:1px solid var(--line)}
.export-button,.text-button{border:0;background:transparent;padding:18px 22px;color:#111;font-size:12px;font-weight:600}
.list-paper{overflow:hidden}
.list-toolbar{min-height:72px;display:flex;align-items:center;gap:14px;padding:14px 22px;border-bottom:1px solid var(--line)}
.list-toolbar .grow{flex:1}
.list-toolbar label{font-size:11px;color:#777;min-width:115px}
.list-toolbar input,.list-toolbar select{display:block;margin-top:4px}
.narrow-paper{max-width:760px}
.row-link{padding:0;border:0;background:transparent;color:#122f50;text-align:left}
.row-link:hover{text-decoration:underline;color:#3d913b}
.icon-action{border:0;background:transparent;color:#6d7478;padding:5px 9px;display:inline-grid;place-items:center}
.icon-action .icon{width:18px;height:18px}
.icon-action.danger{color:#a33}
.status-toggle{border:0;background:#f2f2f2;color:#555;border-radius:15px;padding:6px 12px;font-size:12px}
.status-toggle.on{background:#e7f4e8;color:#388e3c}
.inline-note{max-width:850px;margin:12px 2px;color:#677382;font-size:12px;line-height:1.5}
.metric-strip.taxes-metrics{grid-template-columns:repeat(3,1fr);margin-bottom:16px;background:#fff;border:1px solid #e6e6e6;box-shadow:0 2px 5px #00000012}
.taxes-metrics .metric{min-height:100px}
.taxes-metrics .metric strong{font-size:28px}
.empty-state{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;max-width:100%;color:#627083}
.paper.empty-state{max-width:700px}
.empty-state h2{font-size:20px;font-weight:400;margin:14px 0 5px;color:#536577}
.empty-state p{max-width:590px;line-height:1.55}
.empty-icon{width:86px;height:86px;border-radius:50%;background:#f4f4f4;color:#aaa;display:grid;place-items:center}
.empty-icon .icon{width:42px;height:42px}
.settings-grid{display:grid;grid-template-columns:minmax(270px,405px) minmax(450px,650px);gap:22px;align-items:start}
.settings-menu{overflow:hidden}
.settings-menu-title{padding:20px 22px;border-bottom:1px solid var(--line);font-size:18px}
.settings-menu-title>.icon{width:20px;height:20px;margin-right:8px;color:#607d8b}
.settings-menu-title small{display:block;padding-left:43px;font-size:12px;color:#718093}
.settings-menu>button{height:46px;width:100%;padding:0 22px 0 54px;text-align:left;border:0;border-bottom:1px solid var(--line);background:#fff;color:#20334b}
.settings-menu>button:hover,.settings-menu>button.selected{background:#f2f2f2}
.settings-card{padding:22px;max-width:100%}
.settings-card h2,.settings-card h3{font-size:19px;font-weight:400;margin:0 0 22px}
.settings-card h3{margin:20px 0 12px}
.settings-card>label{margin:18px 0}
.settings-card input,.settings-card select{font-size:14px}
.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:15px 0}
.switch-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:12px 0;border-bottom:1px solid #eee;color:#233247}
.switch-row input{width:18px;height:18px;accent-color:var(--accent)}
.settings-save{margin-top:18px;float:right}
.settings-actions{display:flex;justify-content:flex-end;margin-top:18px}
.settings-card p{line-height:1.5;color:#677382}
.settings-main{min-width:0}
.settings-main>.paper,.settings-main>.empty-state{max-width:100%}
.summary-daily{margin-top:18px;overflow:hidden}
.inline-editor{max-width:760px;margin:0 0 18px;scroll-margin-top:60px}
.inline-editor-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
.inline-editor-head h2{margin:0;font-size:20px;font-weight:400}
.inline-editor .form-fields{max-height:none;padding:20px 22px}
.inline-editor .form-fields>label{margin:0}
.inline-editor .form-fields .danger-button{margin-top:8px}
.inline-form-error{min-height:18px;margin:0;padding:0 22px;color:#b3261e;font-size:13px}
.inline-editor .form-actions{border-top:0}
.receipt-back{margin-bottom:14px}
.receipt-detail{max-width:760px;padding:22px}
.receipt-detail h2{font-size:20px;font-weight:400;margin:0 0 10px}
.receipt-detail>p{color:var(--muted)}
.table-name-row,.editable-list-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid #eee;min-height:55px;padding:4px 8px}
.table-name-row input{flex:1}
.editable-list-row span{flex:1;padding:10px}
.receipt-metrics{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:16px;overflow:hidden}
.receipt-metrics .metric{display:flex;flex-direction:column;justify-content:center;align-items:center}
.receipt-items{border-top:1px solid #eee;border-bottom:1px solid #eee;margin:15px 0}
.receipt-line,.receipt-total{display:flex;justify-content:space-between;padding:10px 0}
.receipt-total{font-size:17px}
.inventory-intro{text-align:center;padding:22px}
.inventory-icon{color:#009fe8}
.inventory-icon .icon{width:40px;height:40px}
.inventory-intro h2{font-weight:400}
.inventory-intro p{color:#687587}
.warning{color:#d97912}
.permission-list{border:1px solid #ddd;max-height:230px;overflow:auto;padding:12px}
.permission-list label{display:flex;flex-direction:row;align-items:center;margin:9px 0}
.icon-close{border:0;background:transparent;color:#555;padding:4px;display:grid;place-items:center}
.icon-close .icon{width:22px;height:22px}
.form-fields{display:flex;flex-direction:column;gap:16px;padding:18px 24px;overflow:auto}
.form-fields>label{font-size:12px}
.form-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid #eee}
.check-label{display:flex!important;align-items:center!important;flex-direction:row!important;gap:9px!important;color:#243246!important}
.check-label input{width:auto!important;accent-color:var(--accent)}
.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);background:#323232;color:white;padding:12px 18px;border-radius:3px;opacity:0;pointer-events:none;transition:.2s;z-index:30;box-shadow:0 3px 12px #0004}
.toast.visible{opacity:1;transform:translate(-50%,0)}
.toast.error{background:#b3261e}
.loading{height:160px;display:flex;gap:12px;align-items:center;justify-content:center;color:#677382}
.spinner{width:18px;height:18px;border:2px solid #ddd;border-top-color:var(--green);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.error-panel{padding:30px;color:#5e6975}
@media(max-width:900px){.metric-strip{grid-template-columns:repeat(2,minmax(120px,1fr))}.settings-grid{grid-template-columns:1fr}.settings-menu{display:grid;grid-template-columns:repeat(2,1fr)}.settings-menu-title{grid-column:1/-1}.settings-menu>button{padding-left:15px}.workspace{padding-left:14px;padding-right:14px}.top-user{padding-right:10px}}
@media(max-width:620px){:root{--sidebar:0px}.sidebar{top:48px;width:245px;transform:translateX(-100%);box-shadow:2px 0 8px #0002}.sidebar.open{transform:translateX(0)}.sidebar .profile{justify-content:flex-start;padding:12px;gap:11px}.sidebar .profile div{display:block}.workspace,.sidebar:hover~.workspace,.sidebar.open~.workspace{margin-left:0;padding:62px 10px 24px}.topbar strong{font-size:16px}.top-user{font-size:12px;gap:8px}.toolbar{flex-wrap:wrap;gap:7px}.date-control{flex:1;min-width:280px}.date-control input{width:95px}.filter-control{flex:1}.filter-control select{min-width:0;flex:1}.metric-strip{grid-template-columns:1fr 1fr}.metric{padding:13px}.metric strong{font-size:19px}.metric-strip.taxes-metrics{grid-template-columns:1fr}.receipt-metrics{grid-template-columns:1fr}.receipt-metrics .metric{align-items:flex-start}.list-toolbar{flex-wrap:wrap;padding:12px}.list-toolbar label{flex:1}.two-fields{grid-template-columns:1fr}.chart-heading span{padding:0 8px 7px}.sales-chart{min-width:650px}.summary-paper{overflow-x:auto}}
