/* Poker — walnut room, casino-green oval with a rail, card-stock tiles. */

body[data-theme="poker"] {
  --font-display: "Georgia", "Palatino Linotype", serif;
  --font-body: "Verdana", "Helvetica Neue", sans-serif;
  --font-tile-num: Georgia, serif;

  --bg: #1c1410;
  --panel: #2b1f17;
  --ink: #efe6d8;
  --ink-soft: #c4b39d;
  --ink-faint: #8a7a64;

  --accent: #d4af37;             /* casino gold */
  --accent-deep: #e6c65c;
  --accent-ink: #241a08;
  --mahj-bg: #a02020;            /* the red chip */
  --mahj-ink: #ffe9e0;

  /* The table: deep green oval glow inside a walnut-and-gold rail. */
  --felt: radial-gradient(ellipse at 50% 32%, #2e7d4f, #175231 65%, #0e3d22);
  --felt-ink: #bfe3cb;
  --felt-shadow: inset 0 0 0 7px #4e3627, inset 0 0 0 9px #d4af3788,
                 inset 0 0 0 10px #4e3627, inset 0 12px 44px rgba(0, 0, 0, .55);

  --chip-bg: #3d2c20;
  --chip-ink: #e6c65c;
  --east-bg: #d4af37;
  --east-ink: #241a08;

  /* Card stock, with the classic red cross-hatch back. */
  --tile-bg: linear-gradient(178deg, #fffdf8, #f3ecdd);
  --tile-border: 1px solid #b8ab92;
  --tile-shadow: 0 3px 6px rgba(0, 0, 0, .5);
  --tile-back: repeating-linear-gradient(45deg, #9c2020 0 4px, #8a1a1a 4px 8px),
               repeating-linear-gradient(-45deg, transparent 0 4px, rgba(0, 0, 0, .18) 4px 8px);
  --tile-back-border: 2px solid #f3ecdd;
  --tile-num: #22232a;
  --tile-sub: #8a7a64;
  --tile-joker-bg: linear-gradient(178deg, #f4e9f7, #e6d3ec);
  --tile-flower-bg: linear-gradient(178deg, #eef6e8, #dcecd2);
  --exposure-bg: rgba(212, 175, 55, .15);

  --radius-panel: 18px;
  --radius-btn: 7px;
  --radius-tile: 7px;
  --btn-bg: #3d2c20;
  --btn-ink: #efe6d8;
  --btn-border: 1.5px solid #56402e;
  --input-border: 1.5px solid #56402e;
  --shadow: 0 4px 14px rgba(0, 0, 0, .5);
  --shadow-hover: 0 6px 16px rgba(0, 0, 0, .6);

  --anim-tile-in: .22s;
  --anim-tile-in-dy: 10px;

  --cs-a: #86b7e8;
  --cs-b: #e08a8a;
  --cs-c: #8ed0a2;
  --cs-f: #e6c65c;
}

body[data-theme="poker"] .tile { color: #22232a; }

/* Card-face pips for all three suits. */
body[data-theme="poker"] .tile[data-suit] .t-glyph {
  white-space: pre-line;
  font-size: .82rem;
  line-height: 1.3;
  letter-spacing: 3px;
  text-indent: 3px;
  text-align: center;
  font-weight: 900;
}
body[data-theme="poker"] .tile[data-suit="dot"] .t-glyph { color: #b8860b; }
body[data-theme="poker"] .tile[data-suit="bam"] .t-glyph { color: #1f4d2e; font-size: .95rem; }
body[data-theme="poker"] .tile[data-suit="crak"] .t-glyph { color: #b02030; font-size: .95rem; }
body[data-theme="poker"] .tile.small[data-suit] .t-glyph {
  font-size: .46rem; line-height: 1.25; letter-spacing: 1.5px; text-indent: 1.5px;
}
body[data-theme="poker"] .tile.small[data-suit="bam"] .t-glyph,
body[data-theme="poker"] .tile.small[data-suit="crak"] .t-glyph { font-size: .55rem; }

/* Ace cards and position discs fill the face. */
body[data-theme="poker"] .tile[data-dragon] .t-glyph.svg-glyph svg { width: 1.35em; height: 1.8em; }
body[data-theme="poker"] .tile[data-wind] .t-glyph.svg-glyph svg { width: 1.7em; height: 1.7em; }

body[data-theme="poker"] #brand { color: var(--accent-deep); }
body[data-theme="poker"] .seat-label.active-turn { background: var(--accent); color: var(--accent-ink); }