*{margin:0;padding:0}html,body{font-family:Roboto;height:100%;margin:0;padding:0;overflow:hidden}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;z-index:1001}.view-orders-overlay,.create-orders-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;z-index:1003}.transparent-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1001}.header{display:flex;align-items:center;justify-content:space-between;padding:0 1rem;height:56px}.header .headerLogo{object-fit:cover;height:50px;width:50px;border-radius:50%}.header .headerTitle{color:#0f6eb2;font-size:clamp(1.5rem,7vw,4.8rem);font-weight:600;font-family:Grey Qo,cursive}.header .open-btn{border-radius:50%;border:none;background:none;font-size:1.5rem;color:#0f6eb2;cursor:pointer}.slider-menu{position:fixed;top:0;right:-100vw;height:100%;width:305px;background:#f1f1f1;box-shadow:-2px 0 8px #0003;display:flex;flex-direction:column;gap:1rem;transition:right .5s ease;z-index:1003;border-top-left-radius:15px;border-bottom-left-radius:15px}.slider-menu.open{right:0}.slider-menu-header{border-top-left-radius:15px;display:flex;padding:1rem;align-items:center;justify-content:center;gap:1rem;background:#0f6eb2;color:#fff}.slider-menu-content{display:flex;flex-direction:column;align-items:center;gap:1rem;overflow-y:auto;padding-bottom:.6rem;scrollbar-width:none}.slider-menu-content .request-form{padding:8px 0;width:90%;border-radius:10px;box-shadow:0 1px 1px #0000004d}.request-title{font-size:1rem;display:flex;gap:.5rem}.request-title span{color:#0f6eb2}.request-content{display:flex;align-items:center;justify-content:space-between;padding:.7rem 0}.quantity-controls{display:flex;align-items:center;gap:.5rem;padding:0 1rem}.request-content button{border:none;background-color:transparent;font-size:2rem;color:#555;cursor:pointer}.request-content span{border-radius:10px;border:1px solid rgba(0,0,0,.2);background-color:transparent;font-size:1rem;padding:.8rem 1.2rem;color:#0003}.request-content .request-submit{font-size:.9rem;border-radius:20px;padding:8px 22px;color:#fff;background-color:#0f6eb2;cursor:pointer}.view-orders{padding:8px 0;width:90%;border-radius:10px;box-shadow:0 1px 1px #0000004d}.view-orders .view-order-content{display:flex;align-items:center;justify-content:space-between;padding:8px 1rem}.view-order-content .view-order-title{display:flex;align-items:center;font-size:1rem;gap:.3rem}.view-order-title span{color:#0f6eb2}.view-order-content .btn-view-orders{display:flex;align-items:center;gap:1rem;border:none;font-size:.9rem;border-radius:10px;padding:8px 22px;color:#fff;background-color:#0f6eb2;cursor:pointer}.request-note{display:flex;flex-direction:column;gap:.3rem;width:90%}.request-note .note-label{overflow:hidden;border:1px solid #555;border-radius:5px;position:relative;display:flex;flex-direction:column}.note-label .note{position:absolute;top:50%;left:5px;transform:translateY(-50%);transition:all .3s ease;color:#777;pointer-events:none;z-index:1;background-color:#fff;padding:0 5px}.note-label #note{padding:12px 10px;box-sizing:border-box;font-size:1rem;border:1px solid #ccc;border-radius:4px;resize:vertical}.note-label #note:focus+.note,.note-label #note:not(:placeholder-shown)+.note{top:-6px;left:8px;font-size:.75rem;transform:none}.request-note .btn-note-request{display:flex;align-items:center;justify-content:center;gap:.3rem;border:none;font-size:.9rem;border-radius:20px;padding:4px 0;color:#fff;background-color:#0f6eb2;cursor:pointer}.close-btn{background:none;border:none;font-size:1.2rem;align-self:flex-end;cursor:pointer;color:#fff}.sub-header{display:flex;align-items:center;justify-content:space-between;padding:1.1rem;color:#fff;background-color:#0f6eb2}.lang-dropdown{position:relative;display:inline-block}.lang-button{background-color:#4689b6;border:none;color:#fff;padding:1rem .8rem;font-weight:700;border-radius:10px;cursor:pointer;font-size:.8rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.lang-globe{font-size:1rem}.lang-menu{position:absolute;top:0;left:60%;transform:translate(-50%);background-color:#0f6eb2;border-radius:8px;box-shadow:0 0 10px #0003;z-index:9998;width:70px;overflow:hidden}.lang-option{padding:1.2rem 0;color:#fff;font-weight:700;text-align:center;cursor:pointer}.lang-option:hover{background-color:#0c619a}.sub-header h3,.sub-header h4{font-size:clamp(1rem,1.2vw,3rem)}.navbar-container{display:flex;overflow-x:auto;justify-content:start;padding-left:40px;scrollbar-width:none;border-bottom:1px solid rgba(0,0,0,.2)}.navbar{position:relative;display:flex}.navbar-category{display:flex;align-items:center;font-size:14px;gap:.5rem;color:#6b7280}.nav-item{white-space:nowrap;padding:12px 16px;cursor:pointer;position:relative;z-index:1;color:#333;font-weight:600}.nav-item.active{color:#0f6eb2;transition:all 2s ease}.nav-indicator{position:absolute;transform:scaleX(.8);transform-origin:center;bottom:0;height:3px;background-color:#0f6eb2;border-radius:3px 3px 0 0;transition:all .4s ease;z-index:0}.app-container{display:flex;flex-direction:column;height:100vh}.main-content{flex:1;overflow-y:auto}.main-content::-webkit-scrollbar{width:0}.toast{width:80%;position:fixed;top:-100vh;left:50%;transform:translate(-50%);background-color:#fef6fb;color:#000;padding:12px 16px;border-radius:10px;display:flex;align-items:center;justify-content:space-around;box-shadow:0 2px 6px #0003;font-size:14px;z-index:1003;transition:all .3s ease;gap:8px}.toast.top_Yes{top:10vh}.toast.left_Yes{left:-100vw}.toast .icon{display:inline-block;background-color:#0f6eb2;color:#fff;font-weight:700;border-radius:50%;width:20px;height:20px;text-align:center;line-height:20px;font-size:14px}.card-container{height:100vh;display:grid;grid-template-columns:repeat(auto-fit,1fr)}.card{border:1px solid rgba(0,0,0,.2);border-radius:10px;box-shadow:0 1px 5px #0000004d;margin:3px 8px;display:inline-block;position:relative;overflow:hidden;height:100%;padding-bottom:1rem}.card .card-image{width:100%}@media screen and (min-width: 320px){.card-container{height:auto;grid-template-columns:repeat(2,1fr)}.card{height:auto}.card .card-image{height:200px}}@media screen and (min-width: 768px){.card-container{height:auto;grid-template-columns:repeat(2,1fr)}.card{height:auto}.card .card-image{height:400px}}@media screen and (min-width: 1024px){.card-container{height:auto;grid-template-columns:repeat(3,1fr)}.card{height:auto}.card .card-image{height:300px}}.card .card-name{margin:0 .4rem;font-size:clamp(1rem,3vw,3rem);color:#000c}.card .card-price{margin:0 .4rem;font-size:clamp(.8rem,2.5vw,3rem);color:#007a00cc}.card .card-button-group{position:absolute;top:10px;right:10px;background:#0006;border-radius:20px;display:flex;align-items:center;justify-content:center;color:#fff}.card-button-group button{height:40px;width:40px;border:none;background:none;cursor:pointer;font-size:1.5rem;color:#fff}.modal-content{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);height:auto;width:100%;max-width:575px;border-radius:10px;box-shadow:0 0 10px #0003;z-index:1003;display:flex;flex-direction:column;transition:opacity 6s ease-in-out;opacity:0}.modal-content.show{opacity:1;transition:opacity 6s ease-in-out}.modal-content .modal-button-group{position:absolute;top:10px;right:10px;background:#0006;border-radius:20px;display:flex;align-items:center;justify-content:center;color:#fff}.modal-button-group button{height:40px;width:40px;border:none;background:none;cursor:pointer;font-size:1.5rem;color:#fff}.modal-image{height:100%;width:100%;object-fit:cover;border-radius:10px}.modal-desc-price-container{width:95%;position:absolute;bottom:10px;left:50%;transform:translate(-50%);padding:8px 12px;text-align:center;border-radius:10px;background:#000c;box-sizing:border-box}.modal-description{font-size:20px;margin-bottom:8px;color:#ccc}.modal-price{font-size:18px;font-weight:700;color:#8aef8acc}.cart-bar{width:80%;position:relative;bottom:-100vh;left:50%;transform:translate(-50%);background:#0f6eb2;color:#fff;padding:12px 24px;border-radius:10px;box-shadow:0 6px 15px #0003;display:inline-flex;justify-content:space-between;align-items:center;gap:10px;font-weight:500;font-size:16px;transition:bottom .5s ease;z-index:1000;cursor:pointer}.cart-bar.show{bottom:20px}.cart-icon{font-size:1.2rem;position:relative}.cart-icon .cart-badge{background-color:#e10000;color:#fff;border-radius:50%;padding:.3rem;font-size:.6rem;font-weight:700;position:absolute;top:0;right:0;transform:translate(50%,-50%)}.cart-text{margin-left:10px}.cart-modal{height:90%;position:fixed;bottom:-100vh;left:50%;transform:translate(-50%);color:#000;z-index:1002;background:#fff;width:100%;max-width:650px;border-top-left-radius:20px;border-top-right-radius:20px;box-shadow:0 4px 20px #0003;transition:bottom .3s ease;display:flex;flex-direction:column}.cart-modal.open{bottom:0}.cart-header{display:flex;justify-content:space-between;align-items:center;background:#0f6eb2;color:#fff;padding:16px;border-top-left-radius:20px;border-top-right-radius:20px}.cart-header .header-cart-title{width:100%;text-align:center}.cart-body{height:100%;max-height:400px;overflow-y:auto;scrollbar-width:none;padding:16px}.cart-item{display:flex;align-items:center;margin-bottom:1rem}.item-image{width:50px;height:50px;border-radius:8px;object-fit:cover}.item-details{flex:1;margin-left:1rem}.item-name{font-size:1rem;margin-bottom:.3rem}.item-price{font-size:.8rem;color:gray}.item-controls{display:flex;align-items:center;gap:1rem}.control-btn{background:#ccc;border:none;border-radius:50%;font-size:1rem;font-weight:600;cursor:pointer}.add{display:flex;align-items:center;justify-content:center;background-color:#209f20cc;color:#fff;height:20px;width:20px}.subtract{display:flex;align-items:center;justify-content:center;background-color:#0f6eb2;color:#fff;height:20px;width:20px}.trash{display:flex;align-items:center;justify-content:center;background:transparent;color:#0f6eb2;height:20px;width:20px}.quantity-box{padding:.8rem .4rem;background:#0009;border-radius:8px;min-width:32px;text-align:center;font-weight:600;color:#fff}.cart-footer{padding:16px;display:flex;flex-direction:column;gap:12px}.add-more-btn,.place-order-btn{border:none;padding:.6rem .4rem;border-radius:10px;cursor:pointer}.add-more-btn{background:#4689b6;color:#fff;font-weight:500;margin:0 auto;margin-bottom:1.5rem}.place-order-btn{display:flex;align-items:center;justify-content:space-evenly;gap:1rem;background:#0f6eb2;color:#fff;font-weight:600;font-size:16px;margin:0 auto}.place-order-btn:disabled{background:#9aa7af;color:#0f0f0f;cursor:not-allowed}.order-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-height:90%;max-width:345px;background:#f0f0f0;border-radius:10px 10px 25px 25px;box-shadow:0 0 10px #0003;z-index:1004;display:flex;flex-direction:column;transition:opacity .3s ease-in-out;overflow:hidden;opacity:0;pointer-events:none}.order-container.open{opacity:1;pointer-events:auto}.order-header{text-align:center;padding:1rem 0;background:#0f6eb2;border-radius:10px 10px 0 0}.order-header span{position:fixed;top:5px;left:95%;transform:translate(-50%);font-size:1.2rem;color:#fff;cursor:pointer}.order-header h1{color:#fff;margin:0;font-size:1.3rem}.order-header p{color:#fff;margin-top:.5rem}.order-content{overflow-y:auto;scrollbar-width:none;margin:1rem}.no-orders-container{display:flex;flex-direction:column;align-items:center;gap:1rem;font-size:.8rem}.no-orders{width:50%}.order-group{border-bottom:2px solid #999}.order-group-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:.5rem 1rem}.order-info{display:flex;flex-direction:column;gap:.5rem}.order-group-header.open{border-top:1px solid #555}.order-group-header:hover{background:#e0e0e0}.order-group-header .ref{font-size:1.05rem;margin:0}.order-group-header .status{color:#6b7280;font-size:.95rem;margin:0}.expand-icon,.extract-icon{font-size:1.5rem}.order-items-wrapper{overflow:hidden;transition:padding .3s ease}.order-items-wrapper.open{padding:.5rem 0}.order-items{display:flex;flex-direction:column;gap:1rem;padding:.5rem 0}.order-item{display:flex;align-items:center;justify-content:space-between}.order-status-gif{width:50px;height:50px;border-radius:50%}.product-name{font-size:1rem;margin:0}.qty{font-size:.9rem;color:#6b7280;margin:.25rem 0 0}.price{font-size:.7rem;color:#6b7280;margin:0}.billout-wrapper{display:flex;justify-content:flex-end;margin:10px 20px}.billout-btn{background:#0f6eb2;color:#fff;border:none;padding:10px 20px;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:.3s}.billout-btn:disabled{background:#9aa7af;color:#0f0f0f;cursor:not-allowed}.bill-slip-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1005}.bill-slip-content{background:#fff;border-radius:10px 10px 0 0;width:100%;max-width:345px;max-height:90%;overflow-y:auto;text-align:center;font-size:1.2rem;scrollbar-width:none}.title{font-size:1.2rem;font-weight:700;margin:1rem 0}.bill-slip-header{text-align:center;padding:1rem 0;background:#0f6eb2;border-radius:10px 10px 0 0;position:relative}.bill-slip-header span{position:absolute;top:5px;left:95%;transform:translate(-50%);font-size:1.2rem;color:#fff;cursor:pointer}.bill-slip-header h1{color:#fff;margin:0;font-size:1.3rem}.bill-items{margin:15px;border-top:2px solid #ccc;border-bottom:2px solid #ccc;padding:10px 0}.bill-item{display:flex;justify-content:space-between}.bill-item:last-child{border-bottom:none}.bill-items-list{text-align:left;margin:15px;padding:10px 0}.bill-group{font-size:1rem;margin-bottom:.5rem}.total-amount-slip{font-weight:700;font-size:1.2rem}.download-btn{background:#0f6eb2;color:#fff;border:none;padding:10px 20px;border-radius:25px;font-size:1rem;cursor:pointer;transition:.3s;margin:15px}.modal-box{position:fixed;bottom:-100vh;left:50%;transform:translate(-50%);background:#fff;height:100%;max-width:768px;width:100%;border-radius:15px 15px 0 0;overflow:hidden;font-family:Roboto;box-shadow:0 0 10px #0003;transition:bottom .3s ease;z-index:1004}.modal-box.open{bottom:0}.modal-header{background-color:#0f6eb2;color:#fff;padding:.8rem 1.2rem;display:flex;justify-content:space-between;align-items:center}.close-button{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer}.modal-body{padding:1rem;text-align:center}.status-icon{border-radius:50%;background:green;font-size:3rem;color:#fff;margin-bottom:1rem}.success-text{color:green;margin-bottom:1rem}.order-info,h4{font-size:1rem;margin-bottom:1rem}.order-details{height:220px;overflow-y:auto;scrollbar-width:none}.order-item{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;font-size:1rem}.per-item{text-align:left;color:#aaa;font-size:.8rem}.item-total{text-align:right;font-size:.8rem}.modal-footer{width:100%;text-align:center;display:flex;flex-direction:column;gap:1rem;background:#fff}.total-amount{background:#0f6eb2;font-weight:700;padding:1rem;display:flex;justify-content:space-between;font-size:1rem;color:#fff}.countdown{font-size:1rem;color:#4689b6}