/* ============================================================================
 * roulette-chip.css — chip-place UX ke NEW styles (roulette12/13/11).
 * Board grid/colors style.css me hain; yahan sirf chip-place interaction ke
 * additions: clickable cells, placed-chip stacks, inside-bet (split/street/corner)
 * zone anchors. index.html me casino-extra.css ke BAAD load.
 * ==========================================================================*/

/* har board cell clickable (chip place) */
.roulette .board-cell-in.rc-clickable {
  cursor: pointer;
  pointer-events: all;
}
.roulette .board-cell-in.rc-clickable.rc-susp {
  cursor: not-allowed;
}

/* placed chip visual — cell ke center me, click block na kare (dubara stack ho sake) */
.roulette .rc-placed-chip {
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.6));
}
.roulette .rc-placed-chip .bet-chip-holder {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
}
.roulette .board-cell-in .bet-chip-area.center-center {
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 16;
  pointer-events: none;
}

/* ── inside-bet zones (split/street/corner) — chhote clickable hit-areas cell ke
 *    edges/corners par. Positions standard geometry se; LIVE tuning yahin karein. ── */
.roulette .board-cell-in .bet-chip-area.rc-inside {
  position: absolute;
  width: 46%;
  height: 46%;
  z-index: 20;
  pointer-events: all;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.roulette .board-cell-in .bet-chip-area.rc-inside.rc-susp {
  cursor: not-allowed;
}
/* subtle hint dot jab chip placed na ho (taaki zone dikhe) */
.roulette .board-cell-in .bet-chip-area.rc-inside::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.28);
  transition: background 150ms ease;
}
.roulette .board-cell-in .bet-chip-area.rc-inside:hover::after {
  background: rgba(255, 223, 0, 0.9);
}
.roulette .board-cell-in .bet-chip-area.rc-inside .rc-placed-chip .bet-chip-holder {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
}

/* anchor positions (existing top-center / center-left / bottom-left ke complement) */
.roulette .board-cell-in .bet-chip-area.rc-center-right { top: 50%; right: 0; transform: translate3d(50%, -50%, 0); }
.roulette .board-cell-in .bet-chip-area.rc-top-right    { top: 0;   right: 0; transform: translate3d(50%, -50%, 0); }
.roulette .board-cell-in .bet-chip-area.rc-bottom-right { bottom: 0; right: 0; transform: translate3d(50%, 50%, 0); }
.roulette .board-cell-in .bet-chip-area.rc-bottom-center{ bottom: 0; left: 50%; transform: translate3d(-50%, 50%, 0); }
/* reuse existing top-center/center-left/bottom-left classes for other anchors */
.roulette .board-cell-in .bet-chip-area.rc-inside.top-center  { top: 0;   left: 50%; transform: translate3d(-50%, -50%, 0); }
.roulette .board-cell-in .bet-chip-area.rc-inside.center-left  { top: 50%; left: 0;   transform: translate3d(-50%, -50%, 0); }
.roulette .board-cell-in .bet-chip-area.rc-inside.bottom-left  { bottom: 0; left: 0;  transform: translate3d(-50%, 50%, 0); }

/* mobile: placed chips thode chhote taaki cell me fit rahein */
@media only screen and (max-width: 767px) {
  .roulette .rc-placed-chip .bet-chip-holder { width: 26px; height: 26px; flex: 0 0 26px; }
  .roulette .board-cell-in .bet-chip-area.rc-inside .rc-placed-chip .bet-chip-holder { width: 20px; height: 20px; flex: 0 0 20px; }
}