/* MellowKids — non-transparent mobile bottom menu / WebKit Safari iOS.
   Fully opaque paint is in a real DOM layer so content behind cannot bleed through.
   Uses opaque RGB gradient stops; no opacity, translucent color-mix or blur.
   File is loaded last, with PHP filemtime cache busting.
*/
@media screen and (max-width: 650px) {
  html .bottom-nav[data-menu-fix="ios-opaque-20261012-v2"] {
    position: fixed !important;
    inset: auto 0 0 0 !important;
    width: 100% !important;
    height: 80px !important;
    padding: 0 5px max(10px, env(safe-area-inset-bottom, 0px)) !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-evenly !important;
    background: #ffffff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    filter: none !important;
    opacity: 1 !important;
    isolation: isolate !important;
    z-index: 1000 !important;
    border-top: 1px solid #f5bdd3 !important;
    box-shadow: 0 -6px 24px rgba(29, 69, 83, .08) !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  html .bottom-nav[data-menu-fix="ios-opaque-20261012-v2"] > .bottom-nav-surface {
    position: absolute !important;
    display: block !important;
    inset: 0 !important;
    z-index: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 1 !important;
    pointer-events: none !important;
    background-color: #ffffff !important;
    background-image: linear-gradient(90deg, #eefafb 0%, #ffffff 48%, #fce9f1 100%) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  html .bottom-nav[data-menu-fix="ios-opaque-20261012-v2"] > a {
    position: relative;
    z-index: 1;
    flex: 0 0 20%;
  }
  /* Keep the large wallet icon lifted as before. */
  html .bottom-nav[data-menu-fix="ios-opaque-20261012-v2"] > a.center-action-btn .floating-btn {
    z-index: 2;
  }
  html[data-front-theme="dark"] .bottom-nav[data-menu-fix="ios-opaque-20261012-v2"] {
    background: #0a121d !important;
    border-top-color: #243449 !important;
  }
  html[data-front-theme="dark"] .bottom-nav[data-menu-fix="ios-opaque-20261012-v2"] > .bottom-nav-surface {
    background: #0a121d !important;
  }
}