.btn {
    color: var(--text-color-1);
    cursor: pointer;
    font-size: 1.3rem;
    padding: 0.6rem 0.7rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: all 0.2s linear 0s;
    box-shadow: 0.1rem 0.1rem 0.3rem 0.1rem var(--box-shadow);
    margin: 0.5rem;
}

.btn-1 {
    color: var(--text-color-1);
    background-color: var(--btn-color-1);
}

.btn-1:hover {
    background-color: var(--btn-color-1-hover);
}

.btn-2 {
    color: var(--text-color-1);
    background-color: var(--btn-color-2);
    box-shadow: none;
}

.btn-2:hover {
    background-color: var(--item-color-1);
    box-shadow: 0.1rem 0.1rem 0.3rem 0.1rem var(--box-shadow);
}

.btn-success {
    background-color: #1dad24;
}

.btn-success:hover {
    background-color: #16851c;
}

.btn-warning {
    background-color: #a4a700;
}

.btn-warning:hover {
    background-color: #898b00;
}

.btn-danger {
    background-color: #c90c0c;
}

.btn-danger:hover {
    background-color: #960b0b;
}

.btn:disabled {
    background-color: var(--background-color-3);
    box-shadow: none;
}