/* Staff pending Document review: in-page edit + Form/Document switch + orange Post. */
.cc-ad-switch-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    color: inherit;
    text-decoration: none;
    flex: 0 0 auto;
}

/* Document-review Apply now: same on/off chrome as Designer (not a disabled preview). */
.job-right [data-cc-doc-apply="1"] {
    display: inline-flex;
    align-items: center;
}

.job-right .job-action-buttons [data-cc-doc-apply="1"] .btn {
    position: relative;
    /* Beat Assets `.btn { padding: 5px 39px }` so Apply hugs its label like Actions. */
    padding: 5px 0.9rem 5px calc(0.28rem + 5px + 0.28rem);
    cursor: pointer;
}

.job-right [data-cc-doc-apply="1"] .cc-ad-apply-status {
    position: absolute;
    left: 0.28rem;
    top: 50%;
    width: 5px;
    height: 5px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    background: var(--cc-ad-apply-status-off, #94a3b8);
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
}

.job-right [data-cc-doc-apply="1"] .btn:not(.is-cc-ad-apply-off) .cc-ad-apply-status {
    background: var(--cc-ad-apply-status-on, #22c55e);
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
}

html[data-theme="dark"] .job-right [data-cc-doc-apply="1"] .cc-ad-apply-status {
    --cc-ad-apply-status-off: #94a3b8;
    --cc-ad-apply-status-on: #4ade80;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.job-right [data-cc-doc-apply="1"] .btn.is-cc-ad-apply-off {
    opacity: 0.38;
    filter: saturate(0.28);
}

.job-right [data-cc-doc-apply="1"] .btn.is-cc-ad-apply-off:hover,
.job-right [data-cc-doc-apply="1"] .btn.is-cc-ad-apply-off:focus {
    opacity: 0.55;
}

.cc-doc-autosave-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-right: 2px;
    flex: 0 0 auto;
    position: relative;
}

/* Idle until the user edits; do not show a ✓ on first paint. */
.cc-doc-autosave-status[hidden],
.cc-doc-autosave-status:not([data-cc-doc-autosave-touched="1"]) {
    display: none !important;
}

/* Posted title-line Copy: Org/Staff only; visible while the Position row is hovered/focused. */
.job-right-title .job-copy-form[data-cc-job-title-copy-hover="1"] {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.12s ease;
}

.job-right-title:hover .job-copy-form[data-cc-job-title-copy-hover="1"],
.job-right-title:focus-within .job-copy-form[data-cc-job-title-copy-hover="1"],
.job-right-title .job-copy-form[data-cc-job-title-copy-hover="1"]:focus-within {
    opacity: 1;
    pointer-events: auto;
}

/* Title-bar Actions: open remaining items on hover (fine pointer), keep click for touch. */
@media (hover: hover) and (pointer: fine) {
    .job-right-title .drop-group-block.auto-dropdown:hover > .dropdown-menu,
    .job-right-title .drop-group-block.auto-dropdown:focus-within > .dropdown-menu {
        display: block;
    }
}

.cc-doc-autosave-status__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    cursor: default;
    color: inherit;
}

button.cc-doc-autosave-status__save {
    cursor: pointer;
}

.cc-doc-autosave-status__btn[hidden] {
    display: none !important;
}

.cc-doc-autosave-status__btn img {
    display: block;
    width: 20px;
    height: 20px;
    filter: none !important;
}

/* Same circular ✓ pill as Profile/Team/Applicants autosave (not Submit checked.svg). */
.cc-doc-autosave-status__saved .cc-profile-autosave-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin: 0;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #d7e2ef;
    background: #eefaf4;
    color: #1f7a53;
    font-size: 12px;
    line-height: 1;
    cursor: help;
    box-shadow: 0 0 1px rgba(26, 58, 92, 0.45);
}

html[data-theme="dark"] .cc-doc-autosave-status__saved .cc-profile-autosave-status {
    border-color: #334155;
    background: rgba(148, 216, 187, 0.14);
    color: #94d8bb;
}

/* Floppy Save stays sharp on the blue title bar or Document tab tools row. */
.job-right-title .cc-doc-autosave-status__save img,
.job-right .job-tab .cc-ad-tab-tools .cc-doc-autosave-status__save img {
    filter: drop-shadow(0 0 1px rgba(26, 58, 92, 0.35)) !important;
}

.job-right-title .cc-doc-autosave-status__saving img,
.job-right .job-tab .cc-ad-tab-tools .cc-doc-autosave-status__saving img {
    filter: brightness(0) invert(1) drop-shadow(0 0 1px rgba(26, 58, 92, 0.55)) !important;
    opacity: 0.95;
}

.cc-doc-autosave-status__spinner {
    display: block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #FFFFFF;
    border-radius: 50%;
    box-shadow: 0 0 1px rgba(26, 58, 92, 0.55);
    animation: cc-doc-autosave-spin 0.7s linear infinite;
}

@keyframes cc-doc-autosave-spin {
    to { transform: rotate(360deg); }
}

.cc-doc-autosave-status[data-state="dirty"] {
    animation: cc-doc-autosave-pulse 1.4s ease-in-out infinite;
}

@keyframes cc-doc-autosave-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.72; }
}

.cc-ad-switch-link:hover,
.cc-ad-switch-link:focus {
    text-decoration: none;
    opacity: 0.85;
    color: inherit;
}

.cc-ad-switch-icon {
    display: block;
    width: 20px;
    height: 20px;
}

.job-right-title .job-action-buttons .cc-ad-switch-link,
.job-right .cc-job-meta-panel .cc-ad-meta-editor-switch .cc-ad-switch-link,
.job-right .cc-ad-body-editor-switch .cc-ad-switch-link {
    color: inherit;
}

html[data-theme="dark"] .job-right-title .job-action-buttons .cc-ad-switch-link,
html[data-theme="dark"] .job-right .cc-job-meta-panel .cc-ad-meta-editor-switch .cc-ad-switch-link,
html[data-theme="dark"] .job-right .cc-ad-body-editor-switch .cc-ad-switch-link {
    color: var(--cc-theme-dark-text, #e8eef7);
}

.profile-tab:has(.cc-ad-switch-tab) {
    max-width: 1416px;
}

.profile-tab .cc-ad-switch-tab {
    flex: 0 0 auto !important;
    min-width: 0;
    margin-left: auto;
    padding-right: 15px;
}

.profile-tab .cc-ad-switch-link {
    color: #006db7;
}

html[data-theme="dark"] .profile-tab .cc-ad-switch-link {
    color: var(--cc-theme-dark-text, #e8eef7);
}

/* Actions sit on the listing tab row (.cc-ad-tab-actions); keep title-bar selectors for legacy. */
.job-right [data-cc-pending-review-actions].is-cc-ad-actions-ready > .dropdown-toggle,
.job-right [data-cc-pending-review-actions] > .dropdown-toggle.btn-orange-gradient,
.job-right [data-cc-pending-review-actions] > .dropdown-toggle.btn-blue-gradient {
    color: #fff !important;
}

html[data-theme="light"] .job-right [data-cc-pending-review-actions] > .dropdown-toggle.btn-orange-gradient,
html[data-theme="dark"] .job-right [data-cc-pending-review-actions] > .dropdown-toggle.btn-orange-gradient,
html[data-theme="light"] .job-right [data-cc-pending-review-actions] > .dropdown-toggle.btn-blue-gradient,
html[data-theme="dark"] .job-right [data-cc-pending-review-actions] > .dropdown-toggle.btn-blue-gradient {
    color: #fff !important;
}

.job-right [data-cc-pending-review-actions="pending"] > .dropdown-toggle.cc-pending-status-pill,
.job-right .is-cc-pending-status-pill > .dropdown-toggle.cc-pending-status-pill {
    border-radius: 999px;
    border: 0;
    background: #ead889;
    color: #5a4a12 !important;
    box-shadow: none;
}

html[data-theme="dark"] .job-right [data-cc-pending-review-actions="pending"] > .dropdown-toggle.cc-pending-status-pill,
html[data-theme="dark"] .job-right .is-cc-pending-status-pill > .dropdown-toggle.cc-pending-status-pill {
    background: #c9b45a;
    color: #2d2508 !important;
}

[data-cc-pending-review] ~ * [contenteditable="true"],
.job-right [contenteditable="true"].cc-job-translate-value,
.job-right [contenteditable="true"][data-cc-job-translate-field] {
    outline: none;
    min-width: 1ch;
    cursor: text;
}

.job-right [contenteditable="true"][data-cc-job-translate-field]:focus,
.job-right [contenteditable="true"].cc-job-translate-value:focus {
    outline: 1px dashed currentColor;
    outline-offset: 2px;
}

.job-right-title .cc-job-detail-title-marquee [contenteditable="true"][data-cc-job-translate-field="title"]:focus {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    animation: none !important;
    transform: none !important;
}

/* Freeze parent marquee crawl the moment the editable title is focused. */
.job-right-title .cc-job-detail-title-marquee:focus-within.is-overflowing .cc-job-list-marquee__text,
.job-right-title .cc-job-detail-title-marquee:focus-within .cc-job-list-marquee__text {
    animation: none !important;
    transform: none !important;
}

.job-action-buttons .dropdown-menu.is-cc-actions-copy-on-title form:has(img[src*="copy.svg"]),
.job-action-buttons .dropdown-menu.is-cc-actions-copy-on-title a.dropdown-item:has(img[src*="copy.svg"]),
.job-action-buttons .dropdown-menu.is-cc-actions-copy-on-title button.dropdown-item:has(img[src*="copy.svg"]) {
    display: none !important;
}

/* Fine pointer: primary already on the toggle — do not repeat it in the menu.
   Keep the form in a clipped off-screen box (not display:none) so requestSubmit works.
   Actions live on the tab row; match any .job-right placement. */
@media (hover: hover) and (pointer: fine) {
    /* Clip the ready primary from the menu so it is not repeated — except Save.
       Save must stay visible in the Actions list even when the closed primary is
       already Save (and when Email/Expire is still showing before promote).
       Do not add [data-cc-actions-menu-primary="save"] to this clip list. */
    .job-right [data-cc-pending-review-actions="submit"].is-cc-ad-actions-ready .dropdown-menu [data-cc-actions-menu-primary="submit"],
    .job-right [data-cc-pending-review-actions="post"].is-cc-ad-actions-ready .dropdown-menu [data-cc-actions-menu-primary="post"],
    .job-right [data-cc-pending-review-actions="copy"].is-cc-ad-actions-ready .dropdown-menu [data-cc-actions-menu-primary="copy"],
    .job-right [data-cc-pending-review-actions="expire"].is-cc-ad-actions-ready .dropdown-menu [data-cc-actions-menu-primary="expire"],
    .job-right [data-cc-pending-review-actions="post_and_email"].is-cc-ad-actions-ready .dropdown-menu [data-cc-actions-menu-primary="post_and_email"],
    .job-right [data-cc-pending-review-actions="submit"].is-cc-ad-actions-ready .dropdown-menu form:has([data-cc-actions-menu-primary="submit"]),
    .job-right [data-cc-pending-review-actions="post"].is-cc-ad-actions-ready .dropdown-menu form:has([data-cc-actions-menu-primary="post"]),
    .job-right [data-cc-pending-review-actions="copy"].is-cc-ad-actions-ready .dropdown-menu form:has([data-cc-actions-menu-primary="copy"]),
    .job-right [data-cc-pending-review-actions="expire"].is-cc-ad-actions-ready .dropdown-menu form:has([data-cc-actions-menu-primary="expire"]),
    .job-right [data-cc-pending-review-actions="post_and_email"].is-cc-ad-actions-ready .dropdown-menu form:has([data-cc-actions-menu-primary="post_and_email"]) {
        position: absolute !important;
        left: -10000px !important;
        top: 0 !important;
        width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        clip: rect(0 0 0 0) !important;
        clip-path: inset(50%) !important;
        white-space: nowrap !important;
    }
}

.job-right .job-action-buttons .dropdown-menu .dropdown-item img {
    filter: none !important;
}

html[data-theme="dark"] .job-right .job-action-buttons .dropdown-menu .dropdown-item img,
html[data-theme="dark"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img,
html[data-theme="light"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img {
    /* Keep native Action icon colors (do not dark-invert / theme-tint). */
    filter: none !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img {
    filter: none !important;
}

/* Explicit: never let the global dark dropdown invert restyle title-line Actions. */
html[data-theme="dark"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img,
html[data-theme="dark"] .job-right .job-action-buttons .dropdown-menu .dropdown-item img {
    filter: none !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline {
    display: inline-flex;
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-toggle {
    display: none;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu {
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 2px;
    position: static;
    float: none;
    transform: none;
    inset: auto;
    margin: 0;
    padding: 0;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    min-width: 0;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-divider {
    display: none;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu > form {
    display: inline-flex;
    margin: 0;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item,
html[data-theme="dark"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item,
html[data-theme="dark"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item:hover,
html[data-theme="dark"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item:focus,
html[data-theme="light"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item:hover,
html[data-theme="light"] .job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item:focus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin: 0 4px 0 0;
    padding: 0 !important;
    white-space: nowrap;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
    font-size: 0 !important;
    line-height: 1 !important;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    position: relative;
    opacity: 1;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item:hover,
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item:focus {
    opacity: 0.88;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item .cc-job-action-label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img {
    display: block;
    width: 20px;
    height: 20px;
    font-size: 16px;
    line-height: normal;
}

/* Copy-style [tooltip] bubble on title-line Action icons (Log keeps its own popover). */
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item[tooltip]::after {
    font-size: 12px !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

/* Stable hover labels: do not replay the global tooltip entrance animation on
 * title-line Action icons (fit/measure cycles used to restart it and flicker). */
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item[tooltip]:hover::before,
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item[tooltip]:hover::after {
    opacity: 0.9 !important;
    animation: none !important;
    transform: translate(-50%, 0) !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .job-action-log-item {
    font-size: 0 !important;
}

.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .job-action-log-item[tooltip],
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .job-action-log-item[tooltip]::before,
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .job-action-log-item[tooltip]::after {
    display: none !important;
}

/* Keep Post pushpin orange on the blue title gradient (no theme invert). */
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img[src*="announcement-action-post.svg"],
.job-action-buttons .dropdown-menu .dropdown-item img[src*="announcement-action-post.svg"],
.job-right-title .drop-group-block.is-cc-job-actions-inline > .dropdown-menu .dropdown-item img[src*="announcement-action-careerhouse.svg"],
.job-action-buttons .dropdown-menu .dropdown-item img[src*="announcement-action-careerhouse.svg"] {
    filter: none !important;
}

.job-tab-content h4[data-cc-listing-field] {
    cursor: text;
}

.job-right [contenteditable="true"][data-cc-job-translate-field].cc-doc-flow-joined,
.job-right [contenteditable="true"][data-cc-job-translate-field].cc-doc-flow-section {
    padding-left: 0;
    text-indent: 0;
}

.job-right [contenteditable="true"][data-cc-job-translate-field] > :first-child {
    margin-top: 0;
}

.job-right [contenteditable="true"][data-cc-job-translate-field] > .cc-ad-flow-break,
.job-right [contenteditable="true"][data-cc-job-translate-field] > .cc-doc-flow-break {
    display: block !important;
    clear: both !important;
    width: 100%;
    height: 0;
    line-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
}

.job-tab-content h4.cc-listing-flow-line + [data-cc-job-translate-field][contenteditable="true"] {
    display: block;
}

/* Meta labels shrink to wording so Company / Location / Deadline values sit next to the colon. */
.job-right .cc-job-meta-panel > .table {
    width: auto;
    max-width: 100%;
    table-layout: auto;
}

.job-right .cc-job-meta-panel .table th.cc-job-meta-th {
    width: 1%;
    white-space: nowrap;
    padding-right: 0.35rem;
    vertical-align: baseline;
}

.job-right .cc-job-meta-panel .table td {
    padding-left: 0;
    vertical-align: baseline;
}

/*
 * Draft/Pending Document review: reuse create-Designer listing meta icons
 * (Company / Location / Opening Date / Deadline / Duration) with the same
 * Light/Dark tint. Public posted detail stays wording-only on desktop.
 */
.job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-label {
    display: inline-flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 0.55rem;
    gap: 0.55rem;
    line-height: 1.2;
}

.job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-ad-meta-icon {
    display: block !important;
    flex: none;
    width: 1.05rem;
    height: 1.05rem;
    pointer-events: none;
    /* Same Light tint as Designer `.cc-ad-meta .cc-ad-meta-icon`. */
    filter: invert(27%) sepia(91%) saturate(1642%) hue-rotate(186deg) brightness(94%) contrast(101%);
}

html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-ad-meta-icon {
    /* Same Dark tint as Designer `.cc-ad-meta .cc-ad-meta-icon`. */
    filter: invert(79%) sepia(18%) saturate(747%) hue-rotate(176deg) brightness(95%) contrast(96%);
}

/*
 * Pending Document upper meta: same label/value colors as create Designer sheet.
 * Date-switches stay the interactive blue; plain labels use primary; values use body text.
 */
html[data-theme="light"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-label:not(.cc-job-meta-date-switch),
html[data-theme="light"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-label:not(.cc-job-meta-date-switch) .cc-job-meta-text {
    color: var(--cc-theme-light-primary, #006DB7) !important;
    -webkit-text-fill-color: var(--cc-theme-light-primary, #006DB7) !important;
}

html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-label:not(.cc-job-meta-date-switch),
html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-label:not(.cc-job-meta-date-switch) .cc-job-meta-text {
    color: var(--cc-theme-dark-primary, #809EE5) !important;
    -webkit-text-fill-color: var(--cc-theme-dark-primary, #809EE5) !important;
}

html[data-theme="light"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch,
html[data-theme="light"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch .cc-job-meta-date-trigger,
html[data-theme="light"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch .cc-job-meta-text,
html[data-theme="light"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch .cc-job-meta-date-caret {
    color: #4F8DE8 !important;
    -webkit-text-fill-color: #4F8DE8 !important;
}

html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch,
html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch .cc-job-meta-date-trigger,
html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch .cc-job-meta-text,
html[data-theme="dark"] .job-right:has([data-cc-pending-review]) .cc-job-meta-panel .cc-job-meta-date-switch .cc-job-meta-date-caret {
    color: #4F8DE8 !important;
    -webkit-text-fill-color: #4F8DE8 !important;
}

/*
 * Meta values (Company / Location / Start / Deadline / …) share one content tone
 * for guests, Individuals, and Document review — match create Designer / list-meta.
 * Do NOT use --cc-theme-*-text (Assets label blue). Company profile links keep
 * navigation but use the same content color (not announcements link blue).
 */
html[data-theme="light"] .job-right .cc-job-meta-panel .table td,
html[data-theme="light"] .job-right .cc-job-meta-panel .table td a:not(.btn):not([class*="btn-"]),
html[data-theme="light"] .job-right .cc-job-meta-panel .table td .cc-job-translate-value,
html[data-theme="light"] .job-right .cc-job-meta-panel .table td .cc-job-meta-date-readonly,
html[data-theme="light"] .job-right .cc-job-meta-panel .table td .cc-job-meta-date-input,
html[data-theme="light"] .job-right .cc-job-meta-panel .table td input:not([type="hidden"]):not(.btn) {
    color: var(--cc-theme-light-announcements-list-meta-text, #334155) !important;
    -webkit-text-fill-color: var(--cc-theme-light-announcements-list-meta-text, #334155) !important;
}

html[data-theme="dark"] .job-right .cc-job-meta-panel .table td,
html[data-theme="dark"] .job-right .cc-job-meta-panel .table td a:not(.btn):not([class*="btn-"]),
html[data-theme="dark"] .job-right .cc-job-meta-panel .table td .cc-job-translate-value,
html[data-theme="dark"] .job-right .cc-job-meta-panel .table td .cc-job-meta-date-readonly,
html[data-theme="dark"] .job-right .cc-job-meta-panel .table td .cc-job-meta-date-input,
html[data-theme="dark"] .job-right .cc-job-meta-panel .table td input:not([type="hidden"]):not(.btn) {
    color: var(--cc-theme-dark-announcements-list-meta-text, #A8B7C8) !important;
    -webkit-text-fill-color: var(--cc-theme-dark-announcements-list-meta-text, #A8B7C8) !important;
}

html[data-theme="light"] .job-right .cc-job-meta-panel .table td a:not(.btn):not([class*="btn-"]):hover,
html[data-theme="light"] .job-right .cc-job-meta-panel .table td a:not(.btn):not([class*="btn-"]):focus {
    color: var(--cc-theme-light-announcements-list-meta-text-hover, var(--cc-theme-light-announcements-list-meta-text, #334155)) !important;
    -webkit-text-fill-color: var(--cc-theme-light-announcements-list-meta-text-hover, var(--cc-theme-light-announcements-list-meta-text, #334155)) !important;
    text-decoration: underline !important;
}

html[data-theme="dark"] .job-right .cc-job-meta-panel .table td a:not(.btn):not([class*="btn-"]):hover,
html[data-theme="dark"] .job-right .cc-job-meta-panel .table td a:not(.btn):not([class*="btn-"]):focus {
    color: var(--cc-theme-dark-announcements-list-meta-text-hover, var(--cc-theme-dark-announcements-list-meta-text, #A8B7C8)) !important;
    -webkit-text-fill-color: var(--cc-theme-dark-announcements-list-meta-text-hover, var(--cc-theme-dark-announcements-list-meta-text, #A8B7C8)) !important;
    text-decoration: underline !important;
}


/* Draft/Pending Document composer tabs (Internal Information + Optional Fields).
   Match Designer: Internal Information is always icon-only (wording on hover).
   Optional Fields stays labeled until `.job-container.is-cc-ad-tabs-icons`
   after overflow fit.
   Do not use overflow:hidden on the tab row — that clips the Optional Fields
   hover panel (Designer keeps overflow visible and shows the menu via :hover).
   Document composer: sticky under Position (same contract as create Designer). */
.job-right .job-tab {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.35rem;
    overflow: visible;
}

/*
 * Freeze Position + the listing tab row for viewing and modifying (guest, org, staff).
 * Override .body-list desktop relative so the title cannot scroll away.
 * --cc-ad-sticky-tabs-top comes from title sticky top + height (designer-tabs.js).
 */
.body-list .job-right:has(.job-tab) .job-right-title,
.job-right:has(.job-tab) .job-right-title {
    position: sticky;
    top: 0;
    z-index: 12;
}

@media (max-width: 767px) {
    .body-list .job-right:has(.job-tab) .job-right-title,
    .job-right:has(.job-tab) .job-right-title {
        top: 64px;
    }
}

.job-right .job-tab {
    position: sticky;
    top: var(--cc-ad-sticky-tabs-top, 0px);
    z-index: 11;
    background-color: var(--cc-theme-light-surface, #ffffff);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}

html[data-theme="dark"] .job-right .job-tab {
    background-color: var(--cc-theme-dark-background, #0f141c);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
}

/* Internal Contact beside Company; Autosave packs right (swapped with Attachments). */
.job-right .job-tab .cc-ad-internal-tab {
    margin-left: 0;
    flex: 0 0 auto;
}

.job-right .job-tab .cc-ad-autosave-tab {
    margin-left: auto;
    flex: 0 0 auto;
    align-self: center;
    position: relative;
    display: flex;
    align-items: center;
}

.job-right .job-tab .cc-ad-attachments-tab {
    margin-left: 0.35rem;
    flex: 0 0 auto;
    align-self: center;
    position: relative;
}

/* Guests / no autosave tab: Attachments still packs the right cluster. */
.job-right .job-tab:not(:has(.cc-ad-autosave-tab)) .cc-ad-attachments-tab {
    margin-left: auto;
}

.job-right .job-tab .cc-ad-tab-tools {
    margin-left: 0.35rem;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    align-self: center;
    position: relative;
    z-index: 8;
}

.job-right .job-tab .cc-ad-tab-tools-inner {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: nowrap;
}

.job-right .job-tab .cc-ad-tab-tools .job-title-tools,
.job-right .job-tab .cc-ad-tab-tools .cc-doc-autosave-status,
.job-right .job-tab .cc-ad-tab-tools .job-copy-form {
    display: flex;
    align-items: center;
    margin: 0;
}

.job-right .job-tab .cc-ad-tab-actions {
    margin-left: 0.35rem;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    align-self: center;
    position: relative;
    z-index: 8;
}

.job-right .job-tab .cc-ad-tab-actions .btn-group,
.job-right .job-tab .cc-ad-tab-actions .dropdown-toggle {
    margin: 0;
}

.job-right .job-tab .cc-ad-tab-actions .btn,
.job-right .job-tab .cc-ad-tab-actions .btn-group {
    min-width: 0;
    width: max-content;
    flex: 0 0 auto;
}

.job-right .job-tab .cc-ad-tab-actions .btn {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 0.9rem;
    padding-right: 0.9rem;
    font-size: 12px;
    line-height: 18px;
    min-height: 32px;
    box-sizing: border-box;
}

/*
 * Sibling gaps for items AFTER the right-pack owner (Autosave, or Attachments when no autosave).
 * Do NOT list `.cc-ad-autosave-tab` / `.cc-ad-attachments-tab` packer selectors here with
 * `margin-left: 0.35rem` — that undoes packing on create (form.job-right) and Document.
 */
.job-right .job-tab .cc-ad-multi-language-tab,
.job-right .job-tab .cc-ad-position-roles-tab,
.job-right .job-tab .cc-ad-fields-tab,
.job-right .job-tab .cc-ad-fields-tab + .cc-ad-tab-actions,
.job-right .job-tab .cc-ad-autosave-tab + .cc-ad-tab-tools,
.job-right .job-tab .cc-ad-autosave-tab + .cc-ad-multi-language-tab,
.job-right .job-tab .cc-ad-attachments-tab + .cc-ad-multi-language-tab,
.job-right .job-tab .cc-ad-attachments-tab + .cc-ad-tab-tools,
.job-right .job-tab .cc-ad-tab-tools + .cc-ad-attachments-tab,
.job-right .job-tab .cc-ad-multi-language-tab + .cc-ad-tab-tools,
.job-right .job-tab .cc-ad-multi-language-tab + .cc-ad-fields-tab,
.job-right .job-tab .cc-ad-multi-language-tab + .cc-ad-attachments-tab,
.job-right .job-tab .cc-ad-tab-tools + .cc-ad-position-roles-tab,
.job-right .job-tab .cc-ad-position-roles-tab + .cc-ad-fields-tab {
    position: relative;
    margin-left: 0.35rem;
    flex: 0 0 auto;
}

/* Packer must win after sibling-gap rules (create + Document share .job-right). */
.job-right .job-tab .cc-ad-autosave-tab {
    margin-left: auto;
}

.job-right .job-tab:not(:has(.cc-ad-autosave-tab)) .cc-ad-attachments-tab {
    margin-left: auto;
}

/* Company mark trailing — Form/Document switch lives on the body upper-right. */
.job-right .cc-job-meta-panel > .cc-ad-meta-trailing {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.35rem;
    flex: 0 0 auto;
    margin-left: auto;
    padding-left: 1rem;
    align-self: flex-start;
    position: relative;
    z-index: 8;
}

.job-right .cc-ad-meta-editor-switch {
    display: flex;
    align-items: center;
    line-height: 1;
    flex: 0 0 auto;
}

/* Form/Document switch: body upper-right, same 18×18 as left-panel classic-view switch. */
.job-right .job-tab-content {
    position: relative;
}

.job-right .cc-ad-body-editor-switch {
    position: absolute;
    top: 0.25rem;
    right: 0.15rem;
    z-index: 7;
    display: flex;
    align-items: center;
    line-height: 1;
}

.job-right .cc-ad-body-editor-switch .cc-ad-switch-link {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

.job-right .cc-ad-body-editor-switch .cc-ad-switch-icon {
    width: 18px;
    height: 18px;
    display: block;
}

/* Composer tab icons: Draft Document reuses Designer overflow contract via
 * cc-announcement-designer.css + is-cc-ad-tabs-icons on .job-container. */
.job-right .job-tab .cc-ad-composer-tab:not(.cc-ad-internal-tab):not(.cc-ad-attachments-tab):not(.cc-ad-multi-language-tab) .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background-color: transparent !important;
    border-bottom-style: dotted !important;
    border-bottom-width: 2px !important;
    border-bottom-color: currentColor !important;
}

.job-right .job-tab .cc-ad-composer-tab:not(.cc-ad-internal-tab):not(.cc-ad-attachments-tab):not(.cc-ad-multi-language-tab) .nav-link.active,
.job-right .job-tab .cc-ad-composer-tab:not(.cc-ad-internal-tab):not(.cc-ad-attachments-tab):not(.cc-ad-multi-language-tab) .nav-link:hover,
.job-right .job-tab .cc-ad-composer-tab:not(.cc-ad-internal-tab):not(.cc-ad-attachments-tab):not(.cc-ad-multi-language-tab) .nav-link:focus {
    background-color: transparent !important;
    border-bottom-style: dotted !important;
    border-bottom-width: 2px !important;
    border-bottom-color: currentColor !important;
}

.job-right .job-tab .cc-ad-internal-tab .nav-link,
.job-right .job-tab .cc-ad-attachments-tab .nav-link,
.job-right .job-tab .cc-ad-multi-language-tab .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background-color: transparent !important;
    border-bottom: 0 !important;
}

.job-right .job-tab .cc-ad-internal-tab .nav-link.active,
.job-right .job-tab .cc-ad-internal-tab .nav-link:hover,
.job-right .job-tab .cc-ad-internal-tab .nav-link:focus,
.job-right .job-tab .cc-ad-attachments-tab .nav-link.active,
.job-right .job-tab .cc-ad-attachments-tab .nav-link:hover,
.job-right .job-tab .cc-ad-attachments-tab .nav-link:focus,
.job-right .job-tab .cc-ad-multi-language-tab .nav-link.active,
.job-right .job-tab .cc-ad-multi-language-tab .nav-link:hover,
.job-right .job-tab .cc-ad-multi-language-tab .nav-link:focus {
    background-color: transparent !important;
    border-bottom: 0 !important;
}

.job-right .job-tab .cc-ad-composer-tab-icon {
    display: none;
    width: 1.15rem;
    height: 1.15rem;
    flex: 0 0 auto;
}

/* Icon-only tabs must keep their glyph (do not leave only a quantity badge). */
.job-right .job-tab .cc-ad-attachments-tab .cc-ad-composer-tab-icon,
.job-right .job-tab .cc-ad-multi-language-tab .cc-ad-composer-tab-icon {
    display: block;
}

html[data-theme="dark"] .job-right .job-tab .cc-ad-composer-tab-icon {
    filter: invert(79%) sepia(18%) saturate(747%) hue-rotate(176deg) brightness(95%) contrast(96%);
}

html[data-theme="light"] .job-right .job-tab .cc-ad-composer-tab-icon {
    filter: invert(27%) sepia(91%) saturate(1642%) hue-rotate(186deg) brightness(94%) contrast(101%);
}

.job-right .job-tab .cc-ad-multi-language-tab.is-on .cc-ad-composer-tab-icon {
    filter: invert(48%) sepia(70%) saturate(1800%) hue-rotate(314deg) brightness(102%) contrast(101%);
}

html[data-theme="dark"] .job-right .job-tab .cc-ad-multi-language-tab.is-on .cc-ad-composer-tab-icon {
    filter: invert(72%) sepia(42%) saturate(1200%) hue-rotate(314deg) brightness(105%) contrast(98%);
}

/* Internal Information: always icon; wording via title/hover (Designer parity). */
.job-right .job-tab .cc-ad-internal-tab .nav-link {
    margin-right: 0.45rem;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
}

.job-right .job-tab .cc-ad-internal-tab .cc-ad-composer-tab-icon {
    display: block;
    box-sizing: border-box;
    width: 1.15rem;
    height: 1.15rem;
    padding: 0;
    border: 0;
    border-radius: 0;
}

.job-right .job-tab .cc-ad-internal-tab .cc-ad-composer-tab-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Optional Fields panel/chips: use Designer `.cc-ad-fields` / `.cc-ad-rail-chip`
 * from cc-announcement-designer.css — do not redefine here.
 * Internal Information: use Designer `.cc-ad-internal-panel` + Profile contact card
 * from cc-announcement-designer-internal.css / cc-profile-contact-cards.css —
 * do not reinvent a tab pane here. */

/*
 * Guest/public Attachments hover (belt-and-suspenders):
 * Designer.css owns the full hover card. If that stylesheet is missing or lagging,
 * an in-flow panel crushes the Job Opportunity / type tab into a vertical letter
 * strip. Keep the panel out of layout and protect the type tab from flex shrink.
 */
.job-right .job-tab > .nav-item:first-child,
.job-right .job-tab > .nav-item:first-child .nav-link {
    flex: 0 0 auto;
    min-width: max-content;
    white-space: nowrap;
    max-width: none;
}

.job-right .cc-ad-attachments-panel {
    display: none;
    position: absolute;
    top: calc(100% - 1px);
    left: auto;
    right: 0;
    z-index: 22;
}

.job-right .cc-ad-attachments-tab:hover > .cc-ad-attachments-panel,
.job-right .cc-ad-attachments-tab:focus-within > .cc-ad-attachments-panel,
.job-right .cc-ad-attachments-tab.is-open > .cc-ad-attachments-panel {
    display: block;
}
