#root,body,html{height:100%;margin:0;padding:0}body{background:#f7fafc;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.notification-center{position:relative}.notification-bell{background:#0000;border:none;cursor:pointer;font-size:24px;padding:8px;position:relative;transition:transform .2s}.notification-bell:hover{transform:scale(1.1)}.notification-bell .badge{align-items:center;background:#f44336;border-radius:50%;color:#fff;display:flex;font-size:12px;font-weight:700;height:18px;justify-content:center;min-width:18px;padding:2px 4px;position:absolute;right:4px;top:4px}.notification-panel{background:#fff;border-radius:8px;box-shadow:0 4px 16px #0003;display:flex;flex-direction:column;max-height:600px;max-width:90vw;min-width:30%;position:fixed;right:10%;top:30%;width:-webkit-fit-content;width:fit-content}.panel-header{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;padding:16px}.panel-header h3{font-size:18px;margin:0}.panel-header button{background:none;border:none;color:#666;cursor:pointer;font-size:20px;padding:4px 8px}.notifications-list{max-height:500px;overflow-y:auto}.notification-item{align-items:start;border-bottom:1px solid #f0f0f0;display:flex;justify-content:space-between;padding:16px;transition:background .2s}.notification-item:hover{background:#f9f9f9}.notification-item.unread{background:#e3f2fd}.notification-item.unread:hover{background:#bbdefb}.notification-content{flex:1 1}.type-badge{border-radius:4px;display:inline-block;font-size:11px;font-weight:600;margin-bottom:8px;padding:2px 8px;text-transform:uppercase}.type-badge.expiry_warning{background:#fff3cd;color:#856404}.type-badge.use_by_warning{background:#ffebee;color:#c62828}.type-badge.low_stock{background:#e1f5fe;color:#01579b}.notification-content p{color:#333;font-size:14px;margin:8px 0}.notification-content small{color:#999;font-size:12px}.notification-actions{display:flex;gap:8px;margin-left:12px}.delete-btn,.mark-read-btn{background:none;border:1px solid #ddd;border-radius:4px;cursor:pointer;font-size:16px;padding:4px 8px;transition:all .2s}.mark-read-btn:hover{background:#4caf50;border-color:#4caf50;color:#fff}.delete-btn:hover{background:#f44336;border-color:#f44336;color:#fff}.empty-state{color:#999;padding:40px 20px}.barcode-scanner-modal{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000bf;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.scanner-content{background:#fff;background:var(--color-white,#fff);border:3px solid #fef5dc;border:3px solid var(--color-cream,#fef5dc);border-radius:2rem;border-radius:var(--radius-xl,2rem);box-shadow:0 25px 50px -12px #00000040;box-shadow:var(--shadow-2xl,0 25px 50px -12px #00000040);max-height:90vh;max-width:500px;overflow-y:auto;padding:1.5rem;padding:var(--space-6,1.5rem);width:90%}.scanner-header{align-items:center;border-bottom:2px solid #fef5dc;border-bottom:2px solid var(--color-cream,#fef5dc);display:flex;justify-content:space-between;margin-bottom:1.25rem;margin-bottom:var(--space-5,1.25rem);padding-bottom:1rem;padding-bottom:var(--space-4,1rem)}.scanner-header h2{color:#2d7a3e;color:var(--color-primary-green,#2d7a3e);font-size:1.5rem;font-weight:700;margin:0}.close-btn{align-items:center;background:#f3f4f6;background:var(--color-gray-100,#f3f4f6);border:none;border-radius:.75rem;border-radius:var(--radius-md,.75rem);color:#374151;color:var(--color-gray-700,#374151);cursor:pointer;display:flex;font-size:1.5rem;height:40px;justify-content:center;line-height:1;padding:.5rem .75rem;padding:var(--space-2,.5rem) var(--space-3,.75rem);transition:all .15s ease;transition:all var(--transition-fast,.15s ease);width:40px}.close-btn:hover{background:#e5e7eb;background:var(--color-gray-200,#e5e7eb);color:#111827;color:var(--color-gray-900,#111827);transform:scale(1.05)}.start-scan-btn{background:#2d7a3e;background:var(--color-primary-green,#2d7a3e);border:none;border-radius:9999px;border-radius:var(--radius-full,9999px);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md,0 4px 6px -1px #0000001a);color:#fff;color:var(--color-white,#fff);cursor:pointer;font-size:1rem;font-weight:600;margin-top:1rem;margin-top:var(--space-4,1rem);padding:1rem 1.5rem;padding:var(--space-4,1rem) var(--space-6,1.5rem);transition:all .2s ease;transition:all var(--transition-base,.2s ease);width:100%}.start-scan-btn:hover{background:#1f5329;background:var(--color-primary-green-dark,#1f5329);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg,0 10px 15px -3px #0000001a);transform:translateY(-2px)}.start-scan-btn:active{transform:translateY(0)}.scanner-instructions{background:#fef5dc;background:var(--color-cream,#fef5dc);border-radius:1.25rem;border-radius:var(--radius-lg,1.25rem);margin:1rem 0;margin:var(--space-4,1rem) 0;padding:1.25rem;padding:var(--space-5,1.25rem);text-align:center}.scanner-instructions p{color:#374151;color:var(--color-gray-700,#374151);font-size:.95rem;line-height:1.6;margin:.5rem 0;margin:var(--space-2,.5rem) 0}#barcode-reader{border-radius:1.25rem;border-radius:var(--radius-lg,1.25rem);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md,0 4px 6px -1px #0000001a);margin:1.25rem 0;margin:var(--space-5,1.25rem) 0;overflow:hidden}.error-message{background:#fee2e2;border:1px solid #fecaca;border-radius:.75rem;border-radius:var(--radius-md,.75rem);color:#991b1b;font-size:.9rem;font-weight:500;margin:1rem 0;margin:var(--space-4,1rem) 0;padding:.75rem 1rem;padding:var(--space-3,.75rem) var(--space-4,1rem)}@media (max-width:768px){.scanner-content{border-radius:1.25rem;border-radius:var(--radius-lg,1.25rem);padding:1rem;padding:var(--space-4,1rem);width:95%}.scanner-header h2{font-size:1.25rem}.start-scan-btn{font-size:.95rem}}.scanner-content::-webkit-scrollbar{width:8px}.scanner-content::-webkit-scrollbar-track{background:#f3f4f6;background:var(--color-gray-100,#f3f4f6);border-radius:.375rem;border-radius:var(--radius-sm,.375rem)}.scanner-content::-webkit-scrollbar-thumb{background:#2d7a3e;background:var(--color-primary-green,#2d7a3e);border-radius:.375rem;border-radius:var(--radius-sm,.375rem)}.scanner-content::-webkit-scrollbar-thumb:hover{background:#1f5329;background:var(--color-primary-green-dark,#1f5329)}.product-scanner{align-items:center;box-sizing:border-box;display:flex;justify-content:center;margin:20px auto;max-width:920px;padding:0 12px;width:100%}.scan-button{background:var(--color-primary-green);border:none;border-radius:var(--radius-full);box-shadow:var(--shadow-lg);color:var(--color-white);cursor:pointer;flex:1 1;font-size:1.1rem;font-weight:700;max-width:480px;padding:var(--space-4) var(--space-6);transition:all var(--transition-base);width:100%}.loading{color:#666;padding:20px}.product-card{background:#f9f9f9;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-top:20px;padding:24px}.product-card h3{color:#4caf50;margin-bottom:16px}.product-image{border-radius:8px;display:block;margin:16px 0;max-height:200px;max-width:200px}.product-info{background:#fff;border-radius:8px;margin:20px 0;padding:16px}.product-info p{font-size:14px;margin:8px 0}.product-form{margin-top:24px}.form-group{margin-bottom:16px}.form-group label{color:#333;font-weight:500;margin-bottom:8px}.form-group input,.form-group select{border:1px solid #ddd;border-radius:4px;font-size:14px;padding:10px;width:100%}.add-button{background:#2196f3;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;margin-top:16px;padding:12px 32px;transition:background .3s;width:100%}.add-button:hover:not(:disabled){background:#1976d2}.add-button:disabled{background:#ccc;cursor:not-allowed}.voice-input{background:#f5f5f5;border-radius:8px;margin:20px 0;padding:20px}.voice-btn{background:#9c27b0;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;padding:12px 24px;transition:background .3s;width:100%}.voice-btn:hover:not(:disabled){background:#7b1fa2}.voice-btn:disabled{background:#ccc;cursor:not-allowed}.voice-btn.listening{animation:pulse 1.5s infinite;background:#f44336}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.transcript{background:#fff;border-left:4px solid #9c27b0;border-radius:4px;color:#333;font-style:italic;margin:16px 0;padding:12px}.voice-tips{color:#666;margin-top:12px;text-align:center}.voice-tips small{font-size:12px}.container{box-sizing:border-box;margin:0 auto;max-width:100%;padding:clamp(.75rem,4vw,1.25rem);width:100%}.card{background:var(--color-white);border:1px solid #0f172a08;border-radius:12px;border-radius:calc(var(--radius-lg, 12px));box-shadow:0 6px 18px #0f172a0f;box-shadow:var(--shadow-card,0 6px 18px #0f172a0f);padding:clamp(.75rem,4vw,1rem)}.card h2{color:var(--color-primary-green);font-size:clamp(1.15rem,6vw,1.25rem);font-weight:800;margin-bottom:.5rem}.ai-methods{align-items:stretch;display:flex;flex-direction:column;flex-wrap:nowrap;gap:.5rem;margin-bottom:.75rem}.ai-methods>*{flex:1 1 auto;min-width:0}.or-separator{color:#666;color:var(--color-gray-600,#666);font-size:.95rem;margin:.5rem 0;text-align:center}.form-field-wrapper{margin-bottom:.75rem;position:relative;width:100%}.autocomplete-dropdown{background:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);left:0;max-height:220px;overflow-y:auto;position:absolute;right:0;top:calc(100% + 6px);z-index:60}.autocomplete-item{background:#0000;border:none;color:var(--color-gray-900);cursor:pointer;font-weight:500;overflow:hidden;padding:.5rem .75rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;width:100%}.autocomplete-item:hover{background:#2d7a3e0f;color:var(--color-primary-green)}input[type=date],input[type=number],input[type=text],select{background:var(--color-white);border:1.5px solid var(--color-gray-200);border-radius:8px;border-radius:calc(var(--radius-md, 8px));box-sizing:border-box;color:var(--color-gray-900);font-size:.95rem;padding:.5rem .75rem;transition:all .18s ease;transition:all var(--transition-base,.18s ease);width:100%}input:focus,select:focus{border-color:var(--color-primary-green);box-shadow:0 0 0 3px #2d7a3e0f;outline:none}.add-button,.btn-primary,.scan-button,button[type=submit]{background:var(--color-primary-green);border:none;border-radius:999px;box-shadow:var(--shadow-md);color:var(--color-white);cursor:pointer;font-size:.95rem;font-weight:700;padding:.6rem .9rem;text-align:center;transition:all var(--transition-base);width:100%}.add-button:hover,.btn-primary:hover,.scan-button:hover,button[type=submit]:hover{background:#2f7a3a;background:var(--color-primary-green-dark,#2f7a3a);transform:translateY(-2px)}.back-button{background:#0000;border:1px solid var(--color-gray-200);border-radius:8px;border-radius:calc(var(--radius-md,8px));color:var(--color-gray-700);display:inline-flex;gap:.5rem;padding:.45rem .6rem;width:auto}.loading-spinner{color:var(--color-gray-700);font-size:.9rem;padding:.5rem 0}@media (min-width:720px){.container{max-width:900px;padding:1.5rem;padding:var(--space-6,1.5rem)}.card{padding:1.25rem;padding:var(--space-6,1.25rem)}.ai-methods{align-items:flex-start;flex-direction:row;gap:1rem;gap:var(--space-4,1rem)}.ai-methods>*{flex:1 1 280px;min-width:220px}.card h2{font-size:1.5rem;margin-bottom:1rem;margin-bottom:var(--space-4,1rem)}.add-button,.scan-button,button[type=submit]{font-size:1rem;padding:.75rem 1.25rem;padding:var(--space-3,.75rem) var(--space-5,1.25rem);width:auto}}@media (min-width:1024px){.card,.container{padding:2rem;padding:var(--space-8,2rem)}.ai-methods{gap:1.5rem;gap:var(--space-6,1.5rem)}.card h2{font-size:1.75rem}}.cooking-log{background:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a;margin:20px 0;padding:24px}.cooking-log h3{color:#ff5722;margin-top:0}.cooking-log .description{color:#666;margin-bottom:16px}.cooking-input{border:1px solid #ddd;border-radius:4px;font-family:inherit;font-size:14px;margin-bottom:12px;padding:12px;resize:vertical;width:100%}.cooking-input:focus{border-color:#ff5722;outline:none}.log-button{background:#ff5722;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;padding:12px 32px;transition:background .3s;width:100%}.log-button:hover:not(:disabled){background:#e64a19}.log-button:disabled{background:#ccc;cursor:not-allowed}.error-message{background:#ffebee;border-radius:4px;color:#c62828;margin:10px 0;padding:12px;text-align:center}.cooking-result{background:#e8f5e9;border-left:4px solid #4caf50;border-radius:8px;margin:20px 0;padding:16px}.cooking-result h4{color:#2e7d32;margin-top:0}.deducted-ingredients{margin-top:12px}.deducted-ingredients ul{margin:8px 0;padding-left:20px}.deducted-ingredients li{color:#333;margin:4px 0}.cooking-examples{background:#f5f5f5;border-radius:4px;margin-top:16px;padding:12px}.cooking-examples small{color:#666}.cooking-examples ul{margin:8px 0 0;padding-left:20px}.cooking-examples li{color:#666;font-size:13px;margin:4px 0}*{box-sizing:border-box;margin:0;padding:0}@font-face{font-display:swap;font-family:ElevenTwenty;font-style:normal;font-weight:400;src:url(/static/media/11.20___.6ca6a9f2887d21e006a8.TTF) format("truetype")}:root{--color-primary-green:#2d7a3e;--color-primary-green-dark:#1f5329;--color-secondary-yellow:#f4e4a6;--color-accent-yellow:#ffd966;--color-cream:#fef5dc;--color-light-green:#a8d5a3;--color-success:#10b981;--color-warning:#f59e0b;--color-danger:#ef4444;--color-expired:#ff6b6b;--color-white:#fff;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-700:#374151;--color-gray-900:#111827;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--radius-sm:0.375rem;--radius-md:0.75rem;--radius-lg:1.25rem;--radius-xl:2rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a;--shadow-card:0 8px 24px #2d7a3e1f;--transition-fast:150ms ease;--transition-base:200ms ease}html{font-size:16px}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(180deg,#f0f4f8,#d9e8e0);background-attachment:fixed;color:#111827;color:var(--color-gray-900);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;font-family:var(--font-display);line-height:1.6;min-height:100vh}.grocery-background{height:100%;left:0;overflow:hidden;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}.grocery-background:after,.grocery-background:before{background-repeat:no-repeat;background-size:contain;content:"";opacity:.4;position:absolute}.grocery-background:before{background:linear-gradient(135deg,#4a90e2,#5ca8f5);border-radius:20px 20px 40px 40px;bottom:-50px;height:350px;left:-80px;transform:rotate(-15deg);width:250px}.grocery-background:after{background:linear-gradient(135deg,#ff9f43,#ffa94d);border-radius:15px 15px 30px 30px;bottom:-30px;height:320px;right:-60px;transform:rotate(12deg);width:200px}.grocery-elements{height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}.floating-element{animation:float 6s ease-in-out infinite;opacity:.2;position:absolute}@keyframes float{0%,to{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-20px) rotate(5deg)}}.auth-container{align-items:center;display:flex;justify-content:center;min-height:100vh;overflow:hidden;padding:1rem;padding:var(--space-4);position:relative}.auth-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:2rem;border-radius:var(--radius-xl);box-shadow:0 8px 24px #2d7a3e1f;box-shadow:var(--shadow-card);max-width:420px;padding:2rem;padding:var(--space-8);position:relative;width:100%;z-index:1}.auth-header{margin-bottom:2rem;margin-bottom:var(--space-8);text-align:center}.auth-logo{font-size:4rem;margin-bottom:1rem;margin-bottom:var(--space-4)}.auth-header h1{font-size:clamp(2rem,2.5rem,5rem);font-weight:800;letter-spacing:-.02em;text-transform:uppercase}.auth-header h1,.auth-header h2{color:#2d7a3e;color:var(--color-primary-green);margin-bottom:.5rem;margin-bottom:var(--space-2)}.auth-header h2{font-size:1.5rem;font-weight:600}.auth-header p{color:#374151;color:var(--color-gray-700);font-size:.95rem}.auth-card form{display:flex;flex-direction:column;gap:1rem;gap:var(--space-4);margin-bottom:1.25rem;margin-bottom:var(--space-5)}.auth-card input[type=email],.auth-card input[type=password],.auth-card input[type=text]{background:#fff;background:var(--color-white);border:2px solid #e5e7eb;border:2px solid var(--color-gray-200);border-radius:9999px;border-radius:var(--radius-full);color:#2d7a3e;color:var(--color-primary-green);font-size:1rem;font-weight:500;padding:1rem 1.25rem;padding:var(--space-4) var(--space-5);transition:all .2s ease;transition:all var(--transition-base);width:100%}.auth-card input::placeholder{color:#2d7a3e;color:var(--color-primary-green);opacity:.7}.auth-card input:focus{border-color:#2d7a3e;border-color:var(--color-primary-green);box-shadow:0 0 0 3px #2d7a3e1a;outline:none}.auth-card .btn-primary,.auth-card button[type=submit]{background:#2d7a3e;background:var(--color-primary-green);border:none;border-radius:9999px;border-radius:var(--radius-full);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff;color:var(--color-white);cursor:pointer;font-size:1.1rem;font-weight:600;padding:1rem 1.5rem;padding:var(--space-4) var(--space-6);transition:all .2s ease;transition:all var(--transition-base);width:100%}.auth-card .btn-primary:hover,.auth-card button[type=submit]:hover{background:#1f5329;background:var(--color-primary-green-dark);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-2px)}.auth-card .btn-primary:active,.auth-card button[type=submit]:active{transform:translateY(0)}.auth-card p{color:#374151;color:var(--color-gray-700);font-size:.95rem;text-align:center}.auth-card a{color:#2d7a3e;color:var(--color-primary-green);font-weight:600;text-decoration:none;transition:color .15s ease;transition:color var(--transition-fast)}.auth-card a:hover{color:#1f5329;color:var(--color-primary-green-dark);text-decoration:underline}.forgot-password-btn{background:none;border:none;color:#2d7a3e;color:var(--color-primary-green);cursor:pointer;font-size:.95rem;font-weight:600;padding:0;transition:color .15s ease;transition:color var(--transition-fast)}.forgot-password-btn:hover{color:#1f5329;color:var(--color-primary-green-dark);text-decoration:underline}.alert{border-radius:.75rem;border-radius:var(--radius-md);font-size:.9rem;margin-bottom:1rem;margin-bottom:var(--space-4);padding:.75rem 1rem;padding:var(--space-3) var(--space-4)}.alert-error{background:#fee2e2;border:1px solid #fecaca;color:#991b1b}.alert-success{background:#d1fae5;border:1px solid #a7f3d0;color:#065f46}.app-container{background:#f9fafb;background:var(--color-gray-50);display:flex;min-height:100vh;position:relative}.sidebar{background:#f4e4a6;background:var(--color-secondary-yellow);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);height:100vh;left:0;overflow-y:auto;padding:1.5rem 1rem;padding:var(--space-6) var(--space-4);position:fixed;top:0;transition:transform .2s ease;transition:transform var(--transition-base);width:280px;z-index:100}.sidebar.collapsed{transform:translateX(-100%)}.sidebar-header{margin-bottom:1.5rem;margin-bottom:var(--space-6);padding:1rem;padding:var(--space-4);text-align:left}.sidebar-header h2{color:#2d7a3e;color:var(--color-primary-green);font-size:2rem;font-weight:800;margin-bottom:.5rem;margin-bottom:var(--space-2)}.sidebar-section{margin-bottom:1.5rem;margin-bottom:var(--space-6)}.sidebar-section h3{color:#2d7a3e;color:var(--color-primary-green);font-size:1.25rem;font-weight:700;margin-bottom:.75rem;margin-bottom:var(--space-3);padding:0 .5rem;padding:0 var(--space-2)}.sidebar-menu{list-style:none}.sidebar-menu li{margin-bottom:.5rem;margin-bottom:var(--space-2)}.sidebar-menu a,.sidebar-menu button{background:#0000;border:none;border-radius:.75rem;border-radius:var(--radius-md);color:#111827;color:var(--color-gray-900);cursor:pointer;display:block;font-size:1rem;font-weight:500;padding:.75rem 1rem;padding:var(--space-3) var(--space-4);text-align:left;text-decoration:none;transition:all .15s ease;transition:all var(--transition-fast);width:100%}.sidebar-menu a:hover,.sidebar-menu button:hover{background:#2d7a3e1a;color:#2d7a3e;color:var(--color-primary-green)}.sidebar-menu .active{background:#2d7a3e;background:var(--color-primary-green);color:#fff;color:var(--color-white);font-weight:600}.sidebar-menu button.logout-btn{color:#ef4444;color:var(--color-danger);font-weight:600}.sidebar-menu button.logout-btn:hover{background:#ef44441a}.menu-toggle{align-items:center;background:#2d7a3e;background:var(--color-primary-green);border:none;border-radius:.75rem;border-radius:var(--radius-md);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md);color:#fff;color:var(--color-white);cursor:pointer;display:flex;font-size:1.5rem;height:48px;justify-content:center;left:1rem;left:var(--space-4);line-height:1;padding:.75rem;padding:var(--space-3);position:fixed;top:1rem;top:var(--space-4);transition:all .2s ease;transition:all var(--transition-base);width:48px;z-index:101}.menu-toggle:hover{background:#1f5329;background:var(--color-primary-green-dark);transform:scale(1.05)}.sidebar-overlay{background:#00000080;display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:99}.sidebar-overlay.active{display:block}.main-content{flex:1 1;margin:0 auto;max-width:1200px;padding:1.5rem 1rem;padding:var(--space-6) var(--space-4);padding-bottom:100px;transition:margin-left .2s ease;transition:margin-left var(--transition-base);width:100%}.main-content.sidebar-open{margin-left:280px}.app-header{margin-bottom:2rem;margin-bottom:var(--space-8);margin-top:2rem;margin-top:var(--space-8);text-align:center}.app-title{font-size:clamp(5rem,5rem,10rem);font-weight:1000;letter-spacing:-.02em;margin-bottom:.5rem;margin-bottom:var(--space-2);text-shadow:2px 2px 4px #2d7a3e1a;text-transform:uppercase}.app-subtitle,.app-title{color:#2d7a3e;color:var(--color-primary-green)}.app-subtitle{font-size:1.25rem;font-weight:500}.category-grid{grid-gap:1.25rem;grid-gap:var(--space-5);display:grid;gap:1.25rem;gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-bottom:2rem;margin-bottom:var(--space-8);padding:0 .5rem;padding:0 var(--space-2)}.category-card{background:#fef5dc;background:var(--color-cream);border:3px solid #0000;border-radius:1.25rem;border-radius:var(--radius-lg);box-shadow:0 1px 2px 0 #0000000d;box-shadow:var(--shadow-sm);cursor:pointer;overflow:hidden;padding:1.25rem .75rem;padding:var(--space-5) var(--space-3);position:relative;text-align:center;transition:all .2s ease;transition:all var(--transition-base)}.category-card:before{background:#ffd966;background:var(--color-accent-yellow);border-radius:1.25rem;border-radius:var(--radius-lg);bottom:-5px;content:"";left:-5px;opacity:0;position:absolute;right:-5px;top:-5px;transition:opacity .2s ease;transition:opacity var(--transition-base);z-index:-1}.category-card:hover{box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-5px)}.category-card:hover:before{opacity:1}.category-card.active{border-color:#2d7a3e;border-color:var(--color-primary-green)}.category-card.active,.category-icon{background:#fff;background:var(--color-white)}.category-icon{align-items:center;border-radius:50%;box-shadow:0 1px 2px 0 #0000000d;box-shadow:var(--shadow-sm);display:flex;font-size:3.5rem;height:80px;justify-content:center;margin:0 auto .75rem;margin:0 auto var(--space-3);width:80px}.category-icon-img{display:block;height:48px;margin:0 auto;object-fit:contain;width:48px}@media (max-width:480px){.category-icon-img{height:36px;width:36px}}.category-name{color:#111827;color:var(--color-gray-900);font-size:.95rem;font-weight:700;line-height:1.3}.category-alert{align-items:center;background:#ef4444;border-radius:999px;box-shadow:0 2px 6px #0000001f;color:#fff;display:inline-flex;font-size:.75rem;font-weight:700;height:20px;justify-content:center;line-height:20px;min-width:20px;padding:0 6px;position:absolute;right:8px;top:8px;z-index:5}@media (max-width:480px){.category-alert{font-size:.65rem;height:18px;line-height:18px;min-width:18px;right:6px;top:6px}}.search-filters{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;gap:var(--space-4);margin-bottom:1.5rem;margin-bottom:var(--space-6)}.search-box{flex:1 1;min-width:200px;position:relative}.search-box input{background:#fff;background:var(--color-white);border:2px solid #e5e7eb;border:2px solid var(--color-gray-200);border-radius:9999px;border-radius:var(--radius-full);font-size:1rem;padding:.75rem 1.25rem;padding:var(--space-3) var(--space-5);padding-left:2.75rem;transition:all .2s ease;transition:all var(--transition-base);width:100%}.search-box input:focus{border-color:#2d7a3e;border-color:var(--color-primary-green);box-shadow:0 0 0 3px #2d7a3e1a;outline:none}.search-box:before{content:"🔍";font-size:1.25rem;left:1rem;position:absolute;top:50%;transform:translateY(-50%)}.filter-buttons{display:flex;flex-wrap:wrap;gap:.5rem;gap:var(--space-2)}.filter-btn{background:#fff;background:var(--color-white);border:2px solid #e5e7eb;border:2px solid var(--color-gray-200);border-radius:9999px;border-radius:var(--radius-full);color:#374151;color:var(--color-gray-700);cursor:pointer;font-size:.9rem;font-weight:600;padding:.5rem 1rem;padding:var(--space-2) var(--space-4);transition:all .15s ease;transition:all var(--transition-fast)}.filter-btn:hover{color:#2d7a3e;color:var(--color-primary-green)}.filter-btn.active,.filter-btn:hover{border-color:#2d7a3e;border-color:var(--color-primary-green)}.filter-btn.active{background:#2d7a3e;background:var(--color-primary-green);color:#fff;color:var(--color-white)}.table-container{background:#fff;background:var(--color-white);border-radius:1.25rem;border-radius:var(--radius-lg);box-shadow:0 8px 24px #2d7a3e1f;box-shadow:var(--shadow-card);margin-bottom:1.5rem;margin-bottom:var(--space-6);overflow:hidden}.table{border-collapse:collapse;width:100%}.table thead{background:#fef5dc;background:var(--color-cream)}.table th{border-bottom:2px solid #e5e7eb;border-bottom:2px solid var(--color-gray-200);color:#111827;color:var(--color-gray-900);font-size:.9rem;font-weight:700;letter-spacing:.05em;text-align:left;text-transform:uppercase}.table td,.table th{padding:1rem;padding:var(--space-4)}.table td{border-bottom:1px solid #f3f4f6;border-bottom:1px solid var(--color-gray-100);color:#374151;color:var(--color-gray-700);font-size:.95rem}.table tbody tr{transition:background-color .15s ease;transition:background-color var(--transition-fast)}.table tbody tr:hover{background:#f9fafb;background:var(--color-gray-50)}.table tbody tr:last-child td{border-bottom:none}.quantity-controls{align-items:center;display:flex;gap:.5rem;gap:var(--space-2)}.quantity-controls button{align-items:center;background:#2d7a3e;background:var(--color-primary-green);border:none;border-radius:.375rem;border-radius:var(--radius-sm);color:#fff;color:var(--color-white);cursor:pointer;display:flex;font-size:1.25rem;font-weight:700;height:32px;justify-content:center;line-height:1;transition:all .15s ease;transition:all var(--transition-fast);width:32px}.quantity-controls button:hover:not(:disabled){background:#1f5329;background:var(--color-primary-green-dark);transform:scale(1.05)}.quantity-controls button:disabled{cursor:not-allowed;opacity:.4}.quantity-controls span{color:#111827;color:var(--color-gray-900);font-weight:600;min-width:70px;text-align:center}.action-buttons{display:flex;flex-wrap:wrap;gap:.5rem;gap:var(--space-2)}.action-buttons button{background:#f3f4f6;background:var(--color-gray-100);border:none;border-radius:.375rem;border-radius:var(--radius-sm);color:#374151;color:var(--color-gray-700);cursor:pointer;font-size:.85rem;font-weight:600;padding:.5rem .75rem;padding:var(--space-2) var(--space-3);transition:all .15s ease;transition:all var(--transition-fast)}.action-buttons button:hover{background:#e5e7eb;background:var(--color-gray-200);transform:translateY(-1px)}.action-buttons .btn-primary{background:#ef4444;background:var(--color-danger);color:#fff;color:var(--color-white)}.action-buttons .btn-primary:hover{background:#dc2626}.status-badge{border-radius:9999px;border-radius:var(--radius-full);display:inline-block;font-size:.85rem;font-weight:600;padding:var(--space-1) var(--space-3);text-transform:capitalize}.status-good{background:#d1fae5;color:#065f46}.status-expiring-soon{background:#fed7aa;color:#92400e}.status-expired{background:#fee2e2;color:#991b1b}.status-no-expiry{background:#f3f4f6;background:var(--color-gray-100);color:#374151;color:var(--color-gray-700)}.bottom-tab-bar{align-items:center;background:#fff;background:var(--color-white);border-top:2px solid #f3f4f6;border-top:2px solid var(--color-gray-100);bottom:0;box-shadow:0 -4px 12px #0000001a;display:flex;justify-content:space-around;left:0;padding:.75rem 1rem;padding:var(--space-3) var(--space-4);position:fixed;right:0;z-index:50}.add-main-btn{background:#2d7a3e;background:var(--color-primary-green);border:none;border-radius:9999px;border-radius:var(--radius-full);box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);color:#fff;color:var(--color-white);cursor:pointer;flex:1 1;font-size:1.1rem;font-weight:700;max-width:300px;padding:1rem 1.5rem;padding:var(--space-4) var(--space-6);transition:all .2s ease;transition:all var(--transition-base)}.add-main-btn:hover{background:#1f5329;background:var(--color-primary-green-dark);box-shadow:0 12px 20px #2d7a3e4d;transform:translateY(-2px)}.btn{background:#fff;background:var(--color-white);border:2px solid #e5e7eb;border:2px solid var(--color-gray-200);border-radius:9999px;border-radius:var(--radius-full);color:#374151;color:var(--color-gray-700);cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1.25rem;padding:var(--space-3) var(--space-5);transition:all .2s ease;transition:all var(--transition-base)}.btn:hover{border-color:#2d7a3e;border-color:var(--color-primary-green);color:#2d7a3e;color:var(--color-primary-green);transform:translateY(-1px)}.btn-primary{background:#2d7a3e;background:var(--color-primary-green);border:none;color:#fff;color:var(--color-white)}.btn-primary:hover{background:#1f5329;background:var(--color-primary-green-dark);box-shadow:0 4px 6px -1px #0000001a;box-shadow:var(--shadow-md)}.btn:disabled{cursor:not-allowed;opacity:.5;transform:none}.form-group{margin-bottom:1.25rem;margin-bottom:var(--space-5)}.form-group label{color:#111827;color:var(--color-gray-900);display:block;font-size:.95rem;font-weight:600;margin-bottom:.5rem;margin-bottom:var(--space-2)}.form-group input,.form-group select,.form-group textarea{background:#fff;background:var(--color-white);border:2px solid #e5e7eb;border:2px solid var(--color-gray-200);border-radius:.75rem;border-radius:var(--radius-md);color:#111827;color:var(--color-gray-900);font-size:1rem;padding:.75rem 1rem;padding:var(--space-3) var(--space-4);transition:all .2s ease;transition:all var(--transition-base);width:100%}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#2d7a3e;border-color:var(--color-primary-green);box-shadow:0 0 0 3px #2d7a3e1a;outline:none}.shopping-list-section{background:#fef5dc;background:var(--color-cream);border-radius:1.25rem;border-radius:var(--radius-lg);box-shadow:0 8px 24px #2d7a3e1f;box-shadow:var(--shadow-card);margin-bottom:1.5rem;margin-bottom:var(--space-6);padding:1.5rem;padding:var(--space-6)}.shopping-list-section h3{color:#2d7a3e;color:var(--color-primary-green);font-size:1.5rem;font-weight:700;margin-bottom:1rem;margin-bottom:var(--space-4)}.shopping-actions{display:flex;flex-wrap:wrap;gap:.75rem;gap:var(--space-3);margin-top:1rem;margin-top:var(--space-4)}@media (max-width:768px){.app-title{font-size:2rem}.app-subtitle{font-size:1rem}.category-grid{gap:.75rem;gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.category-icon{font-size:2.5rem;height:60px;width:60px}.sidebar{width:280px}.main-content.sidebar-open{margin-left:0}.table-container{overflow-x:auto}.table{min-width:600px}.search-filters{flex-direction:column}.search-box{width:100%}}@media (min-width:769px){.sidebar{left:0;pointer-events:auto!important;position:fixed;top:0;transform:translateX(0)!important;visibility:visible!important}.main-content{margin-left:280px;margin-left:var(--sidebar-width,280px)}.menu-toggle,.sidebar-overlay{display:none!important}.menu-toggle{pointer-events:none!important;visibility:hidden!important}}.loading{color:#374151;color:var(--color-gray-700);padding:2rem;padding:var(--space-8);text-align:center}.loading:after{animation:loading 1.5s infinite;content:"..."}@keyframes loading{0%,20%{content:"."}40%{content:".."}60%,to{content:"..."}}.empty-state{color:#374151;color:var(--color-gray-700);padding:2rem;padding:var(--space-8);text-align:center}.empty-state-icon{font-size:4rem;opacity:.5}.empty-state p,.empty-state-icon{margin-bottom:1rem;margin-bottom:var(--space-4)}.empty-state p{font-size:1.1rem}.category-view-header{align-items:center;background:#fef5dc;background:var(--color-cream);border-radius:1.25rem;border-radius:var(--radius-lg);display:flex;gap:1rem;gap:var(--space-4);margin-bottom:1.5rem;margin-bottom:var(--space-6);padding:1.25rem;padding:var(--space-5)}.back-button{align-items:center;background:#2d7a3e;background:var(--color-primary-green);border:none;border-radius:.75rem;border-radius:var(--radius-md);color:#fff;color:var(--color-white);cursor:pointer;display:flex;font-size:1.5rem;height:48px;justify-content:center;line-height:1;padding:.75rem;padding:var(--space-3);transition:all .2s ease;transition:all var(--transition-base);width:48px}.back-button:hover{background:#1f5329;background:var(--color-primary-green-dark);transform:translateX(-2px)}.category-view-title{align-items:center;display:flex;flex:1 1;gap:.75rem;gap:var(--space-3)}.category-view-title h2{color:#2d7a3e;color:var(--color-primary-green);font-size:2rem;font-weight:700}.text-center{text-align:center}.mt-4{margin-top:1rem;margin-top:var(--space-4)}.mb-4{margin-bottom:1rem;margin-bottom:var(--space-4)}.mt-6{margin-top:1.5rem;margin-top:var(--space-6)}.mb-6{margin-bottom:1.5rem;margin-bottom:var(--space-6)}.hidden{display:none}.icon-action-grid{flex-wrap:wrap;gap:1rem;gap:var(--space-4);justify-content:center;padding:.5rem;padding:var(--space-2)}.icon-action,.icon-action-grid{align-items:center;display:flex}.icon-action{flex-direction:column;gap:.35rem;min-width:80px}.icon-btn{align-items:center;background:#fff;background:var(--color-white);border:2px solid #e5e7eb;border:2px solid var(--color-gray-200);border-radius:12px;box-shadow:0 1px 2px 0 #0000000d;box-shadow:var(--shadow-sm);cursor:pointer;display:inline-flex;height:64px;justify-content:center;padding:6px;transition:transform .15s ease,box-shadow .15s ease;transition:transform var(--transition-fast),box-shadow var(--transition-fast);width:64px}.icon-btn img{display:block;height:36px;object-fit:contain;width:36px}.icon-btn:hover:not(:disabled){box-shadow:0 10px 15px -3px #0000001a;box-shadow:var(--shadow-lg);transform:translateY(-4px)}.icon-label{color:#374151;color:var(--color-gray-700);font-size:.9rem;font-weight:700;line-height:1.1;text-align:center}@media (max-width:480px){.icon-action-grid{gap:.75rem;gap:var(--space-3)}.icon-btn{height:52px;width:52px}.icon-btn img{height:28px;width:28px}.icon-action{min-width:64px}}
/*# sourceMappingURL=main.8ddcd712.css.map*/