.btn {
    transition: none;
    padding: 0.625rem 1rem;
    font-weight: 600;
    --bs-btn-border-radius: var(--border-radius);
}

.btn::first-letter {
    text-transform: uppercase;
}

.btn-primary {
    --bs-btn-color: var(--primary-default-text);
    --bs-btn-bg: var(--primary-default-background);
    --bs-btn-border-color: var(--primary-default-background);
}

.btn-primary:hover {
    --bs-btn-hover-color: var(--primary-hover-text);
    --bs-btn-hover-bg: var(--primary-hover-background);
    --bs-btn-hover-order-color: var(--primary-hover-background);
}

.btn-primary:active {
    --bs-btn-active-color: var(--primary-active-text);
    --bs-btn-active-bg: var(--primary-active-background);
    --bs-btn-active-border-color: var(--primary-active-background);
}

.btn-primary:focus,
.btn-primary:focus-visible {
    --bs-btn-focus-color: var(--primary-focus-text);
    --bs-btn-focus-bg: var(--primary-focus-background);
    --bs-btn-focus-border-color: var(--primary-focus-background);
}

.btn-primary:focus-visible {
    outline-offset: 4px;
    outline: 2px solid var(--black);
}

.btn-primary:disabled,
.btn-primary.disabled {
    --bs-btn-disabled-color: var(--primary-disabled-text);
    --bs-btn-disabled-bg: var(--primary-disabled-background);
    --bs-btn-disabled-border-color: var(--primary-disabled-background);
    pointer-events: none;
    cursor: default;
}

.btn-default {
    --bs-btn-color: var(--secondary-default-text);
    --bs-btn-bg: var(--secondary-default-background);
    --bs-btn-border-color: var(--secondary-default-background);
}

.btn-default:hover {
    --bs-btn-hover-color: var(--secondary-hover-text);
    --bs-btn-hover-bg: var(--secondary-hover-background);
    --bs-btn-hover-border-color: var(--secondary-hover-background);
}

.btn-default:active {
    --bs-btn-active-color: var(--secondary-active-text);
    --bs-btn-active-bg: var(--secondary-active-background);
    --bs-btn-active-border-color: var(--secondary-active-background);
}

.btn-default[disabled],
.btn-default:disabled {
    --bs-btn-disabled-color: var(--secondary-disabled-text);
    --bs-btn-disabled-bg: var(--secondary-disabled-background);
    --bs-btn-disabled-border-color: var(--secondary-disabled-background);

    pointer-events: none;
    cursor: default;
}

.btn-default:focus,
.btn-default:focus-visible {
    --bs-btn-focus-color: var(--secondary-focus-text);
    --bs-btn-focus-bg: var(--secondary-focus-background);
    --bs-btn-focus-border-color: var(--secondary-focus-background);
}

.btn-default:focus-visible {
    outline-offset: 4px;
    outline: 2px solid var(--black);
}