/* /Pages/Home.razor.rz.scp.css */
.white[b-p1omuvtjcp] {
    color: white;
    text-shadow: -1px -1px 0 black, 1px -1px 0 black, 1px 1px 0 black, 1px 1px 0 black, 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em black;
}
/* /Pages/SudokuGrid.razor.rz.scp.css */
.sudoku-grid[b-7hdqyx0vr8] {
    /*border-collapse: collapse;*/
    border: dashed 1px #000;
    margin: 1vw auto;
    width: fit-content;
    aspect-ratio: 1/1;
    background-color: #2c2f33; /* Subtle dark background */
}

    .sudoku-grid td[b-7hdqyx0vr8] {
        width: 3vw;
        aspect-ratio: 1 /1; /* Force a square aspect ratio */
        text-align: center;
        padding: 0;
    }

    .sudoku-grid input[type="text"][b-7hdqyx0vr8] {
        border: 1px solid black; /* Grid border */
        width: 3vw;
        aspect-ratio: 1 /1; /* Force a square aspect ratio */
        font-size: 2vw;
        text-align: center;
        color: #fff; /* White text */
        font-weight: bold;
        box-sizing: border-box;
    }



button[b-7hdqyx0vr8] {
    margin: 20px;
    padding: 10px 20px;
    font-size: 16px;
    background-color: #444;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

    button:hover[b-7hdqyx0vr8] {
        background-color: #555;
    }

.sudoku-solved[b-7hdqyx0vr8] {
    font-size: 3rem;
    background-color: #00Ff00;
    color: #fff;
    padding: 1vw;
    border-radius: 4px;
    margin: 20px;
    text-align: center;
    /* Text Shadow Property */
    text-shadow: -1px -1px 0 black, 1px -1px 0 black, 1px 1px 0 black, 1px 1px 0 black, 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em black;
}

.sudoku-unsolved[b-7hdqyx0vr8] {
    font-size: 3rem;
    background-color: #CC0000;
    color: #fff;
    padding: 1vw;
    border-radius: 4px;
    margin: 20px;
    text-align: center;
    /* Text Shadow Property */
    text-shadow: -1px -1px 0 black, 1px -1px 0 black, 1px 1px 0 black, 1px 1px 0 black, 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em black;
}

.invalid-cell[b-7hdqyx0vr8] {
    background-color: red;
    color: white;
    border: 5px solid red;
}

.green[b-7hdqyx0vr8] {
    background-color: green;
    background-color: #3c3f44; /* Darker input background */
}

.green:focus[b-7hdqyx0vr8] {
    background-color: #565a60; /* Slightly lighter for focus */
}


form-select[b-7hdqyx0vr8] {
    padding: .5rem 1rem;
    font-size: .75rem;
    background-color: #444;
    color: white;
    border: none;
    border-radius: .2rem;
    cursor: pointer;
}

    form-select:hover[b-7hdqyx0vr8] {
        background-color: #555;
    }

.controls[b-7hdqyx0vr8] {
    position: absolute;
    float: left;
    top: 10px;
    left: 10px;
}