@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap";:root{--ink:#182229;--muted:#64727b;--line:#dce3df;--paper:#f5f6f2;--panel:#fff;--teal:#087e7a;--teal-dark:#005954;--coral:#e66c4b;--gold:#e8b44f}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px Manrope,sans-serif}button,input,textarea,select{font:inherit}button{border:0;cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}.app-shell{height:100vh;display:flex;overflow:hidden}.sidebar{width:252px;background:#16282d;color:#d9e6e5;padding:24px 14px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:2;overflow-y:auto}.brand,.header-title,.user-chip,.panel-heading{display:flex;align-items:center;gap:10px}.brand img,.brand span,.logo-upload img,.logo-upload span{width:38px;height:38px;border-radius:6px;object-fit:cover;background:var(--gold);color:#17272b;display:grid;place-items:center;font-weight:800}small,.eyebrow{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em}.brand small{color:#8db1ae}nav{margin-top:34px;display:grid;gap:3px}nav a{display:flex;gap:12px;align-items:center;color:#b5ccca;padding:11px 12px;text-decoration:none;border-radius:5px}nav a.active,nav a:hover{background:#244248;color:#fff}.logout{margin-top:auto;display:flex;gap:10px;align-items:center;color:#f7cfbf;background:transparent;padding:11px;text-align:left}.workspace{margin-left:252px;min-width:0;flex:1;display:flex;flex-direction:column;height:100vh;overflow:hidden}header{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 28px;border-bottom:1px solid var(--line);background:#fffdf9}.header-title img{width:34px;height:34px;object-fit:contain}.header-actions{display:flex;align-items:center;gap:18px}select,input,textarea{width:100%;border:1px solid #cbd5d2;border-radius:4px;padding:10px;background:#fff;color:var(--ink)}.header-actions select{width:145px}.user-chip b{width:28px;height:28px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center}.user-chip small{margin-left:4px}.content{padding:30px;max-width:1500px;width:100%;margin:0 auto;flex:1;overflow-y:auto;min-height:0}footer{padding:18px 30px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}footer span{margin-left:8px;font-family:DM Mono,monospace}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:28px;letter-spacing:0}h2{font-size:16px}.eyebrow{color:var(--teal);font-weight:800;margin-bottom:5px}.pos-grid,.split-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:20px}.product-list,.checkout-panel,.simple-form,.table-panel,.form-grid{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:20px}.product-list{display:flex;flex-direction:column;max-height:470px;overflow:hidden}.product-list-head{position:sticky;top:0;background:var(--panel);display:flex;flex-direction:column;gap:10px;padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--line)}.product-list-head .scan-box{min-width:0;width:100%}.product-scroll{overflow-y:auto;flex:1;min-height:0}.product-row{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;background:transparent;padding:12px 4px;border-bottom:1px solid var(--line);color:var(--ink)}.product-row:hover{color:var(--teal)}.product-row small,.cart-row small{margin-top:3px}.cart-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}.icon-button{width:32px;height:32px;display:grid;place-items:center;background:transparent;color:var(--muted);border-radius:4px}.icon-button:hover{background:#edf3f0;color:var(--teal)}.scan-box{min-width:310px;display:flex;gap:8px;align-items:center;background:#e7f2ee;border:1px solid #b8d5ce;border-radius:5px;padding:7px 10px;color:var(--teal-dark)}.scan-box input{border:0;background:transparent;padding:4px}.payment-list{margin-top:18px;display:grid;gap:8px}.payment-list div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.text-button{background:transparent;color:var(--teal);text-align:left;padding:6px 0;font-weight:700}.total{display:flex;justify-content:space-between;font-size:18px;border-top:2px solid var(--ink);margin-top:18px;padding:15px 0}button:not(.icon-button):not(.product-row):not(.text-button){display:inline-flex;justify-content:center;align-items:center;gap:8px;border-radius:4px;background:var(--teal);color:#fff;padding:11px 15px;font-weight:800}button:not(.icon-button):not(.product-row):not(.text-button):hover{background:var(--teal-dark)}.notice{color:var(--teal)}.error{color:#b43a25}.empty-state{color:var(--muted);padding:22px 0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}label{display:grid;gap:7px;font-weight:700;text-transform:capitalize}textarea{min-height:90px;resize:vertical}.logo-upload{grid-row:span 3;display:grid;justify-items:center;align-content:center;gap:12px;background:#edf3f0;min-height:220px}.logo-upload img,.logo-upload span{width:104px;height:104px}.secondary-button{display:flex;align-items:center;background:#fff;border:1px solid #bdd1cd;border-radius:4px;padding:9px 12px;color:var(--teal-dark)}.form-actions{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;color:var(--teal)}.simple-form{display:grid;gap:13px;align-content:start}.simple-form svg{color:var(--coral)}.data-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;align-content:start}.record-card{background:#fff;border:1px solid var(--line);border-radius:5px;padding:15px}.record-card p{margin-bottom:12px}.record-card p:last-child{margin-bottom:0}.record-card small{margin-bottom:3px}.status{display:inline-block;padding:3px 8px;background:#e4f1ea;color:#176445;border-radius:12px;font-size:11px;text-transform:capitalize}table{border-collapse:collapse;width:100%}th,td{padding:12px 8px;border-bottom:1px solid var(--line);text-align:left}th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em}.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}.metric-row article{background:#fff;border-top:3px solid var(--gold);padding:17px}.metric-row b{display:block;font-size:22px;margin-top:7px}.login-shell{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#e7eee8,#f8f5ed 45%,#f6d7c8);padding:20px}.login-panel{width:min(420px,100%);padding:36px;background:#fffdf9;border:1px solid #d9ded5;border-radius:6px;box-shadow:10px 12px #cfdfd8;display:grid;gap:17px}.login-panel h1{font-size:36px}.page-loader{min-height:100vh;display:grid;place-items:center;color:var(--teal)}.menu-button{display:none}@media(max-width:900px){.sidebar{transform:translate(-100%);transition:transform .2s}.sidebar.open{transform:translate(0)}.workspace{margin-left:0}.menu-button{display:grid}.pos-grid,.split-layout{grid-template-columns:1fr}.header-actions select{display:none}.content{padding:20px}header{padding:12px 18px}.header-title small{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@media(max-width:600px){.form-grid,.metric-row{grid-template-columns:1fr}.logo-upload{grid-row:auto}.scan-box{min-width:0;width:100%}.page-heading{align-items:stretch;flex-direction:column}.user-chip{font-size:0;gap:0}.user-chip small{display:none}.data-grid{grid-template-columns:1fr}}:root{--ink:#12303a;--muted:#5a7179;--line:#cbe4e9;--paper:#f2fbfd;--panel:#ffffff;--teal:#06b6d4;--teal-dark:#0891b2;--coral:#00a8cc;--gold:#f1c45b}[data-theme=dark]{--ink:#e4f8fc;--muted:#9fc3cb;--line:#255563;--paper:#09242c;--panel:#102f38;--teal:#22d3ee;--teal-dark:#06b6d4;--coral:#52d5e9;--gold:#f0c562}[data-theme=dark] .sidebar{background:#06232b}[data-theme=dark] header,[data-theme=dark] .login-panel,[data-theme=dark] input,[data-theme=dark] select,[data-theme=dark] textarea,[data-theme=dark] .record-card{background:var(--panel);color:var(--ink)}[data-theme=dark] .product-row{color:var(--ink)}.nav-group{margin:18px 0 4px}.nav-group>p{display:flex;align-items:center;gap:7px;margin:0 10px 5px;color:#75cbd9;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.nav-group a{padding:7px 12px 7px 31px;font-size:12px}.route-error{max-width:560px;padding:32px;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--teal)}.feature-toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px}.feature-toolbar input{max-width:360px}.feature-toolbar button{margin-left:auto}.status-badge{display:inline-block;padding:3px 8px;border-radius:12px;background:#def7fb;color:#087c91;font-size:11px;font-weight:700;text-transform:capitalize}.action-modal{position:fixed;inset:0;z-index:5;display:grid;place-items:center;background:#041e268c;padding:20px}.action-modal>div{width:min(440px,100%);padding:24px;border-radius:6px;background:var(--panel);border:1px solid var(--line)}@media(max-width:900px){.nav-group{margin:12px 0 2px}}.pos-statusbar{display:grid;grid-template-columns:1.1fr 1.3fr 1.5fr auto;gap:10px;margin-bottom:18px;padding:11px 14px;background:var(--panel);border:1px solid var(--line);border-radius:6px}.pos-statusbar span{min-width:0;display:grid;gap:2px}.pos-statusbar b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.network{display:flex!important;align-items:center;align-self:center;font-size:12px;font-weight:800}.network.online{color:#078c71}.network.offline{color:#cf4c42}@media(max-width:800px){.pos-statusbar{grid-template-columns:1fr 1fr}}@media(max-width:500px){.pos-statusbar{grid-template-columns:1fr}}.sidebar{transition:width .2s ease,padding .2s ease;overflow:visible}.sidebar-collapsed .sidebar{width:68px;padding-left:10px;padding-right:10px}.sidebar-collapsed .workspace{margin-left:68px}.sidebar-collapsed .nav-group>p{justify-content:center;margin-left:0;margin-right:0}.sidebar-collapsed .nav-group a{justify-content:center;padding:9px;font-size:12px}.sidebar-toggle{position:absolute;right:-14px;top:24px;z-index:50;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid #22d3ee;border-radius:999px;background:#0891b2;color:#fff;box-shadow:0 4px 12px #0891b259;transition:background .2s,transform .2s}.sidebar-toggle:hover{background:#087b98;transform:scale(1.06)}.pos-quick-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px;padding:14px 16px;background:var(--panel);border:1px solid var(--line);border-radius:8px}.pos-quick-actions button{flex:1 1 180px;min-width:160px;justify-content:center;padding:12px 16px;background:#e6fbff;color:var(--teal-dark);border:1px solid #a9e7f2;font-weight:700}.pos-quick-actions button:hover{background:var(--teal);color:#fff}.discount-vat-panel{display:grid;gap:10px;margin:16px 0;padding:14px;background:var(--paper);border:1px solid var(--line);border-radius:6px}.inline-field{display:flex;flex-direction:column;gap:5px;font-weight:700;font-size:12px}.checkbox-field{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13px}.checkbox-field input{width:auto}.total-breakdown{border-top:2px solid var(--ink);margin-top:16px;padding-top:12px;display:grid;gap:6px}.total-breakdown>div{display:flex;justify-content:space-between;font-size:13px}.total-breakdown .grand{font-size:18px;border-top:1px solid var(--line);padding-top:8px;margin-top:4px}@media(max-width:900px){.sidebar-toggle{display:none}.sidebar-collapsed .workspace{margin-left:0}.pos-quick-actions button{flex:1 1 100%}}html,body,#root{margin:0;padding:0;height:100vh;overflow:hidden!important}.app-shell{display:flex!important;width:100vw;height:100vh;overflow:hidden;position:relative}.sidebar-container{width:250px;min-width:250px;height:100vh;background-color:#111c24;color:#d9e6e5;display:flex;flex-direction:column;position:relative;transition:width .22s cubic-bezier(.4,0,.2,1),min-width .22s cubic-bezier(.4,0,.2,1);z-index:40;border-right:1px solid rgba(255,255,255,.08)}.sidebar-container.collapsed{width:68px;min-width:68px}.sidebar-toggle-btn{position:absolute;right:-13px;top:22px;z-index:50;width:26px;height:26px;border-radius:50%;background-color:#06b6d4;color:#fff;border:2px solid #111c24;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #00000059;transition:background-color .2s ease,transform .2s ease}@keyframes buttonShake{0%{transform:scale(1) rotate(0)}25%{transform:scale(1.12) rotate(-6deg)}50%{transform:scale(1.12) rotate(6deg)}75%{transform:scale(1.12) rotate(-3deg)}to{transform:scale(1.08) rotate(0)}}.sidebar-toggle-btn:hover{background-color:#0891b2;animation:buttonShake .35s ease-in-out forwards}.sidebar-brand{padding:18px 14px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.06)}.brand-avatar{width:36px;height:36px;min-width:36px;border-radius:8px;background-color:#f1c45b;color:#111c24;display:grid;place-items:center;font-weight:800;font-size:14px}.brand-logo{width:36px;height:36px;min-width:36px;border-radius:8px;object-fit:cover}.brand-info strong{display:block;color:#fff;font-size:14px;line-height:1.2}.brand-info small{color:#06b6d4;font-size:10px;letter-spacing:.05em}.sidebar-nav{flex:1;overflow-y:auto;padding:12px 8px;display:flex;flex-direction:column;gap:16px}.nav-group-title{display:flex;align-items:center;gap:8px;margin:0 8px 6px;color:#06b6d4;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.sidebar-container.collapsed .nav-group-title{justify-content:center;margin:0 0 6px}.nav-items-list{display:flex;flex-direction:column;gap:3px}.nav-link{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:6px;color:#9fc3cb;text-decoration:none;font-size:13px;transition:all .15s ease}.sidebar-container.collapsed .nav-link{justify-content:center;padding:10px 0}.nav-link:hover{background-color:#ffffff0d;color:#fff}.nav-link.active{background-color:#0891b2;color:#fff;font-weight:600}.link-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-footer{padding:10px 8px;border-top:1px solid rgba(255,255,255,.06)}.logout-btn{width:100%;display:flex;align-items:center;gap:10px;padding:9px 12px;background:transparent;color:#f87171;border-radius:6px;cursor:pointer;border:none;font-size:13px;font-weight:600;transition:background .15s ease}.sidebar-container.collapsed .logout-btn{justify-content:center;padding:10px 0}.logout-btn:hover{background-color:#f871711a}.workspace-container{flex:1;height:100vh;overflow:hidden;display:flex;flex-direction:column;background-color:var(--paper, #f5f6f2);margin-left:0!important}.content-body{flex:1;overflow-y:auto}.custom-scroll::-webkit-scrollbar{width:5px;height:5px}.custom-scroll::-webkit-scrollbar-track{background:transparent}.sidebar-nav.custom-scroll::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:10px}.sidebar-nav.custom-scroll::-webkit-scrollbar-thumb:hover{background:#06b6d4}.content-body.custom-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.content-body.custom-scroll::-webkit-scrollbar-thumb:hover{background:#0891b2}.hub-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;border-bottom:1px solid var(--line);padding-bottom:12px}.hub-tabs button{display:flex;align-items:center;gap:7px;background:transparent;color:var(--muted);border:1px solid var(--line);padding:8px 11px;border-radius:4px}.hub-tabs button.active{background:var(--teal);color:#fff;border-color:var(--teal)}
