/* Oakton Brand Color Integrations */

.brand-text {
    color: #006257;
}

/* Oakton Brand Color Integrations */

.btn-brand {
    background-color: #006257;
    border-color: #006257;
    color: #ffffff;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

/* Hover state: Darken slightly more for a stronger visual contrast shift */
.btn-brand:hover {
    background-color: #003832; 
    border-color: #002f2a;
    color: #ffffff;
}

/* Focus state (Tab selected): Add a high-contrast focus ring */
.btn-brand:focus,
.btn-brand:focus-visible {
    background-color: #004d44;
    border-color: #004d44;
    color: #ffffff;
    outline: 0;
    /* Uses a semi-transparent version of the brand color for the focus ring */
    box-shadow: 0 0 0 0.25rem rgba(0, 98, 87, 0.5); 
}

/* Active state (Clicking/Pressing down) */
.btn-brand:active {
    background-color: #00362f;
    border-color: #002f29;
    color: #ffffff;
}

/* Ensure reCAPTCHA widget shrinks gracefully on extremely small mobile screens */
@media (max-width: 360px) {
    .g-recaptcha {
        transform: scale(0.85);
        transform-origin: center center;
    }
}
/* override the background of the alert */
.alert.alert-info {
    /*  Override the background color */
    --bs-alert-bg: #F5F5F5;

    /* Optional: Update the border to match or be slightly darker */
    --bs-alert-border-color: #878787;
}

/* Adjust placeholder to be visually distinct but strictly WCAG AA compliant */
.form-control::placeholder {
    /* #767676 provides a 4.54:1 contrast ratio against a #ffffff background.
       Going any lighter than this will violate accessibility guidelines. */
    color: #767676 !important;
    
    /* Use italics to make it feel more like a hint and less prominent than user input */
    font-style: italic;
    
    /* Bootstrap sometimes applies an opacity to placeholders; resetting it to 1 
       ensures the mathematical contrast ratio remains true for screen magnifiers. */
    opacity: 1 !important; 
}



/* Custom Alert Background - disabled for now  */
/* .alert-custom-blue {  */
/*    background-color: #00AEEF !important;  */
/*    color: #ffffff !important;  */
/* } */

/* password strength */
/*  Smooth transition for the progress bar */
/*  .progress-bar { */
/*     transition: width 0.4s ease, background-color 0.4s ease; */
/* } */
/* no longer needed for bootstrap 5 */

/* Custom styling for the requirement list */
.req-list {
  font-size: 0.85rem;
}
.req-list li {
     transition: color 0.3s ease;
 }

/* Fix border radius for input groups with validation -no longer needed for bootstrap 5 */
/* .input-group.has-validation > .form-control:not(:focus).is-valid, */
/* .input-group.has-validation > .form-control:not(:focus).is-invalid { */
/*     z-index: 2; */
/*  } */

/* Progress Bar */
.progress-thin {
  height: 6px;
}

#strengthBar {
    width: 0%;
}