/* The private entry is visibly marked without changing its accessible name. */
#mobile-navigation [data-renfa-equipment-entry="v1"]::after {
  display: inline-grid;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  margin-left: 8px;
  place-items: center;
  color: #fff;
  content: "!";
  background: #ff4d4f;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
}

/* Desktop keeps the same private-area warning without crowding the nav line. */
.desktop-nav a[href="/equipment-checklist"]::after {
  display: inline-grid;
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-left: 6px;
  place-items: center;
  color: #fff;
  content: "!";
  background: #ff4d4f;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

@media (min-width: 1041px) {
  .site-header.renfa-ipad-private-navigation .desktop-nav {
    display: none;
  }

  .site-header.renfa-ipad-private-navigation .menu-button {
    display: grid;
  }

  .site-header.renfa-ipad-private-navigation .mobile-nav {
    position: fixed;
    inset: calc(env(safe-area-inset-top, 0px) + var(--site-header-height)) 0 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding:
      24px
      max(24px, env(safe-area-inset-right, 0px))
      calc(32px + env(safe-area-inset-bottom, 0px))
      max(24px, env(safe-area-inset-left, 0px));
    background: #080d13;
    opacity: 0;
    visibility: hidden;
    transform: none;
    pointer-events: none;
    transition:
      opacity 180ms ease,
      visibility 0s linear 180ms;
  }

  .site-header.renfa-ipad-private-navigation .mobile-nav.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
  }

  @supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .site-header.renfa-ipad-private-navigation .mobile-nav {
      background: rgba(8, 13, 19, 0.68);
      -webkit-backdrop-filter: blur(18px) saturate(125%);
      backdrop-filter: blur(18px) saturate(125%);
    }
  }
}