/*
---------------------------------------------------------------------------------
Claimant Portal Accessibility Overrides (WCAG AA Contrast)
---------------------------------------------------------------------------------
Loaded ONLY in claimant-facing layouts (_ICLayout, _ICLayout3, _IWCLayout2,
_ClaimantLayout, _GeneralStandAloneLayout, etc.)
NOT loaded in Staff/Worker layouts.
---------------------------------------------------------------------------------
*/

/* Issue 1, 12 - Header contrast: #107fc9 (4.28:1) → #1E417D (8.56:1) */
div#header {
    background-color: #1E417D;
}

div#header-xs {
    background-color: #1E417D;
}

/* Footer contrast: #0078BD (4.56:1) → #1E417D (8.56:1) */
div#footer {
    background-color: #1E417D;
}

.footer {
    background-color: #1E417D;
}

/* Issue Extra - Skip link contrast: #319795 (3.77:1) → #1B753B (4.86:1) */
.skip-link {
    background: #1B753B;
}

/* Issue 7 - push-0 resets: col-sm-push-* cascades to MD/LG.
   Bootstrap 3 breakpoints: SM=768px, MD=992px, LG=1200px. */
@media (min-width: 992px) {
    .col-md-push-0 {
        left: auto;
    }
}

@media (min-width: 1200px) {
    .col-lg-push-0 {
        left: auto;
    }
}

/* Issue 11 - Datepicker trigger button: no background/border, looks like original icon.
   Override Bootstrap btn styles and jQuery UI ui-state-hover that paint it blue. */
button.ui-datepicker-trigger,
button.ui-datepicker-trigger:hover,
button.ui-datepicker-trigger:focus,
button.ui-datepicker-trigger:active,
button.ui-datepicker-trigger.ui-state-hover,
button.ui-datepicker-trigger.ui-state-active,
button.ui-datepicker-trigger.ui-state-focus {
    background: none !important;
    background-color: transparent !important;
    border: none !important;
    padding: 2px !important;
    cursor: pointer;
    vertical-align: middle;
    box-shadow: none !important;
}

.ui-datepicker-trigger img {
    vertical-align: middle;
}

#content:focus {
    outline: none;
}

.ui-dialog #ClaimantHandbook a {
    color: #1c588d !important;
}

/* Preserve original white background on header menu buttons (Profile, Language, Menu).
   !important needed because Bootstrap 4's .btn-primary and the Issue 2B override both
   set background-color on .btn-primary, which applies to these buttons too. */
.secondaryMenuButton.btn-primary,
.toggleLanguageButton.btn-primary,
#MenuButton.btn-primary {
    color: #003663 !important;
    background-color: #fff !important;
    border-color: #fff !important;
}

    .secondaryMenuButton.btn-primary:hover,
    .toggleLanguageButton.btn-primary:hover,
    #MenuButton.btn-primary:hover {
        color: #fff !important;
        background-color: #003663 !important;
        border-color: #003663 !important;
    }

    .secondaryMenuButton.btn-primary:focus,
    .toggleLanguageButton.btn-primary:focus,
    #MenuButton.btn-primary:focus {
        color: #fff !important;
        background-color: #003663 !important;
        border-color: #003663 !important;
    }

/* Issue 2B - Primary button contrast: #337ab7 (4.58:1) → #2663AC (5.36:1) */
.btn-primary {
    background-color: #2663AC;
}

    .btn-primary:focus,
    .btn-primary.focus {
        background-color: #1E4F8A;
        border-color: #122b40;
    }

    .btn-primary:active,
    .btn-primary:not(:disabled):not(.disabled):active,
    .btn-primary.active,
    .open > .dropdown-toggle.btn-primary {
        background-color: #1E4F8A !important;
        border-color: #163D6B !important;
    }

        .btn-primary:active:hover,
        .btn-primary.active:hover,
        .open > .dropdown-toggle.btn-primary:hover,
        .btn-primary:active:focus,
        .btn-primary.active:focus,
        .open > .dropdown-toggle.btn-primary:focus,
        .btn-primary:active.focus,
        .btn-primary.active.focus,
        .open > .dropdown-toggle.btn-primary.focus {
            background-color: #163D6B;
            border-color: #122b40;
        }

/* Issue 2B - Secondary button contrast: #333/#ccc → #2663AC */
.btn-default {
    color: #2663AC !important;
    background-color: #fff !important;
    border-color: #2663AC !important;
}

    .btn-default:hover {
        color: #000 !important;
        background-color: #81D2FE !important;
        border-color: #0189D0 !important;
    }

    .btn-default:active,
    .btn-default.ui-state-active {
        color: #030303 !important;
        background-color: #8ad343 !important;
        border-color: #537F28 !important;
    }

    /* Prevent jQuery UI ui-state-hover/focus from overriding btn-default styles.
       The layout JS adds ui-state-hover on both mouseover AND focus events,
       which would paint the button light-blue on focus. Override to keep
       the default white bg + blue text appearance. */
    .btn-default.ui-state-hover,
    .btn-default.ui-state-focus {
        color: #2663AC !important;
        background-color: #fff !important;
        border-color: #2663AC !important;
    }

        /* Allow actual mouse hover to show the original hover color */
        .btn-default.ui-state-hover:hover {
            color: #000 !important;
            background-color: #81D2FE !important;
            border-color: #0189D0 !important;
        }

    .btn-default:focus {
        color: #2663AC !important;
        background-color: #fff !important;
        border-color: #2663AC !important;
    }

/* jQuery UI dialog button overrides */
.ui-dialog .ui-dialog-buttonpane button.btn-primary {
    background-color: #2663AC;
    border: 1px solid #2663AC;
}

.ui-dialog .ui-dialog-buttonpane button.btn-default {
    background-color: #fff;
    border: 1px solid #2663AC;
    color: #2663AC;
}

/* jQuery UI widget header (dialog titlebars, datepicker header) */
.ui-widget-header {
    background: #1E417D !important;
    background-image: none !important;
    color: #fff !important;
}

/* Issue 14A - Calendar header: month/year text white on #1E417D */
.ui-datepicker .ui-datepicker-header {
    color: #fff !important;
}

.ui-datepicker .ui-datepicker-title,
.ui-datepicker .ui-datepicker-title span {
    color: #fff !important;
}

    .ui-datepicker .ui-datepicker-title select {
        color: #1E417D !important;
        background-color: #fff !important;
    }

/* Issue 14A - Calendar arrow buttons: white bg + blue arrow icon */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    background-color: #fff !important;
    border-radius: 3px;
}

    .ui-datepicker .ui-datepicker-prev span,
    .ui-datepicker .ui-datepicker-next span {
        filter: brightness(0) saturate(100%) invert(18%) sepia(90%) saturate(600%) hue-rotate(196deg) brightness(90%) contrast(90%);
    }

    .ui-datepicker .ui-datepicker-prev:hover,
    .ui-datepicker .ui-datepicker-next:hover {
        background-color: #f0f0f0 !important;
    }

/* Issue 14A - Calendar/datepicker contrast */

/* Regular weekdays: #1E417D + white */
.ui-datepicker .ui-state-default,
.ui-dialog .ui-state-default {
    background-color: #1E417D;
    color: #fff;
}

/* Previous/next month days: #2663AC + white */
.ui-datepicker td.ui-datepicker-other-month .ui-state-default {
    background-color: #2663AC;
    color: #fff;
}

/* Current week highlight: #0F572C + white */
.ui-datepicker .ui-state-highlight,
.ui-datepicker td .ui-state-highlight {
    background-color: #0F572C !important;
    color: #fff !important;
}

/* Current/selected day or week: #419E46 + black */
.ui-datepicker .ui-state-active,
.ui-datepicker td .ui-state-active,
.ui-datepicker .ui-datepicker-current-day .ui-state-default {
    background-color: #419E46 !important;
    color: #000 !important;
}

/* Calendar heading and arrow buttons are styled in the .ui-widget-header section above */

button.moreinfo-linkbtn {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font: inherit !important;
    color: #2663AC !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    display: inline !important;
    vertical-align: baseline !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

    button.moreinfo-linkbtn:hover,
    button.moreinfo-linkbtn:focus {
        color: #1E4F8A !important;
        text-decoration: underline !important;
    }

/* Close Menu button: match accessibility header color */
#MenuButtonClose {
    background: #1E417D !important;
    color: #fff !important;
}

    #MenuButtonClose:focus {
        background: #1E417D !important;
        color: #fff !important;
    }

    #MenuButtonClose:hover {
        background: #163565 !important;
        color: #fff !important;
    }

/* Overlay menu Logout button: white text on blue btn-primary */
.overlayLight-content .btn-primary {
    color: #fff !important;
}

    .overlayLight-content .btn-primary:hover,
    .overlayLight-content .btn-primary:focus {
        color: #fff !important;
    }

/* Overlay menu: ensure consistent link styling across all pages */
.overlayLight-content .menuHeading a:not(.btn) {
    color: #1C588D !important;
    text-decoration: none;
}

    .overlayLight-content .menuHeading a:not(.btn):hover,
    .overlayLight-content .menuHeading a:not(.btn):focus {
        color: #08108C !important;
        text-decoration: underline;
    }

.separationHelp {
    color: #0D6EAD !important;
    border-color: #0D6EAD !important;
}