/* Sports Hired shared screen layout, 0.7.43.7.
 * The canonical page owns the available width. Core, Hub Pages and nested
 * components must not each create a 100vw/100dvw negative-margin breakout.
 * No pricing, authentication, routing, print/PDF or checkout behavior changes.
 */
@media screen {
    body.sports-hired-layout-page {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    body.sports-hired-layout-page :where(
        #page-container, #et-main-area, #main-content,
        .sports-hired-shortcode-page-shell
    ) {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    /* Fix the boxes themselves. Do not mask their extra width by clipping
     * every ancestor: sticky sidebars and popup content must remain usable. */
    body.sports-hired-layout-page :is(
        .sh-public-app, .sh-workspace, .spma-public-sports-hired-shell,
        .spma-jobs-discovery, .spma-sh-marketing
    ) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        left: auto !important;
        box-sizing: border-box !important;
        overflow: visible;
    }

    /* Hub Pages' discovery view is not a .sh-app. It needs the same border-box
     * contract, and its centering gutters must use parent width, not 100vw. */
    body.sports-hired-layout-page :is(.spma-jobs-discovery, .spma-sh-marketing),
    body.sports-hired-layout-page :is(.spma-jobs-discovery, .spma-sh-marketing) *,
    body.sports-hired-layout-page :is(.spma-jobs-discovery, .spma-sh-marketing) *::before,
    body.sports-hired-layout-page :is(.spma-jobs-discovery, .spma-sh-marketing) *::after {
        box-sizing: border-box;
    }
    body.sports-hired-layout-page .spma-jobs-discovery {
        padding-inline: max(20px, calc((100% - 1280px) / 2));
    }
    body.sports-hired-layout-page .spma-sh-marketing {
        padding-inline: max(22px, calc((100% - 1220px) / 2));
    }

    /* Preserve the bounded job-detail reading surface, not a 100%-wide card. */
    body.sports-hired-layout-page .sh-public-app.sh-job-detail-v2 {
        width: min(calc(100% - 48px), 1240px) !important;
        max-width: 1240px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Host rows may still be supplied by Divi on embedded/custom surfaces.
     * Only the row that contains the public app is expanded. Header/footer
     * rows and unrelated page-builder content are not targeted. */
    @supports selector(.et_pb_row:has(.sh-public-app)) {
        body.sports-hired-layout-page #main-content :is(
            .et_pb_row, .et_pb_column, .et_pb_module, .et_pb_code_inner, .et_pb_text_inner
        ):has(:is(.sh-public-app, .spma-public-sports-hired-shell, .spma-jobs-discovery)) {
            width: 100% !important;
            max-width: 100% !important;
            min-width: 0 !important;
            margin-inline: 0 !important;
            box-sizing: border-box;
        }
    }

    /* Flexible tracks must be allowed to shrink below long titles/URLs and
     * table min-content widths. Do not force table columns themselves smaller. */
    body.sports-hired-layout-page :is(
        .sh-content-grid, .sh-dashboard-grid, .sh-grid, .sh-form-grid,
        .sh-post-grid-v2, .sh-post-layout-v2, .sh-job-public-layout,
        .sh-checkout-layout, .sh-checkout-grid, .sh-product-layout,
        .sh-product-shell, .sh-candidate-shell, .sh-account-grid,
        .sh-resume-workspace, .sh-auth-shell, .sh-auth-name-grid,
        .spma-jobs-search, .spma-jobs-searchbar, .spma-job-results,
        .shp-posting__grid, .shp-plans__grid, .shc-pricing-grid,
        .sh-employer-metric-grid, .sh-employer-quick-grid
    ),
    body.sports-hired-layout-page :is(
        .sh-content-grid, .sh-dashboard-grid, .sh-grid, .sh-form-grid,
        .sh-post-grid-v2, .sh-post-layout-v2, .sh-job-public-layout,
        .sh-checkout-layout, .sh-checkout-grid, .sh-product-layout,
        .sh-product-shell, .sh-candidate-shell, .sh-account-grid,
        .sh-resume-workspace, .sh-auth-shell, .sh-auth-name-grid,
        .spma-jobs-search, .spma-jobs-searchbar, .spma-job-results,
        .shp-posting__grid, .shp-plans__grid, .shc-pricing-grid,
        .sh-employer-metric-grid, .sh-employer-quick-grid
    ) > * {
        min-width: 0;
        box-sizing: border-box;
    }

    body.sports-hired-layout-page :is(
        .sh-candidate-shell__main, .sh-job-public-main, .sh-product-main,
        .sh-auth-main, .sh-auth-card, .sh-auth-panel, .sh-account-auth-form,
        .sh-auth-field, .sh-employer-search, .spma-job-results-wrap
    ) {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Keep full-width login screens without fixed column minimums adding up
     * to more than the available screen. Existing mobile stacking is retained. */
    body.sports-hired-layout-page .sh-auth-shell {
        min-width: 0 !important;
        max-width: 100%;
        grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    }

    body.sports-hired-layout-page :is(
        .sh-hero, .sh-dashboard-head, .sh-company-hero,
        .spma-jobs-discovery__hero
    ) > * {
        min-width: 0;
    }
    body.sports-hired-layout-page :is(
        .sh-row-actions, .sh-employer-filterbar, .spma-jobs-results-head
    ) {
        flex-wrap: wrap;
    }
    body.sports-hired-layout-page :is(.sh-app, .spma-jobs-discovery) :is(
        input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
        select, textarea
    ) {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
    body.sports-hired-layout-page :is(
        .sh-job-prose, .sh-landing-intro, .sh-product-main,
        .spma-jobs-card__title, .sh-job-public-identity,
        .sh-company-hero, .sh-card h2, .sh-card h3
    ) {
        overflow-wrap: anywhere;
    }
    body.sports-hired-layout-page :is(.sh-app, .spma-jobs-discovery) :is(img, video, iframe) {
        max-width: 100%;
    }

    /* Wide tables, pipeline boards and horizontal navigation scroll within
     * their component. Their parents are shrinkable, not cropped to the page. */
    body.sports-hired-layout-page :is(
        .sh-table-wrap, .sh-table-scroll, .sh-comparison-wrap,
        .spmcompare__scroll, .sh-pipeline-wrap,
        .sh-candidate-workspace-nav__links, .sh-employer-workspace-nav__links
    ) {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: auto;
    }

    @media (min-width: 901px) {
        body.sports-hired-layout-page .spma-jobs-search {
            grid-template-columns: 280px minmax(0, 1fr);
        }
        body.sports-hired-layout-page .spma-jobs-searchbar {
            grid-template-columns: minmax(0, 1.25fr) minmax(0, .65fr) minmax(0, .75fr) auto;
        }
    }
    @media (max-width: 960px) {
        body.sports-hired-layout-page .sh-auth-shell { grid-template-columns: minmax(0, 1fr); }
    }
    @media (max-width: 900px) {
        body.sports-hired-layout-page .spma-jobs-discovery { padding-inline: 14px; }
        body.sports-hired-layout-page .spma-sh-marketing { padding-inline: 18px; }
        body.sports-hired-layout-page .sh-public-app.sh-job-detail-v2 {
            width: calc(100% - 28px) !important;
        }
    }
    @media (max-width: 640px) {
        body.sports-hired-layout-page .spma-jobs-discovery,
        body.sports-hired-layout-page .spma-sh-marketing { padding-inline: 12px; }
        body.sports-hired-layout-page .sh-public-app.sh-job-detail-v2 {
            width: calc(100% - 20px) !important;
        }
    }

    /* A root-only guard for decorative overflow; no nested scroll container,
     * no body overflow:hidden, no changes to vertical/sticky scrolling.
     * All actual layout-width corrections above also work without this guard. */
    @supports (overflow: clip) {
        html:has(> body.sports-hired-layout-page) { overflow-x: clip; }
    }
}

/* 0.7.43.7: phone results are one card per row, in either renderer.
 * Hub Pages used to repeat a two-column tablet rule after its phone rule. */
@media screen and (max-width: 767px) {
    body.sports-hired-layout-page .spma-jobs-discovery .spma-job-results,
    body.sports-hired-layout-page .sh-jobs-page .sh-job-list {
        display: grid;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-flow: row;
        gap: 14px;
        width: 100%;
        min-width: 0;
    }
    body.sports-hired-layout-page .spma-job-results > .spma-jobs-card,
    body.sports-hired-layout-page .sh-jobs-page .sh-job-list > .sh-job-card {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        grid-column: 1 / -1;
        box-sizing: border-box;
    }
    body.sports-hired-layout-page .spma-jobs-card__foot {
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 12px;
    }
    body.sports-hired-layout-page .spma-jobs-card__foot-meta {
        flex: 1 1 180px;
        align-items: center;
        justify-content: flex-start;
        line-height: 1.5;
        gap: 4px 6px;
    }
    body.sports-hired-layout-page .spma-jobs-card__apply-by {
        line-height: 1.5;
        white-space: normal;
    }
    body.sports-hired-layout-page .spma-jobs-card__view {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        margin-left: auto;
        flex: 0 0 auto;
    }
}

/* Sports Hired 0.7.43.20: logged-in candidate/employer workspaces keep the
 * normal SPMA site chrome. This intentionally outranks legacy page-ID rules
 * that hid Divi Theme Builder headers/footers on old account pages. */
@media screen {
    body.sports-hired-layout-page.sports-hired-workspace-site-chrome :is(
        header.et-l.et-l--header,
        footer.et-l.et-l--footer,
        .et-l.et-l--header,
        .et-l.et-l--footer,
        #main-header,
        #main-footer
    ) {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}