/*
 * CHESSTRX STUDY BOARD GRID FIX V1
 * Solo corrección visual.
 */

.chesstrx-study-board-v1 {
  display: grid !important;

  grid-template-columns:
    repeat(8, minmax(0, 1fr)) !important;

  grid-template-rows:
    repeat(8, minmax(0, 1fr)) !important;

  width: 100% !important;
  height: auto !important;

  aspect-ratio: 1 / 1 !important;

  gap: 0 !important;

  box-sizing: border-box !important;
  overflow: hidden !important;
}


/* Todas las casillas exactamente cuadradas */

.chesstrx-study-square-v1 {
  position: relative !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  height: 100% !important;

  min-width: 0 !important;
  min-height: 0 !important;

  aspect-ratio: 1 / 1 !important;

  padding: 0 !important;
  margin: 0 !important;

  box-sizing: border-box !important;

  line-height: 1 !important;

  font-size:
    clamp(26px, 9.5vw, 54px) !important;

  overflow: hidden !important;
}


/* Coordenadas sin modificar tamaño de la casilla */

.chesstrx-study-coordinate-v1 {
  position: absolute !important;

  left: 3px !important;
  bottom: 3px !important;

  margin: 0 !important;
  padding: 0 !important;

  width: auto !important;
  height: auto !important;

  line-height: 1 !important;

  font-size: 9px !important;
  font-weight: 700 !important;

  pointer-events: none !important;

  z-index: 4 !important;
}


/* Selección y recomendación no alteran dimensiones */

.chesstrx-study-square-v1.selected,
.chesstrx-study-square-v1.recommended {
  box-sizing: border-box !important;
}


/* Evita deformación en pantallas pequeñas */

@media (max-width: 600px) {

  .chesstrx-study-board-v1 {
    width: 100% !important;
    max-width: 100% !important;
  }

  .chesstrx-study-square-v1 {
    font-size:
      clamp(25px, 10vw, 47px) !important;
  }
}