.btn {
    --bs-btn-padding-x: calc(24 * var(--rem-size));
    --bs-btn-padding-y: calc(14 * var(--rem-size));

    text-transform: uppercase;

    .table &  {
        --bs-btn-padding-x: calc(18 * var(--rem-size));
        --bs-btn-padding-y: calc(8 * var(--rem-size));
    }
}

.btn-link {
    --bs-btn-color: var(--app-color-purple);
    --bs-btn-hover-color: var(--app-color-purple-dark);
    --bs-btn-active-color: var(--app-color-purple-dark);
}

.btn-primary {
    --bs-btn-bg: var(--app-color-purple);
    --bs-btn-border-color: var(--app-color-purple);
    --bs-btn-hover-bg: var(--app-color-purple-dark);
    --bs-btn-hover-border-color: var(--app-color-purple-dark);
    --bs-btn-active-bg: var(--app-color-purple-dark);
    --bs-btn-active-border-color: var(--app-color-purple-dark);
}

.btn-outline-primary {
    --bs-btn-color: var(--app-color-purple);
    --bs-btn-border-color: var(--app-color-purple);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--app-color-purple-dark);
    --bs-btn-hover-color: var(--app-color-purple-dark);
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: var(--app-color-purple-dark);
    --bs-btn-active-color: var(--app-color-purple-dark);
}