/* Bootstrap Color Overrides */
:root {
    --bs-primary: rgb(0, 186, 199) !important;
    --bs-primary-rgb: 0, 186, 199 !important;
    --bs-secondary: #6c757d !important;
    --bs-secondary-rgb: 108, 117, 125 !important;
    --bs-success: #28a745 !important;
    --bs-success-rgb: 40, 167, 69 !important;
    --bs-danger: #dc3545 !important;
    --bs-danger-rgb: 220, 53, 69 !important;
    --bs-warning: #ffc107 !important;
    --bs-warning-rgb: 255, 193, 7 !important;
    --bs-info: #17a2b8 !important;
    --bs-info-rgb: 23, 162, 184 !important;
    --bs-light: #f8f9fa !important;
    --bs-light-rgb: 248, 249, 250 !important;
    --bs-dark: #343a40 !important;
    --bs-dark-rgb: 52, 58, 64 !important;
    --bs-body-font-family: var(--bs-font-sans-serif) !important;
}

/* Direct Bootstrap component overrides */
.btn-primary {
    background-color: rgb(0, 186, 199) !important;
    border-color: rgb(0, 186, 199) !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: rgb(0, 166, 179) !important;
    border-color: rgb(0, 166, 179) !important;
}

.btn-primary:active {
    background-color: rgb(0, 146, 159) !important;
    border-color: rgb(0, 146, 159) !important;
}

.bg-light-green {
    --bs-bg-opacity: 1;
    background-color: rgba(241, 245, 247, var(--bs-bg-opacity)) !important;
}

.h3 {
    font-size: 1.125rem;
}

.link-primary {
    color: rgb(0, 186, 199) !important;
    text-decoration: none !important;
}

.link-primary:hover {
    color: rgb(0, 166, 179) !important;
    text-decoration: underline !important;
}

.form-label {
    margin-bottom: .3125rem !important;
    font-size: .75rem !important;
}

.form-control {
    font-size: .75rem !important;
    border-radius: .625rem !important;
    background-color: #F8FAFB !important;
    line-height: 1.5 !important;
    padding: .625rem .75rem !important;
}

.form-control:focus {
    border-color: rgb(0, 186, 199) !important;
    box-shadow: 0 0 transparent,0 0 .75rem #00bac740;
    outline: 0 !important;
}