:root {
    --spillplaz-primary: #36b9cc;
    --spillplaz-primary-rgb: 54, 185, 204;
    --spillplaz-primary-hover: #2fa5b6;
    --spillplaz-primary-active: #2a95a4;
    --spillplaz-primary-active-rgb: 42, 149, 164;
    --bs-primary: var(--spillplaz-primary);
    --bs-primary-rgb: var(--spillplaz-primary-rgb);
    --bs-link-color: var(--spillplaz-primary);
    --bs-link-color-rgb: var(--spillplaz-primary-rgb);
    --bs-link-hover-color: var(--spillplaz-primary-active);
    --bs-link-hover-color-rgb: var(--spillplaz-primary-active-rgb);
    --bs-primary-text-emphasis: #15525b;
    --bs-primary-bg-subtle: #d7f1f5;
    --bs-primary-border-subtle: #9be0e9;
}

.btn-primary {
    --bs-btn-bg: var(--spillplaz-primary);
    --bs-btn-border-color: var(--spillplaz-primary);
    --bs-btn-hover-bg: var(--spillplaz-primary-hover);
    --bs-btn-hover-border-color: var(--spillplaz-primary-hover);
    --bs-btn-active-bg: var(--spillplaz-primary-active);
    --bs-btn-active-border-color: var(--spillplaz-primary-active);
    --bs-btn-disabled-bg: var(--spillplaz-primary);
    --bs-btn-disabled-border-color: var(--spillplaz-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--spillplaz-primary);
    --bs-btn-border-color: var(--spillplaz-primary);
    --bs-btn-hover-bg: var(--spillplaz-primary);
    --bs-btn-hover-border-color: var(--spillplaz-primary);
    --bs-btn-active-bg: var(--spillplaz-primary-active);
    --bs-btn-active-border-color: var(--spillplaz-primary-active);
    --bs-btn-disabled-color: var(--spillplaz-primary);
    --bs-btn-disabled-border-color: var(--spillplaz-primary);
}

.link-primary {
    color: rgba(var(--spillplaz-primary-rgb), var(--bs-link-opacity, 1)) !important;
    text-decoration-color: rgba(var(--spillplaz-primary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

.link-primary:hover,
.link-primary:focus {
    color: rgba(var(--spillplaz-primary-active-rgb), var(--bs-link-opacity, 1)) !important;
    text-decoration-color: rgba(var(--spillplaz-primary-active-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

.text-primary {
    color: rgba(var(--spillplaz-primary-rgb), var(--bs-text-opacity, 1)) !important;
}

.bg-primary {
    background-color: rgba(var(--spillplaz-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.border-primary {
    border-color: var(--spillplaz-primary) !important;
}