@import "tailwindcss";

@layer components {
    html {
        background-color: rgb(230, 230, 230);
    }

    .btn {
        border: 1px solid black;
        border-radius: 5px;
        padding: 4px;
        cursor: pointer;
        height: fit-content;
    }

    .btn:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }

    .inputField {
        padding: 8px;
    }

    .card {
        border: 1px solid black;
        border-radius: 5px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: larger;
        font-weight: bold;
        cursor: pointer;
    }

    .card:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }
}
