.jobadmin-summary {
    padding: 8px;
}

.ja-empty {
    padding: 16px;
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,.08);
}

.ja-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.ja-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    padding: 14px 14px;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,.08);
    background: #fff;
    box-shadow: 0 1px 10px rgba(0,0,0,.04);
}

.ja-card__body {
    min-width: 0;
}

.ja-select-with-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ja-mini-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    padding: 0 10px;
    border-radius: 6px;
    border: 1px solid rgba(0,0,0,.15);
    text-decoration: none;
    cursor: pointer;
}

    .ja-mini-btn:hover {
        background: rgba(0,0,0,.06);
    }

.ja-card__title {
    font-size: 1.05rem;
    font-weight: 700;
    color: #111;
    line-height: 1.25;
    margin-bottom: 6px;
}

.ja-card__meta {
    font-size: .9rem;
    color: rgba(0,0,0,.65);
}

.ja-card__cta {
    flex: 0 0 auto;
    font-weight: 700;
    font-size: .95rem;
    padding-left: 14px;
    color: rgba(0,0,0,.75);
}

.ja-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.ja-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 700;
    border: 1px solid rgba(0,0,0,.08);
    background: rgba(0,0,0,.03);
    color: rgba(0,0,0,.75);
}

.ja-success {
    padding: 10px 12px;
    border-radius: 12px;
    margin-bottom: 10px;
    border: 1px solid rgba(0,0,0,.08);
    background: rgba(0, 150, 0, .06);
    font-weight: 700;
}

/* If you want subtle differentiation without relying on colors */
.ja-badge--sector {
}

.ja-badge--contract {
}

.ja-badge--location {
}

.ja-filters {
    padding: 10px;
    margin-bottom: 12px;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,.08);
    background: #fff;
    box-shadow: 0 1px 10px rgba(0,0,0,.04);
}

.ja-filterrow {
    display: grid;
    gap: 10px;
    margin-bottom: 10px;
}

.ja-input, .ja-select {
    width: 100%;
    padding: 12px 12px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.14);
    font-size: 1rem;
}

.ja-admin-filters .ja-input:focus,
.ja-admin-filters .ja-select:focus {
    outline: none;
    border-color: rgba(0, 120, 215, .6);
    box-shadow: 0 0 0 3px rgba(0,120,215,.15);
}

/* --- JobEdit form layout --- */
.ja-form {
    display: grid;
    gap: 14px;
}

.ja-formrow {
    display: grid;
    gap: 12px;
}

.ja-formrow--2 {
    grid-template-columns: 1fr;
}

.ja-formrow--3 {
    grid-template-columns: 1fr;
}

.ja-advanced-toggle {
    margin: 10px 0;
}

.ja-advanced-link {
    display: inline-block;
    font-weight: 600;
}

    .ja-advanced-link.is-open::after {
        content: " ▲";
    }

    .ja-advanced-link::after {
        content: " ▼";
    }

.ja-advanced-panel {
    padding-top: 8px;
}

@media (min-width: 900px) {
    .ja-formrow--2 {
        grid-template-columns: 1fr 1fr;
    }

    .ja-formrow--3 {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

.ja-field {
    min-width: 0;
}

.ja-label {
    display: block;
    font-weight: 800;
    margin-bottom: 6px;
    color: rgba(0,0,0,.75);
}

.ja-input--textarea {
    min-height: 120px;
    resize: vertical;
}

.ja-checkrow {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
}

.ja-audit {
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.08);
    background: rgba(0,0,0,.02);
    margin-bottom: 10px;
    display: grid;
    gap: 6px;
}

.ja-formactions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.ja-audit {
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.08);
    background: rgba(0,0,0,.03);
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.ja-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ja-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ja-label {
    font-weight: 700;
    font-size: .9rem;
    opacity: .8;
}

.ja-formrow {
    display: grid;
    gap: 10px;
}

.ja-formrow--2 {
    grid-template-columns: 1fr 1fr;
}

.ja-formrow--3 {
    grid-template-columns: 1fr 1fr 1fr;
}

.ja-formrow--4 {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.ja-formrow--flags {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
}

.ja-hr {
    border: 0;
    border-top: 1px solid rgba(0,0,0,.08);
    margin: 6px 0;
}

.ja-formactions {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 6px;
}

@media (max-width: 900px) {
    .ja-formrow--4 {
        grid-template-columns: 1fr 1fr;
    }

    .ja-formrow--3 {
        grid-template-columns: 1fr;
    }

    .ja-formrow--2 {
        grid-template-columns: 1fr;
    }
}

/* Admin filter controls fix */
.ja-admin-filters .ja-input,
.ja-admin-filters .ja-select {
    height: 44px;
    min-height: 44px;
    box-sizing: border-box;
    background: #fff;
}

.ja-admin-filters .ja-btn {
    height: 44px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
}

.ja-admin-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.ja-filteractions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ja-btn {
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.14);
    background: #f7f7f7;
    font-weight: 700;
}

.ja-link {
    text-decoration: underline;
    background: transparent;
    border: 0;
    padding: 0;
    font-weight: 700;
}

.ja-editor-emptycard,
.ja-editor-shell {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 10px rgba(0,0,0,.04);
}

.ja-editor-emptycard {
    padding: 16px;
}

.ja-editor-shell {
    overflow: hidden;
    margin-top: 12px;
}

.ja-editor-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(0,0,0,.08);
    font-weight: 800;
}

.ja-editor-close {
    text-decoration: underline;
    font-weight: 700;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.ja-editor-body {
    padding: 14px;
}

.ja-admin-actions {
    margin-bottom: 10px;
}

/* --- Admin Job List Grid --- */
.ja-grid {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 10px rgba(0,0,0,.04);
    overflow: hidden;
}

    .ja-grid th {
        text-align: left;
        padding: 12px 14px;
        font-weight: 800;
        font-size: .95rem;
        border-bottom: 1px solid rgba(0,0,0,.08);
        background: rgba(0,0,0,.02);
        white-space: nowrap;
    }

    .ja-grid td {
        padding: 12px 14px;
        border-bottom: 1px solid rgba(0,0,0,.06);
        vertical-align: middle;
    }

    .ja-grid tr:last-child td {
        border-bottom: 0;
    }

    /* Subtle zebra striping */
    .ja-grid tr:nth-child(even) td {
        background: rgba(0,0,0,.012);
    }

/* Job cell */
.ja-jobcell__title {
    font-size: 1.02rem;
    font-weight: 800;
    color: #111;
    line-height: 1.25;
}

.ja-jobcell__meta {
    margin-top: 4px;
    font-size: .9rem;
    color: rgba(0,0,0,.65);
}

/* Status badge tweak (reuse your existing ja-badge base) */
.ja-badge--status {
    font-size: .8rem;
    padding: 5px 9px;
}

/* Checkbox columns */
.ja-grid input[type="checkbox"] {
    transform: translateY(1px);
}

/* Actions links */
.ja-grid a {
    font-weight: 800;
    color: rgba(0,0,0,.75);
    text-decoration: underline;
}

    .ja-grid a:hover {
        color: rgba(0,0,0,.95);
    }

.ja-badge--active {
    background: rgba(0, 150, 0, .06);
    border-color: rgba(0, 150, 0, .18);
}

.ja-badge--inactive {
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .10);
}

.ja-badge--deleted {
    background: rgba(200, 0, 0, .06);
    border-color: rgba(200, 0, 0, .18);
}

.ja-badge--expired {
    background: rgba(240, 160, 0, .10);
    border-color: rgba(240, 160, 0, .22);
}

/* ===== Modal overlay foundation (reusable) ===== */
.ja-modal {
    position: fixed;
    inset: 0;
    z-index: 99999; /* sit above DNN chrome */
    display: block;
}

.ja-modal-open {
    overflow: hidden; /* stops scrolling behind modal */
}

.ja-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.55);
    /* blocks clicks to page underneath */
    pointer-events: auto;
}

.ja-modal-card {
    position: relative;
    max-width: 560px;
    width: calc(100% - 32px);
    margin: 8vh auto 0 auto;
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    z-index: 1; /* above backdrop */
}

.ja-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    font-size: 18px;
    font-weight: 600;
}

.ja-modal-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid rgba(0,0,0,.15);
}

    .ja-modal-close:hover {
        background: rgba(0,0,0,.06);
    }

.ja-form-row {
    margin-bottom: 12px;
}

    .ja-form-row label {
        display: block;
        margin-bottom: 6px;
        font-weight: 600;
    }

.ja-form-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 14px;
}

/* ---- Job Details (public) ---- */
.cr-job {
    max-width: 1100px;
    margin: 0 auto;
    padding: 18px 12px;
}

.cr-job-hero {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 18px;
    align-items: start;
}

@media (max-width: 920px) {
    .cr-job-hero {
        grid-template-columns: 1fr;
    }
}

.cr-job-title {
    margin: 0 0 10px;
    font-size: 34px;
    line-height: 1.15;
}

@media (max-width: 600px) {
    .cr-job-title {
        font-size: 28px;
    }
}

.cr-job-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 12px;
}

.cr-chip {
    display: inline-flex;
    align-items: center;
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 13px;
}

.cr-job-salary {
    font-size: 18px;
    font-weight: 700;
    margin: 8px 0 10px;
}

.cr-job-dates {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #6b7280;
    font-size: 13px;
}

.cr-dot {
    padding: 0 6px;
}

.cr-job-body {
    margin-top: 18px;
}

.cr-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 6px 16px rgba(0,0,0,0.04);
}

.cr-card--sticky {
    position: sticky;
    top: 12px;
}

.cr-h2 {
    margin: 0 0 12px;
    font-size: 18px;
}

.cr-h3 {
    margin: 0 0 8px;
    font-size: 15px;
}

.cr-muted {
    color: #6b7280;
    margin: 0 0 12px;
}

.cr-btn {
    display: inline-block;
    text-decoration: none;
    border-radius: 12px;
    padding: 10px 12px;
    font-weight: 700;
    border: 1px solid #111827;
}

.cr-btn--primary {
    background: #111827;
    color: #fff !important;
}

.cr-hr {
    border: 0;
    border-top: 1px solid #e5e7eb;
    margin: 14px 0;
}

.cr-contact a {
    color: inherit;
    text-decoration: underline;
}

.cr-job-desc {
    line-height: 1.6;
}

    .cr-job-desc h1, .cr-job-desc h2, .cr-job-desc h3 {
        margin-top: 18px;
    }

    .cr-job-desc ul, .cr-job-desc ol {
        padding-left: 20px;
    }

.cr-field {
    margin: 10px 0;
}

.cr-label {
    display: block;
    font-size: 13px;
    margin: 0 0 6px;
    color: #374151;
}

.cr-input {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 10px;
}

.cr-apply .cr-btn {
    width: 100%;
    text-align: center;
    margin-top: 10px;
}

.cr-msg-ok {
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    border-radius: 10px;
    margin-bottom: 10px;
}

.cr-msg-err {
    padding: 10px 12px;
    border: 1px solid #fecaca;
    background: #fef2f2;
    border-radius: 10px;
    margin-bottom: 10px;
}

/* Keep filter row tidy on larger screens */
@media (min-width: 900px) {
    .ja-admin-filterrow {
        grid-template-columns: 2fr auto 1fr auto;
        align-items: center;
    }
        /* checkbox aligns nicer */
        .ja-admin-filterrow label {
            margin: 0;
        }
}

/* Responsive: allow horizontal scroll if needed */
@media (max-width: 900px) {
    .jobadmin-adminlist {
        overflow-x: auto;
    }

    .ja-grid {
        min-width: 980px;
    }
}

@media (min-width: 900px) {
    .ja-filterrow:nth-child(2) {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

/* Slightly wider layouts */
@media (min-width: 768px) {
    .ja-cards {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 1100px) {
    .ja-cards {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

/* ----- Featured jobs carousel -----------------------------------------------
   Horizontal scroll-snap on narrow screens (swipeable on mobile). Falls back
   to the regular .ja-cards grid behaviour from ~768px upwards. No JS.
   --------------------------------------------------------------------------- */
.jobadmin-featured {
    padding: 8px;
}

.ja-section-head {
    margin-bottom: 12px;
}

.ja-h2 {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0;
    color: #111;
}

.ja-cards--featured {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding: 4px 4px 12px;
    /* Hide the scrollbar visually on mobile while keeping scroll behaviour */
    scrollbar-width: thin;
}

    .ja-cards--featured > .ja-card {
        flex: 0 0 280px;
        scroll-snap-align: start;
    }

@media (min-width: 768px) {
    .ja-cards--featured {
        flex-wrap: wrap;
        overflow-x: visible;
        scroll-snap-type: none;
    }

    .ja-cards--featured > .ja-card {
        flex: 1 1 calc(50% - 12px);
    }
}

@media (min-width: 1100px) {
    .ja-cards--featured > .ja-card {
        flex: 1 1 calc(33.333% - 12px);
    }
}

/* ----- Pager (public job summary) -------------------------------------------- */
.ja-pager {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin: 24px 0 8px;
    padding: 8px 4px;
    font-size: 0.95rem;
}

.ja-pager__summary {
    color: rgba(0, 0, 0, .6);
}

.ja-pager__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

.ja-pager__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: 8px;
    border: 1px solid rgba(0,0,0,.12);
    text-decoration: none;
    color: #111;
    background: #fff;
}

    .ja-pager__link:hover {
        background: rgba(0,0,0,.04);
    }

    .ja-pager__link--current {
        background: #111;
        color: #fff;
        border-color: #111;
        cursor: default;
    }

    .ja-pager__link--disabled {
        color: rgba(0,0,0,.35);
        background: transparent;
        cursor: not-allowed;
    }

.ja-pager__ellipsis {
    padding: 0 4px;
    color: rgba(0,0,0,.45);
}

@media (min-width: 600px) {
    .ja-pager {
        flex-direction: row;
        justify-content: space-between;
    }
}

/* ----- Bulk action bar (applicants list) ------------------------------------ */
.ja-bulk-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
    margin: 12px 0;
    border-radius: 8px;
    background: rgba(0,0,0,.04);
    border: 1px solid rgba(0,0,0,.08);
    font-size: 0.95rem;
}

    .ja-bulk-bar__label {
        font-weight: 600;
        margin-right: 4px;
    }

    .ja-bulk-bar__sep {
        display: inline-block;
        width: 1px;
        height: 22px;
        background: rgba(0,0,0,.12);
        margin: 0 4px;
    }

/* ----- Applicant management -------------------------------------------------- */
.jobadmin-applicants {
    padding: 8px;
}

.ja-applicants-head {
    margin-bottom: 16px;
}

.ja-applicants-head__crumbs {
    margin-bottom: 4px;
    font-size: 0.9rem;
}

.ja-applicants-head .ja-jobref {
    font-weight: 400;
    color: rgba(0,0,0,.55);
    font-size: 0.85em;
    margin-left: 8px;
}

.ja-applicants-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 16px;
}

.ja-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 0.85rem;
    line-height: 1.4;
    background: rgba(0,0,0,.06);
    color: rgba(0,0,0,.78);
    border: 1px solid rgba(0,0,0,.08);
}

    .ja-status-pill strong {
        font-weight: 700;
    }

    /* Per-status colour hints — keeping it subtle. */
    .ja-status-pill--total              { background: #111; color: #fff; border-color: #111; }
    .ja-status-pill--new                { background: #e8f1ff; color: #0b3a82; border-color: #b6cef0; }
    .ja-status-pill--screened           { background: #f3e8ff; color: #5b21b6; border-color: #d8bfff; }
    .ja-status-pill--submitted-to-client{ background: #e8f7ee; color: #0f5132; border-color: #b6e0c6; }
    .ja-status-pill--interview-arranged { background: #fff4e0; color: #7a4a00; border-color: #f3d99d; }
    .ja-status-pill--placed             { background: #d4f7d4; color: #135e13; border-color: #95d495; }
    .ja-status-pill--rejected           { background: #fde8e8; color: #8a1c1c; border-color: #f0bfbf; }
    .ja-status-pill--withdrawn          { background: #ececec; color: #555;    border-color: #ccc;    }

.ja-rating {
    color: #d4a116;
    letter-spacing: 1px;
}

.ja-cell-meta {
    color: rgba(0,0,0,.55);
    font-size: 0.85em;
    margin-top: 2px;
}

.ja-jobtitle {
    font-weight: 600;
}

/* ============================================================================
   Applicant detail page

   This block is intentionally rebuilt using ONLY plain <div>s and uniquely-named
   classes that no DNN skin or core stylesheet can possibly be targeting. Every
   rule carries !important and every layout-critical rule scopes itself under
   .applicantdetail-root so we win every cascade fight.

   If you find yourself reusing one of these class names elsewhere, rename it
   instead — uniqueness is the whole point.
   ============================================================================ */

.applicantdetail-root {
    display: block !important;
    padding: 8px;
    font-family: inherit;
}

    .applicantdetail-root .applicantdetail-crumbs {
        display: block !important;
        margin-bottom: 4px;
        font-size: 0.9rem;
    }

    .applicantdetail-root .applicantdetail-sep {
        display: inline-block !important;
        padding: 0 6px;
        color: rgba(0,0,0,.35);
    }

    .applicantdetail-root .applicantdetail-link {
        color: #0b3a82;
        text-decoration: underline;
    }

    .applicantdetail-root .applicantdetail-link--danger {
        color: #8a1c1c;
        margin-left: auto;
    }

    .applicantdetail-root .applicantdetail-title {
        display: block !important;
        font-size: 1.5rem;
        font-weight: 700;
        margin: 8px 0 4px;
        color: #111;
    }

    .applicantdetail-root .applicantdetail-subtitle {
        display: block !important;
        font-size: 0.95rem;
        color: rgba(0,0,0,.6);
        margin-bottom: 12px;
    }

    .applicantdetail-root .applicantdetail-jobref {
        color: rgba(0,0,0,.55);
        margin-left: 4px;
    }

    .applicantdetail-root .applicantdetail-empty {
        display: block !important;
        padding: 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,.08);
        background: #fff;
    }

        .applicantdetail-root .applicantdetail-empty__title {
            font-weight: 700;
            margin-bottom: 4px;
        }

        .applicantdetail-root .applicantdetail-empty__sub {
            color: rgba(0,0,0,.6);
        }

    /* ----- The two-column grid (info | workflow) ----- */
    .applicantdetail-root .applicantdetail-grid {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 16px;
        margin: 16px 0;
    }

@media (min-width: 900px) {
    .applicantdetail-root .applicantdetail-grid {
        grid-template-columns: 1fr 1fr !important;
    }
}

    /* ----- Card (any plain block of content) ----- */
    .applicantdetail-root .applicantdetail-card {
        display: block !important;
        padding: 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,.08);
        background: #fff;
        box-shadow: 0 1px 6px rgba(0,0,0,.03);
        margin-bottom: 16px;
        box-sizing: border-box;
    }

        .applicantdetail-root .applicantdetail-card__heading {
            display: block !important;
            font-size: 1.05rem;
            font-weight: 700;
            margin: 0 0 12px;
            color: #111;
        }

        .applicantdetail-root .applicantdetail-card__subheading {
            display: block !important;
            font-size: 0.95rem;
            font-weight: 600;
            margin: 18px 0 8px;
            color: rgba(0,0,0,.7);
        }

    /* ----- Definition-list rows (label | value pairs) ----- */
    .applicantdetail-root .applicantdetail-dl {
        display: block !important;
        margin: 0 0 12px;
    }

        .applicantdetail-root .applicantdetail-dl__row {
            display: grid !important;
            grid-template-columns: 110px 1fr;
            gap: 12px;
            padding: 4px 0;
        }

        .applicantdetail-root .applicantdetail-dl__label {
            font-weight: 600;
            color: rgba(0,0,0,.65);
        }

        .applicantdetail-root .applicantdetail-dl__value {
            min-width: 0;
            word-break: break-word;
        }

    /* ----- Applicant's message panel ----- */
    .applicantdetail-root .applicantdetail-message {
        display: block !important;
        white-space: pre-wrap;
        background: rgba(0,0,0,.03);
        padding: 10px 12px;
        border-radius: 8px;
        line-height: 1.5;
    }

    .applicantdetail-root .applicantdetail-cv-name {
        display: block !important;
        margin-top: 6px;
        color: rgba(0,0,0,.55);
        font-size: 0.9em;
    }

    /* ----- Current status pill row ----- */
    .applicantdetail-root .applicantdetail-current {
        display: block !important;
        margin-bottom: 16px;
    }

        .applicantdetail-root .applicantdetail-current__label {
            font-weight: 600;
            margin-right: 8px;
        }

    /* ----- Form rows (label on top, control below) ----- */
    .applicantdetail-root .applicantdetail-row {
        display: block !important;
        margin-bottom: 10px;
    }

        .applicantdetail-root .applicantdetail-row__label {
            display: block !important;
            font-size: 0.9rem;
            color: rgba(0,0,0,.65);
            margin-bottom: 4px;
            font-weight: 500;
        }

        /* --inline variant for dropdowns + save-button on the same line */
        .applicantdetail-root .applicantdetail-row--inline {
            display: flex !important;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }

        .applicantdetail-root .applicantdetail-row--actions {
            text-align: left;
        }

    /* ----- Input controls ----- */
    .applicantdetail-root .applicantdetail-input {
        display: block !important;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding: 6px 8px;
        border: 1px solid rgba(0,0,0,.18);
        border-radius: 6px;
        font: inherit;
    }

    .applicantdetail-root .applicantdetail-select {
        padding: 6px 8px;
        border: 1px solid rgba(0,0,0,.18);
        border-radius: 6px;
        font: inherit;
        min-width: 200px;
    }

    .applicantdetail-root .applicantdetail-btn {
        display: inline-block !important;
        padding: 8px 14px;
        border-radius: 6px;
        border: 1px solid rgba(0,0,0,.18);
        background: #111;
        color: #fff;
        text-decoration: none;
        cursor: pointer;
        font: inherit;
    }

        .applicantdetail-root .applicantdetail-btn:hover {
            background: #000;
        }

    /* ----- Flags (one checkbox per line) ----- */
    .applicantdetail-root .applicantdetail-flag {
        display: block !important;
        margin: 4px 0;
    }

    /* ----- Notes thread ----- */
    .applicantdetail-root .applicantdetail-note-add {
        display: block !important;
        margin-bottom: 16px;
    }

        .applicantdetail-root .applicantdetail-note-add textarea {
            display: block !important;
            width: 100%;
            margin-bottom: 8px;
        }

    .applicantdetail-root .applicantdetail-note {
        display: block !important;
        padding: 10px 12px;
        border-radius: 8px;
        background: rgba(0,0,0,.03);
        margin-bottom: 8px;
    }

        .applicantdetail-root .applicantdetail-note__head {
            display: flex !important;
            align-items: baseline;
            gap: 10px;
            margin-bottom: 4px;
            font-size: 0.9rem;
        }

        .applicantdetail-root .applicantdetail-note__date {
            color: rgba(0,0,0,.55);
        }

        .applicantdetail-root .applicantdetail-note__body {
            display: block !important;
            white-space: pre-wrap;
            line-height: 1.45;
        }

    /* ----- Status history timeline ----- */
    .applicantdetail-root .applicantdetail-history-item {
        display: block !important;
        padding: 8px 12px;
        border-left: 3px solid rgba(0,0,0,.12);
        margin-bottom: 10px;
    }

        .applicantdetail-root .applicantdetail-history-item__head {
            display: block !important;
            margin-bottom: 2px;
        }

        .applicantdetail-root .applicantdetail-history-item__meta {
            display: block !important;
            color: rgba(0,0,0,.55);
            font-size: 0.85em;
        }

        .applicantdetail-root .applicantdetail-history-item__note {
            display: block !important;
            margin-top: 6px;
            padding: 6px 10px;
            background: rgba(0,0,0,.03);
            border-radius: 6px;
            font-style: italic;
            font-size: 0.95em;
        }

/* =============================================================================
   In-form navigation strip (JobList / EmailTemplateList / EmailSendHistory)
   ============================================================================= */
.jobadmin .ja-topnav {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    padding: 10px 0 14px;
    margin-bottom: 12px;
    border-bottom: 1px solid rgba(0,0,0,.08);
    font-size: 0.95em;
}
.jobadmin .ja-topnav__current {
    font-weight: 600;
    color: rgba(0,0,0,.85);
}
.jobadmin .ja-topnav__link {
    color: #1565c0;
    text-decoration: none;
}
.jobadmin .ja-topnav__link:hover { text-decoration: underline; }

/* =============================================================================
   Email template list / edit / send history
   ============================================================================= */

.jobadmin .ja-tmpl-name { font-weight: 600; }
.jobadmin .ja-tmpl-key  { color: rgba(0,0,0,.55); font-size: 0.85em; }

.jobadmin .ja-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 0.75em;
    line-height: 1.5;
    background: rgba(0,0,0,.07);
    color: rgba(0,0,0,.65);
    vertical-align: middle;
}
.jobadmin .ja-badge--lock { background: #fff3cd; color: #8a6d3b; }

/* Edit form layout — form on the left, token panel on the right (stacks on narrow screens). */
.jobadmin .ja-tmpl-edit {
    display: flex !important;
    flex-wrap: wrap;
    gap: 24px;
    align-items: flex-start;
}
.jobadmin .ja-tmpl-edit__form {
    flex: 1 1 480px;
    min-width: 0;
}
.jobadmin .ja-tmpl-edit__tokens {
    flex: 0 0 240px;
    padding: 14px;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 8px;
    background: rgba(0,0,0,.025);
}
.jobadmin .ja-tmpl-tokens__title { margin: 0 0 4px; font-size: 1em; }
.jobadmin .ja-tmpl-tokens__hint  { margin: 0 0 10px; color: rgba(0,0,0,.6); font-size: 0.85em; }
.jobadmin .ja-tmpl-tokens__list  {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.jobadmin .ja-tmpl-tokens__list li { margin: 0 !important; padding: 0 !important; }
.jobadmin .ja-token-btn {
    border: 1px solid rgba(0,0,0,.15);
    background: #fff;
    color: #1565c0;
    padding: 4px 10px;
    border-radius: 14px;
    cursor: pointer;
    font-size: 0.9em;
    font-family: inherit;
}
.jobadmin .ja-token-btn:hover { background: #e3f2fd; }

.jobadmin .ja-tmpl-field { margin-bottom: 14px; }
.jobadmin .ja-tmpl-field--inline { display: flex; align-items: center; gap: 8px; }
.jobadmin .ja-tmpl-label {
    display: block;
    font-weight: 600;
    margin-bottom: 4px;
    font-size: 0.95em;
}
.jobadmin .ja-tmpl-input    { width: 100%; max-width: 640px; box-sizing: border-box; }
.jobadmin .ja-tmpl-textarea { width: 100%; max-width: 640px; box-sizing: border-box; font-family: Consolas, Menlo, monospace; font-size: 0.9em; }

/* DNN's TextEditor wrapper renders a complex composite; this just keeps it from
   getting squished by a flex parent. The editor's own Width="100%" attribute
   handles the inner sizing. */
.jobadmin .ja-tmpl-editor { display: block; max-width: 760px; }
.jobadmin .ja-tmpl-hint     { color: rgba(0,0,0,.55); font-size: 0.85em; margin-top: 4px; }

.jobadmin .ja-input--locked {
    background: #f5f5f5 !important;
    color: rgba(0,0,0,.55) !important;
    cursor: not-allowed !important;
}

.jobadmin .ja-tmpl-actions { margin-top: 10px; display: flex; gap: 10px; }
.jobadmin .ja-btn--primary { background: #1565c0; color: #fff; border-color: #1565c0; }
.jobadmin .ja-btn--primary:hover { background: #0d47a1; border-color: #0d47a1; }

/* Send-history pills + snapshot panel */
.jobadmin .ja-pill {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 10px;
    font-size: 0.8em;
    line-height: 1.6;
}
.jobadmin .ja-pill--ok  { background: #e6f4ea; color: #1e7e34; }
.jobadmin .ja-pill--bad { background: #fdecea; color: #b71c1c; }

.jobadmin .ja-snapshot {
    margin-top: 18px;
    padding: 16px;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 8px;
    background: rgba(0,0,0,.02);
}
.jobadmin .ja-snapshot__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 10px;
}
.jobadmin .ja-snapshot__title { margin: 0; font-size: 1.05em; }
.jobadmin .ja-snapshot__meta {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 4px 14px;
    margin: 0 0 12px;
    font-size: 0.9em;
}
.jobadmin .ja-snapshot__meta dt { color: rgba(0,0,0,.6); font-weight: 600; }
.jobadmin .ja-snapshot__meta dd { margin: 0; }
.jobadmin .ja-snapshot__bodylabel { margin: 12px 0 6px; font-size: 0.95em; color: rgba(0,0,0,.7); }
.jobadmin .ja-snapshot__bodyframe {
    width: 100%;
    min-height: 320px;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 6px;
    background: #fff;
}

.jobadmin .ja-info {
    margin: 10px 0;
    padding: 8px 12px;
    background: #e3f2fd;
    border-left: 3px solid #1565c0;
    color: #0d47a1;
    border-radius: 4px;
}