/* ---- Mobile Bottom Navigation ---- */
.storefront-bottom-nav {
  display: none;
}

@media (max-width: 767.98px) {
  .storefront-bottom-nav {
    position: fixed;
    inset: auto 0 0;
    z-index: 1050;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    border-top: 1px solid rgba(195, 198, 214, 0.3);
    background: var(--ldm-surface, #fff);
    backdrop-filter: blur(14px);
    /* padding: 8px 8px 22px; */
    padding: 8px 8px 8px;
  }

  .storefront-bottom-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    color: var(--ldm-on-surface-variant, #6b6f82);
    text-decoration: none;
  }

  .storefront-bottom-nav small {
    font-size: 10px;
    font-weight: 700;
  }

  .storefront-bottom-nav .is-active {
    color: var(--ldm-primary, #0052cc);
  }

  .storefront-bottom-nav .material-symbols-outlined {
    font-size: 24px;
  }

  /* Center "Deals" button with elevated icon */
  .storefront-bottom-nav__center {
    position: relative;
  }

  .storefront-bottom-nav__center span {
    display: flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    border: 4px solid var(--ldm-surface, #fff);
    border-radius: 999px;
    background: var(--ldm-primary, #0052cc);
    color: #fff;
    margin-top: -28px;
    box-shadow: 0 10px 22px rgba(0, 61, 155, 0.28);
    font-size: 28px;
  }
}