/* Pepper table (ui/pepper.js). Builds on the Euchre table styles (ui/euchre.css, eu-*); only pp-* additions here. */

/* bids shown on the seats and in the bidding list */
.pp .pp-bidline { display: block; color: var(--gold); font-weight: 700; }
.pp .pp-bidline.muted { color: var(--muted); font-weight: 600; }
.pp-bids-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; text-align: left; }
.pp-bids-list li {
  display: flex; justify-content: space-between; gap: .75rem; align-items: baseline;
  padding: .35rem .6rem; border-radius: 10px; background: rgba(255, 255, 255, .06); border: 2px solid transparent;
}
.pp-bids-list li span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pp-bids-list li b { flex: none; }
.pp-bids-list li.bid b { color: var(--gold); }
.pp-bids-list li.now { border-color: var(--gold); }

/* the high bid in the trump box, and negative scores */
.pp .eu-suit.pp-high { font-size: 1.35rem; color: #fff; }
.pp .eu-score.pp-neg { color: var(--bad); }

/* bid buttons: 3 4 5 6 in one row, the two peppers in the next */
.pp-bid .actions { margin: .25rem 0 .5rem; }
.pp-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pp-peppers { display: grid; grid-template-columns: 1fr 1fr; }
.pp-num { min-width: 0; padding-left: .3rem; padding-right: .3rem; font-size: 1.25rem; }
.pp-pepper { min-width: 0; padding-left: .5rem; padding-right: .5rem; background: var(--red); border-color: var(--red); color: #fff; }
.pp-hint { margin: 0 0 .25rem; }

/* seven cards while the pepper bidder discards: fit one row at 360px */
.pp .eu-hand.pp-seven { gap: .22rem; }
.pp .eu-hand.pp-seven .card { width: 2.65rem; height: 3.9rem; }
.pp .eu-hand.pp-seven .card .corner { font-size: .85rem; }
.pp .eu-hand.pp-seven .card .pip { font-size: 1.35rem; }