/* v0.9.96 · compact game-mode panels, fixed player slots and final Blackjack alignment */

/* Blackjack and Roulette game-mode windows use only the extra space they need,
   but are tall enough to show all controls without an internal scrollbar. */
@media (min-width: 701px) {
  .v072-launch-overlay[data-game-mode="blackjack"] .v072-launch-panel,
  .v072-launch-overlay[data-game-mode="roulette"] .v072-launch-panel {
    width: min(650px, 100%) !important;
    height: 560px !important;
    min-height: 560px !important;
    max-height: min(560px, calc(100dvh - 40px)) !important;
    overflow: hidden !important;
  }
}

/* Multiplayer Blackjack chip values are easier to read. */
body.multiplayer-live #multiplayerApp .multi-chip-palette .chip,
body.multiplayer-live #multiplayerApp .multi-bet-controls > .multi-chip-palette .chip {
  font-size: .82rem !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
}
body.multiplayer-live #multiplayerApp .multi-chip-palette :is(.chip-2500, .chip-5000, .chip-10000) {
  font-size: .7rem !important;
}

/* The own visiting card keeps exactly the same box geometry before, during and
   after the winner state. Only the avatar ring is animated. */
body.multiplayer-live #multiSeats .multi-seat.me,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-loser {
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
}
body.multiplayer-live #multiSeats .multi-seat.me .seat-info-row,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner .seat-info-row,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-loser .seat-info-row {
  position: relative !important;
  inset: auto !important;
  height: 74px !important;
  min-height: 74px !important;
  max-height: 74px !important;
  padding: 0 2px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  box-sizing: border-box !important;
}
body.multiplayer-live #multiSeats .multi-seat.me .seat-profile,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner .seat-profile,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-loser .seat-profile,
body.multiplayer-live #multiSeats .multi-seat.me.active .seat-profile {
  position: relative !important;
  inset: auto !important;
  top: 14px !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: min(214px, calc(100% - 8px)) !important;
  height: 84px !important;
  min-height: 84px !important;
  max-height: 84px !important;
  margin: 0 auto !important;
  padding: 9px 11px !important;
  border: 3px solid var(--wf-ink, #071116) !important;
  border-radius: 16px !important;
  background: #ddff91 !important;
  box-shadow: 4px 4px 0 var(--wf-ink, #071116) !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  box-sizing: border-box !important;
}
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner::before,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner::after,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner .seat-profile::before,
body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner .seat-profile::after {
  display: none !important;
}

/* Move only the Dealer avatar toward the left inner edge. */
body.multiplayer-live .dealer-persona .dealer-avatar {
  justify-self: start !important;
  margin-left: -4px !important;
  transform: none !important;
}

/* Blackjack player list: always show all three places, never scroll. */
body.multiplayer-live #multiplayerApp .multi-player-list {
  display: grid !important;
  grid-template-rows: repeat(3, minmax(52px, auto)) !important;
  gap: 7px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  overscroll-behavior: auto !important;
  scrollbar-gutter: auto !important;
}
body.multiplayer-live #multiplayerApp .multi-player-row {
  min-height: 52px !important;
  box-sizing: border-box !important;
}
body.multiplayer-live #multiplayerApp .multi-player-row.empty-seat-row {
  color: #7e8998 !important;
  background: rgba(255, 255, 255, .045) !important;
  border-style: dashed !important;
  opacity: .82 !important;
}
body.multiplayer-live #multiplayerApp .multi-player-row.empty-seat-row .empty-seat-avatar {
  color: #9aa6b6 !important;
  background: #202a36 !important;
  border-color: #566273 !important;
}
body.multiplayer-live #multiplayerApp .multi-player-row.empty-seat-row strong,
body.multiplayer-live #multiplayerApp .multi-player-row.empty-seat-row small {
  color: #9aa6b6 !important;
}

/* Roulette player list: five permanent places, matching Poker's fixed list. */
#rouletteApp.roulette-multiplayer-active .roulette-player-list {
  display: grid !important;
  grid-template-rows: repeat(5, minmax(50px, auto)) !important;
  gap: 6px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 1px 3px 3px 1px !important;
  overflow: visible !important;
  overscroll-behavior: auto !important;
  scrollbar-gutter: auto !important;
}
#rouletteApp.roulette-multiplayer-active .roulette-player-row {
  min-height: 50px !important;
  grid-template-columns: 36px minmax(0, 1fr) 9px !important;
  gap: 8px !important;
  padding: 6px 7px !important;
  box-sizing: border-box !important;
}
#rouletteApp.roulette-multiplayer-active .roulette-player-row > span {
  width: 36px !important;
  height: 36px !important;
  font-size: 1.12rem !important;
}
#rouletteApp.roulette-multiplayer-active .roulette-player-row small {
  font-size: .66rem !important;
  line-height: 1.15 !important;
}
#rouletteApp.roulette-multiplayer-active .roulette-player-row.empty-seat-row {
  color: #77818d !important;
  background: #e7e8e4 !important;
  border-style: dashed !important;
  box-shadow: 2px 2px 0 var(--wf-ink, #121212) !important;
  opacity: .82 !important;
}
#rouletteApp.roulette-multiplayer-active .roulette-player-row.empty-seat-row > span {
  color: #65707c !important;
  background: #d0d5d8 !important;
  border-color: #65707c !important;
}
#rouletteApp.roulette-multiplayer-active .roulette-player-row.empty-seat-row strong,
#rouletteApp.roulette-multiplayer-active .roulette-player-row.empty-seat-row small {
  color: #65707c !important;
}

@media (max-width: 1180px) {
  body.multiplayer-live #multiplayerApp .multi-player-list,
  #rouletteApp.roulette-multiplayer-active .roulette-player-list {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

@media (max-width: 700px) {
  .v072-launch-overlay[data-game-mode="blackjack"] .v072-launch-panel,
  .v072-launch-overlay[data-game-mode="roulette"] .v072-launch-panel {
    width: 100% !important;
    height: calc(100dvh - 24px) !important;
    min-height: calc(100dvh - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    overflow-y: auto !important;
  }
  body.multiplayer-live #multiSeats .multi-seat.me .seat-info-row,
  body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner .seat-info-row,
  body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-loser .seat-info-row {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
  }
  body.multiplayer-live #multiSeats .multi-seat.me .seat-profile,
  body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-winner .seat-profile,
  body.multiplayer-live #multiSeats .multi-seat.me.multi-hand-loser .seat-profile,
  body.multiplayer-live #multiSeats .multi-seat.me.active .seat-profile {
    top: 9px !important;
    width: min(174px, calc(100% - 6px)) !important;
    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
    padding: 7px 8px !important;
  }
}
