:root{--baltic: #22577a;--baltic-light: #2d6d99;--baltic-dark: #1a4560;--teal: #38a3a5;--teal-light: #4bbcbe;--teal-dark: #2e8a8c;--emerald: #57cc99;--emerald-light: #6fd9aa;--emerald-dark: #44b584;--green-light: #80ed99;--tea: #c7f9cc;--tea-muted: #e4fceb;--primary: var(--teal);--primary-dark: var(--teal-dark);--primary-light: var(--teal-light);--accent: var(--emerald);--accent-dark: var(--emerald-dark);--success: #16a34a;--warning: #38a3a5;--danger: #ef4444;--danger-dark: #dc2626;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-600: #475569;--gray-700: #334155;--gray-800: #1e293b;--gray-900: #0f172a;--bg-body: #f0fdf4;--bg-card: rgba(255, 255, 255, .8);--bg-glass: rgba(255, 255, 255, .55);--bg-sidebar: linear-gradient(180deg, var(--baltic) 0%, var(--baltic-dark) 100%);--radius: 12px;--radius-lg: 16px;--radius-xl: 20px;--shadow-sm: 0 1px 2px rgba(34, 87, 122, .06);--shadow: 0 1px 3px rgba(34, 87, 122, .08), 0 4px 12px rgba(34, 87, 122, .04);--shadow-md: 0 4px 16px rgba(34, 87, 122, .1), 0 1px 4px rgba(34, 87, 122, .06);--shadow-lg: 0 8px 30px rgba(34, 87, 122, .12), 0 2px 8px rgba(34, 87, 122, .06);--shadow-glow: 0 0 20px rgba(56, 163, 165, .15);--transition: .2s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--gray-800);background:var(--bg-body);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 1px 1px,rgba(34,87,122,.03) 1px,transparent 0);background-size:24px 24px;pointer-events:none;z-index:0}button{cursor:pointer;font:inherit;border:none;border-radius:var(--radius);padding:.5rem 1.125rem;font-weight:600;font-size:.875rem;letter-spacing:.01em;transition:all var(--transition);position:relative;overflow:hidden}button:disabled{opacity:.5;cursor:not-allowed}button:active:not(:disabled){transform:scale(.97)}.btn-primary{background:linear-gradient(135deg,var(--teal),var(--teal-dark));color:#fff;box-shadow:0 2px 8px #38a3a54d}.btn-primary:hover:not(:disabled){box-shadow:0 4px 16px #38a3a566;transform:translateY(-1px)}.btn-success{background:linear-gradient(135deg,var(--emerald),var(--emerald-dark));color:#fff;box-shadow:0 2px 8px #57cc994d}.btn-success:hover:not(:disabled){box-shadow:0 4px 16px #57cc9966;transform:translateY(-1px)}.btn-danger{background:linear-gradient(135deg,var(--danger),var(--danger-dark));color:#fff;box-shadow:0 2px 8px #ef44444d}.btn-danger:hover:not(:disabled){box-shadow:0 4px 16px #ef444466;transform:translateY(-1px)}.btn-warning{background:linear-gradient(135deg,var(--baltic),#1a4560);color:#fff;box-shadow:0 2px 8px #22577a4d}.btn-warning:hover:not(:disabled){box-shadow:0 4px 16px #22577a66;transform:translateY(-1px)}.btn-outline{background:var(--bg-glass);color:var(--gray-700);border:1px solid var(--gray-200);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.btn-outline:hover:not(:disabled){background:#fff;border-color:var(--teal);color:var(--teal);box-shadow:0 2px 8px #38a3a51a}.btn-sm{padding:.375rem .75rem;font-size:.8125rem;border-radius:8px}.btn-lg{padding:.875rem 1.75rem;font-size:1.05rem;font-weight:700;border-radius:var(--radius-lg)}.btn-icon{display:inline-flex;align-items:center;gap:.375rem}input,select,textarea{font:inherit;padding:.625rem .875rem;border:1.5px solid var(--gray-200);border-radius:var(--radius);width:100%;background:#ffffffe6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--gray-800);font-size:.9375rem;transition:all var(--transition)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px #38a3a526,var(--shadow-sm);background:#fff}input::placeholder{color:var(--gray-400)}select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;padding-right:2.25rem}.card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1.25rem;transition:all var(--transition)}.card:hover{box-shadow:var(--shadow-md)}.badge{display:inline-flex;align-items:center;padding:.2rem .625rem;border-radius:9999px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.badge-pending{background:#8b5cf61f;color:#6d28d9}.badge-delivered{background:#38a3a51f;color:var(--teal-dark)}.badge-closed{background:#57cc9926;color:var(--emerald-dark)}.badge-cancelled{background:#fee2e2;color:#991b1b}.page{padding:1.25rem;max-width:1200px;margin:0 auto;position:relative;z-index:1}.page-title{font-size:1.5rem;font-weight:800;margin-bottom:1rem;color:var(--baltic);letter-spacing:-.02em}.form-group{margin-bottom:1rem}.form-group label{display:block;font-size:.8125rem;font-weight:600;color:var(--gray-600);margin-bottom:.375rem;letter-spacing:.01em}.form-error{color:var(--danger);font-size:.8rem;margin-top:.25rem}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.grid-3{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:.75rem}.flex-between{display:flex;justify-content:space-between;align-items:center}.text-muted{color:var(--gray-500);font-size:.875rem}.text-right{text-align:right}.text-center{text-align:center}.text-lg{font-size:1.25rem}.text-xl{font-size:1.5rem}.font-bold{font-weight:700}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.gap-1{gap:.5rem}.gap-05{gap:.25rem}.empty-state{text-align:center;padding:3rem 1rem;color:var(--gray-400);font-size:.95rem}.loading{text-align:center;padding:3rem;color:var(--teal);font-weight:500}.table-wrap{overflow-x:auto;background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:var(--radius-lg);box-shadow:var(--shadow)}table{width:100%;border-collapse:collapse}th,td{padding:.75rem 1rem;text-align:left}th{font-size:.7rem;font-weight:700;color:var(--gray-500);text-transform:uppercase;letter-spacing:.06em;background:#22577a08;border-bottom:1.5px solid var(--gray-200)}td{border-bottom:1px solid var(--gray-100);font-size:.9rem}tr:last-child td{border-bottom:none}tr:hover td{background:#38a3a50a}.filter-bar{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;align-items:center}.filter-bar input,.filter-bar select{width:auto;min-width:180px;padding:.5rem .75rem;font-size:.875rem}.filter-bar select{padding-right:2.25rem}.filter-bar .search-input{flex:1;min-width:200px;max-width:320px}.stat-card{display:flex;align-items:center;gap:.75rem;transition:all var(--transition)}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.show-mobile-only{display:none}@media (max-width: 640px){.filter-bar{flex-direction:column}.filter-bar input,.filter-bar select,.filter-bar .search-input{width:100%;max-width:none;min-width:0}.hide-mobile{display:none!important}.show-mobile-only{display:block}}@media (max-width: 480px){.page{padding:.5rem}.page-title{font-size:1.25rem}.card{padding:.75rem}th,td{padding:.5rem;font-size:.8rem}th{font-size:.65rem}.hide-mobile-sm{display:none!important}.filter-bar{gap:.35rem}.btn-sm{padding:.3rem .5rem;font-size:.75rem}}.product-card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1rem;transition:all var(--transition);-webkit-tap-highlight-color:transparent}.product-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.product-card.out-of-stock{opacity:.45;pointer-events:none}.qty-btn{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700;border:none;cursor:pointer;transition:all var(--transition);-webkit-tap-highlight-color:transparent}.qty-btn:active{transform:scale(.9)}.qty-btn-add{background:linear-gradient(135deg,var(--emerald),var(--emerald-dark));color:#fff;box-shadow:0 2px 8px #57cc9959}.qty-btn-add:hover{box-shadow:0 4px 12px #57cc9980}.qty-btn-remove{background:var(--gray-100);color:var(--gray-700)}.qty-btn-remove:hover{background:var(--gray-200)}.add-btn{display:flex;align-items:center;gap:.3rem;background:linear-gradient(135deg,var(--emerald),var(--teal));color:#fff;border:none;border-radius:9999px;padding:.5rem 1rem;font-size:.9rem;font-weight:600;cursor:pointer;transition:all var(--transition);-webkit-tap-highlight-color:transparent;white-space:nowrap;box-shadow:0 2px 8px #57cc994d}.add-btn:hover:not(:disabled){box-shadow:0 4px 16px #57cc9973;transform:translateY(-1px)}.add-btn:active:not(:disabled){transform:scale(.95)}.add-btn:disabled{opacity:.4;cursor:not-allowed}.cat-scroll{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.75rem;margin-bottom:.5rem;-webkit-overflow-scrolling:touch;scrollbar-width:none}.cat-scroll::-webkit-scrollbar{display:none}.cat-chip{display:flex;align-items:center;gap:.375rem;padding:.5rem .875rem;border-radius:9999px;font-size:.8125rem;font-weight:600;white-space:nowrap;border:1.5px solid var(--gray-200);background:#ffffffd9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--gray-600);cursor:pointer;transition:all var(--transition);-webkit-tap-highlight-color:transparent;flex-shrink:0}.cat-chip:hover{border-color:var(--teal-light);color:var(--teal)}.cat-chip.active{background:linear-gradient(135deg,var(--teal),var(--baltic));color:#fff;border-color:transparent;box-shadow:0 2px 8px #38a3a559}.cat-pill{padding:.5rem 1.125rem;border-radius:9999px;font-size:.875rem;font-weight:600;white-space:nowrap;border:2px solid var(--gray-200);background:#fffc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--gray-600);cursor:pointer;transition:all var(--transition);-webkit-tap-highlight-color:transparent}.cat-pill:hover{border-color:var(--teal-light);color:var(--teal)}.cat-pill.active{background:linear-gradient(135deg,var(--teal),var(--baltic));color:#fff;border-color:transparent;box-shadow:0 2px 8px #38a3a559}.customer-banner{background:linear-gradient(135deg,var(--baltic),var(--teal-dark));color:#fff;padding:.625rem 1rem;display:flex;justify-content:space-between;align-items:center}.customer-banner .customer-name{font-weight:700;font-size:.95rem}.customer-banner .customer-phone{font-size:.8rem;opacity:.85}.floating-cart{position:fixed;bottom:60px;left:.75rem;right:.75rem;background:linear-gradient(135deg,var(--baltic),var(--baltic-dark));color:#fff;border-radius:var(--radius-xl);padding:1rem 1.25rem;display:flex;justify-content:space-between;align-items:center;z-index:9;box-shadow:0 8px 32px #22577a66;cursor:pointer;-webkit-tap-highlight-color:transparent;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes addedFlash{0%{box-shadow:var(--shadow)}50%{box-shadow:0 0 0 3px var(--emerald),var(--shadow-md)}to{box-shadow:var(--shadow)}}.product-card.just-added{animation:addedFlash .4s ease}.total-card{background:linear-gradient(135deg,var(--teal),var(--emerald));color:#fff;border-radius:var(--radius-xl);padding:1.75rem;text-align:center;box-shadow:0 8px 32px #38a3a54d}.total-card .amount{font-size:3rem;font-weight:800;line-height:1.1}.total-card .label{font-size:.95rem;opacity:.9;margin-top:.25rem}.order-card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1rem;border-left:4px solid var(--gray-200)}.order-card.status-pending{border-left-color:#8b5cf6;background:#8b5cf60d}.order-card.status-delivered{border-left-color:var(--teal)}.order-card.status-closed{border-left-color:var(--emerald)}.order-card.status-cancelled{border-left-color:var(--danger)}.identify-container{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;padding-top:0;background:linear-gradient(160deg,var(--baltic) 0%,var(--teal-dark) 40%,var(--emerald) 100%);position:relative;overflow:hidden}.identify-container:before{content:"";position:absolute;top:-20%;right:-10%;width:500px;height:500px;border-radius:50%;background:#80ed9926;filter:blur(80px)}.identify-container:after{content:"";position:absolute;bottom:-15%;left:-10%;width:400px;height:400px;border-radius:50%;background:#38a3a533;filter:blur(60px)}.identify-card{width:100%;max-width:400px;background:#ffffffe6;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5);border-radius:var(--radius-xl);box-shadow:0 8px 40px #22577a33;padding:2.25rem 1.75rem;position:relative;z-index:1}.identify-logo{text-align:center;margin:-3rem 0 -1.5rem}.identify-logo img{height:240px}@media (max-height: 700px){.identify-logo{margin:-2rem 0 -1.5rem}.identify-logo img{height:160px}}.identify-card h1{font-size:1.75rem;font-weight:800;text-align:center;margin-bottom:.25rem;background:linear-gradient(135deg,var(--baltic),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.identify-card .subtitle{text-align:center;color:var(--gray-500);margin-bottom:1.5rem;font-size:.95rem}.identify-card input{padding:.875rem 1rem;font-size:1.05rem;border-radius:var(--radius)}@media (max-width: 640px){.page{padding:.75rem}.grid-2,.grid-3{grid-template-columns:1fr}}@media (max-width: 480px){.product-card{padding:.875rem}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}