.btn {
    width: fit-content;
    height: 3rem;
    padding: 0 var(--padding-size);
    color: var(--color-info-text);
    font-weight: bold;
    text-transform: uppercase;   
    letter-spacing: 0.06rem;      
    box-sizing: border-box;
    transition: var(--transition-global); 
    border: var(--border-size) solid var(--dezent-rgba);
    border-radius: var(--border-radius-variant);
    outline: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap-size);
}

.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-primary:hover, 
.btn-primary.active {
    background-color: var(--color-primary-variant);
    border-color: var(--color-primary-variant);
}

.btn-secondary {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
}

.btn-secondary:hover, 
.btn-secondary.active {
    background-color: var(--color-secondary-variant);
    border-color: var(--color-secondary-variant);
}

.btn-remove {
    background-color: var(--color-remove);
    border-color: var(--color-remove);
}

.btn-remove:hover, 
.btn-remove.active {
    background-color: var(--color-remove-variant);
    border-color: var(--color-remove-variant);
}

.btn.active {
    transform: scale(0.8);
}