:root {
    --bs-primary: #3e73dc;
    --bs-primary-rgb: 62, 115, 220;
    --bs-primary-bg-subtle: #ecf1fc;
    --bs-primary-text-emphasis: #254584;

    --bs-primary-dark: color-mix(in srgb, var(--bs-primary), #000 15%);
    --bs-primary-darker: color-mix(in srgb, var(--bs-primary), #000 25%);

    --bs-link-color-rgb: 62, 115, 220;
    --bs-link-hover-color-rgb: 53, 98, 187;
}

.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary-dark);
    --bs-btn-hover-border-color: var(--bs-primary-darker);
    --bs-btn-active-bg: var(--bs-primary-darker);
    --bs-btn-active-border-color: var(--bs-primary-darker);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

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

/* Pagination Active State */
.page-item.active .page-link {
    --bs-pagination-active-bg: var(--bs-primary);
    --bs-pagination-active-border-color: var(--bs-primary);
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
}

.page-link {
    --bs-pagination-color: var(--bs-primary);
}

.page-link:hover {
    --bs-pagination-hover-color: var(--bs-primary-dark);
}

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--bs-primary);
}

.nav-link:focus, .nav-link:hover {
    --bs-nav-link-hover-color: var(--bs-primary-dark);
}

.form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

a {
    --bs-link-opacity: 1;
    text-decoration-color: rgba(var(--bs-link-color-rgb), 0.4);
}

a:hover {
    text-decoration-color: rgba(var(--bs-link-hover-color-rgb), 1); 
}

.form-check-input[type=checkbox]:indeterminate {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}