.jobpro-dnone{
    display: none;
}
.jobpro-jobpro-preview-section {
    display: flex;
    width: 100%;
    background-color: #F0F5F7;
    border-radius: 8px;
    border: 1px solid #F0F5F7;
    padding: 20px;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
ul.jobpro-jobpro-preview-box {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
ul.jobpro-jobpro-preview-box li {
    display: inline-flex;
    background-color: #0074a9;
    padding: 10px;
    border-radius: 4px;
    color: #fff;
    line-height: 1;
    font-size: 14px;
    margin: 0px;
}
.wp-admin.post-type-job-alert #post-body-content {
    display: none;
}
/* Admin job-alert metabox: Country / State / City / Location Radius / Radius
   Type — all five on one row. Scoped to the metabox-only row class so the
   frontend widget's .jobpro-user-locations layout is untouched. NB: the parent
   .jobpro-main-advsearch-elements is a GRID (common.css, auto-fit minmax(300px))
   — without the full-width span this wrapper collapses into one ~300px grid
   cell and the fields stack vertically inside it. */
.jobpro-main-advsearch-elements .jobpro-alert-location-row {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}
.jobpro-main-advsearch-elements .jobpro-alert-location-row > .jobpro-adv-search-item {
    flex: 1 1 calc(20% - 12px);
    min-width: 140px;
}
/* Radius + Radius Type shrink to the minimum; Country/State/City absorb the rest. */
.jobpro-main-advsearch-elements .jobpro-alert-location-row > .jobpro-alert-radius-field {
    flex: 0 1 110px;
    min-width: 90px;
}

/* Keyword-location mode: frontend-parity chrome inside the admin metabox.
   The suggestion-box styles ship scoped to the dashboard (.jpro-default in
   jobpro-dashboard-common.css) and the locate button's frontend rule assumes
   a label-less search bar — both re-scoped here for the metabox row. */
.jobpro-alert-location-row .jobpro-autocomplete-suggboxholdr {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgb(0 0 0 / 0.1);
    font-size: 14px;
    left: 0;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 2;
}
.jobpro-alert-location-row ul.jobpro-open-street-suggbox {
    margin: 0;
    padding: 0;
}
.jobpro-alert-location-row li.jobpro-open-street-item {
    align-items: center;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    display: flex;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 12px 16px;
    transition: all 0.4s ease-in-out;
}
.jobpro-alert-location-row li.jobpro-open-street-item:hover {
    background-color: #f5f5f5;
}
/* The metabox item has a label above the input — pin the locate button to the
   input area only (frontend rule stretches it over the full item height). */
.jobpro-alert-location-row span.jobpro-location-find {
    bottom: 0;
    height: auto;
    min-height: 0;
    top: 30px;
}
.jobpro-alert-location-row .jobpro-inline-loader {
    background-color: #fff;
    bottom: 16px;
    position: absolute;
    right: 20px;
}

/* Employer field set (jobs + applicant pickers) is wrapped so wp-admin can
   show/hide it as one unit — but the wrapper must not take its items out of
   the metabox's grid (that pushed Select Applicants onto its own row).
   display:contents makes the wrapper transparent to layout, so Jobs and
   Select Applicants flow as normal grid cells; the inline display:none /
   jQuery .toggle() still hide the set as a whole. */
.jobpro-alert-employer-fields {
    display: contents;
}

/* Import Emails: info icon pinned to the end of the file input; the format
   help sits in its hover/focus tooltip — same dark bubble as the dashboard
   upload buttons' .jobpro-tooltip-upload. Loaded on wp-admin (metabox) and
   the front dashboards (shared form) alike. */
.jobpro-alert-import-field {
    position: relative;
    width: 100%;
}
.jobpro-alert-import-field input[type="file"] {
    /* inherits background/border/radius/height from .jobpro-input-style;
       only keep room for the info icon and centre the native file control */
    align-items: center;
    box-sizing: border-box;
    padding-right: 44px;
    width: 100%;
}
.jobpro-alert-import-field .jobpro-field-info {
    align-items: center;
    color: #64739a;
    cursor: help;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    outline: none;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    z-index: 2;
}
.jobpro-alert-import-field .jobpro-field-info svg {
    display: block;
    height: 18px;
    width: 18px;
}
.jobpro-alert-import-field .jobpro-field-info:hover,
.jobpro-alert-import-field .jobpro-field-info:focus {
    color: #7757e8;
}
.jobpro-alert-import-field .jobpro-field-info-tip {
    background-color: #000;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    margin-right: 5px;
    opacity: 0;
    padding: 8px 10px;
    pointer-events: none;
    position: absolute;
    right: 100%;
    text-align: left;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease-in;
    visibility: hidden;
    white-space: normal;
    width: 320px;
    z-index: 3;
}
.jobpro-alert-import-field .jobpro-field-info-tip::after {
    border-bottom: 6px solid transparent;
    border-left: 6px solid #000;
    border-top: 6px solid transparent;
    content: '';
    position: absolute;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
}
.jobpro-alert-import-field .jobpro-field-info:hover .jobpro-field-info-tip,
.jobpro-alert-import-field .jobpro-field-info:focus .jobpro-field-info-tip {
    margin-right: 12px;
    opacity: 1;
    visibility: visible;
}