* {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  touch-action: manipulation;
}

*::-webkit-scrollbar {
  width: 16px !important;
}

*::-webkit-scrollbar-track {
  background-color: transparent !important;
}

*::-webkit-scrollbar-thumb {
  background-color: #babac0 !important;
  border-radius: 16px !important;
  border: 4px solid transparent !important;
  background-clip: content-box !important;
}

*::-webkit-scrollbar-thumb:hover {
  background-color: #acacb1 !important;
}

*::-webkit-scrollbar-button {
  display: none;
}

/* Hide the password reveal button in Edge */
input[type='password']::-ms-reveal,
input[type='password']::-ms-clear {
  display: none;
}

#components-reconnect-modal {
  display: none;
}
/*
DOCS: https://learn.microsoft.com/en-us/aspnet/core/blazor/fundamentals/signalr?view=aspnetcore-10.0#reflect-the-server-side-connection-state-in-the-ui*/
#components-reconnect-modal.components-reconnect-show,
#components-reconnect-modal.components-reconnect-failed,
#components-reconnect-modal.components-reconnect-rejected {
  display: grid;
  position: fixed;
  z-index: 10001;
}

.app-bottom-footer-gradient {
  --app-bottom-footer-background: #F5F5F5;
  isolation: isolate;
  background: var(--app-bottom-footer-background);
}

.app-bottom-footer-gradient::before {
  content: "";
  position: absolute;
  top: -26px;
  left: 0;
  width: 100%;
  height: 26px;
  pointer-events: none;
  background: linear-gradient(to top, #F5F5F5, transparent);
  z-index: -1;
}

/* Keep primary actions outside Safari's collapsed bottom-toolbar activation zone. */
@supports (height: 100dvh) and (height: 100svh) {
  @media (hover: none) and (pointer: coarse) {
    .app-safari-tap-safe-footer {
      bottom: max(0px, calc(100dvh - 100svh));
    }
  }
}

/* Live connection indicator (reconnect status pill, Instant View): a brand-blue dot with an expanding ring. */
.nexus-connection-pulse {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #3a9ad2;
}

.nexus-connection-pulse::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: inherit;
  animation: nexus-connection-pulse 1.6s cubic-bezier(0.2, 0.6, 0.3, 1) infinite;
}

@keyframes nexus-connection-pulse {
  from {
    opacity: 0.6;
    transform: scale(1);
  }
  to {
    opacity: 0;
    transform: scale(3);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nexus-connection-pulse::after {
    animation: none;
  }
}

/* Scroll visibility is applied locally while Blazor synchronizes the header content. */
html[data-catalog-regular-header] #header-compact,
html[data-catalog-regular-header] #nav-container-compact {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* dark-theme:generated — dark variants of the colours above, written by Nexus.Retail.Server/TailwindAssets/dark-theme-sync.mjs.
   Edit the light rules and rerun the script; do not edit this block. */

:where(:root[data-theme="dark"]) *::-webkit-scrollbar-thumb {
    background-color: #42454B !important;
    border: 4px solid transparent !important;
}

:where(:root[data-theme="dark"]) *::-webkit-scrollbar-thumb:hover {
    background-color: #4A4D53 !important;
}

:where(:root[data-theme="dark"]) .app-bottom-footer-gradient {
    --app-bottom-footer-background: #111317;
    background: var(--app-bottom-footer-background);
}

:where(:root[data-theme="dark"]) .app-bottom-footer-gradient::before {
    background: linear-gradient(to top, #111317, transparent);
}

:where(:root[data-theme="dark"]) .nexus-connection-pulse {
    background: #3A9AD2;
}

:where(:root[data-theme="dark"]) .nexus-connection-pulse::after {
    background: inherit;
}

/* dark-theme:generated:end */