/* public/games/poker/poker.css */
body { overflow: hidden; height: 100vh; }

.poker-layout { display: flex; height: 100vh; position: relative; z-index: 1; }

/* ── Settlement sidebar ───────────────────────────────── */
.settle-sidebar {
  width: 195px; flex-shrink: 0;
  background: rgba(5,7,8,.97);
  border-right: 1px solid rgba(195,155,90,.12);
  padding: 1.1rem .9rem;
  display: flex; flex-direction: column;
  overflow-y: auto;
}
/* A1.T11: sidebar empty state — bumped from text-dim italic to text-mid */
.sidebar-empty {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: .82rem;
  color: var(--text-mid);
  text-align: center;
  padding: .5rem 0;
}
.sb-player { display:flex; justify-content:space-between; align-items:center; padding:.25rem 0; font-size:.78rem; border-bottom:1px solid rgba(255,255,255,.05); }
.sb-pname  { font-family:var(--font-serif); color:var(--text-mid); }
.sb-pnet   { font-family:var(--font-display); font-size:.7rem; }
.sb-pnet.pos { color:var(--green-live); }
.sb-pnet.neg { color:#E05050; }

/* ── Table layout ─────────────────────────────────────── */
.table-main { flex:1; display:flex; flex-direction:column; min-width:0; }
.table-wrap { flex:1; display:flex; align-items:center; justify-content:center; padding:.75rem; min-height:0; }
.table-outer { position:relative; width:100%; max-width:860px; aspect-ratio:2/1; }

/* ── Table rail — A1.T08 ──────────────────────────────── */
/* Richer wood-grain gradient, stronger shadow for physical depth */
.table-rail {
  position: absolute; inset: 0; border-radius: 50%;
  background: radial-gradient(ellipse at 30% 20%,
    #6b4518 0%,
    #4a2810 35%,
    #3D1F0A 65%,
    #2a1408 100%
  );
  box-shadow:
    0 22px 65px rgba(0,0,0,.9),
    0 0 0 1.5px rgba(195,155,90,.22),
    0 0 0 3px rgba(0,0,0,.5),
    inset 0 2px 4px rgba(255,255,255,.05),
    inset 0 -2px 8px rgba(0,0,0,.4);
}

/* ── Table felt — A1.T08 ──────────────────────────────── */
/* Richer directional gradient; SVG noise overlay baked into felt-texture */
.table-felt {
  position: absolute; inset: 17px; border-radius: 50%;
  background: radial-gradient(ellipse at 40% 35%,
    var(--felt-light) 0%,
    var(--felt) 30%,
    #164a2e 65%,
    var(--felt-dark) 100%
  );
  box-shadow:
    inset 0 0 65px rgba(0,0,0,.5),
    inset 0 2px 8px rgba(0,0,0,.3);
}

/* A1.T08: felt texture — SVG noise overlay at low opacity */
.felt-texture {
  position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  /* Diagonal weave + noise layered */
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E"),
    repeating-linear-gradient(45deg, rgba(0,0,0,.025) 0px, rgba(0,0,0,.025) 1px, transparent 1px, transparent 9px);
  opacity: 1;
}

/* Gold inner ring — slightly more visible */
.felt-inner-ring {
  position: absolute; inset: 9px; border-radius: 50%;
  border: 1px solid rgba(195,155,90,.18);
  pointer-events: none;
}

/* ── Pot display ──────────────────────────────────────── */
/* A1.T10: pot label contrast bump */
.pot-display { position:absolute; top:13%; left:50%; transform:translateX(-50%); text-align:center; }
.pot-label {
  display: block;
  font-family: var(--font-display);
  font-size: 8px;
  letter-spacing: .35em;
  /* was rgba(195,155,90,.45) — bumped */
  color: rgba(195,155,90,.7);
  text-shadow: 0 0 10px rgba(195,155,90,.25);
  margin-bottom: 3px;
}
.pot-val {
  font-family: var(--font-display);
  font-size: 1.15rem;
  color: var(--gold);
  text-shadow: 0 0 22px rgba(195,155,90,.45), 0 2px 4px rgba(0,0,0,.5);
}

/* ── Community cards — A1.T04 ─────────────────────────── */
/* 48×70 → 80×116. Slots sized to match. */
.community-cards {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -42%);
  display: flex;
  gap: 9px;
}
.cc-slot {
  width: var(--card-w-lg);
  height: var(--card-h-lg);
  border-radius: 6px;
  border: 1px dashed rgba(195,155,90,.18);
  background: rgba(0,0,0,.22);
  /* subtle inner glow on empty slots */
  box-shadow: inset 0 0 12px rgba(0,0,0,.3);
}
.cc-slot .card {
  width: var(--card-w-lg);
  height: var(--card-h-lg);
  border-radius: 6px;
}
/* Scale card typography for larger community cards */
.cc-slot .card .c-rank { font-size: 1.35rem; }
.cc-slot .card .c-suit { font-size: 2rem; }
.cc-slot .card .c-corner,
.cc-slot .card .c-corner-b { font-size: .72rem; }

/* ── Phase label — A1.T10 ─────────────────────────────── */
/* was rgba(195,155,90,.35) — bumped */
.phase-label {
  position: absolute; bottom: 13%; left: 50%; transform: translateX(-50%);
  font-family: var(--font-display);
  font-size: 8.5px;
  letter-spacing: .35em;
  color: rgba(195,155,90,.6);
  text-shadow: 0 0 10px rgba(195,155,90,.2);
  text-transform: uppercase;
}

/* ── Seat ring ────────────────────────────────────────── */
.seats-ring { position:absolute; inset:0; }

.seat { position:absolute; transform:translate(-50%,-50%); }
#seat0 { left:50%;  top:-6%;  }
#seat1 { left:81%;  top:9%;   }
#seat2 { left:100%; top:50%;  }
#seat3 { left:81%;  top:91%;  }
#seat4 { left:50%;  top:106%; }
#seat5 { left:19%;  top:91%;  }
#seat6 { left:0%;   top:50%;  }
#seat7 { left:19%;  top:9%;   }

/* A1.T05: widened from 86px → 112px to accommodate larger hole cards */
.seat-inner { text-align:center; width:112px; }

/* Sit button */
.sit-btn {
  background: rgba(195,155,90,.07);
  border: 1px dashed rgba(195,155,90,.3);
  color: rgba(195,155,90,.55); /* A1.T10: was .45 */
  font-family: var(--font-display);
  font-size: 8.5px; letter-spacing: .1em;
  padding: .4rem .6rem; cursor: pointer;
  transition: all .2s; white-space: nowrap;
}
.sit-btn:hover { background:rgba(195,155,90,.15); border-color:var(--gold); color:var(--gold); }

/* Avatar */
.seat-av {
  border-radius: 50%;
  width: 46px; height: 46px; object-fit: cover;
  border: 2px solid rgba(195,155,90,.3);
  display: block; margin: 0 auto .3rem;
  background: #1a3a22;
  box-shadow: 0 3px 10px rgba(0,0,0,.45);
}
/* A1.T01: name/chip labels bumped to text-mid */
.seat-name  {
  font-family: var(--font-serif);
  font-size: .8rem;
  color: var(--text-mid);  /* was var(--text) at low-contrast */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.seat-chips {
  font-family: var(--font-display);
  font-size: .64rem;
  color: var(--gold);
  margin-top: .1rem;
  text-shadow: 0 0 8px rgba(195,155,90,.25);
}

/* ── Hole cards — A1.T05 ──────────────────────────────── */
/* 26×38 → 44×64 */
.seat-cards { display:flex; gap:4px; justify-content:center; margin-top:.3rem; }
.seat-cards .card {
  width: var(--card-w-sm);
  height: var(--card-h-sm);
  border-radius: 4px;
}
.seat-cards .card .c-rank { font-size: .82rem; }
.seat-cards .card .c-suit { font-size: 1.2rem; }
/* corners hidden on hole cards — too small to be useful even at 44×64 */
.seat-cards .card .c-corner,
.seat-cards .card .c-corner-b { display:none; }

/* ── Seat states ──────────────────────────────────────── */
.seat-inner.is-turn .seat-av {
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(195,155,90,.25), 0 0 18px rgba(195,155,90,.55);
}
.seat-inner.is-me .seat-av {
  border-color: var(--green-live);
  box-shadow: 0 0 0 2px rgba(76,175,80,.2), 0 0 12px rgba(76,175,80,.35);
}
.seat-inner.folded { opacity: .32; }

/* Turn ring pulse */
.turn-ring {
  position: absolute; top: -6px; left: 50%; transform: translateX(-50%);
  width: 58px; height: 58px; border-radius: 50%;
  border: 2px solid var(--gold);
  box-shadow: 0 0 14px rgba(195,155,90,.55);
  animation: turnPulse 1.2s ease infinite;
  pointer-events: none;
}
@keyframes turnPulse {
  0%,100% { opacity:1; transform:translateX(-50%) scale(1); }
  50%      { opacity:.4; transform:translateX(-50%) scale(1.07); }
}

/* ── Status bar ───────────────────────────────────────── */
.status-bar {
  flex-shrink: 0;
  background: rgba(5,7,8,.96);
  border-top: 1px solid rgba(195,155,90,.1);
  padding: .65rem 1.25rem;
  display: flex; align-items: center; justify-content: center;
  gap: 1rem;
}
/* A1.T11: empty state text bumped from text-mid italic to readable */
.status-text {
  font-family: var(--font-serif);
  font-style: italic;
  color: var(--text-mid);
  font-size: .95rem;
}
.status-text.gold { color: var(--gold); text-shadow: 0 0 12px rgba(195,155,90,.3); }

/* ── Action bar ───────────────────────────────────────── */
.action-bar {
  flex-shrink: 0;
  background: rgba(5,7,8,.96);
  border-top: 1px solid rgba(195,155,90,.12);
  padding: .7rem 1.25rem;
}
.timer-track {
  height: 3px; /* slightly thicker — easier to read */
  background: rgba(195,155,90,.1);
  margin-bottom: .65rem;
  overflow: hidden;
  border-radius: 2px;
}
.timer-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold), var(--gold-light));
  width: 100%;
  transition: width 1s linear;
  border-radius: 2px;
}
.action-btns {
  display: flex; gap: .5rem; align-items: center;
  flex-wrap: wrap; justify-content: center;
}
.action-btns .btn { font-size: .7rem; padding: .58rem 1.1rem; }
.raise-input {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(195,155,90,.22);
  color: var(--text);
  font-family: var(--font-display);
  font-size: .7rem;
  padding: .56rem .5rem;
  width: 88px; outline: none; text-align: center;
  transition: border-color .2s;
}
.raise-input:focus { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(195,155,90,.1); }

/* ── Chat bar ─────────────────────────────────────────── */
.chat-bar {
  flex-shrink: 0; height: 80px;
  display: flex; flex-direction: column;
  border-top: 1px solid rgba(195,155,90,.07);
}
/* A1.T01: chat messages bumped from text-dim to text-mid */
.chat-msgs {
  flex: 1; overflow-y: auto;
  padding: .35rem 1.25rem;
  font-family: var(--font-serif);
  font-size: .78rem;
  color: var(--text-mid);
}
.chat-msgs div { padding: .08rem 0; }
/* A1.T01: chat input bumped from .18 opacity placeholder to .35 */
.chat-in {
  background: transparent; border: none;
  border-top: 1px solid rgba(195,155,90,.07);
  color: var(--text-mid);
  font-family: var(--font-serif);
  font-size: .78rem;
  padding: .38rem 1.25rem; outline: none;
}
.chat-in::placeholder { color: rgba(237,224,196,.35); }