/* Three card poker: a royal purple felt, the dealer's three cards at the top
   and six seats with pair plus, ante and play circles. Loaded after kit.css. */

.kt-tcp {
  --felt: #3a1d58;
  --felt-hi: #5a3186;
  --felt-deep: #1e0d33;
}

.tcp-felt .k-print {
  top: 29%;
}

.tcp-felt .felt-msg {
  top: 42%;
}

@media (min-width: 761px) {
  .tcp-felt .seat {
    width: min(15.5%, 168px);
  }
}

.tcp-felt .hand {
  min-height: calc(var(--pw) * 1.4);
}

.tcp-felt .hand .pc + .pc {
  margin-left: calc(var(--pw) * -0.3);
}

.tcp-felt .seat[data-kind="you"] .hand .pc + .pc {
  margin-left: 4px;
}

.tcp-felt .c-pair {
  border-color: rgba(246, 215, 125, 0.8);
}

.tcp-felt .c-pair .c-label {
  font-size: 6.5px;
  line-height: 1.1;
  text-align: center;
}

.tcp-felt .c-play {
  border-style: dashed;
}

/* four circles per seat: 6 card bonus, pair plus, ante, play */
.tcp-felt .circle {
  width: 36px;
  height: 36px;
}

.tcp-felt .circles {
  gap: 4px;
}

.tcp-felt .c-six {
  border-color: rgba(160, 205, 255, 0.75);
}

.tcp-felt .c-six .c-label {
  font-size: 5.5px;
  line-height: 1.1;
  text-align: center;
}

@media (max-width: 760px) {
  .tcp-felt {
    min-height: 540px;
  }

  .tcp-felt .seat[data-kind="you"] .hand .pc + .pc {
    margin-left: calc(var(--pw) * -0.2);
  }

  .tcp-felt .c-pair .c-label,
  .tcp-felt .c-six .c-label {
    font-size: 4.6px;
  }

  .tcp-felt .circles {
    gap: 2px;
  }

  .tcp-felt .circle {
    width: 27px;
    height: 27px;
  }

  .tcp-felt .kchip {
    min-width: 20px;
    height: 20px;
    font-size: 8.5px;
  }
}