:root{--bg:#f8fafc;--bg-soft:#f1f5f9b3;--panel:#ffffffd9;--panel-strong:#fff;--text:#0f172a;--text-soft:#64748b;--border:#e2e8f0cc;--accent:#f59e0b;--accent-strong:#d97706;--accent-soft:#f59e0b1f;--accent-glow:#f59e0b66;--success:#10b981;--success-soft:#10b9811a;--warning:#f59e0b;--danger:#ef4444;--danger-soft:#ef44441a;--info:#f59e0b;--info-soft:#3b82f61a;--shadow-sm:0 1px 2px 0 #0000000d;--shadow:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--shadow-xl:0 25px 50px -12px #00000040;--shadow-accent:0 10px 15px -3px #f59e0b33;--font-body:"Inter", system-ui, -apple-system, sans-serif;--font-heading:"Outfit", "Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", Consolas, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:var(--font-body);color:var(--text);background:radial-gradient(at 0 0,#f59e0b0d 0,#0000 50%),radial-gradient(at 100% 0,#10b9810d 0,#0000 50%),#f8fafc}:root[data-theme=dark]{--bg:#020617;--bg-soft:#0f172ab3;--panel:#1e293bb3;--panel-strong:#0f172a;--text:#f8fafc;--text-soft:#94a3b8;--border:#33415580;--accent:#fbbf24;--accent-strong:#f59e0b;--accent-soft:#fbbf241a;--success:#34d399;--warning:#fbbf24;--danger:#f87171;--shadow:0 20px 25px -5px #0000004d, 0 8px 10px -6px #0000004d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:radial-gradient(at 0 0,#f59e0b1a 0,#0000 50%),radial-gradient(at 100% 0,#10b9811a 0,#0000 50%),#020617}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-body);color:var(--text);background:var(--bg);transition:all .3s;overflow-x:hidden}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes spin{to{transform:rotate(360deg)}}.animate-fade{animation:.5s cubic-bezier(.4,0,.2,1) forwards fadeIn}.animate-pulse-soft{animation:2s ease-in-out infinite pulseSoft}@keyframes pulseSoft{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.98)}}.custom-scrollbar::-webkit-scrollbar{width:12px;display:block}.custom-scrollbar::-webkit-scrollbar-track{background:#00000014;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--accent-strong);background-clip:content-box;border:3px solid #ffffff1a;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--accent)}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.glass-panel{background:var(--panel);-webkit-backdrop-filter:blur(20px)saturate(180%);border:1px solid #ffffff1a}:root[data-theme=dark] .glass-panel{background:#1e293b80;border:1px solid #ffffff0d}.auth-shell{background:var(--bg);grid-template-columns:1.1fr .9fr;align-items:center;gap:40px;min-height:100vh;padding:40px;display:grid}.app-shell{background:var(--bg);grid-template-columns:280px 1fr;min-height:100vh;display:grid}.workspace{padding:16px 32px 32px;overflow-y:auto}.sidebar{background:var(--panel-strong);border-right:1px solid var(--border);flex-direction:column;justify-content:space-between;height:100vh;padding:32px 24px;display:flex;position:sticky;top:0}.brand-lockup{align-items:center;gap:16px;margin-bottom:32px;display:flex}.brand-badge{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;display:flex;box-shadow:0 4px 12px #f59e0b4d}.brand-lockup h2{font-family:var(--font-heading);letter-spacing:-.02em;font-size:1.25rem;font-weight:700}.nav-link{color:var(--text-soft);cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:12px;width:100%;margin-bottom:4px;padding:12px 16px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-link:hover{background:var(--bg-soft);color:var(--text);transform:translate(4px)}.nav-link.active{background:var(--accent-soft);color:var(--accent-strong)}.panel{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow);border-radius:24px}.auth-card{justify-self:center;width:100%;max-width:480px;padding:48px}.auth-splash{color:#fff;background:#0f172a;border-radius:40px;flex-direction:column;justify-content:flex-end;height:calc(100vh - 80px);padding:60px;display:flex;position:relative;overflow:hidden}.auth-splash img{object-fit:cover;opacity:.6;width:100%;height:100%;position:absolute;top:0;left:0}.auth-splash-content{z-index:1;position:relative}h1,h2,h3{font-family:var(--font-heading);letter-spacing:-.02em;margin:0}p{margin:0;line-height:1.6}.field{flex-direction:column;gap:6px;display:flex}.field span{color:var(--text-soft);letter-spacing:.02em;font-size:.815rem;font-weight:700}.input,select,textarea{border:1px solid var(--border);background:var(--panel-strong);width:100%;color:var(--text);border-radius:12px;outline:none;padding:12px 16px;font-size:.95rem;transition:all .2s}.input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.input-shell{background:var(--panel-strong);border:1px solid var(--border);border-radius:14px;align-items:center;gap:12px;padding:0 16px;display:flex}.ghost-input{color:var(--text);background:0 0;border:none;outline:none;flex:1;padding:12px 0}.btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff;box-shadow:0 4px 12px #f59e0b33}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #f59e0b4d}.btn-secondary{background:var(--bg-soft);color:var(--text);border:1px solid var(--border)}.btn-ghost{color:var(--text-soft);background:0 0}.btn-ghost:hover{color:var(--text);background:var(--bg-soft)}.icon-btn{border:1px solid var(--border);background:var(--panel-strong);width:40px;height:40px;color:var(--text);cursor:pointer;border-radius:10px;place-items:center;transition:all .2s;display:grid}.icon-btn:hover{border-color:var(--accent);color:var(--accent-strong)}.metric-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;display:grid}.metric-card{flex-direction:column;gap:16px;padding:24px;display:flex}.metric-icon{background:var(--accent-soft);width:48px;height:48px;color:var(--accent-strong);border-radius:12px;justify-content:center;align-items:center;display:flex}.metric-value{font-size:2.25rem;font-weight:700;font-family:var(--font-heading)}.content-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;display:grid}.list-row{justify-content:space-between;align-items:center;padding:8px 0;display:flex}.thumb{object-fit:cover;border-radius:12px;width:48px;height:48px}.thumb.large{width:64px;height:64px}.pos-grid,.inventory-grid{grid-template-columns:1fr 400px;gap:32px;display:grid}.product-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;display:grid}.product-card{background:var(--panel-strong);border:1px solid var(--border);cursor:pointer;text-align:left;border-radius:20px;padding:12px;transition:all .3s cubic-bezier(.4,0,.2,1)}.product-card:hover{border-color:var(--accent);box-shadow:var(--shadow-xl);transform:translateY(-8px)}.product-image{aspect-ratio:1;object-fit:cover;border-radius:16px;width:100%;margin-bottom:12px}.stack{flex-direction:column;display:flex}.cluster{align-items:center;display:flex}.between{justify-content:space-between;align-items:center;display:flex}.wrap-row{flex-wrap:wrap}.justify-center{justify-content:center}.align-center{align-items:center}.grow{flex-grow:1}.p-1{padding:4px}.p-2{padding:8px}.p-3{padding:12px}.p-4{padding:16px}.p-5{padding:20px}.p-6{padding:24px}.p-8{padding:32px}.p-10{padding:40px}.p-12{padding:48px}.pt-4{padding-top:16px}.grid{display:grid}.cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}@media (width>=768px){.md-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=1024px){.lg-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.lg-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}}.pb-4{padding-bottom:16px}.m-0{margin:0}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-5{margin-top:20px}.mt-6{margin-top:24px}.mt-auto{margin-top:auto}.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.ml-1{margin-left:4px}.ml-2{margin-left:8px}.mr-1{margin-right:4px}.mr-2{margin-right:8px}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-5{gap:24px}.gap-6{gap:32px}.muted{color:var(--text-soft)}.small{font-size:.8125rem}.eyebrow{text-transform:uppercase;letter-spacing:.1em;color:var(--accent-strong);font-size:.75rem;font-weight:700}.pill{border-radius:999px;padding:4px 12px;font-size:.75rem;font-weight:600}.pill.success{color:#065f46;background:#d1fae5}.pill.warning{color:#9a3412;background:#ffedd5}.pill.neutral{color:#475569;background:#f1f5f9}.qty-box{background:var(--bg-soft);border-radius:10px;align-items:center;gap:12px;padding:4px 8px;display:flex}.qty-btn{background:var(--panel-strong);border:1px solid var(--border);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;font-weight:700;transition:all .2s;display:flex}.qty-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.bill-summary{border-top:1px dashed var(--border);padding-top:20px}.total-line{color:var(--accent-strong);letter-spacing:-.03em;font-size:1.5rem;font-weight:800}.quick-action-card{background:var(--panel-strong);border:1px solid var(--border);cursor:pointer;text-align:center;border-radius:16px;flex-direction:column;align-items:center;gap:8px;padding:16px;transition:all .2s;display:flex}.quick-action-card:hover{background:var(--accent-soft);border-color:var(--accent);transform:translateY(-4px)}.quick-action-icon{background:var(--bg-soft);width:40px;height:40px;color:var(--accent-strong);border-radius:12px;justify-content:center;align-items:center;display:flex}.progress-track{background:var(--bg-soft);border-radius:999px;height:8px;overflow:hidden}.progress-bar{background:linear-gradient(90deg, var(--accent), var(--accent-strong));border-radius:999px;height:100%;transition:width 1s cubic-bezier(.4,0,.2,1)}.inventory-meta{align-items:center;gap:24px;display:flex}.sticky-panel{max-height:calc(100vh - 64px);position:sticky;top:32px;overflow-y:auto}.notice-banner{border:1px solid #0000;border-radius:16px;align-items:center;gap:12px;margin-bottom:24px;padding:16px 24px;font-weight:500;display:flex}.notice-banner.success{color:#065f46;background:#ecfdf5;border-color:#10b981}.notice-banner.error{color:#991b1b;background:#fef2f2;border-color:#ef4444}.notice-banner.warning{color:#92400e;background:#fffbeb;border-color:#f59e0b}.loading-state{flex-direction:column;justify-content:center;align-items:center;padding:100px 0;display:flex}.spinner{border:4px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@media (width<=1200px){.auth-shell{grid-template-columns:1fr}.auth-splash{display:none}.pos-grid,.inventory-grid{grid-template-columns:1fr}.app-shell{grid-template-columns:80px 1fr}.sidebar span,.sidebar h2,.sidebar p,.sidebar .role-banner{display:none}}.professional-table{border-collapse:collapse;text-align:left;table-layout:auto;width:100%}.professional-table th{background:var(--bg-soft);color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);padding:20px 16px;font-size:.75rem;font-weight:700}.professional-table td{border-bottom:1px solid var(--border);padding:16px;transition:all .2s}.table-row-hover:hover td{background:var(--bg-soft)}.icon-btn.ghost{color:var(--text-soft);background:0 0;border:1px solid #0000}.icon-btn.hover-accent:hover{background:var(--accent-soft);color:var(--accent-strong);border-color:#f59e0b33}.icon-btn.hover-danger:hover{background:var(--danger-soft);color:var(--danger);border-color:#ef444433}.animate-slide{animation:.4s forwards slideIn}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.table-row-hover{transition:all .2s}.table-row-hover:hover{background:var(--bg-soft)}.pill.success-soft{background:var(--success-soft);color:var(--success)}.pill.warning-soft{background:var(--warning-soft);color:var(--warning);border:1px solid #f59e0b33}.pill.danger-soft{background:var(--danger-soft);color:var(--danger);border:1px solid #ef444433}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.grid-12{grid-template-columns:repeat(12,1fr);display:grid}.grid-colspan-1{grid-column:span 1/span 1}.grid-colspan-2{grid-column:span 2/span 2}.grid-colspan-3{grid-column:span 3/span 3}.grid-colspan-4{grid-column:span 4/span 4}.grid-colspan-5{grid-column:span 5/span 5}.grid-colspan-6{grid-column:span 6/span 6}.grid-colspan-7{grid-column:span 7/span 7}.grid-colspan-8{grid-column:span 8/span 8}.grid-colspan-9{grid-column:span 9/span 9}.grid-colspan-10{grid-column:span 10/span 10}.grid-colspan-11{grid-column:span 11/span 11}.grid-colspan-12{grid-column:span 12/span 12}.input-with-icon{background:var(--panel-strong);border:1px solid var(--border);border-radius:12px;align-items:center;gap:12px;padding:0 16px;display:flex}.input-with-icon .input{background:0 0;border:none;flex:1;padding:12px 0}.density-compact th{padding:10px 12px!important;font-size:.725rem!important}.density-compact td{padding:8px 12px!important;font-size:.825rem!important}
