/* =========================================================
   KLASİK SUDOKU - TASARIM
   ========================================================= */

.game-body {
    background-color: #f4f4f0;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100vh;
    overflow-x: hidden;
}

.game-header {
    width: 100%;
    max-width: 800px;
    margin-top: 10px;
    background-color: #ffffff;
    border: 3px solid #000;
    border-radius: 8px;
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 4px 4px 0px #000;
    z-index: 10;
}

.game-layout {
    display: flex;
    gap: 30px;
    margin-top: 30px;
    max-width: 900px;
    align-items: flex-start;
}

/* OYUN ÇERÇEVESİ */
#sudoku-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

/* 9x9 SUDOKU TAHTASI */
#sudoku-board {
    display: grid;
    grid-template-columns: repeat(9, 50px);
    grid-template-rows: repeat(9, 50px);
    background-color: #fff;
    border: 4px solid #000;
    box-shadow: 6px 6px 0px #000;
}

/* HÜCRELER */
.sudoku-cell {
    width: 50px;
    height: 50px;
    border: 1px solid #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    font-weight: 700;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.1s;
}

/* 3x3 Blokları Belirginleştiren Kalın Çizgiler */
.sudoku-cell:nth-child(3n) { border-right: 3px solid #000; }
.sudoku-cell:nth-child(9n) { border-right: none; } /* En sağ kenarı çifte sınır yapmasın */
.sudoku-cell:nth-child(n+19):nth-child(-n+27),
.sudoku-cell:nth-child(n+46):nth-child(-n+54) { border-bottom: 3px solid #000; }

/* Hücre Durumları */
.sudoku-cell.fixed {
    color: #000;
    background-color: #f0f0f0; /* Oyunun verdiği sabit sayılar */
}

.sudoku-cell.user-input {
    color: #2980b9; /* Oyuncunun girdiği sayılar mavi */
}

.sudoku-cell.selected {
    background-color: #ffeaa7 !important; /* Tıklanan hücre tatlı sarı */
    border: 2px solid #e1b12c;
    z-index: 2;
}

.sudoku-cell.highlight {
    background-color: #dff9fb; /* Aynı sayının veya satır/sütunun parlaması */
}

.sudoku-cell.error {
    background-color: #ff7675; /* Hatalı giriş kırmızı */
    color: #fff;
}

/* NUMARATÖR (SAYI BUTONLARI) */
#number-pad {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 450px;
}

.num-btn {
    width: 40px;
    height: 40px;
    background-color: #fff;
    border: 2px solid #000;
    border-radius: 6px;
    font-size: 20px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 2px 2px 0px #000;
    transition: transform 0.1s, box-shadow 0.1s;
}

.num-btn:active {
    transform: translate(2px, 2px);
    box-shadow: 0px 0px 0px #000;
}

.action-btn {
    width: 60px;
    background-color: #dcdde1;
}

.game-ad {
    margin-top: 0; background-color: #fff; border: 3px solid #000; box-shadow: 4px 4px 0px #000;
}