/*
 Theme Name:   Superio Child
 Theme URI:    https://themeforest.net/item/superio-job-board-wordpress-theme/32180231
 Description:  Superio Child Theme
 Author:       ApusTheme
 Author URI:   http://apusthemes.com
 Template:     superio
 Version:      1.0.0
 Text Domain:  superio-child
*/


/* =========================================
   GLOBAL TYPOGRAPHY
   ========================================= */

body,
p {
    font-size: 18px;
    line-height: 1.3em;
}


/* =========================================
   MENU BAR
   ========================================= */

#header-menu {
    border-bottom: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    position: relative;
    z-index: 100;
}

#header-menu .megamenu>li>a {
    font-family: "Poppins", Sans-serif;
    font-size: 16px !important;
    line-height: 20px;
}

.fw-bold {
    font-weight: 600;
}


/* =========================================
   BREADCRUMBS
   ========================================= */

.apus-breadscrumb {
    background-color: #E5EBF5;
    margin: 0 0 30px;
    text-align: center;
    background-color: var(--e-global-color-7b0b33c);
    background-image: url(https://culminationmanpower.com/wp-content/uploads/2026/09/bg-cta-cms.webp);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    color: white;
}

.apus-breadscrumb .bread-title {
    font-size: 30px;
    color: white;
}

.apus-breadscrumb .breadcrumb a {
    color: white;
}


/* =========================================
   WHITE BORDER TEXT
   ========================================= */

.text-bdr-white {
    padding: 4px 10px;
    border-radius: 15px;
    border: 2px solid #fff;
}

.text-bdr-white:hover {
    padding: 4px 10px;
    border-radius: 15px;
    border: 2px solid #fff;
    background-color: #008A4B80;
}


/* =========================================
   RESPONSIVE HERO
   ========================================= */

@media (max-width: 768px) {
    .main-hero-section .widget-job-search-form .widget-title {
        line-height: 2.2;
    }
}

@media (min-width: 1200px) {
    .filter-listing-form.horizontal {
        padding: 8px 8px;
    }
}


/* =========================================
   NORMAL FORM INPUTS
   ========================================= */

/* Standard form controls */

.form-control {
    border: 1px solid #ccc;
}

/* CMB2 form controls */

form.cmb-form select,
form.cmb-form textarea,
form.cmb-form input[type="email"],
form.cmb-form input[type="url"],
form.cmb-form input[type="text"],
form.cmb-form input[type="password"],
form.cmb-form input[type="number"] {
    border: 1px solid #ccc;
}

/* Form labels */

.register-form-wrapper .form-group label,
.login-form-wrapper .form-group label {
    font-weight: 400;
    margin: 0 0 10px;
    color: #202124;
    font-size: 16px;
}


/* =========================================
   CMS TRUST PILLS
   Natural width and automatic wrapping
   ========================================= */

.cms-trust-pills {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 14px 16px;
    box-sizing: border-box;
}


/* =========================================
   TRUST PILL
   ========================================= */

.cms-trust-pill {
    position: relative;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;

    display: inline-flex;
    align-items: center;
    justify-content: flex-start;

    gap: 9px;
    box-sizing: border-box;

    padding: 7px 16px 7px 8px;

    background: #F1F8F5;
    border: 1px solid rgba(0, 138, 75, 0.18);
    border-radius: 999px;

    color: #3E4843;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;

    white-space: nowrap;

    box-shadow: 0 4px 14px rgba(0, 138, 75, 0.045);

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


/* =========================================
   TRUST PILL ICON
   ========================================= */

.cms-pill-icon {
    position: relative;

    width: 38px;
    height: 38px;
    flex: 0 0 38px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    background: #008A4B;
    color: #ffffff;

    border-radius: 50%;
    box-sizing: border-box;

    box-shadow: 0 3px 9px rgba(0, 138, 75, 0.22);

    animation: cmsPillPulse 3.5s ease-in-out infinite;
}


/* =========================================
   TRUST PILL ANIMATED RING
   ========================================= */

.cms-pill-icon::before {
    content: "";

    position: absolute;
    inset: -3px;

    border: 1px solid rgba(0, 138, 75, 0.20);
    border-radius: 50%;

    pointer-events: none;

    animation: cmsPillRing 4s ease-in-out infinite;
}


/* =========================================
   TRUST PILL SVG
   ========================================= */

.cms-pill-icon svg {
    width: 21px;
    height: 21px;
    flex: 0 0 auto;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================
   TRUST PILL HOVER
   ========================================= */

.cms-trust-pill:hover {
    transform: translateY(-2px);

    background: #E8F5EF;
    border-color: rgba(0, 138, 75, 0.35);

    box-shadow: 0 8px 20px rgba(0, 138, 75, 0.10);
}


/* =========================================
   TRUST PILL ANIMATIONS
   ========================================= */

@keyframes cmsPillPulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

@keyframes cmsPillRing {

    0%,
    100% {
        transform: scale(1);
        opacity: .45;
    }

    50% {
        transform: scale(1.07);
        opacity: .15;
    }
}


/* =========================================
   TRUST PILL RESPONSIVE
   ========================================= */

@media (max-width: 900px) {
    .cms-trust-pills {
        gap: 12px;
    }
}

@media (max-width: 600px) {
    .cms-trust-pills {
        gap: 10px;
    }

    .cms-trust-pill {
        font-size: 15px;
    }
}

@media (max-width: 420px) {
    .cms-trust-pill {
        width: 100%;
        max-width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {

    .cms-pill-icon,
    .cms-pill-icon::before {
        animation: none !important;
    }

    .cms-trust-pill {
        transition: none !important;
    }
}


/* =========================================
   CMS PROFILE FORM
   SELECT2 OVERRIDES
   ========================================= */

/*
 IMPORTANT:
 Do not apply borders to:
 .select2-container
 .select2-container *
 
 The actual border belongs on:
 .select2-selection--single
 .select2-selection--multiple
 .select2-dropdown
*/


/* =========================================
   1. SELECT2 OUTER WRAPPER
   Does not change form layout.
   ========================================= */

form.cmb-form .select2-container {
    box-sizing: border-box !important;
    max-width: 100% !important;
}


/* =========================================
   2. SINGLE SELECT BOX
   Age, Qualification, Experience, Salary Type
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--single {
    position: relative !important;

    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;

    box-sizing: border-box !important;

    background-color: #f0f5f8 !important;

    border: 1px solid #ccc !important;
    border-radius: 6px !important;

    box-shadow: none !important;
    outline: none !important;
}


/* =========================================
   3. SINGLE SELECT TEXT
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    display: flex !important;
    align-items: center !important;

    width: 100% !important;
    height: 50px !important;

    box-sizing: border-box !important;

    padding: 0 45px 0 20px !important;

    color: #65717d !important;

    font-size: 16px !important;
    line-height: normal !important;
}


/* =========================================
   4. SINGLE SELECT ARROW
   Keeps arrow vertically centered.
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--single .select2-selection__arrow {
    position: absolute !important;

    top: 0 !important;
    right: 12px !important;

    width: 20px !important;
    height: 50px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* =========================================
   5. MULTISELECT BOX
   Languages and Categories
   Same height as normal textboxes.
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--multiple {
    position: relative !important;

    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;

    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;

    padding: 6px 40px 6px 12px !important;

    background-color: #f0f5f8 !important;

    border: 1px solid #ccc !important;
    border-radius: 6px !important;

    box-shadow: none !important;
    outline: none !important;

    overflow: hidden !important;
}


/* =========================================
   6. MULTISELECT INTERNAL LIST
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    display: flex !important;
    align-items: center !important;

    flex-wrap: nowrap !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}


/* =========================================
   7. MULTISELECT SEARCH FIELD
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--multiple .select2-search--inline {
    display: block !important;

    flex: 1 1 auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
}

form.cmb-form .select2-container--default .select2-selection--multiple .select2-search__field {
    width: 100% !important;
    height: 36px !important;

    margin: 0 !important;
    padding: 0 8px !important;

    box-sizing: border-box !important;

    background: transparent !important;

    border: none !important;
    outline: none !important;
    box-shadow: none !important;

    color: #333 !important;
    font-size: 16px !important;
}


/* =========================================
   8. MULTISELECT SELECTED TAGS
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--multiple .select2-selection__choice {
    display: inline-flex !important;
    align-items: center !important;

    flex: 0 0 auto !important;

    background-color: #e4edf4 !important;

    border: 1px solid #c5d0d9 !important;
    border-radius: 4px !important;

    color: #333 !important;

    padding: 4px 8px !important;
    margin: 2px 4px 2px 0 !important;
}


/* =========================================
   9. OPEN DROPDOWN
   Visible border and subtle shadow.
   ========================================= */

.select2-container--default .select2-dropdown {
    background: #ffffff !important;

    border: 1px solid #999999 !important;
    border-radius: 6px !important;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;

    z-index: 999999 !important;
    overflow: hidden !important;
}


/* =========================================
   10. DROPDOWN SEARCH AREA
   ========================================= */

.select2-container--default .select2-search--dropdown {
    display: block;

    padding: 10px;

    background: #ffffff;

    border-bottom: 1px solid #d5d5d5;
}

.select2-container--default .select2-search--dropdown.select2-search--hide,
.select2-search--dropdown.select2-search--hide,
.no-search-dropdown .select2-search--dropdown {
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    height: 0 !important;
    min-height: 0 !important;
}


/* =========================================
   11. DROPDOWN SEARCH INPUT
   Green border always visible.
   ========================================= */

.select2-container--default .select2-search--dropdown .select2-search__field {
    display: block !important;

    width: 100% !important;
    height: 42px !important;

    box-sizing: border-box !important;

    padding: 8px 12px !important;

    background: #ffffff !important;

    color: #333333 !important;

    border: 1px solid #00a651 !important;
    border-radius: 4px !important;

    outline: none !important;
    box-shadow: none !important;

    font-size: 16px !important;
}


/* =========================================
   12. SEARCH FOCUS
   ========================================= */

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #00a651 !important;

    outline: none !important;

    box-shadow: 0 0 0 1px rgba(0, 166, 81, 0.15) !important;
}


/* =========================================
   13. DROPDOWN OPTIONS
   ========================================= */

.select2-container--default .select2-results__option {
    padding: 12px 16px !important;

    background: #ffffff !important;
    color: #333333 !important;

    font-size: 15px !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #eef3f7 !important;
    color: #222222 !important;
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background: #e4edf4 !important;
    color: #222222 !important;
}


/* =========================================
   14. SELECT2 FOCUS
   ========================================= */

form.cmb-form .select2-container--default .select2-selection--single:focus,
form.cmb-form .select2-container--default .select2-selection--multiple:focus {
    outline: none !important;
}


/* =========================================
   15. RESPONSIVE SELECT2
   ========================================= */

@media (max-width: 767px) {

    form.cmb-form .select2-container--default .select2-selection--single {
        height: 52px !important;
        min-height: 52px !important;
    }

    form.cmb-form .select2-container--default .select2-selection--multiple {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
    }

}


/* =========================================================
   CMS PROFILE FORM — RESPONSIVE FORM FIELD STYLING
   Preserves Superio parent theme's native .before-group-row columns.
   Desktop (768px+): Clean 2-column layout.
   Mobile (<768px): Responsive 1-column layout.
   ========================================================= */

/* Hide hidden fields completely so they never affect spacing */
form.cmb-form .cmb-type-hidden,
form.cmb-form input[type="hidden"],
form.cmb-form .hidden,
form.cmb-form .d-none,
form.cmb-form [style*="display: none"],
form.cmb-form [style*="display:none"] {
    display: none !important;
}

/* Ensure form controls expand 100% inside their column cells */
form.cmb-form .cmb-row {
    box-sizing: border-box;
}

/* Form Field Header & Label Typography */
form.cmb-form .cmb-row .cmb-th,
form.cmb-form .cmb-row .cmb-th label,
.cmb-th,
.cmb-th label {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #222222 !important;
    margin-top: 0 !important;
    margin-bottom: 6px !important;
}

form.cmb-form .cmb-row .cmb-th,
form.cmb-form .cmb-row .cmb-td,
form.cmb-form .cmb-row input[type="text"],
form.cmb-form .cmb-row input[type="email"],
form.cmb-form .cmb-row input[type="url"],
form.cmb-form .cmb-row input[type="password"],
form.cmb-form .cmb-row input[type="number"],
form.cmb-form .cmb-row select,
form.cmb-form .cmb-row textarea,
form.cmb-form .cmb-row .select2-container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Responsive alignment for radio & checkbox groups */
form.cmb-form .cmb-type-radio .cmb2-radio-list,
form.cmb-form .cmb-type-checkbox .cmb2-checkbox-list {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
    margin-top: 5px;
}

form.cmb-form .cmb-type-radio .cmb2-radio-list li,
form.cmb-form .cmb-type-checkbox .cmb2-checkbox-list li {
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

/* 2-Column Form Grid Layout Rules for Candidate Profile Form */
form.cmb-form .cmb-row.cmb-type-title,
form.cmb-form .cmb-row[class*="id-custom-heading"],
form.cmb-form .cmb-row[class*="id-_candidate_heading"],
form.cmb-form .cmb-row[class*="id-_employer_heading"],
form.cmb-form .cmb-row.cmb2-id--candidate-featured-image,
form.cmb-form .cmb-row.cmb2-id--candidate-profile-url,
form.cmb-form .cmb-row.cmb-type-wp-job-board-pro-file,
form.cmb-form .cmb-row.cmb-type-wp-job-board-pro-profile-url,
form.cmb-form .cmb-row.cmb-type-wysiwyg,
form.cmb-form .cmb-row.cmb2-id-post-content,
form.cmb-form .cmb-row.cmb2-id-description,
form.cmb-form .cmb-row.cmb2-id--employer-description,
form.cmb-form .cmb-row.cmb2-id--candidate-description,
form.cmb-form .cmb-row[class*="id-_employer_description"],
form.cmb-form .cmb-row[class*="id-_candidate_description"],
form.cmb-form .cmb-row[class*="id-post-content"],
form.cmb-form .cmb-row[class*="id-description"] {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    display: block !important;
}

@media (min-width: 768px) {

    /* 50% width for standard form fields inside .columns-2 */
    .before-group-row.columns-2 .before-group-row-inner>.cmb-row:not(.cmb-type-title):not(.cmb2-id--candidate-featured-image):not(.cmb2-id--candidate-profile-url):not(.cmb-type-wp-job-board-pro-file):not(.cmb-type-wp-job-board-pro-profile-url):not(.cmb-type-wysiwyg):not(.cmb2-id-post-content):not([class*="id-description"]):not([class*="id-post-content"]) {
        width: 50% !important;
        float: left !important;
        box-sizing: border-box !important;
    }

    /* Main Profile Section (#heading-custom-heading-33): Featured Image is 2nd child. Input pairs start at 3rd child (odd=left, even=right) */
    #heading-custom-heading-33 .before-group-row-inner>.cmb-row:not(.cmb-type-title):not(.cmb2-id--candidate-featured-image):not(.cmb2-id--candidate-profile-url):nth-child(2n+1) {
        clear: left !important;
    }

    #heading-custom-heading-33 .before-group-row-inner>.cmb-row:not(.cmb-type-title):not(.cmb2-id--candidate-featured-image):not(.cmb2-id--candidate-profile-url):nth-child(2n) {
        clear: none !important;
    }

    /* Contact Information Section (#heading-custom-heading-34): Address starts on left, Location stays on right */
    #heading-custom-heading-34 .before-group-row-inner>.cmb2-id--candidate-address {
        clear: left !important;
    }

    #heading-custom-heading-34 .before-group-row-inner>.cmb2-id--candidate-location {
        clear: none !important;
    }

    /* General fallback for any other .columns-2 sections */
    .before-group-row.columns-2:not(#heading-custom-heading-33):not(#heading-custom-heading-34) .before-group-row-inner>.cmb-row.cmb-type-title~.cmb-row:nth-child(2n) {
        clear: left !important;
    }

    .before-group-row.columns-2:not(#heading-custom-heading-33):not(#heading-custom-heading-34) .before-group-row-inner>.cmb-row.cmb-type-title~.cmb-row:nth-child(2n+1) {
        clear: none !important;
    }

    /* Force Show My Profile field to clear floats and align cleanly on the left column */
    form.cmb-form .cmb-row[class*="show_profile"],
    form.cmb-form .cmb-row[class*="show-profile"] {
        clear: both !important;
        float: left !important;
    }
}

form#_candidate_front {
    margin-bottom: 70px;
}


/* =========================================================
   CMS CANDIDATE PROFILE FORM - VALIDATION & EDUCATION 3-COL LAYOUT
   ========================================================= */

.required,
span.required,
label .required,
label span.required,
.cmb2-metabox-title .required {
    color: #d9534f !important;
    font-weight: bold !important;
    margin-left: 3px !important;
}

.culmination-error-msg {
    color: #d9534f !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    margin-top: 5px !important;
    margin-bottom: 2px !important;
    display: block !important;
    width: 100% !important;
    clear: both !important;
}

input.is-invalid,
select.is-invalid,
textarea.is-invalid {
    border: 2px solid #d9534f !important;
    background-color: #fff8f8 !important;
}

.culmination-empty-hidden-row {
    display: none !important;
}

/* Ensure closed repeater rows hide content properly */
.cmb-repeatable-grouping.closed .cmb-nested,
.cmb-repeatable-grouping.closed .cmb-repeatable-grouping-fields,
.cmb-repeatable-grouping.closed .cmb-rows {
    display: none !important;
}

/* Education Fields: 1 Row with 3 Columns (Title, Academy, Passing Year) & Description Below */
.cmb2-id--candidate-education .cmb-repeatable-grouping:not(.closed) .cmb-nested,
.cmb2-id--candidate-education .cmb-repeatable-grouping:not(.closed) .cmb-repeatable-grouping-fields,
.cmb2-id--candidate-education .cmb-repeatable-grouping:not(.closed) .cmb-rows {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.cmb2-id--candidate-education .cmb-repeatable-grouping .cmb-row {
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
    margin-bottom: 15px !important;
}

/* Course/Degree Name, University/Institute, Passing Year: 3 Columns (33.333% each) */
.cmb2-id--candidate-education .cmb2-id-title,
.cmb2-id--candidate-education .cmb2-id-academy,
.cmb2-id--candidate-education .cmb2-id-year,
.cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-title"],
.cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-academy"],
.cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-year"],
.cmb2-id--candidate-education .cmb2-id-education-title,
.cmb2-id--candidate-education .cmb2-id-education-academy,
.cmb2-id--candidate-education .cmb2-id-education-year {
    width: 33.333% !important;
    flex: 0 0 33.333% !important;
    max-width: 33.333% !important;
}

/* Description: Full Width (100%) below the 3 columns */
.cmb2-id--candidate-education .cmb2-id-description,
.cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-description"],
.cmb2-id--candidate-education .cmb2-id-education-description {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    clear: both !important;
}

@media (max-width: 767px) {

    .cmb2-id--candidate-education .cmb2-id-title,
    .cmb2-id--candidate-education .cmb2-id-academy,
    .cmb2-id--candidate-education .cmb2-id-year,
    .cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-title"],
    .cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-academy"],
    .cmb2-id--candidate-education div[class*="cmb2-id-"][class*="-year"],
    .cmb2-id--candidate-education .cmb2-id-education-title,
    .cmb2-id--candidate-education .cmb2-id-education-academy,
    .cmb2-id--candidate-education .cmb2-id-education-year {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* Hide search box in dropdowns for Qualification, Experience, Salary Type, and Age without leaving top whitespace */
.cmb2-id--candidate-qualification .select2-search--dropdown,
.cmb2-id--candidate-experience-time .select2-search--dropdown,
.cmb2-id--candidate-salary-type .select2-search--dropdown,
.cmb2-id--candidate-age .select2-search--dropdown,
.select2-dropdown-no-search .select2-search--dropdown,
.no-search-dropdown .select2-search--dropdown,
.select2-search--dropdown.select2-search--hide {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

.no-search-dropdown .select2-results,
.no-search-dropdown .select2-results__options {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* =========================================================
   CANDIDATE PROFILE DETAIL PAGE - EDUCATION & EXPERIENCE DISPLAY STYLING
   ========================================================= */

.my_resume_eduarea .year {
    color: #1967d2 !important;
    background-color: #f0f5f7 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 3px 10px !important;
    border-radius: 12px !important;
    display: inline-block !important;
    margin-left: 8px !important;
}

.my_resume_eduarea .edu_center,
.my_resume_eduarea .university {
    color: #1967d2 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    margin-top: 3px !important;
}

/* Green Success Alert Banner for Form Submission */
.alert-success,
.culmination-success-alert,
.wp-job-board-pro-message.success,
.job-board-pro-message.success {
    background-color: #f0fdf4 !important;
    color: #15803d !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 8px !important;
    padding: 14px 18px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin-bottom: 24px !important;
    box-shadow: 0 4px 12px rgba(21, 128, 61, 0.08) !important;
}

form.cmb-form .button-secondary,
form.cmb-form .cmb-row[data-fieldtype="wp_job_board_pro_file"] .upload-file-btn {
    background: var(--superio-theme-color-015) !important;
    color: var(--superio-theme-color) !important;
}


/* =========================================================
   END CMS PROFILE FORM STYLING
   ========================================================= */

/* =========================================================
   CANDIDATE INFORMATION 2-COLUMN GRID LAYOUT
   ========================================================= */
ul.list.candidate-info-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -15px !important;
    margin-right: -15px !important;
    padding-left: 0 !important;
    list-style: none !important;
}

ul.list.candidate-info-grid>li {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-bottom: 24px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
}

ul.list.candidate-info-grid>li .icon {
    margin-right: 15px !important;
    flex-shrink: 0 !important;
}

/* Sidebar behavior: Keep single column inside narrow sidebar */
.sidebar-job ul.list.candidate-info-grid>li {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
}

@media (max-width: 576px) {
    ul.list.candidate-info-grid>li {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

.send-private-wrapper .send-private-message-btn {
    font-weight: 500;
    color: #696969;
    text-decoration: underline;
    padding: 0;
    border: 0;
    display: none !important;
}

/* =========================================================
   EMPLOYER & CANDIDATE PROFILE FORM SUBMIT BUTTON SPACING
   ========================================================= */
form.cmb-form .form-group.submit-wrapper,
form.cmb-form p.submit,
form.cmb-form .cmb-submit-group,
form.cmb-form .form-group button[type="submit"],
form.cmb-form .form-group input[type="submit"],
form.cmb-form button.btn-theme,
form.cmb-form input.btn-theme,
form.cmb-form .btn-theme-second,
.profile-form-wrapper form button[type="submit"],
.profile-form-wrapper form input[type="submit"] {
    margin-top: 32px !important;
    margin-bottom: 50px !important;
}


/* =========================================================
   SINGLE EMPLOYER HEADER V2 STYLING (EMPLOYER SINGLE PAGE V3)
   ========================================================= */
.employer-detail-header.v2,
.employer-detail-header.v2.candidate-detail-header {
    text-align: center !important;
    padding: 45px 0 !important;
    background-color: var(--e-global-color-7b0b33c, #1967d2) !important;
    background-image: url('https://culminationmanpower.com/wp-content/uploads/2026/09/bg-cta-cms.webp') !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    position: relative !important;
}

/* White text color for titles, metas & job counts on header background */
.employer-detail-header.v2 .top-information,
.employer-detail-header.v2 .title-wrapper .candidate-title,
.employer-detail-header.v2 .title-wrapper h1,
.employer-detail-header.v2 .title-wrapper h2,
.employer-detail-header.v2 .employer-title,
.employer-detail-header.v2 .employer-metas-bottom,
.employer-detail-header.v2 .employer-metas-bottom .nb-job,
.employer-detail-header.v2 .employer-metas-bottom .nb-job span,
.employer-detail-header.v2 .employer-metas-bottom .nb-job .text,
.employer-detail-header.v2 .employer-metas,
.employer-detail-header.v2 .employer-metas span,
.employer-detail-header.v2 .employer-metas a,
.employer-detail-header.v2 .employer-metas i,
.employer-detail-header.v2 .employer-metas svg {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4) !important;
}

/* Styled logo container */
.employer-detail-header.v2 .candidate-thumbnail .employer-logo img,
.employer-detail-header.v2 .employer-logo img {
    border-radius: 10px !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25) !important;
    background-color: #ffffff !important;
}


/* =========================================================
   POST A NEW JOB FORM - MULTI-COLUMN RESPONSIVE GRID LAYOUT
   ========================================================= */

#cmb2-metabox-_job_front .before-group-row-inner,
form#_job_front .before-group-row-inner,
.job-submit-wrapper .before-group-row-inner,
.submit-job-form-wrapper .before-group-row-inner {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -10px !important;
    margin-right: -10px !important;
}

#cmb2-metabox-_job_front .cmb-row,
form#_job_front .cmb-row,
.job-submit-wrapper .cmb-row,
.submit-job-form-wrapper .cmb-row {
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
    margin-bottom: 20px !important;
}

/* Full Width (100%) Fields */
#cmb2-metabox-_job_front .cmb-row.cmb-type-title,
#cmb2-metabox-_job_front .cmb2-id--job-featured-image,
#cmb2-metabox-_job_front .cmb2-id--job-title,
#cmb2-metabox-_job_front .cmb2-id--job-description,
#cmb2-metabox-_job_front .cmb2-id--job-address,
#cmb2-metabox-_job_front .cmb2-id--job-career-level,
form#_job_front .cmb-row.cmb-type-title,
form#_job_front .cmb2-id--job-featured-image,
form#_job_front .cmb2-id--job-title,
form#_job_front .cmb2-id--job-description,
form#_job_front .cmb2-id--job-address,
form#_job_front .cmb2-id--job-career-level {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    clear: both !important;
}

@media (min-width: 768px) {

    /* 1. Job Category & Job Type: 1 Row with 2 Columns (50% each) */
    #cmb2-metabox-_job_front .cmb2-id--job-category,
    #cmb2-metabox-_job_front .cmb2-id--job-type,
    form#_job_front .cmb2-id--job-category,
    form#_job_front .cmb2-id--job-type {
        width: 50% !important;
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }

    #cmb2-metabox-_job_front .cmb2-id--job-category,
    form#_job_front .cmb2-id--job-category {
        clear: left !important;
    }

    /* 2. Experience & Education level: 1 Row with 2 Columns (50% each) */
    #cmb2-metabox-_job_front .cmb2-id--job-experience,
    #cmb2-metabox-_job_front .cmb2-id--job-qualification,
    form#_job_front .cmb2-id--job-experience,
    form#_job_front .cmb2-id--job-qualification {
        width: 50% !important;
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }

    #cmb2-metabox-_job_front .cmb2-id--job-experience,
    form#_job_front .cmb2-id--job-experience {
        clear: left !important;
    }

    /* 3. Gender & Job City: 1 Row with 2 Columns (50% each) */
    #cmb2-metabox-_job_front .cmb2-id--job-gender,
    #cmb2-metabox-_job_front .cmb2-id--job-location,
    form#_job_front .cmb2-id--job-gender,
    form#_job_front .cmb2-id--job-location {
        width: 50% !important;
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }

    #cmb2-metabox-_job_front .cmb2-id--job-gender,
    form#_job_front .cmb2-id--job-gender {
        clear: left !important;
    }

    /* 4. Salary Type, Min. Salary, Max. Salary: 1 Row with 3 Columns (33.333% each) */
    #cmb2-metabox-_job_front .cmb2-id--job-salary-type,
    #cmb2-metabox-_job_front .cmb2-id--job-salary,
    #cmb2-metabox-_job_front .cmb2-id--job-max-salary,
    form#_job_front .cmb2-id--job-salary-type,
    form#_job_front .cmb2-id--job-salary,
    form#_job_front .cmb2-id--job-max-salary {
        width: 33.333% !important;
        flex: 0 0 33.333% !important;
        max-width: 33.333% !important;
    }

    #cmb2-metabox-_job_front .cmb2-id--job-salary-type,
    form#_job_front .cmb2-id--job-salary-type {
        clear: left !important;
    }

    /* Job Apply Type, External URL, Job Apply Email: 1 Row with 3 Columns (33.333% each) */
    #cmb2-metabox-_job_front .cmb2-id--job-apply-type,
    #cmb2-metabox-_job_front .cmb2-id--job-apply-url,
    #cmb2-metabox-_job_front .cmb2-id--job-apply-email,
    form#_job_front .cmb2-id--job-apply-type,
    form#_job_front .cmb2-id--job-apply-url,
    form#_job_front .cmb2-id--job-apply-email {
        width: 33.333% !important;
        flex: 0 0 33.333% !important;
        max-width: 33.333% !important;
    }

    #cmb2-metabox-_job_front .cmb2-id--job-apply-type,
    form#_job_front .cmb2-id--job-apply-type {
        clear: left !important;
    }
}

/* Mobile Breakdown (<768px): All columns collapse cleanly into 100% single column rows */
@media (max-width: 767px) {

    #cmb2-metabox-_job_front .cmb-row,
    form#_job_front .cmb-row {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        clear: both !important;
    }
}


@media (min-width: 1200px) {
    .list-content-job .job-detail-detail .list li {
        width: 50%;
    }

    .list-content-job .job-detail-detail {
        padding: 25px 30px;
        background: #e4fbea;
    }

}