body {
}

/* Accessibility: visible keyboard focus indicator (WCAG 2.1 SC 2.4.7).
   Bootstrap suppresses outline on several elements; this restores a
   high-contrast, always-visible replacement across the site. */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
.btn:focus,
.navbar-nav > li > a:focus {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
}

/* UX: keep the language dropdown's visible label + select on one line in the navbar instead of
   Bootstrap's default label margin/weight (form-oriented, meant for stacked form fields) pushing
   it onto its own row. See CleanResponsive.Master (navbar-language li). */
.navbar-language label {
    display: inline-block;
    margin: 0 6px 0 0;
    font-weight: normal;
    color: #595959;
    vertical-align: middle;
}
.navbar-language .form-control {
    display: inline-block;
    width: auto;
    min-width: 110px;
    vertical-align: middle;
}

/* Accessibility: darken the default Bootstrap navbar-default link color
   (#777 on #f8f8f8 ~= 4.22:1) to clear the WCAG 2.1 AA 4.5:1 minimum
   (SC 1.4.3) for normal-size text. */
.navbar-default .navbar-nav > li > a {
    color: #595959;
}

/* Accessibility: the generic a:focus/button:focus rule above does NOT reach
   .navbar-toggle or .dropdown-toggle — bootstrap.min.css's
   .navbar-toggle:focus{outline:0} has higher specificity (0,2,0) than the
   generic button:focus rule (0,1,1) and wins regardless of stylesheet order.
   Explicit override needed (WCAG 2.1 SC 2.4.7).
   :focus-visible and plain :focus have EQUAL specificity, so whichever rule
   comes later in the file wins for every focus event, keyboard or mouse — a
   plain :focus fallback sitting after the :focus-visible rule (as a prior
   version of this file had) defeats it entirely, painting the ring on mouse
   clicks too. The @supports feature query keeps the two mutually exclusive
   instead of relying on source order: browsers that understand
   :focus-visible never see the plain :focus rule at all. */
.navbar-toggle:focus-visible,
.dropdown-toggle:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
}
@supports not selector(:focus-visible) {
    .navbar-toggle:focus,
    .dropdown-toggle:focus {
        outline: 2px solid #005fcc;
        outline-offset: 2px;
    }
}

/* Accessibility: content-area images pasted via the tenant WYSIWYG can carry
   hard pixel widths (e.g. width:520px;max-width:none), overflowing the
   document at narrow viewports (WCAG 2.1 SC 1.4.10 Reflow). Scoped to
   tenant content regions, not applied globally — see docs/ada-wcag-
   accessibility-audit.md §9.1 (P-8) for the .inner-content scope caveat. */
.inner-content img,
.register-home-view5 img {
    max-width: 100%;
    height: auto;
}

/* Accessibility: ASP.NET validators (RequiredFieldValidator/CompareValidator/etc.) default their
   ForeColor to Red, which renders as an inline style="color:Red" (~4.00:1 on white, worse on
   colored panels) — no stylesheet rule can beat an inline style without !important, and setting
   ForeColor on every validator individually isn't practical across this many forms. This is the
   one sanctioned use of !important in this codebase. #B42318 clears 4.5:1 on white and on the
   #F2DEDE alert-danger background. */
.text-danger,
.alert-danger,
.alert-danger li,
.qa-lbl.is-error {
    color: #B42318 !important;
}
.alert-danger {
    background-color: #FEF3F2;
    border-color: #FDA29B;
}

/* Accessibility: Bootstrap's default .btn-success (#fff on #5cb85c) is 2.48:1 — needs 4.5:1.
   Covers every "Apply Now"/Submit button sitewide. */
.btn-success {
    background-color: #1E7E34;
    border-color: #1A6E2E;
    color: #FFFFFF;
}
.btn-success:hover,
.btn-success:focus {
    background-color: #19692C;
    border-color: #155D26;
}

/* Accessibility: default Bootstrap link blue (#337ab7) drops under 4.5:1 on grey panel/row
   backgrounds (panel-heading #F5F5F5, striped table rows). .btn-link is included because the
   map card's Hide/Show Map toggle is a <button class="btn btn-link"> inside .panel-heading,
   so the bare `a` selector never matched it (measured 4.18:1). */
.panel-heading a,
.panel-heading .btn-link,
.table-striped > tbody > tr:nth-of-type(odd) a {
    color: #2A6496;
}

/* Accessibility: the required-field asterisk emitted by the dynamic form builders
   (Apps/ccApplication.vb AddTRfield). apply_wizard.aspx defines this for its own hand-authored
   fields, but the same markup renders on CompleteApply.aspx too, which has no page-level copy.
   #B42318 is the same accessible red used for validation text. */
.req-mark {
    color: #B42318;
}

/* Accessibility: links sitting inside running text must not rely on colour alone
   (WCAG 2.1 SC 1.4.1, technique G183). Link blue #337ab7 against body text #333333 is only
   2.77:1 — well under the 3:1 G183 requires for colour-only differentiation — and Bootstrap
   leaves them undecorated at rest, only underlining on :hover/:focus. Underlining is used
   rather than darkening the blue because the same link colour sits on several different
   background colours across the site.
   Scope is deliberately narrow: links in paragraphs, plus an explicit opt-in class for links
   that introduce a block of body copy without being wrapped in a <p> themselves (see
   recent_snapin_clean.ascx). Standalone links — nav items, buttons, table action links — are
   unaffected and need no underline. */
p a,
a.link-in-text {
    text-decoration: underline;
}
/* Link-styled buttons inside a paragraph are still buttons, not prose links. */
p a.btn {
    text-decoration: none;
}

/* Accessibility: Bootstrap link blue on the alert-warning background (#fcf8e3) is 4.26:1,
   under the 4.5:1 minimum (SC 1.4.3). Used by the apply wizard's "position unavailable"
   panel and the onboarding/profile warning panels. */
.alert-warning a {
    color: #2A6496;
}

/* Accessibility: default placeholder grey (~#999 on white) is 2.85:1 — needs 4.5:1. Placeholders
   are never a substitute for a real <label> (see the fields fixed alongside this), but where one
   is shown it should still be readable. */
.form-control::-webkit-input-placeholder { color: #6b7280; }
.form-control::-moz-placeholder { color: #6b7280; }
.form-control:-ms-input-placeholder { color: #6b7280; }
.form-control::placeholder { color: #6b7280; }

.strength0 {
    display: none;
}

.strength1 {
    width: 20%;
    background: linear-gradient(to right,red,#ff6a00);
    height: 10px;
    float: left;
    position: relative;
}

.strength2 {
    width: 20%;
    background: linear-gradient(to right,#ff6a00,#ffd800);
    height: 10px;
    float: left;
    position: relative;
}

.strength3 {
    width: 20%;
    background: linear-gradient(to right,#ffd800,#b6ff00);
    height: 10px;
    float: left;
    position: relative;
}

.strength4 {
    width: 20%;
    background: linear-gradient(to right,#b6ff00,#4cff00);
    height: 10px;
    float: left;
    position: relative;
}

.strength5 {
    width: 20%;
    background: linear-gradient(to right,#4cff00,#23ad5c);
    height: 10px;
    float: left;
    position: relative;
}
.form-control-register {
    width: 95%;
    float: right;
    vertical-align: -webkit-baseline-middle;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.text-red{
    color:red;
}

/* Mobile reflow for the "Jobs Applied To" grid (controls/applyList_Snapin_clean.ascx).
   Below Bootstrap 3's xs breakpoint the 4-column table (Title/Status/Location/Complete)
   overflowed its col-md-6 container and clipped the trailing red "Complete" button.
   Stack each row into a card so every field, including a full-width Complete button,
   is fully visible with no horizontal scrolling. Scoped to .apply-list-responsive. */
@media (max-width: 767px) {
    .apply-list-responsive .table,
    .apply-list-responsive .table tbody,
    .apply-list-responsive .table tr,
    .apply-list-responsive .table td {
        display: block;
        width: 100%;
    }

    .apply-list-responsive .table thead {
        display: none;
    }

    .apply-list-responsive .table tr {
        margin-bottom: 12px;
        padding-bottom: 8px;
        border-bottom: 1px solid #ddd;
    }

    .apply-list-responsive .table td {
        border: 0;
        padding: 4px 0;
    }

    /* data-label is set from the localized column header in RowDataBound */
    .apply-list-responsive .table td[data-label]::before {
        content: attr(data-label) ": ";
        font-weight: bold;
    }

    .apply-list-responsive .table td .btn {
        width: 100%;
    }
}

/* ── Post-login home toolbar (home.aspx #profileToolbarGroup) ────────────────
   Consolidated single toolbar: a segmented view toggle (Profile / Available
   Positions) on the left and a Manage actions dropdown on the right. The active
   view uses .btn-primary so the accent follows each tenant's own theme; the
   inactive view and the Manage toggle stay neutral (.btn-default). */
.profileToolbar {
    background: #f7f8fa;
    border: 1px solid #e4e7eb;
    border-radius: 6px;
    padding: 8px 10px;
    margin-bottom: 18px;
}
.profileToolbar .btn-toolbar {
    margin-left: 0;
}
.profileToolbar .btn-default {
    background-color: #fff;
}

/* Icons (Glyphicons Halflings, already loaded) injected via ::before so the
   localized button Text is preserved and the view-toggle CssClass sentinel in
   home.aspx.vb (compares the exact string "btn btn-primary active") is left
   untouched. View-toggle icons are keyed by position, not by an added class. */
.profileToolbar .pt-views > a:before,
.profileToolbar .dropdown-menu .pt-icon-edit:before,
.profileToolbar .dropdown-menu .pt-icon-app:before {
    font-family: 'Glyphicons Halflings';
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    margin-right: 6px;
}
.profileToolbar .pt-views > a:first-child:before { content: "\e008"; } /* user     → Profile   */
.profileToolbar .pt-views > a:last-child:before  { content: "\e032"; } /* list-alt → Positions */
.profileToolbar .dropdown-menu .pt-icon-edit:before { content: "\e065"; } /* pencil */
.profileToolbar .dropdown-menu .pt-icon-app:before  { content: "\e022"; } /* file   */

/* Phones / kiosk: stack the two groups full width so nothing clips */
@media (max-width: 767px) {
    .profileToolbar .btn-group {
        display: block;
        float: none;
        margin-bottom: 6px;
    }
    .profileToolbar .btn-group:last-child {
        margin-bottom: 0;
    }
    .profileToolbar .pull-right {
        float: none !important;
    }
    .profileToolbar .dropdown-menu {
        position: static;
        float: none;
        width: 100%;
        box-shadow: none;
    }
}