body {
    background-color: #040D12;
    color: #93B1A6;
}

/* Override Skeleton inputs for dark theme */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
    background-color: #183D3D;
    color: #93B1A6;
    border: 1px solid #5C8374;
}

input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    border: 1px solid #93B1A6;
}

.button,
button {
    background-color: #183D3D;
    color: #93B1A6;
    border-color: #5C8374;
}

.button:hover,
button:hover {
    background-color: #5C8374;
    color: #183D3D;
    border-color: #93B1A6;
}

.button.button-primary,
button.button-primary {
    background-color: #5C8374;
    color: #040D12;
    border-color: #5C8374;
}

.button.button-primary:hover,
button.button-primary:hover {
    background-color: #93B1A6;
    color: #040D12;
    border-color: #93B1A6;
}

.button.button-primary:focus,
button.button-primary:focus {
    background-color: #5C8374;
    color: #040D12;
    border-color: #93B1A6;
    box-shadow: 0 0 10px rgba(147, 177, 166, 0.7);
    outline: none;
}

.button:focus,
button:focus {
    background-color: #183D3D;
    color: #93B1A6;
    border-color: #93B1A6;
    box-shadow: 0 0 10px rgba(147, 177, 166, 0.5);
    outline: none;
}

.button.button-primary:active,
button.button-primary:active {
    background-color: #93B1A6;
    border-color: #93B1A6;
    color: #040D12;
}

.button:active,
button:active {
    background-color: #5C8374;
    border-color: #93B1A6;
    color: #183D3D;
}

#output p {
    font-size: 1.5rem;
    border-bottom: 1px solid #183D3D;
    padding: 10px 0;
}

/* Checkbox layout */
.checkbox-group {
    display: flex;
    justify-content: space-between;
}

@media (max-width: 550px) {
    .checkbox-group {
        margin-top: -1.5rem;
    }
}