:root{--bg-dark: #121214;--bg-card: #1A1A1E;--bg-card-hover: #26262E;--bg-border: #2E2E38;--accent-cyan: #4CC9F0;--accent-blue: #3A86C8;--accent-green: #47B881;--accent-orange: #FF9F1C;--accent-red: #E63946;--accent-purple: #7209B7;--accent-pos: #2A6F97;--text-main: #FFFFFF;--text-muted: #8E8E9F;--font-family: "Inter", system-ui, -apple-system, sans-serif;--font-heading: "Outfit", "Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body{background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-family);min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--bg-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.app-container{display:flex;min-height:100vh}.sidebar{width:240px;background-color:var(--bg-card);border-right:1px solid var(--bg-border);display:flex;flex-direction:column;padding:20px 15px;flex-shrink:0}.brand-header{text-align:center;margin-bottom:30px}.brand-title{font-family:var(--font-heading);font-size:22px;font-weight:800;color:var(--accent-cyan);letter-spacing:.5px}.brand-subtitle{font-size:11px;color:var(--text-muted);margin-top:3px}.nav-list{display:flex;flex-direction:column;gap:10px;list-style:none;flex-grow:1}.nav-item-btn{width:100%;display:flex;align-items:center;gap:12px;padding:12px 15px;background:var(--bg-card);border:1px solid var(--bg-border);border-radius:10px;color:var(--text-muted);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;text-align:left}.nav-item-btn:hover{background:var(--bg-card-hover);color:#fff}.nav-item-btn.active{background:#3a86c826;border-color:var(--accent-blue);color:var(--accent-cyan);font-weight:700}.main-content{flex-grow:1;padding:20px;overflow-y:auto;max-width:1400px;margin:0 auto;width:100%}.pos-card{background:var(--bg-card);border:1px solid var(--bg-border);border-radius:14px;padding:20px}.page-header{margin-bottom:20px}.page-title{font-family:var(--font-heading);font-size:24px;font-weight:700;color:var(--accent-cyan)}.page-subtitle{font-size:13px;color:var(--text-muted);margin-top:4px}.btn{padding:10px 16px;border-radius:8px;font-weight:600;font-size:14px;border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .15s cubic-bezier(.16,1,.3,1),box-shadow .15s ease,filter .15s ease,background-color .15s ease}.btn:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 6px 16px #0006;filter:brightness(1.15)}.btn:active:not(:disabled){transform:translateY(0) scale(.97);filter:brightness(.95);box-shadow:0 2px 6px #0003}.btn-primary{background:var(--accent-blue);color:#fff}.btn-success{background:var(--accent-green);color:#fff}.btn-warning{background:var(--accent-orange);color:#fff}.btn-danger{background:var(--accent-red);color:#fff}.btn-purple{background:var(--accent-purple);color:#fff}.btn-pos{background:var(--accent-pos);color:#fff}.btn-cyan{background:var(--accent-cyan);color:#121214}.btn:disabled{opacity:.4;cursor:not-allowed}.pos-card{transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s ease,border-color .2s ease}.product-card-hover{transition:transform .15s cubic-bezier(.16,1,.3,1),box-shadow .15s ease,border-color .15s ease,background .15s ease!important}.product-card-hover:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 8px 22px #00000073,0 0 12px #4cc9f040;border-color:var(--accent-cyan)!important;background:#25252e!important}.product-card-hover:active{transform:translateY(0) scale(.97)}.input-field{width:100%;background:#121214;border:1px solid var(--bg-border);border-radius:8px;padding:10px 14px;color:#fff;font-size:14px;outline:none}.input-field:focus{border-color:var(--accent-cyan)}.mobile-top-header,.mobile-bottom-nav{display:none}.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}@media (max-width: 768px){.app-container{flex-direction:column;padding-bottom:70px}.sidebar{display:none!important}.mobile-top-header{display:flex;align-items:center;justify-content:space-between;background:var(--bg-card);border-bottom:1px solid var(--bg-border);padding:12px 16px;position:sticky;top:0;z-index:900}.mobile-bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;height:64px;background:#16161a;border-top:1px solid var(--bg-border);z-index:1000;justify-content:space-around;align-items:center;padding:4px 6px;box-shadow:0 -4px 15px #00000080}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:transparent;border:none;color:var(--text-muted);font-size:11px;font-weight:600;flex:1;padding:6px 0;cursor:pointer;border-radius:8px;transition:color .15s ease,background .15s ease}.mobile-nav-item.active{color:var(--accent-cyan);background:#4cc9f01a}.main-content{padding:12px}.responsive-grid-tables{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))!important;gap:10px!important}.responsive-grid-products{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))!important;gap:8px!important}.responsive-grid-stats{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}.order-view-layout{display:flex;flex-direction:column;gap:15px}.order-mobile-tabs{display:flex!important;gap:6px;background:#16161a;padding:6px;border-radius:10px;border:1px solid var(--bg-border);margin-bottom:12px}.order-mobile-tab-btn{flex:1;padding:10px 6px;background:transparent;border:none;border-radius:7px;color:var(--text-muted);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:all .2s ease}.order-mobile-tab-btn.active{background:var(--accent-blue);color:#fff;box-shadow:0 2px 8px #3a86c866}.modal-box{width:95%!important;max-width:480px!important;max-height:90vh!important;overflow-y:auto!important;padding:18px!important;border-radius:16px!important}}.receipt-paper{width:360px;max-width:100%;background:#fffdf3;color:#111;font-family:Consolas,Courier New,monospace;font-size:13px;padding:20px;border-radius:4px;box-shadow:0 5px 20px #00000080;margin:0 auto;line-height:1.4;white-space:pre-wrap}@page{margin:0;size:auto}@media print{body *{visibility:hidden!important}#global-print-area,#global-print-area *,.printable-receipt,.printable-receipt *{visibility:visible!important}#global-print-area,.printable-receipt{position:absolute!important;left:0!important;top:0!important;width:78mm!important;margin:0!important;padding:4mm!important;font-family:Consolas,Courier New,monospace!important;font-size:12px!important;line-height:1.3!important;white-space:pre-wrap!important;word-break:break-all!important;color:#000!important;background:#fff!important}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}