/* Table rooms and card tables retain their real game surfaces and chosen seats.
   The background images live alongside this stylesheet. */
body.public-table-games,
body:has(.felt-table #gameBoard),
body #gameDialog.game-dialog:has(.table-stage:not([aria-label="Video poker machine"])) {
  background-color: #111710;
  background-image: linear-gradient(180deg, #0c100978 0%, #10130a8c 34%, #141109df 91%),
    url('./salon-front.webp');
  background-position: center 36%;
  background-size: cover;
  background-repeat: no-repeat;
}

body.public-table-games .room-header,
body #gameDialog.game-dialog:has(.table-stage:not([aria-label="Video poker machine"])) > .dialog-top {
  background: linear-gradient(112deg, #272017f5, #101912f8 58%, #261e13f7);
  color: #fff0c7;
  border-bottom-color: #b18a48;
}

body.public-table-games .scene-toolbar,
body.public-table-games .table-navigation {
  background: #121910e8;
  border-bottom: 1px solid #9c7c43;
}

body.public-table-games .scene-toolbar {
  padding-inline: 8px;
  border-radius: 5px;
}

body.public-table-games .scene-toolbar button,
body.public-table-games .wager-controls button {
  border-color: #c4a267;
}

/* Public Hold'em has its own fitted layout. The other card games use the same
   room material with their own existing cards, turn prompts and wagers. */
body #gameDialog .table-stage:not([aria-label="Video poker machine"]):not(:has(.isn-seated-group)) {
  background-color: #123626;
  background-image: url('./salon-overhead.webp');
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 16px;
  box-shadow: 0 8px 20px #0007;
}

body #gameDialog .table-stage:not([aria-label="Video poker machine"]) .table-brand {
  color: #eed59a;
  text-shadow: 0 1px 3px #000;
}

body #gameDialog .table-stage:not([aria-label="Video poker machine"]) .turn-action-button:focus-visible,
body #gameDialog .table-stage:not([aria-label="Video poker machine"]) button:focus-visible,
body:has(.felt-table #gameBoard) button:focus-visible {
  outline: 3px solid #fff2bc;
  outline-offset: 2px;
}

/* Reduce the empty apron below the cards in the older club table shell.
   The original cutout and guest positions still belong to seating.css. */
body[data-isn-room] #gameDialog:not(.poker-fit) .game-room-started .table-stage:has(.isn-seated-group) {
  margin-top: clamp(65px, 12dvh, 120px);
  padding: clamp(60px, 12dvh, 110px) 8% clamp(65px, 11dvh, 112px);
}

body[data-isn-room] #gameDialog:not(.poker-fit) .seated-controls {
  background: linear-gradient(110deg, #242119f5, #111c13f7);
  border: 1px solid #a4874e;
  border-radius: 8px;
  padding: 5px 10px;
}

body[data-isn-room] #gameDialog:not(.poker-fit) .seated-controls .table-action-panels {
  gap: 6px;
  margin: 5px 0 0;
}

body #gameDialog:not(.poker-fit) .game-room-started .table-center .room-card-row {
  margin-block: 5px;
  padding-block: 4px;
}

body #gameDialog:not(.poker-fit) .game-room-started .table-center .table-status,
body #gameDialog:not(.poker-fit) .game-room-started .seated-controls .opponent-comment {
  color: #fff0ce;
  background-color: #10251def;
}

/* The club house-game shell puts the real wheel, number grid, dice or cards
   on its own photographed tabletop. Public house games use their cutout art. */
body:has(.felt-table #gameBoard) .felt-table {
  background: #133b2d url('./salon-overhead.webp') center / 100% 100% no-repeat;
  border: 0;
  outline: 0;
  border-radius: 12px;
  box-shadow: 0 12px 18px #0007;
  padding: 18px clamp(18px, 5%, 65px) 28px;
}

body:has(.felt-table #gameBoard) .felt-table .table-marquee {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 8px;
  padding: 3px 18px;
  border: 1px solid #bd9a59;
  border-radius: 5px;
  background: linear-gradient(110deg, #302519, #10180f 65%, #302519);
  color: #ffe6ab;
}

body:has(.felt-table #gameBoard) .table-marquee h1 {
  margin: 0;
  font-size: clamp(18px, 3.5dvh, 34px);
}

body:has(.felt-table #gameBoard) .table-marquee :is(span,p) {
  margin: 0;
  color: #e7cea1;
  font-size: 10px;
}

body:has(.felt-table #gameBoard) .table-result {
  min-height: 35px;
  margin: 8px auto 0;
  padding: 6px 10px;
  color: #fff2cd;
  background: #10271ceb;
  text-align: center;
}

body:has(.felt-table #gameBoard) .play-controls {
  background: linear-gradient(145deg,#33291cf5,#0d1811f9);
  border-color: #a18650;
  padding: clamp(9px,1.4dvh,17px);
}

body:has(.felt-table #gameBoard) .play-controls .balance-readout,
body:has(.felt-table #gameBoard) .play-controls .last-spin {
  padding-block: 5px;
  margin-block: 0 7px;
}

body:has(.felt-table #gameBoard) .play-controls .balance-readout strong {
  margin: 3px 0;
  font-size: clamp(18px, 4dvh, 34px);
}

body:has(.felt-table #gameBoard) .play-controls .spin-button {
  min-height: 40px;
  font-size: clamp(15px,2dvh,20px);
}

body:has(.felt-table #gameBoard) .felt-table .dice-stage {
  margin: 6px 0;
  padding: 6px;
}

body:has(.felt-table #gameBoard) .felt-table .roulette-top {
  margin: 0 0 5px;
  grid-template-columns: minmax(78px, min(22dvh, 180px)) minmax(0, 1fr);
}

body:has(.felt-table #gameBoard) .felt-table .baccarat-hands {
  padding: 5px 0;
  gap: 7px;
}

body:has(.felt-table #gameBoard) .company-table.isn-seated-group {
  min-height: 0;
  padding: 2px 5% 3px;
  margin: 0 0 3px;
  align-items: end;
}

body:has(.felt-table #gameBoard) .company-table.isn-seated-group .seated-figure {
  height: clamp(46px, 12dvh, 100px);
}

body:has(.felt-table #gameBoard) .company-table.isn-seated-group .seated-figure :is(img, svg.vip-portrait) {
  height: clamp(58px, 15dvh, 132px) !important;
}

body:has(.felt-table #gameBoard) .company-table.isn-seated-group .seated-reaction-button {
  top: auto;
  bottom: 4px;
  right: 0;
}

body:has(.felt-table #gameBoard) .company-table.isn-seated-group article {
  transform: none;
}

body:has(.felt-table #gameBoard) .company-table.isn-seated-group article p {
  min-height: 0;
  margin: 3px 0;
  line-height: 1.1;
}

@media (max-width: 650px) {
  body[data-isn-room] #gameDialog:not(.poker-fit) .game-room-started .table-stage:has(.isn-seated-group) {
    margin-top: clamp(55px, 11dvh, 85px);
    padding: clamp(68px, 11dvh, 88px) 3% 24px;
    background-size: 100% 100%;
    background-position: center;
  }

  body[data-isn-room] #gameDialog:not(.poker-fit) .game-room-started .table-center {
    padding: 5px 3px;
  }

  body:has(.felt-table #gameBoard) .felt-table {
    padding: 9px max(12px, 4%) 13px;
  }

  body:has(.felt-table #gameBoard) .company-table.isn-seated-group {
    gap: 2px;
    padding-inline: 4px;
  }

  body:has(.felt-table #gameBoard) .company-table.isn-seated-group article p {
    font-size: 9px;
  }
}

@media (max-height: 500px) and (orientation: landscape) {
  body:has(.felt-table #gameBoard) .table-marquee p {
    font-size: 8px;
  }

  body:has(.felt-table #gameBoard) .felt-table .roulette-top {
    grid-template-columns: 70px minmax(0,1fr);
  }

  body:has(.felt-table #gameBoard) .play-layout {
    grid-template-columns: minmax(0,1.8fr) minmax(190px,.9fr);
    align-items: start;
    gap: 8px;
  }
}