const symbols = [
  '🐶','🌸','⚽','🍕','🎲','🌞','🚗','🍩',
  '⭐','🚀','🎮','💎'
];
let cards = [];
let firstCard = null;
let secondCard = null;
let lockBoard = false;
let matches = 0;
let moves = 0;
const maxMoves = 45;
let timer = 120; // segundos
let timerInterval = null;
const boardDiv = document.getElementById("game-board");
const statusDiv = document.getElementById("status");
const restartBtn = document.getElementById("restart-btn");
const movesSpan = document.getElementById("moves");
const timerSpan = document.getElementById("timer");

function shuffle(array) {
  for(let i = array.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i+1));
    [array[i], array[j]] = [array[j], array[i]];
  }
}

function startGame() {
  matches = 0;
  moves = 0;
  timer = 120;
  firstCard = null;
  secondCard = null;
  lockBoard = false;
  statusDiv.textContent = '';
  updateHUD();
  clearInterval(timerInterval);
  timerInterval = setInterval(updateTimer, 1000);
  cards = [...symbols, ...symbols];
  shuffle(cards);
  boardDiv.innerHTML = '';
  cards.forEach((symbol, idx) => {
    const card = document.createElement("div");
    card.className = "card";
    card.dataset.index = idx;
    card.dataset.symbol = symbol;
    card.textContent = '';
    card.onclick = () => flipCard(card);
    boardDiv.appendChild(card);
  });
}

function flipCard(card) {
  if (lockBoard) return;
  if (card.classList.contains('flipped') || card.classList.contains('matched')) return;

  card.classList.add('flipped');
  card.textContent = card.dataset.symbol;

  if (!firstCard) {
    firstCard = card;
    return; // ¡Esperamos por la segunda carta!
  }

  if (card === firstCard) return;
  secondCard = card;
  lockBoard = true;
  moves++;
  updateHUD();

  if (firstCard.dataset.symbol === secondCard.dataset.symbol) {
    // Es PAR
    firstCard.classList.add('matched');
    secondCard.classList.add('matched');
    matches++;

    setTimeout(() => {
      firstCard.classList.add('hide');
      secondCard.classList.add('hide');
      resetTurn();
      // Verifica victoria DESPUÉS de ocultar
      if (matches === symbols.length) {
        clearInterval(timerInterval);
        statusDiv.textContent = `¡Felicidades! Lo lograste en ${moves} movimientos y te sobraron ${timer} segs 🎉`;
        lockBoard = true; // Deshabilita el tablero tras terminar
      }
    }, 800);

  } else {
    // No es PAR
    setTimeout(() => {
      firstCard.classList.remove('flipped');
      secondCard.classList.remove('flipped');
      firstCard.textContent = '';
      secondCard.textContent = '';
      resetTurn();
    }, 900);
  }

  // DERROTA: por movimientos
  if (moves >= maxMoves) {
    endGame(false, "Has alcanzado el límite de movimientos. ¡Inténtalo otra vez!");
  }
}

function updateHUD() {
  movesSpan.textContent = `Movimientos: ${moves} / ${maxMoves}`;
  timerSpan.textContent = `Tiempo: ${timer}s`;
}

function updateTimer() {
  timer--;
  updateHUD();
  if (timer <= 0) {
    endGame(false, "¡Se acabó el tiempo!");
  }
}

function resetTurn() {
  firstCard = null;
  secondCard = null;
  lockBoard = false;
}

function endGame(win, msg) {
  lockBoard = true;
  clearInterval(timerInterval);
  statusDiv.textContent = msg;
}

restartBtn.onclick = startGame;
startGame();