/* FINAL REFERENCE PASS — single, explicit layer for the supplied Chocodew mobile reference. */
html,body,#root,.app{width:100%;max-width:100%;min-width:0;overflow-x:hidden!important}
html{scroll-behavior:auto!important}
.brand-logo,.hero-wordmark,.footer-brand{display:block!important;visibility:visible!important;opacity:1!important;overflow:visible!important}
.brand-logo img,.hero-wordmark img,.footer-brand img{display:block!important;visibility:visible!important;opacity:1!important;width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain!important}
.hero-wordmark{width:min(620px,88vw)!important;margin:10px auto 18px!important}
.hero{min-height:0!important;overflow:visible!important;padding-bottom:24px!important}
.hero nav{min-width:0!important;width:100%!important;max-width:100%!important}
.hero-copy{min-width:0!important;max-width:820px!important;margin-inline:auto!important;text-align:center!important}
.hero-copy>p{max-width:700px!important;margin-inline:auto!important}
.hero-copy:after{content:'Fresher Way'!important;display:block!important;margin:12px auto 16px!important;color:#f3c66f!important;font-family:'Lobster','Brush Script MT',cursive!important;font-size:clamp(26px,5vw,42px)!important;line-height:1!important;letter-spacing:.2px!important;text-shadow:0 2px 10px rgba(0,0,0,.42)!important;transform:none!important}
.hero-search{display:flex!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:500!important;width:min(820px,calc(100% - 32px))!important;max-width:820px!important;margin:0 auto!important;box-sizing:border-box!important;border-radius:999px!important;min-height:58px!important;padding:8px 16px!important;background:#fffaf5!important;border:1px solid rgba(80,35,18,.12)!important;box-shadow:0 10px 28px rgba(40,12,4,.12)!important}
.hero-search input{min-width:0!important;width:100%!important;color:#4a2a1d!important;font-size:16px!important}
.hero-search kbd{display:none!important}
.sticky-nav,.premium-nav-actions,.premium-dietary-row{display:none!important}
.discovery-strip,.hero-food-carousel{display:none!important}
main{width:min(1180px,100%)!important;margin-inline:auto!important;padding-inline:16px!important;box-sizing:border-box!important}
.menu-section{width:100%!important;max-width:100%!important;margin-inline:auto!important;scroll-margin-top:12px!important}
.grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;width:100%!important}
.card{min-width:0!important;max-width:100%!important;overflow:hidden!important}
.card.featured{grid-column:span 2!important}
.card-image{width:100%!important;overflow:hidden!important}
.card-image img{display:block!important;width:100%!important;height:auto!important;aspect-ratio:1.55/1!important;object-fit:cover!important}
.card.featured .card-image img{aspect-ratio:2.05/1!important}
.card-info,.card-copy{min-width:0!important}
.card-copy h3{overflow-wrap:anywhere!important}
.add{max-width:100%!important}
.floating-category-wheel{z-index:900!important;filter:none!important}
.floating-category-button{background:#32140b!important;border-color:#8b4b2b!important;color:#fff6ea!important;box-shadow:0 8px 20px rgba(30,8,3,.34)!important}
.floating-category-button.active{background:#a94820!important;border-color:#f3b36e!important;color:#fffaf3!important}
.floating-category-toggle{background:#281008!important;color:#fff5e9!important}

/* Compact premium mobile navigation — all five actions are equal UI buttons. */
.mobile-bottom-nav{
  left:50%!important;
  right:auto!important;
  bottom:max(7px,env(safe-area-inset-bottom))!important;
  transform:translateX(-50%)!important;
  width:min(430px,calc(100% - 28px))!important;
  max-width:430px!important;
  height:58px!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:center!important;
  padding:4px 5px!important;
  box-sizing:border-box!important;
  background:rgba(43,16,8,.97)!important;
  border:1px solid rgba(232,181,111,.28)!important;
  border-radius:18px!important;
  box-shadow:0 12px 30px rgba(25,8,3,.34),0 1px 0 rgba(255,255,255,.05) inset!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  z-index:45!important;
}
.mobile-bottom-nav button{
  position:relative!important;
  min-width:0!important;
  width:100%!important;
  height:48px!important;
  margin:0!important;
  padding:3px 2px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  background:transparent!important;
  color:#c9b4a8!important;
  border:0!important;
  border-radius:13px!important;
  font-size:8px!important;
  font-weight:700!important;
  line-height:1!important;
  transition:color .18s ease,background .18s ease,transform .18s ease!important;
}
.mobile-bottom-nav button.active{color:#fff2df!important;background:rgba(255,255,255,.06)!important}
.mobile-bottom-nav button.active:before{content:'';position:absolute;top:2px;width:18px;height:2px;border-radius:99px;background:#e8b56f}
.mobile-bottom-nav svg{width:18px!important;height:18px!important;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* My Order is highlighted without being a large circle. */
.mobile-bottom-nav .nav-order,
.mobile-bottom-nav .nav-order.active{
  width:48px!important;
  height:48px!important;
  margin:0 auto!important;
  justify-self:center!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,#8c3f1b,#42170a)!important;
  color:#fff3df!important;
  border:1px solid rgba(235,184,113,.45)!important;
  box-shadow:0 7px 16px rgba(24,7,2,.32),0 1px 0 rgba(255,255,255,.08) inset!important;
}
.mobile-bottom-nav .nav-order:before,.mobile-bottom-nav .nav-order.active:before{display:none!important}
.mobile-bottom-nav .nav-order svg{width:19px!important;height:19px!important}
.mobile-bottom-nav .nav-order-badge{top:0!important;right:-1px!important;min-width:15px!important;height:15px!important;padding:0 3px!important;font-size:7px!important;border-width:1px!important}
.mobile-order-bar{bottom:72px!important;z-index:42!important}
.top{bottom:76px!important}
footer{padding-bottom:88px}

@media(max-width:700px){
  .hero{padding-bottom:22px!important}
  .hero nav{padding-inline:12px!important;gap:7px!important}
  .brand-logo{width:min(112px,30vw)!important}
  .nav-actions{min-width:0!important;gap:5px!important}
  .lang-switch{width:72px!important;min-width:72px!important;height:38px!important;padding:0 7px!important;justify-content:center!important;gap:4px!important;white-space:nowrap!important}
  .lang-switch span:last-of-type{font-size:0!important}
  .lang-switch span:last-of-type::after{content:'T';font-size:12px!important;font-weight:800!important}
  .cart-pill{display:none!important}
  .hero-copy{padding-inline:14px!important}
  .hero-copy .overline{font-size:9px!important;letter-spacing:2px!important}
  .hero-wordmark{width:min(390px,86vw)!important;margin:7px auto 13px!important}
  .hero-copy>p{font-size:13px!important;line-height:1.5!important;max-width:340px!important}
  .hero-copy:after{font-size:29px!important;margin:10px auto 15px!important}
  .hero-search{width:calc(100% - 28px)!important;min-height:54px!important;padding:7px 15px!important}
  .hero-search input{font-size:14px!important}
  main{padding-inline:12px!important}
  .grid{gap:10px!important}
  .card{border-radius:15px!important}
  .card-image img{aspect-ratio:1.22/1!important}
  .card.featured .card-image img{aspect-ratio:1.6/1!important}
  .card-copy h3{font-size:14px!important;line-height:1.2!important}
  .card-wait{font-size:9px!important}
  .price strong{font-size:15px!important}
  .add{font-size:11px!important;min-height:36px!important;padding:8px 9px!important}
  .floating-category-wheel{right:3px!important;bottom:102px!important;width:60px!important;height:238px!important}
  .floating-category-button{width:38px!important;height:38px!important}
  .floating-category-button.active{width:46px!important;height:46px!important}
  .floating-category-icon{font-size:16px!important}
  .floating-category-button.active .floating-category-icon{font-size:19px!important}
  .mobile-bottom-nav{width:min(430px,calc(100% - 28px))!important;height:58px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important}
  .mobile-bottom-nav button{height:48px!important;font-size:8px!important}
  .mobile-bottom-nav .nav-order{width:48px!important;height:48px!important}
}

@media(max-width:360px){
  .hero nav{padding-inline:8px!important}
  .brand-logo{width:92px!important}
  .lang-switch{width:66px!important;min-width:66px!important;font-size:11px!important}
  .hero-copy{padding-inline:10px!important}
  .hero-wordmark{width:84vw!important}
  .hero-copy>p{font-size:12px!important;max-width:300px!important}
  .hero-copy:after{font-size:25px!important}
  .hero-search{width:calc(100% - 20px)!important;min-height:50px!important}
  .hero-search input{font-size:13px!important}
  main{padding-inline:9px!important}
  .grid{gap:8px!important}
  .card{border-radius:13px!important}
  .card-copy h3{font-size:12.5px!important}
  .card-wait{font-size:8px!important}
  .add{font-size:10px!important;min-height:33px!important;padding:7px 6px!important}
  .floating-category-wheel{right:1px!important;bottom:96px!important;width:54px!important;height:220px!important}
  .floating-category-button{width:34px!important;height:34px!important}
  .floating-category-button.active{width:42px!important;height:42px!important}
  .mobile-bottom-nav{width:calc(100% - 20px)!important;max-width:400px!important;height:54px!important;padding:3px 4px!important}
  .mobile-bottom-nav button{height:46px!important;font-size:7.5px!important}
  .mobile-bottom-nav .nav-order{width:46px!important;height:46px!important}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
