/* UR MOM KITCHEN — MOBILE/PWA ONLY
   Loaded only at max-width:700px.
*/
/* =========================================================
   RESPONSIVE + PWA MOBILE APP VIEW
========================================================= */
:root{
  --umk-mobile-bar-h:72px;
  --umk-safe-bottom:env(safe-area-inset-bottom,0px);
}
.mk-mobile-toggle{display:grid!important}
.mk-mobile-menu{display:flex!important}
.mk-mobile-menu-overlay{display:block!important}
.umk-mobile-bottom-nav{display:grid!important}

/* Prevent overflowing content */
html,body{max-width:100%;overflow-x:hidden}
img,video,iframe{max-width:100%}
.mk-container,.container{width:min(1180px,92%)!important}
table{max-width:100%}

/* Mobile app layout */

  body{
    padding-bottom:calc(var(--umk-mobile-bar-h) + var(--umk-safe-bottom))!important;
    background:#fffaf3!important
  }

  /* Compact app header */
  #umkRefHome .mk-nav{
    position:sticky!important;top:0!important;z-index:2000!important;
    background:rgba(255,250,243,.98)!important;backdrop-filter:blur(12px)!important
  }
  #umkRefHome .mk-nav-inner{min-height:68px!important;padding:7px 0!important;gap:8px!important}
  #umkRefHome .mk-brand img{width:48px!important;max-height:52px!important}
  #umkRefHome .mk-brand strong{font-size:19px!important}
  #umkRefHome .mk-brand span{display:none!important}
  #umkRefHome .mk-actions .mk-whatsapp{
    min-width:0!important;padding:10px 12px!important;border-radius:10px!important;
    font-size:0!important;box-shadow:none!important
  }
  #umkRefHome .mk-actions .mk-whatsapp:before{content:"🛒";font-size:19px!important}
  #umkRefHome .umk-account-name{display:none!important}
  #umkRefHome .umk-account-btn{padding:6px!important;border:0!important;background:transparent!important;box-shadow:none!important}
  #umkRefHome .umk-account-btn>span:last-child{display:none!important}
  .mk-mobile-toggle{width:40px!important;height:40px!important;font-size:20px!important}

  /* Hero */
  #umkRefHome .mk-hero{padding:22px 0 0!important;min-height:auto!important}
  #umkRefHome .mk-hero-grid{display:flex!important;flex-direction:column!important;gap:20px!important;min-height:auto!important}
  #umkRefHome .mk-hero-copy{padding:14px 0 0!important;text-align:center!important}
  #umkRefHome .mk-eyebrow{font-size:10px!important;letter-spacing:1.2px!important;margin-bottom:12px!important}
  #umkRefHome .mk-hero h1{font-size:38px!important;line-height:1.05!important;letter-spacing:-.7px!important;margin-bottom:14px!important}
  #umkRefHome .mk-hero p{font-size:14px!important;line-height:1.6!important;margin:0 auto 18px!important;max-width:94%!important}
  #umkRefHome .mk-hero-ctas{justify-content:center!important;gap:9px!important;margin-bottom:17px!important}
  #umkRefHome .mk-btn{min-height:45px!important;padding:0 17px!important;font-size:13px!important;border-radius:10px!important}
  #umkRefHome .mk-hero-features{
    grid-template-columns:repeat(2,1fr)!important;width:100%!important;max-width:none!important;
    margin-bottom:16px!important;border-radius:14px!important
  }
  #umkRefHome .mk-hero-features div{padding:11px 7px!important}
  #umkRefHome .mk-hero-features b{font-size:18px!important}
  #umkRefHome .mk-hero-features span{font-size:10px!important}
  #umkRefHome .mk-price-pill{padding:10px 17px!important;gap:8px!important;margin-bottom:4px!important}
  #umkRefHome .mk-price-pill b{font-size:12px!important}
  #umkRefHome .mk-price-pill strong{font-size:27px!important}
  #umkRefHome .mk-price-pill span{font-size:11px!important}
  #umkRefHome .mk-hero-art{width:100%!important;min-height:auto!important;margin:0!important}
  #umkRefHome .mk-hero-art img{width:100%!important;height:285px!important;border-radius:24px 24px 0 0!important;object-fit:cover!important}
  #umkRefHome .mk-seal{width:88px!important;height:88px!important;right:12px!important;top:14px!important;font-size:23px!important;border-width:4px!important}
  #umkRefHome .mk-seal span{font-size:9px!important}
  #umkRefHome .mk-seal small{font-size:6px!important}

  /* Sections */
  #umkRefHome .mk-title,.section-title{font-size:29px!important;line-height:1.2!important;margin-bottom:24px!important}
  #umkRefHome .mk-why,#umkRefHome .mk-how,#umkRefHome .mk-plans,#umkRefHome .mk-today,#umkRefHome .mk-reviews,.section{padding:42px 0!important}
  #umkRefHome .mk-why-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
  #umkRefHome .mk-why-card{padding:20px 11px!important;min-height:165px!important;border-radius:15px!important}
  #umkRefHome .mk-why-card div{font-size:31px!important}
  #umkRefHome .mk-why-card h3{font-size:13px!important}
  #umkRefHome .mk-why-card p{font-size:11px!important}
  #umkRefHome .mk-steps{grid-template-columns:1fr 1fr!important;gap:24px 12px!important}
  #umkRefHome .mk-step-icon{width:78px!important;height:78px!important;font-size:33px!important}
  #umkRefHome .mk-package-grid,.pkg-grid,.pkg-grid-lg{grid-template-columns:1fr!important;gap:17px!important}
  #umkRefHome .umk-pkg-card,.pkg-card,.pkg-card-lg{border-radius:17px!important}
  #umkRefHome .umk-pkg-body{padding:22px!important;min-height:auto!important}
  #umkRefHome .umk-pkg-name{font-size:23px!important}
  .popular-meal-tag{top:12px!important;right:12px!important;font-size:9px!important;padding:6px 9px!important}
  #umkRefHome .mk-today-grid{grid-template-columns:1fr!important;gap:22px!important}
  #umkRefHome .mk-today-img img{height:240px!important;border-radius:20px!important}
  #umkRefHome .mk-apart-grid{grid-template-columns:1fr 1fr!important}
  #umkRefHome .mk-apart-grid div{border:0!important;font-size:27px!important;padding:13px 6px!important}
  #umkRefHome .mk-review-grid{grid-template-columns:1fr!important}
  #umkRefHome .mk-cta{padding:45px 0!important}
  #umkRefHome .mk-cta h2{font-size:31px!important}

  /* Inner pages */
  .page-banner{padding:50px 0 45px!important}
  .page-banner h1{font-size:34px!important}
  .page-banner p{font-size:13px!important;padding:0 8px!important}
  .about-hero-grid,.contact-grid{grid-template-columns:1fr!important;gap:28px!important}
  .about-main-img img{height:270px!important}
  .about-stats-card{position:relative!important;left:auto!important;right:auto!important;margin:-30px 12px 0!important}
  .asc-grid{grid-template-columns:1fr 1fr!important}
  .contact-info-card,.contact-form-card{padding:21px!important;border-radius:18px!important}
  .loc-info-grid{grid-template-columns:1fr!important}
  .compare-table-wrap,.table-responsive{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .compare-table,.comparison-table{min-width:760px!important}

  /* Desktop footer hidden in app/mobile view */
  #umkRefHome .mk-footer{display:none!important}

  /* Bottom app navigation */
  .umk-mobile-bottom-nav{
    display:grid!important;grid-template-columns:repeat(5,1fr)!important;
    position:fixed!important;left:0!important;right:0!important;bottom:0!important;
    height:calc(var(--umk-mobile-bar-h) + var(--umk-safe-bottom))!important;
    padding:6px 8px var(--umk-safe-bottom)!important;z-index:9998!important;
    background:rgba(255,255,255,.97)!important;border-top:1px solid #e8dccb!important;
    box-shadow:0 -8px 30px rgba(0,0,0,.11)!important;backdrop-filter:blur(16px)!important
  }
  .umk-mobile-bottom-nav>a{
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;gap:3px!important;color:#7b7b7b!important;
    font-size:10px!important;font-weight:800!important;position:relative!important
  }
  .umk-mobile-bottom-nav>a.active{color:#145c0d!important}
  .mbn-icon{font-size:20px!important;line-height:1!important}
  .mbn-order{margin-top:-25px!important;color:#145c0d!important}
  .mbn-order-circle{
    width:52px!important;height:52px!important;border-radius:50%!important;
    display:grid!important;place-items:center!important;background:linear-gradient(135deg,#145c0d,#28751b)!important;
    color:#fff!important;font-size:23px!important;border:5px solid #fff!important;
    box-shadow:0 9px 24px rgba(20,92,13,.3)!important
  }

  /* PWA standalone */
  @media(display-mode:standalone){
    #umkRefHome .mk-nav{padding-top:env(safe-area-inset-top,0px)!important}
    .umk-mobile-bottom-nav{background:#fff!important}
  }

/* Very small phones */
@media(max-width:380px){
  #umkRefHome .mk-brand strong{font-size:17px!important}
  #umkRefHome .mk-hero h1{font-size:33px!important}
  #umkRefHome .mk-why-grid{grid-template-columns:1fr!important}
  #umkRefHome .mk-apart-grid{grid-template-columns:1fr!important}
}



/* =========================================================
   FINAL MOBILE HEADER + DRAWER + BOTTOM NAV FIX
========================================================= */
#umkRefHome{
  display:block!important;
  width:100%!important;
  position:relative!important;
  z-index:3000!important;
}
#umkRefHome .mk-nav{
  display:block!important;
  width:100%!important;
  min-height:68px!important;
  visibility:visible!important;
  opacity:1!important;
}
#umkRefHome .mk-nav-inner{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:92%!important;
  max-width:92%!important;
  margin:0 auto!important;
}
#umkRefHome .mk-links{display:none!important}
#umkRefHome .mk-brand{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex:1 1 auto!important;
  min-width:0!important;
}
#umkRefHome .mk-actions{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-left:auto!important;
}
#umkRefHome .mk-actions .mk-location,
#umkRefHome .mk-actions .mk-login,
#umkRefHome .mk-actions .mk-register{
  display:none!important;
}
.mk-mobile-toggle{
  display:grid!important;
  place-items:center!important;
  flex:0 0 40px!important;
  order:3!important;
  margin-left:6px!important;
  border:1px solid #e6d7c2!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#145c0d!important;
  cursor:pointer!important;
}

/* Drawer */
.mk-mobile-menu{
  position:fixed!important;
  top:0!important;
  right:-330px!important;
  width:min(330px,88vw)!important;
  height:100dvh!important;
  z-index:10001!important;
  background:#fffaf3!important;
  box-shadow:-20px 0 60px rgba(0,0,0,.22)!important;
  flex-direction:column!important;
  padding:16px!important;
  overflow-y:auto!important;
  transition:right .28s ease!important;
}
.mk-mobile-menu.open{right:0!important}
.mk-mobile-menu-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:4px 5px 16px!important;
  border-bottom:1px solid #ead8bd!important;
  margin-bottom:8px!important;
}
.mk-mobile-menu-head strong{
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:24px!important;
  color:#145c0d!important;
}
.mk-mobile-menu-head button{
  width:38px!important;
  height:38px!important;
  border:0!important;
  border-radius:50%!important;
  background:#fff!important;
  color:#145c0d!important;
  font-size:26px!important;
}
.mk-mobile-menu>a{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:14px 12px!important;
  border-radius:11px!important;
  color:#26331b!important;
  font-weight:800!important;
  text-decoration:none!important;
  border-bottom:1px solid #f3eadc!important;
}
.mk-mobile-menu>a.active,
.mk-mobile-menu>a:hover{
  background:#eef7e9!important;
  color:#145c0d!important;
}
.mk-mobile-menu-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:10000!important;
  background:rgba(0,0,0,.48)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:.25s ease!important;
}
.mk-mobile-menu-overlay.open{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
body.mobile-menu-open{overflow:hidden!important}

/* Bottom navigation */
.umk-mobile-bottom-nav{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  width:100%!important;
  height:calc(72px + env(safe-area-inset-bottom,0px))!important;
  padding:6px 8px env(safe-area-inset-bottom,0px)!important;
  z-index:99999!important;
  background:#fff!important;
  border-top:1px solid #e8dccb!important;
  box-shadow:0 -8px 30px rgba(0,0,0,.13)!important;
}
.umk-mobile-bottom-nav>a{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  color:#777!important;
  font-size:10px!important;
  font-weight:800!important;
  text-decoration:none!important;
}
.umk-mobile-bottom-nav>a.active{color:#0aa99a!important}
.mbn-icon{font-size:20px!important;line-height:1!important}
.mbn-order{margin-top:-25px!important;color:#145c0d!important}
.mbn-order-circle{
  width:54px!important;
  height:54px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  border:5px solid #fff!important;
  background:linear-gradient(135deg,#0fb7a8,#079b8e)!important;
  color:#fff!important;
  font-size:23px!important;
  box-shadow:0 9px 24px rgba(7,155,142,.3)!important;
}
body{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))!important}


/* FINAL MOBILE POPUP FRONT LAYER FIX */
body.umk-modal-open{overflow:hidden!important;touch-action:none!important}
body.umk-modal-open .umk-mobile-bottom-nav,
body.umk-modal-open .chatbot-widget,
body.umk-modal-open .chat-widget,
body.umk-modal-open #chatbot,
body.umk-modal-open .floating-chat,
body.umk-modal-open .chatbot-launcher{
  opacity:0!important;visibility:hidden!important;pointer-events:none!important
}

#umkPopupOverlay{
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  min-height:100dvh!important;display:none;align-items:center!important;justify-content:center!important;
  padding:max(10px,env(safe-area-inset-top,0px)) 10px max(10px,env(safe-area-inset-bottom,0px))!important;
  overflow-y:auto!important;background:rgba(0,0,0,.72)!important;z-index:2147483600!important
}
#umkPopupOverlay.open{display:flex!important}
#umkPopupOverlay>*{
  position:relative!important;width:min(100%,430px)!important;max-width:430px!important;
  max-height:calc(100dvh - 20px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
  margin:auto!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;
  border-radius:20px!important;z-index:2147483601!important
}
#umkPopupOverlay .popup-footer,
#umkPopupOverlay .location-popup-footer,
#umkPopupOverlay .loc-popup-footer{
  position:sticky!important;bottom:0!important;z-index:5!important;
  padding-bottom:max(12px,env(safe-area-inset-bottom,0px))!important;background:inherit!important
}

#custModal,#checkoutModal,#successModal{
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  min-height:100dvh!important;padding:max(8px,env(safe-area-inset-top,0px)) 8px max(8px,env(safe-area-inset-bottom,0px))!important;
  align-items:center!important;justify-content:center!important;overflow-y:auto!important;
  background:rgba(0,0,0,.74)!important;z-index:2147483610!important
}
#custModal.open,#checkoutModal.open,#successModal.open{
  display:flex!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important
}
#custModal>*,#checkoutModal>*,#successModal>*{
  position:relative!important;width:min(100%,560px)!important;max-width:560px!important;
  max-height:calc(100dvh - 16px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
  margin:auto!important;overflow:hidden!important;border-radius:18px!important;z-index:2147483611!important
}
#custModal .cust-scroll,#custModal #custScroll,
#checkoutModal .checkout-body,#checkoutModal .co-body{
  max-height:calc(100dvh - 210px)!important;overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important
}
#custModal .cust-footer,#custModal .modal-footer{
  position:sticky!important;bottom:0!important;z-index:6!important;
  padding-bottom:max(12px,env(safe-area-inset-bottom,0px))!important;
  background:#fffaf3!important;box-shadow:0 -8px 20px rgba(0,0,0,.08)!important
}
#cartOverlay{z-index:2147483590!important}
#cartDrawer{z-index:2147483591!important}
body.umk-modal-open #umkRefHome,body.umk-modal-open #umkRefHome .mk-nav{z-index:1!important}