/* Boomlink Mobile Native Dock 2026 — final mobile-only navigation layer */
.boom-native-mobile-layer{display:none}

@media (max-width:760px){
  :root{--boom-dock-h:78px;--boom-safe-bottom:env(safe-area-inset-bottom,0px)}
  html,body{max-width:100%;overflow-x:hidden}
  body{padding-bottom:calc(94px + var(--boom-safe-bottom))!important}
  body.boom-sheet-open{overflow:hidden!important;overscroll-behavior:none}
  body .premium-app-main{padding-bottom:calc(118px + var(--boom-safe-bottom))!important}
  .boom-native-mobile-layer{display:block;position:relative;z-index:2147482000}

  /* Hide every legacy mobile-nav variant except the new dock. */
  .mobile-nav:not(.boom-native-dock),
  .mobile-nav-app:not(.boom-native-dock),
  .mobile-nav-wide:not(.boom-native-dock){display:none!important}

  .mobile-nav-four.boom-2026-dock.boom-native-dock{
    position:fixed!important;
    z-index:2147482100!important;
    left:50%!important;
    right:auto!important;
    bottom:calc(8px + var(--boom-safe-bottom))!important;
    transform:translateX(-50%)!important;
    display:grid!important;
    grid-template-columns:1fr 1fr 1.12fr 1fr 1fr!important;
    align-items:center!important;
    gap:4px!important;
    width:calc(100% - 18px)!important;
    max-width:520px!important;
    height:78px!important;
    min-height:78px!important;
    margin:0!important;
    padding:7px 8px!important;
    border:1px solid rgba(217,225,237,.82)!important;
    border-radius:25px!important;
    background:rgba(255,255,255,.92)!important;
    box-shadow:0 18px 54px rgba(13,34,70,.18),0 2px 8px rgba(13,34,70,.06)!important;
    -webkit-backdrop-filter:blur(24px) saturate(170%)!important;
    backdrop-filter:blur(24px) saturate(170%)!important;
    isolation:isolate!important;
    pointer-events:auto!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock::before{
    content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,.68),rgba(255,255,255,.14));
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-item{
    position:relative!important;z-index:1!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    min-width:0!important;width:100%!important;height:62px!important;margin:0!important;padding:4px 2px!important;border:0!important;border-radius:18px!important;
    background:transparent!important;color:#8795a9!important;text-decoration:none!important;box-shadow:none!important;cursor:pointer!important;
    -webkit-tap-highlight-color:transparent!important;touch-action:manipulation!important;pointer-events:auto!important;appearance:none!important;
    transition:transform .18s ease,color .18s ease,background .18s ease!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-item:active{transform:scale(.94)!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-item.active:not(.boom-services-trigger):not(.boom-profile-item){background:#f1f6ff!important;color:#1d63e9!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-icon{position:relative!important;display:grid!important;place-items:center!important;width:30px!important;height:28px!important;margin:0!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-icon svg{width:21px!important;height:21px!important;display:block!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-item small{
    display:block!important;max-width:100%!important;margin:2px 0 0!important;padding:0!important;overflow:hidden!important;
    color:inherit!important;font-size:8.5px!important;font-weight:800!important;line-height:1.05!important;letter-spacing:-.01em!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  }

  /* Center service launcher */
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-trigger{
    height:66px!important;overflow:visible!important;background:transparent!important;color:#071b3d!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-trigger.active{background:transparent!important;color:#071b3d!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-orb{
    display:grid!important;place-items:center!important;width:47px!important;height:47px!important;margin:-13px auto 0!important;border:4px solid rgba(255,255,255,.98)!important;border-radius:17px!important;
    background:linear-gradient(145deg,#0a2349,#071b3d 62%,#102d5d)!important;color:#fff!important;box-shadow:0 11px 24px rgba(7,27,61,.28)!important;transform:rotate(-2deg)!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-orb svg{width:21px!important;height:21px!important;transform:rotate(2deg)!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-trigger small{margin-top:3px!important;color:#34445c!important;font-size:8.2px!important}

  /* Profile is intentionally visually different from every other tab. */
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-profile-item{color:#0b2448!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-profile-item.active{background:#eef3fb!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-profile-avatar{
    display:grid!important;place-items:center!important;width:31px!important;height:31px!important;margin:0!important;border:2px solid #fff!important;border-radius:50%!important;
    background:linear-gradient(145deg,#e8eef8,#cdd9eb)!important;color:#0a2349!important;box-shadow:0 0 0 1px #cbd6e6,0 5px 12px rgba(7,27,61,.13)!important;
    font-size:12px!important;font-weight:950!important;line-height:1!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-profile-avatar svg{width:17px!important;height:17px!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-profile-item.active .boom-profile-avatar{background:linear-gradient(145deg,#133665,#071b3d)!important;color:#fff!important;box-shadow:0 0 0 2px #d8e6ff,0 7px 16px rgba(7,27,61,.22)!important}
  .boom-dock-badge{position:absolute;top:0;right:0;display:grid;width:15px;height:15px;place-items:center;border:2px solid #fff;border-radius:999px;background:#ef4444;color:#fff;font-size:7px;font-style:normal;font-weight:900;line-height:1}

  /* Native bottom sheet */
  .boom-service-sheet-shell{position:fixed!important;z-index:2147483000!important;inset:0!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;transition:opacity .22s ease,visibility .22s ease!important}
  .boom-service-sheet-shell.is-open{visibility:visible!important;opacity:1!important;pointer-events:auto!important}
  .boom-service-sheet-backdrop{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0!important;background:rgba(5,17,36,.48)!important;-webkit-backdrop-filter:blur(7px)!important;backdrop-filter:blur(7px)!important;appearance:none!important}
  .boom-service-sheet{
    position:absolute!important;left:50%!important;bottom:0!important;transform:translate(-50%,105%)!important;width:100%!important;max-width:560px!important;max-height:min(82dvh,720px)!important;
    overflow:auto!important;overscroll-behavior:contain!important;padding:8px 14px calc(18px + var(--boom-safe-bottom))!important;border:1px solid rgba(224,230,239,.92)!important;border-bottom:0!important;
    border-radius:30px 30px 0 0!important;background:#f8fafc!important;box-shadow:0 -24px 64px rgba(5,17,36,.24)!important;outline:none!important;
    transition:transform .34s cubic-bezier(.2,.78,.2,1)!important;-webkit-overflow-scrolling:touch!important;
  }
  .boom-service-sheet-shell.is-open .boom-service-sheet{transform:translate(-50%,0)!important}
  .boom-sheet-handle{width:42px;height:5px;margin:0 auto 14px;border-radius:999px;background:#cfd7e4}
  .boom-sheet-head{display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:12px;align-items:start;padding:2px 2px 14px}
  .boom-sheet-kicker{display:block;margin-bottom:6px;color:#6b7e99;font-size:8px;font-weight:900;letter-spacing:.18em}
  .boom-sheet-head h2{margin:0;color:#081c3d;font-size:28px;font-weight:950;line-height:1.02;letter-spacing:-.045em}
  .boom-sheet-head p{max-width:380px;margin:8px 0 0;color:#64748b;font-size:11.5px;font-weight:650;line-height:1.5}
  .boom-sheet-close{display:grid;width:40px;height:40px;place-items:center;border:1px solid #dce4ef;border-radius:14px;background:#fff;color:#203a5e;box-shadow:0 6px 16px rgba(7,27,61,.06);appearance:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .boom-sheet-close svg{width:18px;height:18px}
  .boom-sheet-services{display:grid;gap:9px}
  .boom-sheet-service{--service:#315fdb;--soft:#eef4ff;display:grid;grid-template-columns:56px minmax(0,1fr) 34px;gap:12px;align-items:center;min-height:76px;padding:9px 10px;border:1px solid #e2e8f0;border-radius:20px;background:#fff;color:#0f2443;text-decoration:none;box-shadow:0 7px 20px rgba(11,32,65,.045);touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
  .boom-sheet-service:active{transform:scale(.985);border-color:color-mix(in srgb,var(--service) 34%,#e2e8f0);box-shadow:0 4px 12px rgba(11,32,65,.04)}
  .boom-sheet-service-food{--service:#ef6c38;--soft:#fff2ec}.boom-sheet-service-med{--service:#19a6a5;--soft:#eafafa}.boom-sheet-service-edu{--service:#6d5be7;--soft:#f0edff}.boom-sheet-service-auto{--service:#2666da;--soft:#edf4ff}.boom-sheet-service-beauty{--service:#e15b92;--soft:#fff0f6}
  .boom-sheet-service-logo{display:grid;width:56px;height:56px;place-items:center;padding:9px;border-radius:17px;background:var(--soft);overflow:hidden}
  .boom-sheet-service-logo svg{display:block!important;width:24px!important;height:24px!important;color:var(--service)!important}
  .boom-sheet-service-copy{min-width:0}.boom-sheet-service-copy strong{display:block;color:#0b2143;font-size:14px;font-weight:900;line-height:1.1}.boom-sheet-service-copy small{display:block;margin-top:4px;overflow:hidden;color:#74839a;font-size:9.5px;font-weight:700;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
  .boom-sheet-service-arrow{display:grid;width:32px;height:32px;place-items:center;border-radius:11px;background:#f5f7fa;color:#5c6f89}.boom-sheet-service-arrow svg{width:16px;height:16px}
  .boom-sheet-all{display:grid;grid-template-columns:38px minmax(0,1fr) 26px;gap:10px;align-items:center;min-height:58px;margin-top:11px;padding:9px 12px;border-radius:18px;background:#071b3d;color:#fff;text-decoration:none;box-shadow:0 10px 24px rgba(7,27,61,.17);touch-action:manipulation}
  .boom-sheet-all>span{display:grid;width:36px;height:36px;place-items:center;border-radius:12px;background:rgba(255,255,255,.1)}.boom-sheet-all>span svg,.boom-sheet-all>i svg{width:17px;height:17px}.boom-sheet-all strong{font-size:11px;font-weight:850}.boom-sheet-all>i{display:grid;place-items:center;font-style:normal}
}

@media (max-width:390px){
  .mobile-nav-four.boom-2026-dock.boom-native-dock{width:calc(100% - 12px)!important;gap:1px!important;padding-inline:5px!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-dock-item small{font-size:7.7px!important}
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-orb{width:44px!important;height:44px!important}
  .boom-service-sheet{padding-inline:10px!important}.boom-sheet-head h2{font-size:25px}.boom-sheet-service{grid-template-columns:52px minmax(0,1fr) 32px;gap:9px}.boom-sheet-service-logo{width:52px;height:52px}
}

@media (prefers-reduced-motion:reduce){.boom-service-sheet-shell,.boom-service-sheet,.boom-dock-item{transition:none!important}}

/* =========================================================
   Native2 — screenshot fixes / 2026 mobile cleanup
   ========================================================= */

/* Restaurant initials are a fallback only. Never float above a real logo. */
.restaurant-brand-frame .restaurant-logo-fallback{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.restaurant-brand-frame.is-logo-fallback .restaurant-logo-fallback{
  opacity:1!important;
  visibility:visible!important;
}
.restaurant-brand-frame.has-logo img{z-index:3!important;background:#fff!important}

@media (max-width:760px){
  /* Mobile header = clean native app bar. Language/login/account controls live outside the top bar on mobile. */
  body .premium-topbar,
  body.module-page .premium-topbar{
    height:58px!important;
    min-height:58px!important;
    padding:7px 14px!important;
    justify-content:flex-start!important;
    grid-template-columns:1fr!important;
    background:rgba(255,255,255,.96)!important;
  }
  body .premium-topbar-right,
  body.module-page .premium-topbar-right,
  body .premium-lang-menu,
  body .premium-login-btn,
  body .premium-account-btn,
  body .premium-notification{display:none!important}
  body .premium-topbar .topbar-left,
  body.module-page .premium-topbar .topbar-left{width:100%!important;justify-content:flex-start!important}
  body .premium-brand,
  body.module-page .premium-brand{height:42px!important;max-width:100%!important}
  body .premium-brand>img:first-child,
  body.module-page .premium-brand>img:first-child{width:auto!important;height:25px!important;max-height:25px!important}
  body .premium-brand .premium-subbrand-logo,
  body.module-page .premium-brand .premium-subbrand-logo{width:auto!important;max-width:78px!important;height:22px!important;max-height:22px!important}

  /* One bottom reserve only. Previous cascade reserved space on body AND main, creating a large blank zone. */
  html,body{padding-bottom:0!important}
  body .premium-app-main,
  body.module-page .premium-app-main{
    padding-top:68px!important;
    padding-bottom:calc(92px + var(--boom-safe-bottom))!important;
  }
  body.premium-home .premium-app-main{
    padding-top:68px!important;
    padding-bottom:calc(92px + var(--boom-safe-bottom))!important;
  }
  body .app-shell,
  body.module-page .app-shell{padding-bottom:0!important}
  body .premium-footer{display:none!important}

  /* Dock remains above content but does not create another layout gap. */
  .mobile-nav-four.boom-2026-dock.boom-native-dock{
    bottom:calc(7px + var(--boom-safe-bottom))!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-trigger{
    transform:none!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }
  .mobile-nav-four.boom-2026-dock.boom-native-dock .boom-services-trigger .boom-services-orb{
    pointer-events:none!important;
  }

  /* Foodlink popular restaurants: one readable card per row, no half-card peeking from the side. */
  body.page-scope-food-index .food-popular-scroll{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-auto-flow:row!important;
    grid-auto-columns:auto!important;
    gap:12px!important;
    width:100%!important;
    overflow:visible!important;
    padding:0!important;
    scroll-snap-type:none!important;
  }
  body.page-scope-food-index .food-popular-card{
    display:flex!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    margin:0!important;
    scroll-snap-align:none!important;
  }
  body.page-scope-food-index .food-popular-cover{
    height:188px!important;
    min-height:188px!important;
    flex-basis:188px!important;
  }
  body.page-scope-food-index .food-popular-body{padding:14px!important}
  body.page-scope-food-index .food-popular-brand{
    display:grid!important;
    grid-template-columns:66px minmax(0,1fr)!important;
    gap:11px!important;
    align-items:center!important;
  }
  body.page-scope-food-index .food-popular-logo{
    position:relative!important;
    width:66px!important;
    height:50px!important;
    left:auto!important;
    bottom:auto!important;
    padding:5px!important;
    border-radius:14px!important;
    box-shadow:none!important;
  }
  body.page-scope-food-index .food-popular-title h3{
    margin:0 0 3px!important;
    min-height:0!important;
    font-size:16px!important;
    line-height:1.2!important;
  }
  body.page-scope-food-index .food-popular-title p{min-height:0!important;font-size:11px!important}
  body.page-scope-food-index .food-popular-meta{gap:7px!important;margin:11px 0 9px!important}
  body.page-scope-food-index .food-popular-meta span{min-height:42px!important;padding:8px!important;font-size:10px!important}

  /* Services screen: compact native launcher instead of giant vertical cards. */
  body.premium-services-page .premium-page-hero{
    margin:8px 0 12px!important;
    padding:21px 18px!important;
    border-radius:20px!important;
    text-align:left!important;
  }
  body.premium-services-page .premium-page-hero::before{display:none!important}
  body.premium-services-page .premium-page-hero>span{font-size:9px!important;letter-spacing:.14em!important}
  body.premium-services-page .premium-page-hero h1{
    margin:7px 0 8px!important;
    font-size:34px!important;
    line-height:1.02!important;
  }
  body.premium-services-page .premium-page-hero p{
    margin:0!important;
    max-width:none!important;
    font-size:11.5px!important;
    line-height:1.5!important;
  }
  body.premium-services-page .premium-services-standalone{
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.premium-services-page .premium-service-grid-large{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    overflow:visible!important;
    padding:0!important;
  }
  body.premium-services-page .premium-service-card,
  body.premium-services-page .premium-service-card:last-child{
    display:flex!important;
    flex:initial!important;
    min-width:0!important;
    min-height:218px!important;
    flex-direction:column!important;
    border-radius:19px!important;
    scroll-snap-align:none!important;
  }
  body.premium-services-page .premium-service-image,
  body.premium-services-page .premium-service-card:last-child .premium-service-image{
    order:1!important;
    width:100%!important;
    height:105px!important;
    min-height:105px!important;
    grid-column:auto!important;
    grid-row:auto!important;
  }
  body.premium-services-page .premium-service-content{
    order:2!important;
    display:block!important;
    padding:11px 11px 6px!important;
  }
  body.premium-services-page .premium-service-logo-wrap{
    width:58px!important;
    height:32px!important;
    margin-bottom:6px!important;
    padding:3px!important;
    border-radius:9px!important;
  }
  body.premium-services-page .premium-service-logo-wrap img{max-width:100%!important;max-height:100%!important}
  body.premium-services-page .premium-service-content h2{margin:0!important;font-size:15px!important;line-height:1.15!important}
  body.premium-services-page .premium-service-content p{display:none!important}
  body.premium-services-page .premium-service-bottom{
    order:3!important;
    margin:auto 11px 0!important;
    padding:8px 0 10px!important;
    min-height:34px!important;
    font-size:9.5px!important;
  }
  body.premium-services-page .premium-business{margin-top:12px!important}

  /* Generic mobile overflow guards for module pages. */
  body.module-page .section,
  body.module-page .simple-card,
  body.module-page .form-card,
  body.module-page .filter-card{max-width:100%!important}
  body.module-page img{max-width:100%}
}

@media (max-width:390px){
  body.premium-services-page .premium-service-grid-large{grid-template-columns:1fr 1fr!important;gap:8px!important}
  body.premium-services-page .premium-service-card,
  body.premium-services-page .premium-service-card:last-child{min-height:205px!important}
  body.premium-services-page .premium-service-image,
  body.premium-services-page .premium-service-card:last-child .premium-service-image{height:94px!important;min-height:94px!important}
  body.page-scope-food-index .food-popular-cover{height:174px!important;min-height:174px!important;flex-basis:174px!important}
}