.inovalon-careers-wrap {
    max-width: 100%;
}

.inovalon-careers-header {
    display: flex;
    gap: 20px;
    margin-bottom: 32px;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
}

.inovalon-careers-header.has-title {
    justify-content: space-between;
}

.inovalon-careers-heading {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
    color: #16233f;
    flex: 1 1 auto;
}

.inovalon-careers-filters {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
}

/*
 * Scoping these selectors under .inovalon-careers-wrap to
 * solve for theme-wide select styles.
 */
.inovalon-careers-wrap .inovalon-careers-search,
.inovalon-careers-wrap .inovalon-careers-department,
.inovalon-careers-wrap .inovalon-careers-location-filter,
.inovalon-careers-wrap .inovalon-careers-employment-type-filter,
.inovalon-careers-wrap .inovalon-careers-workplace-type-filter {
    box-sizing: border-box;
    width: auto;
    /* !important: the theme has `input[type="text"]{height:auto!important;...}`,
       which otherwise wins regardless of our selector's specificity. */
    height: 48px !important;
    flex: 0 0 auto;
    padding: 0 20px;
    border: 1px solid #d7dbea;
    border-radius: 10px;
    background: #f2f3f8;
    color: #33415c;
    font-size: 15px;
    box-shadow: none;
}

.inovalon-careers-wrap .inovalon-careers-department,
.inovalon-careers-wrap .inovalon-careers-location-filter,
.inovalon-careers-wrap .inovalon-careers-employment-type-filter,
.inovalon-careers-wrap .inovalon-careers-workplace-type-filter {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23697386' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 38px;
    min-width: 160px;
    cursor: pointer;
}

.inovalon-careers-search {
    flex: 1 1 200px;
    min-width: 200px;
    max-width: 260px;
}

/* Full-width rows separated by divider lines. */
.inovalon-careers-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 26px 4px;
    border-bottom: 1px solid #e7e9f0;
}

.inovalon-careers-list > .inovalon-careers-item:first-child {
    border-top: 1px solid #e7e9f0;
}

.inovalon-careers-item-main {
    min-width: 0;
}

.inovalon-careers-title {
    margin: 0 0 6px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.3;
}

.inovalon-careers-title a {
    color: #16233f;
    text-decoration: none;
}

.inovalon-careers-title a:hover {
    text-decoration: underline;
}

.inovalon-careers-meta {
    font-size: 15px;
    line-height: 1.4;
    color: #6b7280;
}

.inovalon-careers-compensation {
    margin-top: 2px;
    font-size: 15px;
    line-height: 1.4;
    color: #6b7280;
}

.inovalon-careers-workplace-badge {
    flex: 0 0 auto;
    padding: 6px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    /* Neutral fallback for a workplaceType Ashby adds later that format_workplace_type()
       doesn't recognize yet - the [data-workplace] rules below override this for the
       known values, so this only ever shows for something unmapped. */
    background: #eef0f4;
    color: #47546b;
}

.inovalon-careers-workplace-badge[data-workplace="on-site"] {
    background: #e3f5e9;
    color: #1e7d34;
}

.inovalon-careers-workplace-badge[data-workplace="remote"] {
    background: #e8eaf9;
    color: #3b4bb8;
}

.inovalon-careers-workplace-badge[data-workplace="hybrid"] {
    background: #fdf1da;
    color: #9a6c11;
}

.inovalon-careers-item.is-hidden {
    display: none;
}

.inovalon-careers-empty,
.inovalon-careers-loading {
    color: #666;
}

.inovalon-careers-error {
    color: #9a2626;
}

.inovalon-careers-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 32px;
}

/* The nav is rendered whenever pagination is enabled, so careers.js has somewhere to
   put controls after replacing the list. Until it holds buttons, its margin would add
   stray space below a single-page list. */
.inovalon-careers-pagination:empty {
    display: none;
}

.inovalon-careers-wrap .inovalon-careers-page-btn {
    box-sizing: border-box;
    min-width: 40px;
    height: 40px;
    padding: 0 14px;
    border: 1px solid #d7dbea;
    border-radius: 8px;
    background: #f2f3f8;
    color: #33415c;
    font-size: 14px;
    cursor: pointer;
}

.inovalon-careers-wrap .inovalon-careers-page-btn:hover:not(:disabled) {
    background: #e7e9f0;
}

.inovalon-careers-wrap .inovalon-careers-page-btn.is-current {
    background: #16233f;
    border-color: #16233f;
    color: #fff;
    cursor: default;
}

.inovalon-careers-wrap .inovalon-careers-page-btn:disabled {
    opacity: 0.4;
    cursor: default;
}

@media (max-width: 768px) {
    .inovalon-careers-header {
        flex-direction: column;
        align-items: stretch;
    }

    .inovalon-careers-filters {
        flex-direction: column;
        align-items: stretch;
    }

    .inovalon-careers-wrap .inovalon-careers-search,
    .inovalon-careers-wrap .inovalon-careers-department,
    .inovalon-careers-wrap .inovalon-careers-location-filter,
    .inovalon-careers-wrap .inovalon-careers-employment-type-filter,
    .inovalon-careers-wrap .inovalon-careers-workplace-type-filter {
        width: 100%;
        max-width: none;
    }
}

/* ------------------------------------------------------------------
   Single job posting ([inovalon_careers_single_job])
   ------------------------------------------------------------------
   Moved here from themes/salient-child/style.css (the `/*! Careers - Ashby
   Single Job */` block) now that the single-job page carries a shortcode and so
   gets this stylesheet enqueued. Values are unchanged from the theme copy, so
   the page renders identically.

   The theme copy is deliberately still in place: page 83156 keeps rendering
   through the JCI template until Phase 4 of JCI-MIGRATION-PLAN.md, and that
   page has no shortcode, so it never loads this file. Removing the theme copy
   now would leave it unstyled mid-migration. Phase 4 deletes it.
   ------------------------------------------------------------------ */

.job_single {
    max-width: 54em;
    margin: auto;
    padding: 4em 1em 2em 1em;
}

.single-job_details {
    text-align: left;
    padding-bottom: 2em;
}

.single-job_breadcrumb {
    margin-bottom: 1em;
    font-size: 0.85em;
}

.single-job_breadcrumb a {
    color: #4e84c4;
    text-decoration: none;
}

.single-job_breadcrumb a:hover {
    text-decoration: underline;
}

.single-job_details h2 {
    color: #023d79;
    font-family: Source Sans Pro;
    font-weight: 600;
    font-style: normal;
    font-size: 2.25em;
    margin-bottom: 0.5em;
}

/* Meta grid: four-up, collapsing to two columns on narrow screens. */
.single-job_meta {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1em;
    padding-top: 1em;
}

.single-job_meta-item {
    display: flex;
    flex-direction: column;
    padding: 0.9em 1.1em;
    background: #f2f3f8;
    border: 1px solid #d7dbea;
    border-radius: 10px;
}

.single-job_meta-label {
    font-size: 0.8em;
    font-weight: 600;
    color: #023d79;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.25em;
}

.single-job_meta-value {
    font-size: 1em;
    color: #33415c;
}

@media (max-width: 700px) {
    .single-job_meta {
        grid-template-columns: repeat(2, 1fr);
    }
}

.single-job_compensation {
    display: flex;
    flex-direction: column;
    padding: 0.9em 1.1em;
    background: #f2f3f8;
    border: 1px solid #d7dbea;
    border-radius: 10px;
    margin-top: 1em;
}

.job_textfull p strong {
    display: block;
    color: #023d79;
    font-size: 1.2em;
}

.job_textfull ul {
    margin-left: 2.5em;
}

.job_textfull li {
    margin-bottom: 0.5em;
}

.job_form {
    border-top: 2px solid #4e84c4;
    margin: 2em 0;
    padding: 2em 0;
    text-align: left;
}

.job_form h2 {
    margin-bottom: 0.5em;
    color: #023d79;
    font-family: Source Sans Pro;
    font-weight: 600;
    font-style: normal;
    font-size: 1.75em;
    text-align: center;
}

/* New in the plugin port - no theme equivalent. */

.single-job_unavailable {
    padding: 2em 0;
    text-align: left;
}

.inovalon-careers-admin-notice {
    margin: 1em 0;
    padding: 0.9em 1.1em;
    background: #fff8e5;
    border: 1px solid #f0c33c;
    border-left-width: 4px;
    border-radius: 4px;
    font-size: 0.9em;
    text-align: left;
}
