/* variables */
:root {
    /* brand colors */
    --bs-primary: #1B75BB;
    --bs-primary-rgb: 27,117,187;
    --bs-secondary: #57CC99;
    --bs-secondary-rgb: 87,204,153;
    --bs-light: #EFFBFF;
    --bs-light-rgb: 239,251,255;
    --bs-dark: #0F1071;
    --bs-dark-rgb: 15,16,113;
    /* --bs-body-color: #90A3B4; */
    --bs-link-color: var(--bs-primary);
    --bs-link-color-rgb: var(--bs-primary-rgb);
    --bs-link-hover-color: #36ABFF;
    --bs-link-hover-color-rgb: 54,171,255;

    /* fonts */
    --bs-body-font-family: 'DM Sans', sans-serif;
    --bs-heading-font-family: 'Michroma', sans-serif;
    --bs-body-font-size: 1.125rem;

    --bs-border-radius: .5rem;
    --bs-border-radius-lg: 1rem;
    --bs-border-radius-xl: 1.5rem;
}

.nav {
    --bs-nav-link-color: var(--bs-white);
    --bs-nav-link-hover-color: var(--bs-light);
}

.btn {
    --bs-btn-padding-x: 2rem;
    --bs-btn-padding-y: 1rem;
    --bs-btn-font-size: 1.125rem;
}
.btn-group-sm > .btn,
.btn-sm {
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-font-size: 1rem;
    --bs-btn-border-radius: var(--bs-border-radius);
}
.btn-light {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-bg: var(--bs-white);
    --bs-btn-border-color: var(--bs-white);
    --bs-btn-hover-color: var(--bs-dark);
    --bs-btn-hover-bg: var(--bs-white);
    --bs-btn-hover-border-color: var(--bs-white);
    --bs-btn-focus-shadow-rgb: 211,212,213;
    --bs-btn-active-color: var(--bs-dark);
    --bs-btn-active-bg: var(--bs-white);
    --bs-btn-active-border-color: var(--bs-white);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-dark);
    --bs-btn-disabled-bg: var(--bs-white);
    --bs-btn-disabled-border-color: var(--bs-white);
}
.btn-primary {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-link-hover-color);
    --bs-btn-hover-border-color: var(--bs-link-hover-color);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-link-hover-color);
    --bs-btn-active-border-color: var(--bs-link-hover-color);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-white);
    --bs-btn-disabled-bg: var(--bs-link-hover-color);
    --bs-btn-disabled-border-color: var(--bs-link-hover-color);
}
.btn-secondary {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-white);
    --bs-btn-disabled-bg: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}

.pagination {
    --bs-pagination-active-bg: var(--bs-primary);
    --bs-pagination-active-border-color: var(--bs-primary);
    --bs-pagination-padding-x: 1.25rem;
    --bs-pagination-padding-y: 0.75rem;
    --bs-pagination-font-size: 1.25rem;
    --bs-pagination-border-radius: var(--bs-border-radius-lg);
}
