@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}html,body{height:100%;width:100%;background-color:#f2f2f2;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column}a{text-decoration:none;color:inherit}ul{list-style:none}html{scroll-behavior:smooth}button{border:none;outline:none;cursor:pointer;font-family:inherit}.navbar{display:flex;justify-content:space-between;align-items:center;padding:16px 40px;background:#fff;box-shadow:0 2px 6px #00000014;position:sticky;top:0;z-index:100}.navbar img{height:48px;cursor:pointer}.navbar-menu{display:flex;gap:28px;list-style:none}.navbar-menu li{font-size:16px;font-weight:500;text-transform:capitalize;color:#333;cursor:pointer;transition:all .2s ease;position:relative}.navbar-menu li:after{content:"";position:absolute;width:0%;height:2px;background:#ff4d30;left:0;bottom:-4px;transition:width .3s ease-in-out}.navbar-menu li:hover:after{width:100%}.navbar-menu li.active{color:#ff4d30;font-weight:600}.navbar-menu li.active:after{width:100%}.navbar-right{display:flex;align-items:center;gap:20px}.navbar-right img{height:22px;width:22px;cursor:pointer}.navbar-search-icon{position:relative}.navbar-search-icon .dot{position:absolute;top:-4px;right:-4px;height:8px;width:8px;background:red;border-radius:50%}.navbar-right button{background:#ff4d30;color:#fff;border:none;outline:none;padding:8px 20px;border-radius:25px;font-size:15px;font-weight:500;cursor:pointer;transition:background .2s ease-in-out,transform .2s ease}.navbar-right button:hover{background:#e63f25;transform:translateY(-2px)}@media (max-width: 900px){.navbar-menu{gap:18px}}@media (max-width: 768px){.navbar{flex-direction:column;gap:16px;padding:16px 20px}.navbar-menu{flex-wrap:wrap;justify-content:center;gap:16px}.navbar-right{gap:16px}}.navbar-profile{position:relative;display:inline-block;cursor:pointer}.navbar-profile img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #ddd;transition:all .3s ease}.navbar-profile img:hover{border-color:#ff4c24}.navbar-profile ul{position:absolute;top:50px;right:0;background:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;list-style:none;padding:10px 0;margin:0;width:160px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .3s ease;z-index:1000}.navbar-profile:hover ul{opacity:1;visibility:visible;transform:translateY(0)}.navbar-profile ul li{display:flex;align-items:center;gap:10px;padding:10px 15px;font-size:14px;color:#333;cursor:pointer;transition:background .2s ease}.navbar-profile ul li img{width:18px;height:18px}.navbar-profile ul li:hover{background:#f6f6f6}.navbar-profile ul hr{margin:5px 0;border:none;height:1px;background:#eee}button{background:#ff4c24;color:#fff;padding:8px 18px;border-radius:20px;border:none;font-size:14px;cursor:pointer;transition:background .3s ease}button:hover{background:#e64320}.header{height:70vh;margin:30px auto;background:url(/header_img.png) center center no-repeat;background-size:cover;position:relative;border-radius:12px;overflow:hidden}.header:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;background:#00000059}.header-contents{position:absolute;display:flex;flex-direction:column;align-items:flex-start;gap:1.2rem;max-width:50%;bottom:12%;left:6vw;z-index:2;color:#fff;opacity:0;animation:fadeInUp 1.2s ease-out forwards}.header-contents h1{font-size:2.8rem;font-weight:700;line-height:1.2}.header-contents p{font-size:1rem;font-weight:400;opacity:.9;max-width:90%}.header-contents button{background:#ff4d30;color:#fff;padding:10px 22px;border:none;border-radius:25px;font-size:1rem;font-weight:500;cursor:pointer;transition:background .2s ease-in-out,transform .2s ease}.header-contents button:hover{background:#e63f25;transform:translateY(-2px)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 992px){.header-contents{max-width:70%}.header-contents h1{font-size:2.2rem}}@media (max-width: 768px){.header{height:55vh}.header-contents{max-width:80%;bottom:8%}.header-contents h1{font-size:1.8rem}.header-contents p{font-size:.9rem}}@media (max-width: 480px){.header{height:45vh}.header-contents{max-width:90%;left:5%;gap:.8rem}.header-contents h1{font-size:1.4rem}.header-contents p{font-size:.8rem}.header-contents button{padding:8px 16px;font-size:.85rem}}.explore-menu{padding:50px 8%;text-align:center}.explore-menu h1{font-size:2rem;font-weight:700;margin-bottom:10px;color:#333;text-transform:capitalize}.explore-menu-text{font-size:1rem;color:#666;margin-bottom:30px}.menu-list{display:flex;gap:20px;overflow-x:auto;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:#ff4d30 #f1f1f1}.menu-list-items{flex:0 0 auto;text-align:center;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.menu-list-items:hover{transform:translateY(-5px)}.menu-list-items img{width:100px;height:100px;object-fit:contain;border-radius:50%;padding:10px;background:#fff;box-shadow:0 4px 10px #00000014;transition:all .3s ease}.menu-list-items img.active{border:3px solid #ff4d30;background:#ffeae6;transform:scale(1.1)}.menu-list-items p{margin-top:10px;font-size:1rem;font-weight:500;color:#333;text-transform:capitalize}.menu-list::-webkit-scrollbar{height:8px}.menu-list::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.menu-list::-webkit-scrollbar-thumb{background:#ff4d30;border-radius:10px}.menu-list::-webkit-scrollbar-thumb:hover{background:#e63f25}@media (max-width: 768px){.explore-menu{padding:40px 5%}.explore-menu h1{font-size:1.6rem}.menu-list-items img{width:80px;height:80px}.menu-list-items p{font-size:.9rem}}@media (max-width: 480px){.explore-menu h1{font-size:1.3rem}.menu-list-items img{width:65px;height:65px}.menu-list-items p{font-size:.8rem}}.food-display{padding:50px 8%;background:#f9f9f9}.food-display h2{font-size:2rem;font-weight:700;color:#333;margin-bottom:30px;text-align:center}.food-display-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:25px;justify-items:center}@media (max-width: 1024px){.food-display{padding:40px 6%}.food-display h2{font-size:1.8rem;margin-bottom:25px}.food-display-list{gap:20px}}@media (max-width: 768px){.food-display{padding:30px 5%}.food-display h2{font-size:1.5rem;margin-bottom:20px}.food-display-list{gap:18px}}@media (max-width: 480px){.food-display h2{font-size:1.3rem}.food-display-list{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:15px}}.food-item{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px #00000014;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer;display:flex;flex-direction:column}.food-item:hover{transform:translateY(-6px);box-shadow:0 6px 16px #0000001f}.food-item-img-contain{width:100%;height:180px;overflow:hidden;border-bottom:1px solid #f1f1f1}.food-item-image{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.food-item:hover .food-item-image{transform:scale(1.08)}.food-item-info{padding:15px;display:flex;flex-direction:column;gap:6px;flex-grow:1}.food-item-name{font-size:1.2rem;font-weight:600;color:#333;margin:0}.food-item-description{font-size:.9rem;color:#777;line-height:1.4;flex-grow:1}.food-item-price{font-size:1rem;font-weight:600;color:#ff4d30;margin-top:auto}@media (max-width: 768px){.food-item-img-contain{height:150px}.food-item-name{font-size:1rem}.food-item-description{font-size:.85rem}.food-item-price{font-size:.95rem}}@media (max-width: 480px){.food-item{border-radius:12px}.food-item-img-contain{height:130px}.food-item-name{font-size:.95rem}.food-item-description{font-size:.8rem}.food-item-price{font-size:.9rem}}.food-item-img-contain{position:relative}.food-item-img-contain .add{position:absolute;bottom:10px;right:10px;width:32px;height:32px;cursor:pointer;background:#ff4d30;border-radius:50%;padding:6px;box-shadow:0 2px 6px #0003}.food-item-counter{position:absolute;bottom:10px;right:10px;background:#fff;border-radius:20px;display:flex;align-items:center;gap:8px;padding:5px 10px;box-shadow:0 2px 6px #0003}.food-item-counter img{width:22px;height:22px;cursor:pointer}.food-item-counter span{font-weight:600;font-size:14px;color:#333}.cart{width:90%;max-width:1200px;margin:50px auto;padding:20px;background:#fff;border-radius:12px;box-shadow:0 4px 12px #00000014}.cart-items{width:100%;overflow-x:auto}.cart-items-title,.cart-items-items{display:grid;grid-template-columns:1.5fr 2fr 1fr 1fr 1fr .5fr;align-items:center;gap:15px;padding:12px 0;font-size:16px;font-weight:500;text-align:center}.cart-items-title{border-bottom:2px solid #eee;font-weight:700;color:#444}.cart-items-items{border-bottom:1px solid #f0f0f0;transition:background .2s ease}.cart-items-items:hover{background:#fafafa}.cart-items-items img{width:70px;height:70px;border-radius:10px;object-fit:cover;justify-self:center}.cart-items-items p{margin:0;color:#555}.cart-items-items p:last-child{color:red;font-weight:600;cursor:pointer;transition:transform .2s ease}.cart-items-items p:last-child:hover{transform:scale(1.2)}@media (max-width: 768px){.cart-items-title,.cart-items-items{grid-template-columns:1fr 1.5fr 1fr 1fr;font-size:14px}.cart-items-title p:nth-child(3),.cart-items-title p:nth-child(5),.cart-items-items p:nth-child(3),.cart-items-items p:nth-child(5){display:none}.cart-items-items img{width:50px;height:50px}}.remove-btn{color:red;font-weight:700;cursor:pointer;transition:transform .2s ease,color .2s ease}.remove-btn:hover{transform:scale(1.2);color:#8b0000}.cart{padding:40px 8%;min-height:80vh;background-color:#f9f9f9;font-family:Poppins,sans-serif}.cart-items{width:100%;border-collapse:collapse;margin-bottom:30px}.cart-items-title{display:grid;grid-template-columns:1.5fr 2fr 1fr 1fr 1fr .5fr;align-items:center;font-weight:600;font-size:16px;text-transform:uppercase;padding:12px 0;border-bottom:2px solid #ddd}.cart-items-items{display:grid;grid-template-columns:1.5fr 2fr 1fr 1fr 1fr .5fr;align-items:center;padding:12px 0;border-bottom:1px solid #eee;font-size:15px}.cart-items-items img{width:60px;height:60px;object-fit:cover;border-radius:6px}.cart-items-items p{margin:0}.remove-btn{cursor:pointer;font-size:18px;font-weight:700;color:#ff4d4f;transition:transform .2s ease}.remove-btn:hover{transform:scale(1.2)}.cart-total{display:flex;justify-content:flex-end;align-items:center;gap:40px;padding:20px 0;border-top:2px solid #ddd;font-size:18px;font-weight:600}.cart-total p{margin:0}.cart-total button{padding:12px 24px;font-size:16px;font-weight:600;background-color:#ff4d4f;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:background .3s ease}.cart-total button:hover{background-color:#e63946}@media (max-width: 768px){.cart-items-title,.cart-items-items{grid-template-columns:1fr 1fr;grid-row-gap:10px}.cart-total{flex-direction:column;align-items:flex-start;gap:15px}.cart-total button{width:100%;text-align:center}}.placeorder{max-width:600px;margin:50px auto;padding:30px;background:#fff;border-radius:10px;box-shadow:0 4px 12px #0000001a;font-family:Poppins,sans-serif}.placeorder h2{text-align:center;margin-bottom:20px;color:#333}.placeorder-form .form-group{margin-bottom:20px;display:flex;flex-direction:column}.placeorder-form label{font-weight:600;margin-bottom:6px;color:#444}.placeorder-form input,.placeorder-form textarea,.placeorder-form select{padding:10px;border:1px solid #ddd;border-radius:6px;outline:none;font-size:15px;transition:border .2s ease}.placeorder-form input:focus,.placeorder-form textarea:focus{border-color:#ff4d4f}.form-row{display:flex;gap:20px}.radio-group{display:flex;flex-direction:column;gap:8px}.error{color:red;font-size:13px;margin-top:4px}.submit-btn{width:100%;padding:12px;background-color:#ff4d4f;color:#fff;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background .3s ease}.submit-btn:hover{background-color:#e63946}.footer{background-color:#1e1e1e;color:#f2f2f2;padding:50px 8vw 20px;margin-top:40px}.footer-contents{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px}.footer-contents-left,.footer-contents-center,.footer-contents-right{flex:1;min-width:250px}.footer-contents-left img{width:150px;margin-bottom:15px}.footer-contents-left p{font-size:14px;line-height:1.6;margin-bottom:15px}.social-links{display:flex;gap:15px}.social-links img{width:30px;height:30px;cursor:pointer;transition:transform .2s ease-in-out}.social-links img:hover{transform:scale(1.1)}.footer-contents-center h2,.footer-contents-right h2{margin-bottom:15px;font-size:18px;color:#ff4c24}.footer-contents-center h3{margin-bottom:15px;font-weight:400;font-size:14px;color:#bbb}.footer-contents-center ul,.footer-contents-right ul{list-style:none;padding:0;margin:0}.footer-contents-center li,.footer-contents-right li{margin-bottom:10px;font-size:14px;cursor:pointer;transition:color .2s ease-in-out}.footer-contents-center li:hover,.footer-contents-right li:hover{color:#ff4c24}.footer:after{content:"© 2025 Tomato. All rights reserved.";display:block;text-align:center;margin-top:40px;font-size:12px;color:#888}@media (max-width: 768px){.footer-contents{flex-direction:column;text-align:center;gap:30px}.social-links{justify-content:center}}.login-popup{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;justify-content:center;align-items:center;z-index:2000}.login-popup-container{background:#fff;padding:30px;border-radius:12px;width:350px;box-shadow:0 8px 25px #0003;position:relative}.close-btn{position:absolute;top:12px;right:12px;background:none;border:none;font-size:18px;cursor:pointer}.login-form{display:flex;flex-direction:column;gap:15px}.form-group{display:flex;flex-direction:column}.form-group label{font-weight:600;margin-bottom:5px}.form-group input{padding:10px;border:1px solid #ddd;border-radius:8px;font-size:14px}.submit-btn{background:#ff4c24;color:#fff;padding:12px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:.3s}.submit-btn:hover{background:#e63a12}.error{color:red;font-size:12px;margin-top:3px}.toggle-text{margin-top:15px;font-size:14px;text-align:center}.toggle-text span{color:#ff4c24;font-weight:600;cursor:pointer}