/* Glowrity Marketplace 1.1.9 — mobile account navigation repair */

/* The drawer-only account shortcut must not join the desktop navigation. */
.mobile-account-drawer-link{display:none!important}

/* Keep the account action available in the 851–1050px responsive gap where
   the old layout hid the desktop account link before the mobile bar appeared. */
@media (max-width:1050px){
  .header-actions .header-action.account-action{
    display:inline-grid!important;
    place-items:center;
    flex:0 0 44px;
    width:44px;
    height:44px;
    min-width:44px;
    padding:0;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    color:var(--blue);
    pointer-events:auto;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }
  .header-actions .header-action.account-action .account-action-copy{display:none!important}
  .header-actions .header-action.account-action .action-icon{font-size:24px;pointer-events:none}
}

@media (max-width:850px){
  /* Make the header actions independent from the mobile drawer/backdrop layers. */
  .site-header .header-main{isolation:isolate}
  .site-header .header-actions{position:relative;z-index:206;isolation:isolate}
  .header-actions .header-action{pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}

  /* Retain Account and Basket in the top header. Wishlist remains in the
     fixed bottom navigation, which prevents the small header from overflowing. */
  .header-actions .wishlist-action{display:none!important}
  .header-actions .account-action,
  .header-actions .cart-action{
    display:inline-grid!important;
    place-items:center;
    width:44px;
    height:44px;
    min-width:44px;
    flex:0 0 44px;
    border-radius:14px;
  }
  .header-actions .cart-action{background:#fff;border:1px solid var(--line)}
  .header-actions .cart-action .action-copy{display:none!important}

  /* A second account entry inside the category drawer gives mobile users a
     reliable route even when a browser temporarily covers the bottom toolbar. */
  .navlinks .mobile-account-drawer-link{
    display:flex!important;
    align-items:center;
    gap:12px;
    min-height:62px;
    margin:7px 0 10px;
    padding:10px 12px!important;
    border:1px solid #dfe3f5!important;
    border-radius:15px;
    background:linear-gradient(145deg,#f7f8ff,#fff4f8);
    color:var(--blue-dark)!important;
    text-decoration:none;
    pointer-events:auto;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-account-drawer-link .mobile-account-drawer-icon{
    display:grid;
    place-items:center;
    flex:0 0 40px;
    width:40px;
    height:40px;
    border-radius:12px;
    background:var(--blue);
    color:#fff;
    font-size:23px;
  }
  .mobile-account-drawer-link>span:nth-child(2){display:block;min-width:0;flex:1}
  .mobile-account-drawer-link small{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
  .mobile-account-drawer-link strong{display:block;margin-top:2px;color:var(--blue-dark);font-size:14px}
  .mobile-account-drawer-link b{font-size:20px;color:var(--pink-dark)}

  /* Harden the fixed mobile bar for Chrome, Samsung Internet and iOS Safari. */
  .mobile-bottom-nav{
    display:flex!important;
    position:fixed;
    z-index:500;
    right:0;
    bottom:0;
    left:0;
    align-items:stretch;
    justify-content:space-around;
    min-height:64px;
    padding:5px 4px max(7px,env(safe-area-inset-bottom));
    border-top:1px solid var(--line);
    background:rgba(255,255,255,.985);
    box-shadow:0 -9px 30px rgba(25,31,91,.13);
    isolation:isolate;
    pointer-events:auto;
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
  }
  .mobile-bottom-nav a{
    position:relative;
    z-index:1;
    display:flex;
    flex:1 1 20%;
    min-width:0;
    min-height:52px;
    margin:0;
    padding:4px 2px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:2px;
    border-radius:11px;
    color:var(--blue);
    text-decoration:none;
    pointer-events:auto;
    touch-action:manipulation;
    -webkit-tap-highlight-color:rgba(39,49,131,.12);
    user-select:none;
    -webkit-user-select:none;
  }
  .mobile-bottom-nav a:active{background:var(--blue-soft);transform:scale(.97)}
  .mobile-bottom-nav a[aria-current="page"]{background:var(--pink-soft);color:var(--pink-dark)}
  .mobile-bottom-nav .mobile-nav-icon{display:block!important;font-size:20px!important;line-height:1.05;pointer-events:none}
  .mobile-bottom-nav .mobile-nav-label{display:block!important;font-size:9px!important;line-height:1.2;font-weight:800;pointer-events:none}
  .mobile-bottom-nav b{pointer-events:none}
  .mobile-bottom-nav .mobile-account-nav-link{pointer-events:auto!important}

  /* Do not leave an invisible overlay above the fixed navigation. */
  .mobile-menu-backdrop[hidden]{display:none!important;pointer-events:none!important}
  body:not(.mobile-menu-open) .mobile-menu-backdrop{pointer-events:none!important}
  body.mobile-menu-open .mobile-bottom-nav{visibility:hidden;pointer-events:none}

  /* Keep page controls clear of the fixed bar and phone safe area. */
  main#main-content{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .footer{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
}

@media (max-width:420px){
  .header-actions{gap:6px!important}
  .header-actions .account-action,
  .header-actions .cart-action{width:41px;min-width:41px;height:41px;flex-basis:41px}
  .mobile-bottom-nav{padding-inline:1px}
  .mobile-bottom-nav a{padding-inline:0}
  .mobile-bottom-nav .mobile-nav-label{font-size:8.5px!important}
}