:root{--primary:#f59e0b;--primary-hover:#d97706;--bg-color:#0f172a;--surface-color:#1e293bb3;--surface-border:#ffffff1a;--text-primary:#f8fafc;--text-secondary:#94a3b8;--success:#10b981;--danger:#ef4444;--warning:#f59e0b;--radius:16px;--radius-sm:8px;--transition:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,system-ui,-apple-system,sans-serif}body{background-color:var(--bg-color);color:var(--text-primary);background-image:radial-gradient(at 0 0,#f59e0b26 0,#0000 50%),radial-gradient(at 100% 100%,#10b9811a 0,#0000 50%);background-attachment:fixed;min-height:100vh;overflow-x:hidden}.glass{background:var(--surface-color);-webkit-backdrop-filter:blur(12px);border:1px solid var(--surface-border);border-radius:var(--radius);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.glass-panel{-webkit-backdrop-filter:blur(16px);border-right:1px solid var(--surface-border);background:#0f172a99}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}h1,h2,h3,h4,h5,h6{color:var(--text-primary);letter-spacing:-.025em;font-weight:600}.btn{border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);border:none;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 14px #f59e0b63}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 6px 20px #f59e0b3b}.btn-glass{color:var(--text-primary);border:1px solid var(--surface-border);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff1a}.btn-glass:hover{background:#ffffff26}.input-group{flex-direction:column;gap:.5rem;margin-bottom:1rem;display:flex}.input-label{color:var(--text-secondary);font-size:.875rem;font-weight:500}.input{border:1px solid var(--surface-border);border-radius:var(--radius-sm);color:var(--text-primary);transition:var(--transition);background:#0003;outline:none;padding:.75rem 1rem;font-size:1rem}.input:focus{border-color:var(--primary);box-shadow:0 0 0 2px #f59e0b33}.flex{display:flex}.flex-col{flex-direction:column;display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.w-full{width:100%}.h-full{height:100%}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.font-bold{font-weight:700}.text-secondary{color:var(--text-secondary)}.text-primary-color{color:var(--primary)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.4s ease-out forwards fadeIn}.app-layout{width:100vw;height:100vh;display:flex;overflow:hidden}.sidebar{z-index:10;flex-direction:column;align-items:center;gap:2rem;width:80px;padding:1.5rem 0;display:flex}.sidebar-item{width:48px;height:48px;color:var(--text-secondary);transition:var(--transition);cursor:pointer;border-radius:12px;justify-content:center;align-items:center;display:flex}.sidebar-item:hover{color:var(--text-primary);background:#ffffff1a}.sidebar-item.active{background:var(--primary);color:#fff;box-shadow:0 4px 12px #f59e0b66}.main-content{flex-direction:column;flex:1;display:flex;overflow:hidden}.topbar{border-bottom:1px solid var(--surface-border);justify-content:space-between;align-items:center;height:70px;padding:0 2rem;display:flex}.pos-layout{height:calc(100vh - 70px);display:flex;overflow:hidden}.pos-products-area{flex-direction:column;flex:1;padding:1.5rem;display:flex;overflow:hidden}.pos-cart-area{border-left:1px solid var(--surface-border);background:#0f172a66;flex-direction:column;width:380px;display:flex}.pos-cart-items{flex:1;padding:1rem;overflow-y:auto}.pos-cart-footer{border-top:1px solid var(--surface-border);background:#0003;padding:1.5rem}.category-tabs{-ms-overflow-style:none;scrollbar-width:none;gap:1rem;margin-bottom:1rem;padding-bottom:1rem;display:flex;overflow-x:auto}.category-tabs::-webkit-scrollbar{display:none}.category-tab{border:1px solid var(--surface-border);white-space:nowrap;cursor:pointer;transition:var(--transition);color:var(--text-secondary);background:#ffffff0d;border-radius:30px;padding:.75rem 1.5rem;font-weight:500}.category-tab:hover{color:var(--text-primary);background:#ffffff1a}.category-tab.active{background:var(--text-primary);color:var(--bg-color);border-color:var(--text-primary)}.product-card{border-radius:var(--radius);cursor:pointer;transition:var(--transition);border:1px solid var(--surface-border);background:#ffffff08;flex-direction:column;min-height:240px;display:flex;position:relative;overflow:hidden}.product-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:0 10px 25px -5px #0000004d}.product-image{object-fit:cover;width:100%;height:140px}.product-info{flex-direction:column;flex:1;justify-content:space-between;padding:.75rem;display:flex}.product-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.9rem;font-weight:600;display:-webkit-box;overflow:hidden}.product-price{color:var(--primary);font-weight:700}.cart-item{border-radius:var(--radius-sm);transition:var(--transition);background:#ffffff0d;border:1px solid #0000;justify-content:space-between;margin-bottom:.5rem;padding:1rem;display:flex}.cart-item:hover{background:#ffffff14;border-color:#ffffff1a}.qty-control{background:#0000004d;border-radius:20px;align-items:center;padding:.25rem;display:flex}.qty-btn{color:#fff;cursor:pointer;background:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.qty-btn:hover{background:var(--primary)}.qty-display{padding:0 .75rem;font-weight:600}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.z-\[100\]{z-index:100}.bg-black\/50{background-color:#00000080}.backdrop-blur-sm{-webkit-backdrop-filter:blur(4px)}.max-w-sm{max-width:24rem}.max-w-md{max-width:28rem}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.mx-auto{margin-left:auto;margin-right:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-auto{overflow-x:auto}.flex-1{flex:1}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-auto{margin-top:auto}.ml-auto{margin-left:auto}.mr-auto{margin-right:auto}.space-y-3>*+*{margin-top:.75rem}.space-y-4>*+*{margin-top:1rem}.space-y-6>*+*{margin-top:1.5rem}.min-w-\[300px\]{min-width:300px}.w-36{width:9rem}.text-xs{font-size:.75rem}.text-3xl{font-size:1.875rem}.hidden{display:none}.text-white{color:#fff}.bg-surface-color\/30{background-color:#1e293b4d}.bg-surface-color\/50{background-color:#1e293b80}.rounded-xl{border-radius:12px}.rounded-\[24px\]{border-radius:24px}.cursor-pointer{cursor:pointer}@media (width<=1024px){.grid-cols-5{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}.app-layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--surface-border);flex-direction:row;justify-content:flex-start;gap:1rem;width:100%;height:70px;padding:0 1rem;overflow-x:auto}.sidebar-item{flex-shrink:0;width:44px;height:44px}.sidebar>div:first-child{display:none}.sidebar .flex-col{flex-direction:row;align-items:center;gap:1rem;width:auto}.sidebar .mt-auto{margin-top:0;margin-bottom:0;margin-left:auto}.p-6{padding:1rem}.pos-layout{height:calc(100vh - 140px)}}@media (width<=768px){.grid-cols-5{grid-template-columns:repeat(3,minmax(0,1fr))}.pos-layout{flex-direction:column;height:calc(100vh - 140px);overflow:hidden}.pos-products-area{flex:none;height:50%;min-height:0;padding:1rem;overflow:hidden}.pos-cart-area{border-left:none;border-top:2px solid var(--primary);flex:none;width:100%;height:50%;min-height:0}}@media (width<=640px){.grid-cols-5{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4,.grid-cols-3,.grid-cols-2{grid-template-columns:repeat(1,minmax(0,1fr))}.pos-products-area{height:45%}.pos-cart-area{height:55%}.topbar{padding:0 1rem}.text-3xl{font-size:1.5rem}.text-2xl{font-size:1.25rem}.max-w-7xl{padding-bottom:2rem}}button{color:inherit;background:0 0;border:none;font-family:inherit}.icon-btn{border:1px solid var(--surface-border);color:var(--text-secondary);cursor:pointer;width:36px;height:36px;transition:var(--transition);background:#ffffff0d;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.icon-btn:hover{color:var(--text-primary);background:#ffffff26;transform:translateY(-2px);box-shadow:0 4px 12px #0003}.icon-btn.danger:hover{color:var(--danger);background:#ef444433;border-color:#ef44444d}.icon-btn.primary:hover{color:var(--primary);background:#f59e0b33;border-color:#f59e0b4d}