/*
 * Chessground 보드 반응형 스타일링
 * CDN CSS(base, brown, cburnett)와 함께 사용
 */

/* 반응형 보드 컨테이너 — 뷰포트에 맞게 확장 */
.board-container {
  width: 100%;
  max-width: min(calc(100vh - 200px), 100%);
  aspect-ratio: 1;
  margin: 0 auto;
  position: relative;
}

/* chessground 보드가 컨테이너를 채우도록 */
.board-container cg-container {
  width: 100% !important;
  height: 100% !important;
}

/* 합법수 표시 점 (초록) */
.board-container .cg-shapes circle {
  opacity: 0.4;
}

/* 프리무브 하이라이트 */
.board-container square.premove-dest {
  background: radial-gradient(rgba(20, 85, 30, 0.5) 19%, rgba(0, 0, 0, 0) 20%);
}

/* 체크 표시 강화 */
.board-container square.check {
  background: radial-gradient(
    ellipse at center,
    rgba(255, 0, 0, 1) 0%,
    rgba(231, 0, 0, 1) 25%,
    rgba(169, 0, 0, 0) 89%,
    rgba(158, 0, 0, 0) 100%
  );
}

/* 마지막 수 하이라이트 (다크 테마 보정) */
.board-container square.last-move {
  background-color: rgba(155, 199, 0, 0.41);
}

/* 모바일 터치 영역 확대 */
@media (max-width: 640px) {
  .board-container {
    max-width: 100vw;
    padding: 0;
  }
}

/* 데스크탑에서 보드 — 뷰포트 높이에 맞게 확장 (상한 없음) */
@media (min-width: 1024px) {
  .board-container {
    max-width: calc(100vh - 160px);
  }
}

/* 전체화면 모드 */
.board-fullscreen {
  position: fixed !important;
  inset: 0;
  z-index: 60;
  background: #18181b;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  gap: 16px;
}

.board-fullscreen .board-container {
  max-width: min(calc(100vh - 80px), calc(100vw - 400px)) !important;
  width: min(calc(100vh - 80px), calc(100vw - 400px)) !important;
}

.board-fullscreen .fullscreen-close-btn {
  position: absolute;
  top: 12px;
  right: 16px;
  z-index: 70;
}

.board-fullscreen .fullscreen-move-panel {
  width: 320px;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  flex-shrink: 0;
}

/* 전체화면 시 상단 네비/하단 탭/서브탭/푸터 숨김 */
body.fullscreen-active > header,
body.fullscreen-active > nav,
body.fullscreen-active > footer,
body.fullscreen-active > main {
  display: none !important;
}

body.fullscreen-active {
  overflow: hidden;
}

@media (max-width: 768px) {
  .board-fullscreen .board-container {
    max-width: min(calc(100vh - 80px), calc(100vw - 32px)) !important;
    width: min(calc(100vh - 80px), calc(100vw - 32px)) !important;
  }
  .board-fullscreen .fullscreen-move-panel {
    display: none;
  }
}

/* 퍼즐 힌트 깜박이는 동그라미 */
@keyframes puzzle-hint-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(250, 204, 21, 0.4);
  }
  50% {
    opacity: 0.6;
    transform: scale(1.1);
    box-shadow: 0 0 12px 4px rgba(250, 204, 21, 0.3);
  }
}

/* 커스텀 체스 피스 공통 */
.cg-wrap piece {
  background-size: 75% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* 기물별 크기 조정 */
.cg-wrap piece.bishop {
  background-size: 55% !important;
}
.cg-wrap piece.queen {
  background-size: 85% !important;
}
.cg-wrap piece.rook {
  background-size: 60% !important;
}
.cg-wrap piece.knight {
  background-size: 70% !important;
}
.cg-wrap piece.pawn {
  background-size: 55% !important;
}

/* 커스텀 체스 피스 (cburnett 오버라이드) */
.cg-wrap piece.king.white {
  background-image: url("/chess_pieces/m_W_King.png") !important;
}
.cg-wrap piece.queen.white {
  background-image: url("/chess_pieces/m_W_Queen.png") !important;
}
.cg-wrap piece.rook.white {
  background-image: url("/chess_pieces/m_W_Rook.png") !important;
}
.cg-wrap piece.bishop.white {
  background-image: url("/chess_pieces/m_W_Bishop.png") !important;
}
.cg-wrap piece.knight.white {
  background-image: url("/chess_pieces/m_W_Knight.png") !important;
}
.cg-wrap piece.pawn.white {
  background-image: url("/chess_pieces/m_W_Pawn.png") !important;
}
.cg-wrap piece.king.black {
  background-image: url("/chess_pieces/m_B_King.png") !important;
}
.cg-wrap piece.queen.black {
  background-image: url("/chess_pieces/m_B_Queen.png") !important;
}
.cg-wrap piece.rook.black {
  background-image: url("/chess_pieces/m_B_Rook.png") !important;
}
.cg-wrap piece.bishop.black {
  background-image: url("/chess_pieces/m_B_Bishop.png") !important;
}
.cg-wrap piece.knight.black {
  background-image: url("/chess_pieces/m_B_Knight.png") !important;
}
.cg-wrap piece.pawn.black {
  background-image: url("/chess_pieces/m_B_Pawn.png") !important;
}

/* 관전 리액션 애니메이션 (D-53) */
@keyframes fade-up {
  0% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-40px); }
}

.reaction-animation {
  animation: fade-up 1.5s ease-out forwards;
  position: absolute;
  font-size: 2rem;
  pointer-events: none;
}