﻿/* Support the Sudoku activity. */

/* *************************************************************************************** */
/* Grid section */
/* *************************************************************************************** */

.sudoku_table_main {
    margin: 0;
    padding: 0;
    border-spacing: 0;
}

/* 81 of these */
.sudoku_cell {
    border-color: black;
    border-style: solid;
    border-width: 1px;
    margin: 0;
    padding: 0;
    width: 72px; /* content, not including border */
    height: 72px;
    font-size: x-large;
}

/*.sudoku_cell_normal {
    background-color: white;
}

.sudoku_cell_highlighted {
    background-color: yellow;
}*/

/* Just one of these per cell - overlays the possibles */
.sudoku_cell_value {
    display: none;
    background-color: white;
    width: 72px;
    height: 72px;
    font-size: xx-large;
    text-align: center;
    line-height: 72px; /* aligns vertically */
    /* margin: 0; */
}

/*.sudoku_cell_value_normal {
    background-color: white;
}

.sudoku_cell_value_highlighted {
    background-color: yellow;
}*/

/* Just one of these per cell - overlays the value and holds the possibles. */
.sudoku_table_possible {
    margin: 0;
    padding: 0;
    border-spacing: 0;
}

/* Nine of these per cell */
.sudoku_cell_possible {
    padding: 0;
    padding-left: 7px;
    width: 24px;        /* Does not apply to "inline" */
    height: 24px;       /* Does not apply to "inline" */
    /* background-color: orange; */
    border-width: 0;
    color: #AAAAAA;
    font-size: medium;
}

/*.sudoku_cell_possible_normal {
    background-color: #EEF6FF;
}

.sudoku_cell_possible_highlighted {
    background-color: yellow;
}*/

/* *************************************************************************************** */
/* Control section */
/* *************************************************************************************** */

.sudoku_instructions {
    padding: 5px;
    margin: 5px;
}

.sudoku_instructions_current {
    background-color: #DDFFDD;
}

.sudoku_instructions_done {
    background-color: lightgray;
}

.sudoku_instruction_button {
    background-color: palegreen;
}

.sudoku_option {
    color: green;
}