/* Minimal local styles for chessboard.js */

/* Board container */
.board-b72b1,
.chessboard-63f37 {
  border: 2px solid #1f2937;
  box-sizing: content-box;
  background: #020617; /* dark frame behind the grid */
  box-shadow: 0 0 20px rgba(15, 23, 42, 0.9);
}

/* Each square – chessboard.js sets width/height inline */
.square-55d63 {
  float: left;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  /* 🔲 add a subtle grid so squares are easy to see */
  border: 1px solid #1f2937;
  box-sizing: border-box;
}

/* Piece images inside squares */
.square-55d63 img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ♟ Light / dark squares – much brighter contrast now */
.white-1e1d7 {
  background: #e5e7eb !important;  /* light gray */
}

.black-3c85d {
  background: #111827 !important;  /* deep navy */
}

/* Optional highlight for moves */
.highlight-square {
  box-shadow: inset 0 0 0 2px rgba(56, 189, 248, 0.8) !important;
}

/* Clearfix used by chessboard.js */
.clearfix-7da63 {
  clear: both;
}

/* Highlight the square we clicked/dragged from */
.square-55d63.highlight-source {
  box-shadow: inset 0 0 0 3px rgba(56, 189, 248, 0.9) !important; /* cyan */
}

/* Highlight legal destination squares */
.square-55d63.highlight-move {
  box-shadow: inset 0 0 0 3px rgba(52, 211, 153, 0.9) !important; /* green */
}
