@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400&display=swap";@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&display=swap";select option{background:#1a1a2e!important;color:#fff!important;padding:8px 12px!important}select option:checked{background:#00c853!important;color:#001a08!important}h1,h2,h3,h4,h5,h6{text-shadow:0 2px 8px rgba(0,0,0,.4)!important}th{color:#fffffff2!important;font-weight:600!important;text-shadow:0 1px 2px rgba(0,0,0,.3)!important}td{text-shadow:0 1px 2px rgba(0,0,0,.2)}p,span,div{text-shadow:0 1px 2px rgba(0,0,0,.15)}:root{--glass-white: rgba(255,255,255,.12);--glass-white-md: rgba(255,255,255,.18);--glass-white-lg: rgba(255,255,255,.25);--glass-dark: rgba(0,0,0,.25);--glass-dark-md: rgba(0,0,0,.4);--glass-border: rgba(255,255,255,.22);--glass-border-subtle: rgba(255,255,255,.12);--glass-blur: blur(20px) saturate(180%);--glass-blur-md: blur(14px) saturate(160%);--glass-blur-sm: blur(8px) saturate(140%);--bg-primary: rgba(0,20,8,.4);--bg-secondary: rgba(0,25,10,.35);--bg-surface: rgba(255,255,255,.07);--bg-card: rgba(255,255,255,.1);--bg-hover: rgba(0,230,118,.1);--bg-input: rgba(255,255,255,.1);--border: rgba(255,255,255,.18);--border-focus: rgba(0,230,118,.6);--border-3d: rgba(255,255,255,.15);--green: #00e676;--green-dark: #00c853;--green-light: #b9f6ca;--green-glow: rgba(0,230,118,.35);--blue: #4fc3f7;--blue-mid: #29b6f6;--blue-light: #e1f5fe;--blue-deep: #0277bd;--blue-glow: rgba(79,195,247,.35);--teal: #26c6da;--teal-glow: rgba(38,198,218,.3);--purple: #b39ddb;--purple-deep: #7e57c2;--amber: #ffca28;--red: #ef5350;--red-glow: rgba(239,83,80,.35);--text-primary: rgba(255,255,255,.95);--text-secondary: rgba(255,255,255,.75);--text-muted: rgba(255,255,255,.5);--text-inverse: rgba(0,0,0,.85);--font: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--radius-sm: 8px;--radius: 16px;--radius-lg: 20px;--radius-xl: 28px;--radius-full: 9999px;--shadow-glass: 0 8px 32px rgba(0,0,0,.3), 0 2px 8px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.25);--shadow-glass-lg: 0 20px 60px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.3);--shadow-glass-sm: 0 4px 16px rgba(0,0,0,.2), 0 1px 4px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.2);--shadow-glow-green: 0 0 24px rgba(0,230,118,.5), 0 0 48px rgba(0,230,118,.2);--shadow-glow-blue: 0 0 24px rgba(79,195,247,.5), 0 0 48px rgba(79,195,247,.2);--shadow-glow-teal: 0 0 24px rgba(38,198,218,.5), 0 0 48px rgba(38,198,218,.2);--shadow-btn: 0 4px 20px rgba(0,0,0,.35), 0 1px 4px rgba(0,0,0,.25);--sidebar-w: 265px;--sidebar-collapsed: 72px;--transition: .2s cubic-bezier(.4,0,.2,1);--transition-slow: .4s cubic-bezier(.4,0,.2,1);--transition-spring: .35s cubic-bezier(.34,1.56,.64,1);--transition-glass: .3s cubic-bezier(.4,0,.2,1);--danger: var(--red);--warning: var(--amber);--primary: var(--green);--secondary: var(--blue-mid);--info: var(--teal)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;height:100%}body{font-family:var(--font);font-size:14px;line-height:1.6;color:var(--text-primary);min-height:100vh;overflow-x:hidden;background:linear-gradient(180deg,#00140a85,#051e0f61 40%,#000f087a),url(/bg.webp) center center / cover no-repeat fixed;background-attachment:fixed}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 60% at 20% 10%,rgba(0,180,80,.1) 0%,transparent 60%),radial-gradient(ellipse 60% 50% at 80% 80%,rgba(100,200,120,.08) 0%,transparent 60%),radial-gradient(ellipse 50% 40% at 50% 10%,rgba(180,220,100,.06) 0%,transparent 70%);pointer-events:none;z-index:0}a{color:var(--green);text-decoration:none}button{cursor:pointer;font-family:var(--font)}input,select,textarea{font-family:var(--font)}*{outline:none}*:focus-visible{outline:2px solid rgba(0,230,118,.6);outline-offset:2px}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:#ffffff0a}::-webkit-scrollbar-thumb{background:#fff3;border-radius:99px}::-webkit-scrollbar-thumb:hover{background:#ffffff59}.glass{background:var(--glass-white);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow-glass)}.glass-dark{background:var(--glass-dark);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow-glass)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes glassAppear{0%{opacity:0;transform:scale(.96) translateY(12px);-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;transform:scale(1) translateY(0);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 12px #00e6764d}50%{box-shadow:0 0 24px #00e67699,0 0 48px #00e67633}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 18px;border-radius:var(--radius-full);font-weight:700;font-size:13px;letter-spacing:.2px;border:1px solid transparent;transition:all var(--transition-spring);white-space:nowrap;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);transition:left .4s ease}.btn:hover:before{left:100%}.btn-primary{background:linear-gradient(135deg,#00c853d9,#00e676b3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:#00e67680;color:#001a08;font-weight:800;box-shadow:0 4px 20px #00c85366,inset 0 1px #ffffff4d}.btn-primary:hover{background:linear-gradient(135deg,#00e676f2,#00c853d9);box-shadow:0 6px 28px #00c8538c,0 0 40px #00c85333,inset 0 1px #fff6;transform:translateY(-2px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:linear-gradient(135deg,#29b6f6b3,#4fc3f78c);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:#4fc3f780;color:#001428;font-weight:800;box-shadow:0 4px 20px #29b6f659,inset 0 1px #ffffff4d}.btn-secondary:hover{transform:translateY(-2px);box-shadow:0 6px 28px #29b6f680,inset 0 1px #fff6}.btn-ghost{background:#ffffff14;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-color:#ffffff2e;color:var(--text-primary)}.btn-ghost:hover{background:#ffffff29;border-color:#ffffff4d;transform:translateY(-1px)}.btn-danger,.btn-red{background:linear-gradient(135deg,#ef5350bf,#e5393599);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:#ef535080;color:#fff;box-shadow:0 4px 20px #ef535059}.btn-danger:hover,.btn-red:hover{transform:translateY(-2px);box-shadow:0 6px 28px #ef535080}.btn-amber{background:linear-gradient(135deg,#ffca28cc,#ffb300a6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:#ffca2880;color:#1a1000;font-weight:800;box-shadow:0 4px 20px #ffb30059}.btn-amber:hover{transform:translateY(-2px)}.btn-sm{padding:5px 12px;font-size:12px}.btn-lg{padding:12px 28px;font-size:15px}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important}.card{background:#ffffff1a;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-lg);box-shadow:var(--shadow-glass);position:relative;overflow:hidden;animation:glassAppear .4s ease;transition:all var(--transition)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.5) 30%,rgba(0,230,118,.6) 50%,rgba(79,195,247,.5) 70%,transparent 100%)}.card:hover{border-color:#ffffff4d;box-shadow:0 12px 40px #00000059,inset 0 1px #ffffff59;transform:translateY(-1px)}.card-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid rgba(255,255,255,.1)}.card-title{font-size:15px;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:8px}.card-body{padding:20px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.stat-card{background:#ffffff1a;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-lg);padding:20px;position:relative;overflow:hidden;transition:all var(--transition-spring);box-shadow:var(--shadow-glass-sm)}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent)}.stat-card.green{border-top:2px solid rgba(0,230,118,.7)}.stat-card.blue{border-top:2px solid rgba(79,195,247,.7)}.stat-card.red{border-top:2px solid rgba(239,83,80,.7)}.stat-card.amber{border-top:2px solid rgba(255,202,40,.7)}.stat-card.green:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 80% 20%,rgba(0,230,118,.08) 0%,transparent 60%);pointer-events:none}.stat-card.blue:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 80% 20%,rgba(79,195,247,.08) 0%,transparent 60%);pointer-events:none}.stat-card.red:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 80% 20%,rgba(239,83,80,.08) 0%,transparent 60%);pointer-events:none}.stat-card.amber:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 80% 20%,rgba(255,202,40,.08) 0%,transparent 60%);pointer-events:none}.stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-glass-lg)}.stat-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.stat-card.green .stat-icon{background:#00e6762e;border:1px solid rgba(0,230,118,.3)}.stat-card.blue .stat-icon{background:#4fc3f72e;border:1px solid rgba(79,195,247,.3)}.stat-card.red .stat-icon{background:#ef53502e;border:1px solid rgba(239,83,80,.3)}.stat-card.amber .stat-icon{background:#ffca282e;border:1px solid rgba(255,202,40,.3)}.stat-label{font-size:10.5px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted);margin-bottom:6px}.stat-value{font-size:22px;font-weight:900;color:var(--text-primary);letter-spacing:-.5px;line-height:1.2}.stat-sub{font-size:11px;color:var(--text-muted);margin-top:4px}.form-group{margin-bottom:14px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-label{display:block;font-size:12px;font-weight:600;color:#ffffffb3;margin-bottom:6px;letter-spacing:.3px}.form-label.required:after{content:" *";color:var(--red)}.form-input,.form-select,.form-textarea{width:100%;padding:10px 14px;background:#ffffff1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius);color:var(--text-primary);font-size:13.5px;font-family:var(--font);transition:all var(--transition)}.form-input::placeholder{color:#ffffff4d}.form-input:focus,.form-select:focus,.form-textarea:focus{background:#ffffff26;border-color:#00e67699;box-shadow:0 0 0 3px #00e67626,0 4px 12px #0003}.form-select option{background:#1a2a4a;color:#fff}.form-textarea{min-height:80px;resize:vertical}.form-input-sm{padding:6px 10px;font-size:12.5px;border-radius:var(--radius-sm)}.filter-bar{display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.08);flex-wrap:wrap}.search-input-wrapper{position:relative;flex:1;min-width:200px}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:15px;pointer-events:none;opacity:.6}.search-input{width:100%;padding:9px 14px 9px 38px;background:#ffffff14;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-full);color:var(--text-primary);font-size:13.5px;font-family:var(--font);transition:all var(--transition)}.search-input::placeholder{color:#ffffff59}.search-input:focus{background:#ffffff21;border-color:#00e67680;box-shadow:0 0 0 3px #00e6761f}.table-container{overflow-x:auto;border-radius:0 0 var(--radius-lg) var(--radius-lg)}.data-table{width:100%;border-collapse:collapse}.data-table thead th{padding:12px 16px;background:#ffffff0f;border-bottom:1px solid rgba(255,255,255,.12);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#ffffff80;text-align:left;white-space:nowrap}.data-table tbody tr{border-bottom:1px solid rgba(255,255,255,.05);transition:background var(--transition)}.data-table tbody tr:hover{background:#ffffff0f}.data-table tbody tr:last-child{border-bottom:none}.data-table tbody td{padding:12px 16px;color:var(--text-primary);vertical-align:middle;font-size:13.5px}.data-table tbody td.muted{color:var(--text-muted);font-size:12px}.data-table tfoot td{padding:12px 16px;font-weight:800;font-size:13.5px;color:var(--green);background:#00e6760f;border-top:1px solid rgba(0,230,118,.2)}.badge{display:inline-flex;align-items:center;gap:3px;padding:3px 10px;border-radius:var(--radius-full);font-size:11px;font-weight:700;letter-spacing:.2px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.badge-green{background:#00e6762e;color:#69f0ae;border:1px solid rgba(0,230,118,.35)}.badge-blue{background:#4fc3f72e;color:#b3e5fc;border:1px solid rgba(79,195,247,.35)}.badge-amber{background:#ffca282e;color:#ffe57f;border:1px solid rgba(255,202,40,.35)}.badge-red{background:#ef53502e;color:#ffcdd2;border:1px solid rgba(239,83,80,.35)}.badge-gray{background:#ffffff1a;color:#ffffff80;border:1px solid rgba(255,255,255,.15)}.badge-cyan{background:#26c6da2e;color:#b2ebf2;border:1px solid rgba(38,198,218,.35)}.badge-purple{background:#b39ddb2e;color:#e1bee7;border:1px solid rgba(179,157,219,.35)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:99999;padding:20px;animation:fadeInUp .2s ease}.modal{width:100%;max-width:560px;max-height:85vh;display:flex;flex-direction:column;background:linear-gradient(145deg,#081e0fb3,#05140ad9);backdrop-filter:blur(32px) saturate(200%);-webkit-backdrop-filter:blur(32px) saturate(200%);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-xl);transform-style:preserve-3d;box-shadow:0 35px 65px #000000b3,inset 0 2px #ffffff4d,inset 0 -4px 10px #0006;animation:glassAppear .35s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.modal:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--green),var(--blue-mid),var(--purple))}.modal-sm{max-width:420px}.modal-lg{max-width:720px}.modal-xl{max-width:900px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 16px;border-bottom:1px solid rgba(255,255,255,.1);background:#ffffff0a}.modal-title{font-size:16px;font-weight:800;color:var(--text-primary);letter-spacing:-.2px}.modal-close{width:30px;height:30px;border-radius:50%;background:#ffffff14;border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;color:var(--text-secondary);transition:all var(--transition)}.modal-close:hover{background:#ef535033;border-color:#ef535066;color:var(--red)}.modal-body{padding:20px 24px;overflow-y:auto;flex:1}.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding:16px 24px;border-top:1px solid rgba(255,255,255,.1);background:#ffffff08}.amount{font-variant-numeric:tabular-nums;font-weight:700;font-family:var(--font-mono)}.spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.15);border-top-color:var(--green);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}.toast-container{position:fixed;top:20px;right:20px;z-index:99999;display:flex;flex-direction:column;gap:8px}.toast{background:#001e0cc7;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.18);border-radius:var(--radius);padding:12px 18px 12px 14px;font-size:13.5px;font-weight:600;color:var(--text-primary);box-shadow:0 8px 32px #0000004d;animation:fadeInUp .3s ease;max-width:340px;display:flex;align-items:center;gap:10px}.toast.success{border-left:3px solid var(--green)}.toast.error{border-left:3px solid var(--red)}.toast.warning{border-left:3px solid var(--amber)}.toast.info{border-left:3px solid var(--blue)}.stok-bar{height:4px;background:#ffffff1a;border-radius:var(--radius-full);overflow:hidden}.stok-bar-fill{height:100%;border-radius:var(--radius-full);transition:width .6s ease}.stok-bar-fill.high{background:linear-gradient(90deg,var(--green-dark),var(--green))}.stok-bar-fill.medium{background:linear-gradient(90deg,var(--amber),#ffca28)}.stok-bar-fill.low{background:linear-gradient(90deg,var(--red),#ef9a9a)}.hover-row{cursor:pointer;transition:background var(--transition)}.hover-row:hover{background:#ffffff0f}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--text-muted);text-align:center;gap:12px}.empty-icon{font-size:48px;opacity:.6;animation:float 3s ease-in-out infinite}.chart-card{padding:20px}.chart-title{font-size:14px;font-weight:700;color:var(--text-primary);margin-bottom:16px}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px}.quick-action-btn{background:#ffffff14;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:14px 12px;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;transition:all var(--transition-spring);text-align:center;color:var(--text-secondary);font-size:12px;font-weight:600;font-family:var(--font)}.quick-action-btn:hover{background:#ffffff24;border-color:#00e67666;color:var(--text-primary);transform:translateY(-2px);box-shadow:0 6px 20px #00000040}.qa-icon{font-size:24px}.nota-view{max-width:800px;margin:0 auto;background:#fff;color:#000}.nota-header-bar{background:linear-gradient(90deg,#00c853,#1976d2,#d32f2f);padding:3px 0}.amount{font-variant-numeric:tabular-nums;font-weight:700}.amount.positive{color:#69f0ae}.amount.negative{color:#ff8a80}.app-layout{display:flex;height:100vh;overflow:hidden;position:relative;z-index:1}.sidebar{width:var(--sidebar-w);height:100vh;background:#00190a61;backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border-right:1px solid rgba(255,255,255,.15);display:flex;flex-direction:column;flex-shrink:0;transition:width var(--transition-slow);overflow:hidden;position:relative;z-index:100;box-shadow:2px 0 24px #00000040,inset -1px 0 #ffffff14}.sidebar:after{content:"";position:absolute;right:0;top:8%;bottom:8%;width:1.5px;background:linear-gradient(180deg,#00e676b3,#b4dc5080,#00e6764d);opacity:.7;border-radius:2px;pointer-events:none}.sidebar.sidebar-collapsed{width:var(--sidebar-collapsed)}.sidebar.sidebar-collapsed .logo-name,.sidebar.sidebar-collapsed .logo-subtitle,.sidebar.sidebar-collapsed .nav-label,.sidebar.sidebar-collapsed .nav-section-label{display:none}.sidebar.sidebar-collapsed .nav-item{justify-content:center;padding:10px 0}.sidebar.sidebar-collapsed .nav-icon{width:100%;justify-content:center;font-size:20px}.sidebar.sidebar-collapsed .sidebar-toggle span{display:none}.sidebar.sidebar-collapsed .sidebar-toggle{width:36px;min-width:36px;padding:0;justify-content:center}.sidebar.sidebar-collapsed .logout-btn span:last-child{display:none}.sidebar.sidebar-collapsed .theme-toggle span:last-child{display:none}.sidebar.sidebar-collapsed .theme-toggle{justify-content:center;padding:6px}.sidebar.sidebar-collapsed .logout-btn{justify-content:center;padding:6px;min-width:0}.sidebar-header{padding:16px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;min-height:72px;position:relative;background:#001e0a26}.sidebar-logo{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.logo-icon{font-size:26px;flex-shrink:0;filter:drop-shadow(0 0 8px rgba(0,230,118,.6));animation:float 4s ease-in-out infinite}.logo-name{font-size:14px;font-weight:900;background:linear-gradient(135deg,#00e676,#29b6f6,#b39ddb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap;letter-spacing:.3px}.logo-subtitle{font-size:9.5px;color:#ffffffb3;letter-spacing:.5px;text-shadow:0 1px 4px rgba(0,0,0,.7)}.sidebar-toggle{height:32px;min-width:32px;padding:0 10px;border-radius:var(--radius-full);background:#00e67626;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,230,118,.4);display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;color:#69f0ae;flex-shrink:0;transition:all var(--transition-spring);font-size:14px;font-weight:800;box-shadow:0 2px 12px #00e67640;white-space:nowrap}.sidebar-toggle:hover{background:#00e67647;border-color:#00e676b3;box-shadow:0 4px 20px #00e67666,0 0 30px #00e67626;transform:scale(1.05)}.sidebar-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:8px 0}.nav-section{margin-bottom:4px}.nav-section-label{font-size:9.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;padding:10px 16px 4px;opacity:.7}.nav-item{display:flex;align-items:center;gap:10px;padding:9px 14px;margin:1px 8px;border-radius:var(--radius);cursor:pointer;transition:all var(--transition);color:#ffffffd9;font-size:13px;font-weight:500;position:relative;border:1px solid transparent;text-shadow:0 1px 4px rgba(0,0,0,.6)}.nav-item:hover{background:#00e6761a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-color:#00e67633;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7)}.nav-item.active{background:#00e6762e;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-color:#00e67666;color:#69f0ae;font-weight:700;box-shadow:inset 0 1px #ffffff26,0 2px 8px #0003;text-shadow:0 0 12px rgba(0,230,118,.5)}.nav-item.active:after{content:"";position:absolute;left:0;top:20%;bottom:20%;width:3px;background:linear-gradient(180deg,#00e676,#b4dc50cc);border-radius:0 3px 3px 0;box-shadow:0 0 8px #00e676cc}.nav-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.nav-label{overflow:hidden;white-space:nowrap}.sidebar-footer{border-top:1px solid rgba(255,255,255,.12);padding:12px;display:flex;flex-direction:column;gap:8px;background:#00140833;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.user-info{display:flex;align-items:center;gap:10px;padding:10px;background:#00e67614;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:var(--radius);border:1px solid rgba(0,230,118,.2)}.user-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#00c853,#29b6f6);border:2px solid rgba(0,230,118,.5);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:14px;color:#001a0a;flex-shrink:0;box-shadow:0 0 12px #00e67666}.user-name{font-size:13px;font-weight:700;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:10.5px;color:var(--text-muted)}.user-details{flex:1;overflow:hidden}.logout-btn{width:100%;justify-content:center;font-size:12px!important}.theme-toggle{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;border-radius:var(--radius);border:1px solid rgba(255,255,255,.15);background:#ffffff0f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#ffffffb3;cursor:pointer;font-size:12px;font-weight:700;font-family:var(--font);transition:all var(--transition-spring)}.theme-toggle:hover{background:#ffffff1f;border-color:#4fc3f766;color:var(--text-primary);transform:translateY(-1px)}.main-content{flex:1;overflow-y:auto;background:transparent;position:relative;z-index:1}.page{padding:24px;animation:fadeInUp .35s ease}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px}.page-title{font-size:26px;font-weight:900;color:var(--text-primary);letter-spacing:-.5px;text-shadow:0 2px 20px rgba(0,0,0,.5)}.page-subtitle{font-size:13px;color:var(--text-muted);margin-top:2px}.pos-layout{display:grid;grid-template-columns:1fr 380px;gap:0;height:100%;overflow:hidden}.pos-products-panel{overflow-y:auto;padding:20px;border-right:1px solid rgba(255,255,255,.1)}.pos-cart-panel{display:flex;flex-direction:column;background:#00140859;backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border-left:1px solid rgba(255,255,255,.15);overflow:hidden}.pos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:14px;padding-bottom:8px}.product-card{background:#ffffff17;backdrop-filter:blur(12px) saturate(150%);-webkit-backdrop-filter:blur(12px) saturate(150%);border:1px solid rgba(255,255,255,.18);border-radius:var(--radius);padding:16px;cursor:pointer;transition:all var(--transition-spring);position:relative;overflow:hidden}.product-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent)}.product-card:hover{background:#ffffff26;border-color:#00e67666;transform:translateY(-4px);box-shadow:0 10px 30px #0000004d,0 0 20px #00e6761a}.product-card.out-of-stock{opacity:.45;cursor:not-allowed}.prod-name{font-weight:700;font-size:13.5px;margin-bottom:6px;color:var(--text-primary)}.prod-price{font-weight:800;font-size:13px;color:#69f0ae;margin-bottom:4px}.prod-stok{font-size:11px;color:var(--text-muted)}.cart-customer{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.1);cursor:pointer;transition:background var(--transition);background:#ffffff0a}.cart-customer:hover{background:#ffffff14}.cart-items{flex:1;overflow-y:auto;padding:8px}.cart-item{background:#ffffff12;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:10px 12px;margin-bottom:6px;transition:all var(--transition)}.cart-item:hover{border-color:#fff3}.cart-item-name{font-weight:700;font-size:13px;margin-bottom:8px;color:var(--text-primary)}.cart-item-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.cart-footer{padding:14px;border-top:1px solid rgba(255,255,255,.12);background:#001e0a33;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.cart-total{background:#00e67614;border:1px solid rgba(0,230,118,.2);border-radius:var(--radius);padding:12px 14px;margin-bottom:12px}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;overflow:hidden}.login-card{width:100%;max-width:440px;background:#001e0c94;backdrop-filter:blur(36px) saturate(200%);-webkit-backdrop-filter:blur(36px) saturate(200%);border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-xl);box-shadow:0 32px 64px #0006,inset 0 1px #ffffff38;overflow:hidden;position:relative;animation:glassAppear .6s cubic-bezier(.34,1.56,.64,1)}.login-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--green),var(--blue-mid),var(--purple))}.login-header{padding:36px 36px 24px;text-align:center}.login-logo{font-size:52px;margin-bottom:12px;display:block;filter:drop-shadow(0 0 20px rgba(0,230,118,.6));animation:float 3s ease-in-out infinite}.login-title{font-size:26px;font-weight:900;background:linear-gradient(135deg,#00e676,#29b6f6,#b39ddb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px;margin-bottom:4px}.login-subtitle{font-size:13px;color:var(--text-muted)}.login-body{padding:0 36px 36px}.login-footer-text{text-align:center;font-size:11px;color:var(--text-muted);margin-top:20px}.dashboard-grid{display:grid;grid-template-columns:1fr 380px;gap:20px}.report-section{margin-bottom:28px}.report-title{font-size:13px;font-weight:700;letter-spacing:.5px;color:var(--text-secondary);text-transform:uppercase;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}@media print{.sidebar,.topbar .btn,.btn,.modal-overlay{display:none!important}.main-content{overflow:visible}body{background:#fff;color:#000}.card{background:#fff;border:1px solid #ccc;box-shadow:none}.nota-view{max-width:100%}}@media (max-width: 1200px){.stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}}@media (max-width: 900px){.pos-layout{grid-template-columns:1fr;height:auto}.sidebar{width:var(--sidebar-collapsed)}.sidebar .logo-name,.sidebar .logo-subtitle,.sidebar .nav-label,.sidebar .nav-section-label{display:none}.sidebar .nav-item{justify-content:center}.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.stats-grid,.form-row{grid-template-columns:1fr}.page{padding:16px}.modal{border-radius:var(--radius-lg)}}.owner-app.app-layout{flex-direction:column}@media (max-width: 900px){.owner-app .sidebar{width:100%!important;height:auto;position:fixed;bottom:0;left:0;z-index:1000;padding:0;background:#081028f2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:none;border-top:1px solid rgba(255,255,255,.1);box-shadow:0 -4px 20px #00000080;transform:none!important}.owner-app .sidebar-header,.owner-app .sidebar-footer,.owner-app .nav-section-label{display:none!important}.owner-app .sidebar-nav{display:flex;flex-direction:row;justify-content:space-around;align-items:center;margin:0;padding:0;height:65px;overflow:visible}.owner-app .nav-section{display:flex;flex-direction:row;margin:0;padding:0;width:100%;justify-content:space-around;border:none}.owner-app .nav-item{flex-direction:column;margin:0;padding:8px;width:70px;border-radius:8px;background:transparent!important;justify-content:center}.owner-app .nav-item.active{border-left:none!important;background:#ffffff14!important}.owner-app .nav-icon{font-size:22px;margin-bottom:2px}.owner-app .nav-label{display:block!important;font-size:9px;line-height:1;text-align:center}.owner-app .main-content{padding-bottom:80px}}[data-theme=light] .data-table tbody td{color:#fffffff2}[data-theme=light] .card-title{color:var(--text-primary)}[data-theme=light] .page-title{color:var(--text-primary);text-shadow:0 2px 20px rgba(0,0,0,.3)}code{font-family:var(--font-mono);background:#ffffff1a;padding:2px 6px;border-radius:var(--radius-sm);font-size:12px;color:#b3e5fc;border:1px solid rgba(255,255,255,.1)}