:root{--font-display: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--primary-hue: 35;--primary: hsl(var(--primary-hue), 95%, 52%);--primary-hover: hsl(var(--primary-hue), 95%, 45%);--primary-light: hsl(var(--primary-hue), 95%, 95%);--secondary: hsl(142, 70%, 45%);--secondary-hover: hsl(142, 70%, 38%);--background: hsl(210, 40%, 98%);--surface: hsl(0, 0%, 100%);--surface-hover: hsl(210, 40%, 96%);--surface-glass: rgba(255, 255, 255, .7);--text: hsl(220, 40%, 12%);--text-muted: hsl(218, 15%, 50%);--text-light: hsl(210, 10%, 98%);--border: hsl(214, 30%, 90%);--border-focus: var(--primary);--success: hsl(142, 76%, 36%);--danger: hsl(350, 89%, 60%);--warning: hsl(45, 93%, 47%);--info: hsl(200, 95%, 48%);--shadow-sm: 0 2px 4px rgba(0,0,0,.02), 0 1px 2px rgba(0,0,0,.03);--shadow-md: 0 10px 15px -3px rgba(0,0,0,.05), 0 4px 6px -2px rgba(0,0,0,.02);--shadow-lg: 0 20px 25px -5px rgba(0,0,0,.08), 0 10px 10px -5px rgba(0,0,0,.03);--shadow-glass: 0 8px 32px 0 rgba(0, 0, 0, .04);--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1);--sidebar-width: 260px;--sidebar-collapsed-width: 80px;--header-height: 70px}[data-theme=dark]{--background: hsl(222, 47%, 6%);--surface: hsl(222, 47%, 11%);--surface-hover: hsl(222, 47%, 15%);--surface-glass: rgba(15, 23, 42, .65);--text: hsl(210, 40%, 98%);--text-muted: hsl(215, 20%, 65%);--border: hsl(217, 30%, 18%);--shadow-sm: 0 2px 4px rgba(0,0,0,.2);--shadow-md: 0 10px 15px -3px rgba(0,0,0,.3);--shadow-lg: 0 20px 25px -5px rgba(0,0,0,.4);--shadow-glass: 0 8px 32px 0 rgba(0, 0, 0, .25);--primary-light: hsl(var(--primary-hue), 95%, 15%)}*{box-sizing:border-box;margin:0;padding:0;scrollbar-width:thin;scrollbar-color:var(--border) transparent}body{font-family:var(--font-sans);background-color:var(--background);color:var(--text);overflow-x:hidden;line-height:1.5;transition:background-color var(--transition-normal),color var(--transition-normal)}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;color:var(--text)}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}a{color:inherit;text-decoration:none}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.app-container{display:flex;min-height:100vh;width:100%;max-width:100%}.main-content{flex:0 0 auto;min-width:0;display:flex;flex-direction:column;min-height:100vh;width:calc(100% - var(--sidebar-width));max-width:calc(100% - var(--sidebar-width));transition:width var(--transition-normal),max-width var(--transition-normal);overflow-y:auto}.app-container.collapsed .main-content{width:calc(100% - var(--sidebar-collapsed-width));max-width:calc(100% - var(--sidebar-collapsed-width))}.workspace{flex:1;padding:24px;max-width:1600px;width:100%;margin:0 auto;animation:fadeIn var(--transition-slow)}.card-glass{background:var(--surface-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;box-shadow:var(--shadow-glass);transition:transform var(--transition-normal),box-shadow var(--transition-normal),background-color var(--transition-normal)}.card-glass:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-glass)}.grid{display:grid;gap:20px}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}@media (max-width: 1200px){.grid-cols-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.grid-cols-3,.grid-cols-2,.grid-cols-4{grid-template-columns:1fr}.main-content{margin-left:0!important}}.stat-card{display:flex;align-items:center;gap:16px}.stat-icon{width:50px;height:50px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;background-color:var(--primary-light);color:var(--primary);flex-shrink:0}.stat-icon.success{background-color:#10b9811a;color:var(--success)}.stat-icon.danger{background-color:#ef44441a;color:var(--danger)}.stat-icon.info{background-color:#3b82f61a;color:var(--info)}.stat-details h3{font-size:14px;color:var(--text-muted);font-weight:500;text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}.stat-details .value{font-size:26px;font-family:var(--font-display);font-weight:700}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;border-radius:var(--radius-sm);padding:10px 16px;border:1px solid transparent;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;font-family:var(--font-sans)}.btn-primary{background-color:var(--primary);color:var(--text-light)}.btn-primary:hover{background-color:var(--primary-hover)}.btn-secondary{background-color:var(--secondary);color:var(--text-light)}.btn-secondary:hover{background-color:var(--secondary-hover)}.btn-danger{background-color:var(--danger);color:var(--text-light)}.btn-danger:hover{background-color:#f10e34}.btn-ghost{background-color:transparent;border-color:var(--border);color:var(--text)}.btn-ghost:hover{background-color:var(--surface-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.form-group{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}.form-group label{font-size:13px;font-weight:500;color:var(--text-muted)}.input-control{width:100%;padding:10px 14px;background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none}.input-control:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px #f59e0b26}.table-container{overflow-x:auto;width:100%;border-radius:var(--radius-sm);border:1px solid var(--border)}.table{width:100%;border-collapse:collapse;text-align:left;background-color:var(--surface)}.table th,.table td{padding:14px 18px;border-bottom:1px solid var(--border);font-size:14px}.table th{background-color:var(--surface-hover);color:var(--text-muted);font-weight:600;text-transform:uppercase;font-size:11px;letter-spacing:.05em}.table tr:last-child td{border-bottom:none}.table tr:hover td{background-color:var(--surface-hover)}.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--radius-full);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.03em}.badge-success{background-color:#10b9811a;color:var(--success)}.badge-danger{background-color:#ef44441a;color:var(--danger)}.badge-warning{background-color:#f59e0b1a;color:var(--warning)}.badge-info{background-color:#3b82f61a;color:var(--info)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;display:flex;align-items:center;justify-content:center;animation:fadeIn .2s ease}.modal-content{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);width:90%;max-width:550px;padding:24px;box-shadow:var(--shadow-lg);position:relative;animation:slideUp .3s cubic-bezier(.34,1.56,.64,1);max-height:90vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:1px solid var(--border);padding-bottom:14px}.modal-close{background:none;border:none;cursor:pointer;color:var(--text-muted)}.modal-close:hover{color:var(--text)}.modal-footer{margin-top:24px;display:flex;justify-content:flex-end;gap:12px;border-top:1px solid var(--border);padding-top:16px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.main-content.pos-page-content{height:100vh;max-height:100vh;overflow:hidden}.pos-screen-wrapper{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0;height:calc(100vh - var(--header-height));max-height:calc(100vh - var(--header-height));padding:16px 24px;box-sizing:border-box;overflow:hidden}.pos-container{display:grid;grid-template-columns:1fr 400px;gap:20px;flex:1;min-width:0;min-height:0;height:100%}@media (max-width: 1024px){.pos-container{grid-template-columns:1fr}}.pos-catalog-panel{display:flex;flex-direction:column;gap:16px;height:100%;min-height:0}.pos-cart-panel{display:flex;flex-direction:column;height:100%;min-height:0;background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.pos-search-bar{display:flex;gap:12px;align-items:center;background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:4px 12px}.pos-search-bar input{border:none;background:transparent;padding:8px 0;width:100%;outline:none}.pos-categories{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}.pos-categories::-webkit-scrollbar{display:none}.pos-category-btn{padding:8px 16px;border-radius:var(--radius-full);background-color:var(--surface);border:1px solid var(--border);cursor:pointer;white-space:nowrap;font-size:13px;font-weight:500;transition:all var(--transition-fast)}.pos-category-btn.active{background-color:var(--primary);color:var(--text-light);border-color:var(--primary)}.pos-products-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));grid-auto-rows:max-content;gap:16px;overflow-y:auto;padding-right:4px;align-content:start}.pos-product-card{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:all var(--transition-fast)}.pos-product-card:hover{border-color:var(--primary);box-shadow:var(--shadow-md)}.pos-product-card .price{font-weight:700;color:var(--primary);font-size:16px;margin-top:8px}.pos-cart-header{padding:16px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.pos-cart-items{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}.pos-cart-item{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--border)}.pos-cart-item:last-child{border-bottom:none}.pos-cart-summary{padding:16px;background-color:var(--surface-hover);border-top:1px solid var(--border)}.pos-summary-row{display:flex;justify-content:space-between;margin-bottom:8px;font-size:14px}.pos-summary-row.total{font-weight:700;font-size:18px;border-top:1px solid var(--border);padding-top:10px;margin-top:10px;color:var(--primary)}.quantity-adjuster{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.quantity-adjuster button{background-color:var(--surface);border:none;padding:4px 8px;cursor:pointer}.quantity-adjuster button:hover{background-color:var(--surface-hover)}.quantity-adjuster span{padding:4px 10px;font-weight:600}.mobile-header{height:60px;background-color:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:fixed;top:0;left:0;right:0;z-index:90;box-shadow:var(--shadow-sm)}.hamburger-btn{background:none;border:none;cursor:pointer;color:var(--text);padding:6px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center}.hamburger-btn:hover{background-color:var(--surface-hover)}.mobile-brand-title{font-family:var(--font-display);font-weight:800;color:var(--primary);font-size:18px}.mobile-sidebar-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0006;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:95;animation:fadeIn .2s ease}@media (max-width: 768px){.navbar-container{display:none!important}.main-content{margin-left:0!important;flex:1 1 100%!important;flex-basis:100%!important;width:100%!important;max-width:100%!important;padding-top:60px!important}.workspace{padding:16px}.pos-screen-wrapper{height:calc(100vh - 60px)!important;max-height:calc(100vh - 60px)!important;padding:12px 16px!important}}
