/* Neon Poker v0.93.8.9 — stable viewport game rails and clean auth slider labels. */

/*
 * Blackjack, Roulette and Slots keep their original DOM position so every
 * existing game selector and live renderer continues to work. JavaScript adds
 * a layout placeholder and fixes the original rail to the viewport after
 * neutralising transformed/filtering ancestors that would otherwise make a
 * fixed element scroll with its game container.
 */
@media (min-width: 1181px) {
  .v09389-game-rail-slot {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: var(--v09389-slot-height, 1px) !important;
    visibility: hidden !important;
    pointer-events: none !important;
    align-self: stretch !important;
  }

  #gameApp > .side-panel.v09389-viewport-game-rail,
  #slotsApp > .side-panel.v09389-viewport-game-rail,
  #rouletteApp > .roulette-info.v09389-viewport-game-rail,
  #multiplayerApp .multi-sidebar.v09389-viewport-game-rail {
    position: fixed !important;
    z-index: 58 !important;
    top: var(--v09389-rail-top, 92px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--v09389-rail-left, auto) !important;
    width: var(--v09389-rail-width, 320px) !important;
    min-width: var(--v09389-rail-width, 320px) !important;
    max-width: var(--v09389-rail-width, 320px) !important;
    height: var(--v09389-rail-height, auto) !important;
    min-height: 0 !important;
    max-height: var(--v09389-rail-height, calc(100dvh - 104px)) !important;
    margin: 0 !important;
    align-self: auto !important;
    translate: none !important;
    rotate: none !important;
    scale: none !important;
    transform: none !important;
    animation: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    box-sizing: border-box !important;
  }

  #multiplayerApp .multi-sidebar.v09389-viewport-game-rail,
  #rouletteApp > .roulette-info.v09389-viewport-game-rail {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .v09389-fixed-containing-context {
    transform: none !important;
    translate: none !important;
    rotate: none !important;
    scale: none !important;
    perspective: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    contain: none !important;
    will-change: auto !important;
  }
}

@media (max-width: 1180px) {
  .v09389-game-rail-slot {
    display: none !important;
  }

  #gameApp > .side-panel.v09389-viewport-game-rail,
  #slotsApp > .side-panel.v09389-viewport-game-rail,
  #rouletteApp > .roulette-info.v09389-viewport-game-rail,
  #multiplayerApp .multi-sidebar.v09389-viewport-game-rail {
    position: relative !important;
    inset: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/*
 * Log in with / Register with: the parent slider is the only highlight.
 * Remove every legacy active-button surface, border, glow and pseudo layer.
 */
.developer-auth-mode-tabs > button,
.developer-auth-mode-tabs > button:hover,
.developer-auth-mode-tabs > button:focus,
.developer-auth-mode-tabs > button:focus-visible,
.developer-auth-mode-tabs > button:active,
.developer-auth-mode-tabs > button.active,
.developer-auth-mode-tabs > button[aria-selected="true"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  outline-offset: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  text-shadow: none !important;
}

.developer-auth-mode-tabs > button::before,
.developer-auth-mode-tabs > button::after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

.developer-auth-mode-tabs > button:not(.active):not([aria-selected="true"]),
.developer-auth-mode-tabs > button:not(.active):not([aria-selected="true"]):hover,
.developer-auth-mode-tabs > button:not(.active):not([aria-selected="true"]):focus {
  color: var(--theme-muted, var(--muted)) !important;
}

.developer-auth-mode-tabs > button.active,
.developer-auth-mode-tabs > button[aria-selected="true"] {
  color: #ffffff !important;
}
