/* ==========================================================
   SmartCafe Customer Responsive v5 — /kopinusantara
   Unified mobile/tablet/desktop ordering experience.
   ========================================================== */
html{overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:68px}
body{overflow-x:hidden;min-width:0}
.container{max-width:1180px!important}
img,video,svg,canvas{max-width:100%;height:auto}
input,select,textarea,button{font:inherit}
input,select,textarea{max-width:100%}

@media (min-width:821px) and (max-width:1100px){
  .container{width:min(100% - 36px,1180px)!important}
  .header-inner{padding-inline:18px!important}
  #mainNav a{padding-inline:7px!important;font-size:.70rem!important}
  .menu-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .cart-container{grid-template-columns:minmax(0,1fr) minmax(310px,350px)!important;gap:16px!important}
  .profil-grid{grid-template-columns:240px minmax(0,1fr)!important}
  .footer-inner{grid-template-columns:1.35fr 1fr 1fr!important}
  .footer-contact{grid-column:1/-1!important}
}

@media (max-width:820px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))!important}
  .container{width:min(100% - 24px,1180px)!important;padding-left:0!important;padding-right:0!important}
  #siteHeader{padding-top:env(safe-area-inset-top,0px)!important}
  .header-inner{height:60px!important;min-height:60px!important;padding:0 11px!important;gap:7px!important}
  .logo{min-width:0!important}.logo-copy{min-width:0!important}.logo-copy strong{max-width:150px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .table-badge{max-width:92px!important;overflow:hidden!important}.table-badge span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  #mainNav{width:min(330px,88vw)!important;padding-top:calc(12px + env(safe-area-inset-top,0px))!important}
  #mainNav a{flex:0 0 auto!important;width:100%!important}
  .mobile-bottom-nav{left:0!important;right:0!important;bottom:0!important;padding-bottom:env(safe-area-inset-bottom,0px)!important}

  .page-hero-mini{padding:24px 0 17px!important}.page-hero-mini h2{font-size:1.25rem!important}.page-hero-mini p{font-size:.76rem!important;line-height:1.5!important}
  .hero{padding:42px 13px 50px!important}.hero-content{max-width:none!important}.hero h1{font-size:clamp(2rem,9vw,3.15rem)!important}.hero>.hero-content>p{font-size:.91rem!important}.hero-cta{display:grid!important;grid-template-columns:1fr!important}.hero-cta>*{width:100%!important;justify-content:center!important}.hero-stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;overflow:visible!important}.hero-stats .stat{min-width:0!important;padding:0 10px!important}

  .banner-carousel{width:calc(100% - 24px)!important}
  .menu-container{padding-bottom:34px!important}
  .menu-filters{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .menu-filters>*{min-width:0!important;max-width:100%!important}
  .filter-tabs{order:3!important;width:100%!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important;overscroll-behavior-inline:contain!important}.filter-tabs::-webkit-scrollbar{display:none!important}
  .menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .product-card{min-width:0!important}.product-img-wrap{height:145px!important}.product-body{min-width:0!important}.product-name,.product-desc{overflow-wrap:anywhere!important}
  .product-footer{gap:7px!important}.product-price{min-width:0!important;overflow-wrap:anywhere!important}

  .cart-container{display:block!important;width:min(100% - 20px,1180px)!important;padding:15px 0 32px!important}.cart-items{gap:9px!important}.cart-item{min-width:0!important}.cart-item-info{min-width:0!important}.cart-item-name,.cart-options{overflow-wrap:anywhere!important}.summary-card{position:static!important;margin-top:12px!important}.summary-row,.summary-subtotal,.summary-diskon,.summary-total{gap:12px!important}.summary-row>:last-child,.summary-subtotal>:last-child,.summary-diskon>:last-child,.summary-total>:last-child{text-align:right!important;overflow-wrap:anywhere!important}.checkout-form input,.checkout-form textarea,.checkout-form select{font-size:16px!important}

  .profil-container{padding:18px 0 32px!important}.profil-tabs{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important;gap:6px!important;padding:5px!important;margin-bottom:14px!important}.profil-tabs::-webkit-scrollbar{display:none!important}.profil-tab{flex:0 0 auto!important;white-space:nowrap!important}.profil-grid{grid-template-columns:1fr!important}.profil-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.reward-grid,.favorite-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.my-voucher-card,.riwayat-voucher-item{min-width:0!important;flex-wrap:wrap!important}.voucher-desc{margin-left:0!important;width:100%!important}.riwayat-card{min-width:0!important}.riwayat-bottom{flex-wrap:wrap!important}

  .contact-container,.testi-container{padding-top:20px!important;padding-bottom:34px!important}.contact-cards{grid-template-columns:1fr!important;gap:10px!important}.testi-grid{gap:10px!important}
  .form-row{grid-template-columns:1fr!important;gap:10px!important}
  .auth-page{min-height:calc(100dvh - 60px)!important}.auth-card{width:100%!important}
  .success-card{width:min(100%,480px)!important;padding:28px 18px!important}
  .variant-page{width:100%!important}.variant-product{align-items:flex-start!important}.variant-option{min-width:0!important}.variant-option>*{min-width:0!important}
  .footer-inner{grid-template-columns:1fr 1fr!important;gap:22px!important}.footer-brand{grid-column:1/-1!important}

  .modal-overlay{padding:0!important;align-items:flex-end!important}.modal-box{width:100%!important;max-width:none!important;max-height:90dvh!important;margin:0!important;border-radius:18px 18px 0 0!important;overflow-y:auto!important;padding-bottom:env(safe-area-inset-bottom,0px)!important}
  .service-fab-wrap{bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
}

@media (min-width:390px) and (max-width:767.98px){
  .container{width:min(100% - 26px,1180px)!important}
  .product-img-wrap{height:138px!important}
  .flashsale-card{flex-basis:175px!important;width:175px!important}
}

@media (max-width:389.98px){
  .container{width:calc(100% - 18px)!important}
  .header-inner{padding-inline:8px!important}.logo-copy strong{max-width:108px!important;font-size:.81rem!important}.table-badge{max-width:78px!important;padding-inline:6px!important}.cart-btn,.hamburger{width:36px!important;height:36px!important}
  .hero{padding:34px 9px 42px!important}.hero h1{font-size:clamp(1.8rem,10vw,2.55rem)!important}.hero>.hero-content>p{font-size:.86rem!important}.hero-stats{grid-template-columns:1fr 1fr!important;gap:9px!important}.hero-stats .stat{border:0!important;padding:8px 0!important}.hero-stats .stat:last-child{grid-column:1/-1!important}
  .page-hero-mini{padding:21px 0 15px!important}.page-hero-mini h2{font-size:1.12rem!important}
  .banner-carousel{width:calc(100% - 18px)!important}.banner-slide{aspect-ratio:2.1/1!important}
  .menu-filters{padding:7px!important}.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}.product-img-wrap{height:116px!important}.product-body{padding:8px!important}.product-name{font-size:.82rem!important}.product-desc{display:none!important}.add-btn{min-width:32px!important}.add-btn span{display:none!important}
  .flashsale-card{min-width:140px!important;max-width:140px!important;flex-basis:140px!important}.flashsale-img-wrap{height:104px!important}
  .cart-container{width:calc(100% - 16px)!important}.cart-item{display:grid!important;grid-template-columns:50px minmax(0,1fr) auto!important;gap:8px!important;align-items:start!important}.cart-item img{width:50px!important;height:50px!important}.cart-item-remove{grid-column:3!important;grid-row:1!important}.cart-item .qty-ctrl{grid-column:2/-1!important;justify-self:start!important}
  .profil-stats{grid-template-columns:1fr!important}.reward-grid,.favorite-grid{grid-template-columns:1fr 1fr!important}.favorite-card img{height:96px!important}
  .footer-inner{grid-template-columns:1fr!important;padding-inline:10px!important}.footer-brand{grid-column:auto!important}
  .auth-page{padding-inline:8px!important}.auth-card{padding:20px 14px!important}
}

@media (max-width:339.98px){.menu-grid,.reward-grid,.favorite-grid{grid-template-columns:1fr!important}.product-img-wrap{height:150px!important}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
