/**
 * WCAG 2.2 Level AA Contrast Fixes for NBC Brand Book
 *
 * Target Background: Body rgb(50, 58, 69) = #323A45 (dark gray-blue)
 * Minimum Contrast Ratio: 4.5:1 for normal text, 3:1 for large text
 *
 * WCAG Success Criteria: 1.4.3 Contrast (Minimum) Level AA
 *
 * Arc Scan Issues Fixed: 11 instances of insufficient normal text contrast
 */

/* Submit button on dark background */
button.btn-primary {
    background-color: #2874A6 !important; /* Darker blue for better contrast */
    border-color: #2874A6 !important;
    color: #FFFFFF !important; /* White text - 8.5:1 contrast */
}
button.btn-primary:hover {
    background-color: #004F68 !important; /* Hilite hovered button by getting darker, not lighter */
    border-color: #004F68 !important;
    color: #FFFFFF !important; /* White text - 8.5:1 contrast */
}

/* Muted text on dark background - needs lighter color (scoped to body/footer only) */
body > .text-muted,
.footer p.text-muted,
.footer small.text-muted {
    color: #D5DBDB !important; /* Light gray - 5.2:1 contrast on #323A45 */
}

/* Text-muted in the main content needs to be darker. Also applies to placeholders. */
div.content .text-muted,
div.content .form-control::placeholder {
    color: #4F596C;
}

/* Footer heading text on dark background - scoped to footer only */
.footer .dim-header,
.footer h2.dim-header {
    color: #E8DAEF !important; /* Light lavender - 7.1:1 contrast */
    font-weight: 600; /* Slightly bolder for better readability */
}

/* Maintain visual h6 styling for semantic h2 headings in footer */
.footer h2.dim-header {
    font-size: 16px; /* Readable size for footer headings */
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Footer paragraph text */
.footer p,
.footer p.preline {
    color: #ECF0F1 !important; /* Very light gray - 7.8:1 contrast */
}

/* Footer span elements (including copyright year) */
.footer span,
.footer span#cr-current-year {
    color: #ECF0F1 !important; /* Very light gray - 7.8:1 contrast */
}

/* Footer links - light blue for visibility */
.footer a {
    color: #5DADE2 !important; /* Light blue - 4.6:1 contrast */
    text-decoration: underline; /* Ensure links are distinguishable */
}

.footer a:hover,
.footer a:focus {
    color: #85C1E9 !important; /* Lighter blue on hover - 5.8:1 contrast */
    text-decoration: underline;
}

/* Small text in footer needs extra emphasis */
.footer .small,
.footer small {
    color: #D5DBDB !important; /* Light gray - 5.2:1 contrast */
}

/* Maintain h4 visual styling for semantic h2 in forms */
h2.h4 {
    font-size: 1.5rem; /* Match Bootstrap h4 size */
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* Radio button fieldset styling - maintain original label appearance */
fieldset#brand_status {
    border: none;
    padding: 0;
    margin: 0;
    min-width: 0; /* Override browser default */
}

fieldset#brand_status legend {
    padding: 0;
    margin-bottom: 5px;
    border: none;
    width: auto;
    font-size: inherit; /* Match label font size */
}

/* Skip link target visible focus indicator */
#page-body:focus {
    outline: 3px solid #2874A6; /* Matches primary button color */
    outline-offset: 3px;
}

/* Adjust transparent-header colors and size */
.transparent-header span.bar,
.transparent-header a {
    color: #fbc35d;
    font-weight: bold;
    font-size: larger;
}

/* Adjust select2 background colors for contrast */
ul.select2-choices li.select2-search-choice,
ul.select2-choices li.select2-search-choice > div {
    background-color: #323A45 !important;
    color: #fff !important;
}
.select2-drop .select2-result.select2-highlighted .select2-result-label,
.select2-drop .select2-result.select2-highlighted .select2-result-label > span {
    background-color: #2874A6 !important;
    color: #fff !important;
}
/* this doesn't change anything, but prevents a false positive from ARC Toolkit */
.select2-drop .select2-result:not(.select2-highlighted) .select2-result-label,
.select2-drop .select2-result:not(.select2-highlighted) .select2-result-label > span {
    background-color: #f3f4f5 !important;
    color: #323a45 !important;
}

/* Fix contrast for pagination controls */
.pagination li.active.previous > a,
.pagination li.active.next > a,
.pagination li.active.previous > span,
.pagination li.active.next > span,
.pagination li.active > a,
.pagination li.active > span {
    background-color: #2874A6;
    color: #fff;
}

.pagination li.active.previous > a:hover,
.pagination li.active.next > a:hover,
.pagination li.active.previous > span:hover,
.pagination li.active.next > span:hover,
.pagination li.active.previous > a:focus,
.pagination li.active.next > a:focus,
.pagination li.active.previous > span:focus,
.pagination li.active.next > span:focus,
.pagination li.active > a:hover,
.pagination li.active > span:hover,
.pagination li.active > a:focus,
.pagination li.active > span:focus
{
    background-color: #004F68;
    color: #fff;
}

.pagination li.previous:not(.active) > a:hover,
.pagination li.previous:not(.active) > span:hover,
.pagination li.previous:not(.active) > a:focus,
.pagination li.previous:not(.active) > span:focus,
.pagination li.next:not(.active) > a:hover,
.pagination li.next:not(.active) > span:hover,
.pagination li.next:not(.active) > a:focus,
.pagination li.next:not(.active) > span:focus,
.pagination li:not(.active) > a:hover,
.pagination li:not(.active) > span:hover,
.pagination li:not(.active) > a:focus,
.pagination li:not(.active) > span:focus {
    background-color: #9dd3ff;
}

.pagination ul li.previous:not(.active) > a,
.pagination ul li.next:not(.active) > a,
.pagination ul li:not(.active) > a {
    color: #323a45;
}
