/* ============================================================
   Arc 7 — Poker Cinematic Redesign — Session 1 (Table Sprite)
   ============================================================
   This file is an OVERLAY loaded AFTER /games/poker/poker.css.
   It overrides only what needs to change for the sprite swap and
   leaves everything else untouched, so animations, seats, cards,
   chips, etc. all continue to work as before.

   Why an overlay file instead of editing poker.css inline?
   ── safer rollback: delete one <link> tag and the table reverts
      to the CSS-drawn version with zero risk of dropping unrelated
      rules.
   ── cleaner diff history: this file IS the S1 diff.
   ── coordination: other AI working on roulette/blackjack can edit
      poker.css without merge conflicts.
   ============================================================ */

/* ── A7.S1.1 — Aspect ratio matches sprite ─────────────────
   Sprite is 1545×785 (after second-pass alpha cleanup). */
.table-outer {
  aspect-ratio: 1545 / 785;
}

/* ── A7.S1.2 — The sprite IS the table ────────────────────
   Behind everything else (z:0). Pointer-events off so it never
   intercepts clicks meant for seats or cards. */
.table-sprite {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  z-index: 0;
  user-select: none;
  -webkit-user-drag: none;
}

/* ── A7.S1.3 — Hide the CSS-drawn rail and felt ────────────
   The sprite contains the wood rail, the brass inlay, the felt
   weave, and the centre compass — all baked in. The CSS rules
   below zero out the visuals on the old positioning elements
   while keeping them in the DOM as positioning containers for
   their children (community cards, pot, phase label, seats). */
.table-rail {
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.table-felt {
  inset: 5.5% 7% !important;
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  z-index: 1;
}

.table-felt .felt-texture {
  display: none !important;
}

.table-felt .felt-inner-ring {
  display: none !important;
}

/* ── A7.S1.4 — Seats stay on top ─────────────────────────
   Ensures seat ring renders above the sprite even if a child's
   stacking context shifts. */
.seats-ring {
  z-index: 2;
}

/* ── A7.S1.5 — Layout: tighten vertical space below table ──
   The original layout had .chat-bar with height:80px containing a
   large empty .chat-msgs scroll area when no messages were present.
   Visually this read as a wasted gap between the status bar
   (e.g. "Take a seat...") and the chat input ("Say something...").

   Fix: shrink .chat-bar to a single-line height, so:
     - .chat-msgs becomes a thin one-line view (most recent message visible)
     - .chat-in input still works as before
     - status bar now sits flush above the chat-bar (~36px below it instead
       of ~80px)
     - .table-wrap (flex:1) reclaims the extra space, table moves DOWN
       into where the status bar used to sit visually

   Also: push the table to the BOTTOM of its wrap with a 20px breathing
   gap, so it sits just above the status bar. */
.chat-bar {
  height: 36px !important;
}

.chat-bar .chat-msgs {
  /* Single-line scroll: shows most recent message, older ones scroll up */
  flex: 0 0 16px !important;
  padding: 0 1.25rem !important;
  font-size: .72rem !important;
  line-height: 16px !important;
}

.chat-bar .chat-in {
  padding: .25rem 1.25rem !important;
}

.table-wrap {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  align-items: center !important;
  padding: 1.5rem .75rem 1rem !important;
  min-height: 0 !important;
}

/* The table itself stays at its natural width/aspect, not stretched. */
.table-outer {
  flex-shrink: 0;
}

/* ── A7.S1.6 — Reduced motion respect (forward compat) ────
   No animations introduced in S1, but adding the empty block
   here documents that this overlay respects the existing pattern. */
@media (prefers-reduced-motion: reduce) {
  /* (S5 will add disable-animation rules here for any S5 effects) */
}

/* ── Known limitations of S1 ──────────────────────────────
   ── Felt has no overhead-light vignette baked in. Sprite is
      flat-lit. Adding a CSS radial-gradient ::before highlight
      is deferred to A7.S5 (ambient lighting).
   ── Seat0 (top, -6%) and Seat4 (bottom, 106%) sit just outside
      the table edge — boundary case with the sprite's top/bottom
      cup-holders. If avatars visually crowd the cup-holders on
      smoke test, adjust seat positions in this file:
        #seat0 { top: -10%; }
        #seat4 { top: 110%; }
   ── If community cards or pot label appear off-centre against
      the sprite's felt, adjust .table-felt inset above.
   ── Chat history is single-line view in this iteration. When real
      messages arrive, the most recent will be visible; scrolling
      older history requires scrolling within the small region.
      Acceptable for a friend-group app where chat is conversational
      not historical. If this proves too tight, lift .chat-bar
      height from 36px → 48px or 60px above.
   ============================================================ */