/* LBN Job Board — Frontend Styles v1.1.0
   DS v.3 sandy neumorphic design.
   Scoped to .lbn-jb-* — no theme bleed.
----------------------------------------------------------------------- */

/* ── DS Token Aliases ─────────────────────────────────────────────── */
:root {
    --jb-primary:      var(--primary_color, #285260);
    --jb-on-primary:   var(--c-text-on-primary, #faf3e3);
    --jb-bg:           var(--c-sand-200, #f3e8d1);
    --jb-card:         var(--c-sand-100, #faf3e3);
    --jb-subtle:       var(--c-sand-300, #ece0c8);
    --jb-text:         var(--c-text-body,    #5c4a32);
    --jb-muted:        var(--c-text-muted,   #8a7858);
    --jb-heading:      var(--c-text-heading, #2a2118);
    --jb-border:       var(--c-border-soft,  #e4d6b8);
    --jb-shadow:       var(--shadow-raised-sm, 0 2px 6px rgba(40,30,10,.10), 0 1px 2px rgba(40,30,10,.06));
    --jb-shadow-md:    var(--shadow-raised-md, 0 4px 16px rgba(40,30,10,.13), 0 2px 4px rgba(40,30,10,.08));
    --jb-inset:        var(--shadow-inset-sm, inset 0 2px 4px rgba(40,30,10,.08));
    --jb-danger:       var(--c-danger,      #b85c4a);
    --jb-danger-bg:    var(--c-danger-bg,   #fde8e4);
    --jb-success:      var(--c-success,     #4f8a6b);
    --jb-success-bg:   var(--c-success-bg,  #e0f0e8);
    --jb-warning:      var(--c-warning,     #c89a4c);
    --jb-warning-bg:   var(--c-warning-bg,  #fdf3dc);
    --jb-info:         var(--c-info,        #548c92);
    --jb-info-bg:      var(--c-info-bg,     #e0f0f2);
    --jb-featured:     var(--c-featured,    #b8893f);
    --jb-featured-bg:  var(--c-featured-bg, #fdf0d8);
    --jb-radius:       var(--r-sm,  8px);
    --jb-radius-sm:    var(--r-sm,  8px);
    --jb-gap:          20px;
    --jb-transition:   all .2s ease;
}

/* ── Box-sizing reset ─────────────────────────────────────────────── */
.lbn-jb-container *,
.lbn-jb-container *::before,
.lbn-jb-container *::after,
.lbn-jb-board-wrap *,
.lbn-jb-board-wrap *::before,
.lbn-jb-board-wrap *::after { box-sizing: border-box; }

.lbn-jb-container {
    color: var(--jb-text);
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 16px 48px;
}

/* ── Notices ──────────────────────────────────────────────────────── */
.lbn-jb-notice {
    padding: 12px 16px;
    border-radius: var(--jb-radius-sm);
    border: 1px solid transparent;
    margin-bottom: 16px;
    font-size: .9375rem;
    line-height: 1.5;
}
.lbn-jb-notice-success,
.lbn-jb-notice--ok    { background: var(--jb-success-bg); border-color: var(--jb-success); color: var(--jb-success); }
.lbn-jb-notice-error,
.lbn-jb-notice--error { background: var(--jb-danger-bg);  border-color: var(--jb-danger);  color: var(--jb-danger); }
.lbn-jb-notice--info  { background: var(--jb-info-bg);    border-color: var(--jb-info);    color: var(--jb-info); }
.lbn-jb-notice--warn  { background: var(--jb-warning-bg); border-color: var(--jb-warning); color: var(--jb-warning); }

/* ── Buttons ──────────────────────────────────────────────────────── */
.lbn-jb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 20px;
    border-radius: var(--jb-radius-sm);
    font-size: .9375rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    border: 2px solid transparent;
    transition: var(--jb-transition);
    white-space: nowrap;
    background: none;
    line-height: 1.4;
    min-height: 44px;
    min-width: 44px;
    font-family: inherit;
}
.lbn-jb-btn:focus-visible { outline: 3px solid var(--jb-primary); outline-offset: 2px; }
.lbn-jb-btn:hover { opacity: .88; }
.lbn-jb-btn-primary   { background: var(--jb-primary); color: var(--jb-on-primary); box-shadow: var(--jb-shadow); }
.lbn-jb-btn-secondary { background: var(--jb-card); color: var(--jb-text); border-color: var(--jb-border); box-shadow: var(--jb-shadow); }
.lbn-jb-btn-outline   { background: transparent; color: var(--jb-primary); border-color: var(--jb-primary); }
.lbn-jb-btn-danger    { background: var(--jb-danger); color: #fff; box-shadow: var(--jb-shadow); }
.lbn-jb-btn-promote   { background: var(--jb-primary); color: var(--jb-on-primary); box-shadow: var(--jb-shadow); }
.lbn-jb-btn-promote:hover { opacity: .88; }
.lbn-jb-btn-full      { width: 100%; margin-bottom: 8px; }

.lbn-jb-promote-section {
    margin-top: 28px;
    padding: 20px 22px;
    background: var(--jb-card);
    border-radius: var(--r-md, 14px);
    box-shadow: var(--jb-shadow);
}
.lbn-jb-promote-title { font-size: .95rem; font-weight: 700; color: var(--jb-text); margin: 0 0 4px; display: flex; align-items: center; gap: 6px; }
.lbn-jb-promote-title i { color: var(--jb-primary); }
.lbn-jb-promote-desc { font-size: .85rem; color: var(--jb-muted); margin: 0 0 12px; }
.lbn-jb-btn-sm        { padding: 7px 14px; font-size: .82rem; min-height: auto; }
.lbn-jb-btn-xs        { padding: 4px 10px; font-size: .78rem; min-height: auto; }
.lbn-jb-btn-lg        { padding: 13px 28px; font-size: 1rem; }
.lbn-jb-btn:disabled  { opacity: .55; cursor: not-allowed; }
.lbn-jb-btn-icon {
    display: inline-flex !important;
    align-items: center;
    font-size: 1em;
    line-height: 1;
    flex-shrink: 0;
}

/* ── Hero banner ──────────────────────────────────────────────────── */
.lbn-jb-hero {
    position: relative;
    width: 100vw;
    margin-left:  calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    aspect-ratio: 21 / 9;
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--jb-primary) var(--hero-bg) center/cover no-repeat;
    border-radius: 0;
    overflow: hidden;
}
.lbn-jb-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(40,82,96,.78) 0%, rgba(40,82,96,.55) 100%);
}
.lbn-jb-hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 40px 20px 32px;
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
}
.lbn-jb-hero-title {
    color: #fff;
    font-size: clamp(1.5rem, 4vw, 2.4rem);
    font-weight: 800;
    margin: 0 0 8px;
    text-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.lbn-jb-hero-subtitle {
    color: rgba(255,255,255,.88);
    font-size: 1.05rem;
    margin: 0 0 28px;
}

/* ── Filter pill (inside hero) ────────────────────────────────────── */
.lbn-jb-filter-pill {
    display: flex;
    justify-content: center;
}
.lbn-jb-filter-pill-inner {
    display: flex;
    align-items: center;
    background: var(--jb-card);
    border-radius: 50px;
    box-shadow: var(--jb-shadow-md);
    padding: 6px 8px;
    gap: 0;
    flex-wrap: wrap;
    max-width: 820px;
    width: 100%;
}
.lbn-jb-filter-pill-item {
    flex: 1;
    min-width: 120px;
    padding: 4px 8px;
}
.lbn-jb-filter-pill-item select,
.lbn-jb-filter-pill-item input[type="text"] {
    width: 100%;
    border: none;
    background: transparent;
    font-size: .9rem;
    color: var(--jb-text);
    padding: 6px 4px;
    outline: none;
    font-family: inherit;
    -webkit-appearance: none;
}
.lbn-jb-filter-pill-sep {
    width: 1px;
    height: 28px;
    background: var(--jb-border);
    flex-shrink: 0;
}
.lbn-jb-filter-pill-item--btn { flex: 0; }
.lbn-jb-filter-pill-search {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--jb-primary);
    color: var(--jb-on-primary);
    border: none;
    border-radius: 50px;
    padding: 10px 22px;
    font-size: .9375rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: var(--jb-transition);
    font-family: inherit;
}
.lbn-jb-filter-pill-search:hover { opacity: .88; }

/* ── Board wrap ───────────────────────────────────────────────────── */
.lbn-jb-board-wrap { padding: 0; }

/* Layout switcher toolbar */
.lbn-jb-board-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px;
    padding: 0 16px;
}
.lbn-jb-results-count { font-size: .9rem; color: var(--jb-muted); }
.lbn-jb-layout-btns   { display: flex; gap: 4px; }
.lbn-jb-layout-btn {
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--jb-radius-sm);
    border: 1px solid var(--jb-border);
    background: var(--jb-card);
    color: var(--jb-muted);
    cursor: pointer;
    transition: var(--jb-transition);
    font-size: .9rem;
    box-shadow: var(--jb-shadow);
}
.lbn-jb-layout-btn.active,
.lbn-jb-layout-btn:hover { background: var(--jb-primary); color: var(--jb-on-primary); border-color: var(--jb-primary); }

/* ── Jobs grid ────────────────────────────────────────────────────── */
.lbn-jb-jobs-grid {
    display: grid;
    gap: var(--jb-gap);
    grid-template-columns: repeat(3, 1fr);
    padding: 0 16px;
    margin-bottom: 32px;
}
.lbn-jb-board-wrap.lbn-jb-layout-grid-2 .lbn-jb-jobs-grid { grid-template-columns: repeat(2, 1fr); }
.lbn-jb-board-wrap.lbn-jb-layout-grid-3 .lbn-jb-jobs-grid { grid-template-columns: repeat(3, 1fr); }
.lbn-jb-board-wrap.lbn-jb-layout-grid-4 .lbn-jb-jobs-grid { grid-template-columns: repeat(4, 1fr); }
.lbn-jb-board-wrap.lbn-jb-layout-list   .lbn-jb-jobs-grid { grid-template-columns: 1fr; }
.lbn-jb-board-wrap.lbn-jb-layout-list   .lbn-jb-job-card  { display: flex; flex-direction: row; }
.lbn-jb-board-wrap.lbn-jb-layout-list   .lbn-jb-card-img-wrap { width: 180px; min-width: 180px; }

/* ── Job card ─────────────────────────────────────────────────────── */
.lbn-jb-job-card {
    background: var(--jb-card);
    border-radius: var(--jb-radius);
    border: 1px solid var(--jb-border);
    box-shadow: var(--jb-shadow);
    overflow: hidden;
    transition: var(--jb-transition);
    position: relative;
}
.lbn-jb-job-card:hover { transform: translateY(-2px); box-shadow: var(--jb-shadow-md); }
.lbn-jb-card-featured  { border-color: var(--jb-featured); box-shadow: var(--jb-shadow), 0 0 0 2px rgba(184,137,63,.18); }
.lbn-jb-job-card-closed { opacity: .7; }

/* Card image wrapper */
.lbn-jb-card-img-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16/9;
    background: var(--jb-subtle);
    overflow: hidden;
}
.lbn-jb-card-img-wrap img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    loading: lazy; decoding: async;
}
.lbn-jb-card-no-img {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--jb-border);
    font-size: 2rem;
}
.lbn-jb-card-no-img::before { content: '\f0b1'; font-family: "Font Awesome 5 Free"; font-weight: 900; }

/* Featured star badge */
.lbn-jb-card-featured-badge {
    position: absolute;
    top: 10px;
    inset-inline-start: 10px;
    background: var(--jb-featured);
    color: #fff;
    border-radius: 50%;
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    font-size: .75rem;
    box-shadow: var(--jb-shadow);
}

/* Closed badge */
.lbn-jb-card-closed-badge {
    position: absolute;
    top: 10px;
    inset-inline-end: 10px;
    background: var(--jb-danger);
    color: #fff;
    border-radius: var(--jb-radius-sm);
    padding: 3px 8px;
    font-size: .75rem;
    font-weight: 600;
}

/* Category circle overlay (only when image uploaded) */
.lbn-jb-cat-circle-overlay {
    position: absolute;
    bottom: -18px;
    inset-inline-end: 16px;
    z-index: 2;
}
.lbn-jb-cat-icon-circle,
.lbn-jb-cat-img-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: var(--jb-shadow);
    overflow: hidden;
    color: #fff;
    font-size: .85rem;
}
.lbn-jb-cat-img-circle img { width: 100%; height: 100%; object-fit: cover; }

/* Card body */
.lbn-jb-card-body {
    padding: 18px 16px 14px;
}
.lbn-jb-card-company {
    font-size: .82rem;
    color: var(--jb-muted);
    margin: 0 0 6px;
    display: flex; align-items: center; gap: 5px;
}
.lbn-jb-card-title {
    margin: 0 0 10px;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
.lbn-jb-card-title a {
    color: var(--jb-heading);
    text-decoration: none;
    transition: color .15s;
    flex: 1;
}
.lbn-jb-card-title a:hover { color: var(--jb-primary); }

/* Card facts (type, location, salary) */
.lbn-jb-card-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}
.lbn-jb-card-fact {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: .78rem;
    font-weight: 500;
    background: var(--jb-subtle);
    color: var(--jb-text);
    border: 1px solid var(--jb-border);
}
.lbn-jb-fact-type     { background: var(--jb-info-bg);    color: var(--jb-info);    border-color: var(--jb-info); }
.lbn-jb-fact-location { background: var(--jb-subtle);     color: var(--jb-muted); }
.lbn-jb-fact-salary   { background: var(--jb-success-bg); color: var(--jb-success); border-color: var(--jb-success); }
.lbn-jb-fact-deadline { background: var(--jb-warning-bg); color: var(--jb-warning); border-color: var(--jb-warning); }

.lbn-jb-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .78rem;
    color: var(--jb-muted);
    border-top: 1px solid var(--jb-border);
    padding-top: 10px;
    margin-top: 8px;
}

/* ── No-img card placeholder (jobs with no thumbnail) ─────────────── */
.lbn-jb-job-card--no-img .lbn-jb-card-img-wrap { display: none; }
.lbn-jb-job-card--no-img .lbn-jb-card-body     { padding-top: 20px; }

/* ── Form ─────────────────────────────────────────────────────────── */
.lbn-jb-form { display: flex; flex-direction: column; gap: 18px; }
.lbn-jb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.lbn-jb-field { display: flex; flex-direction: column; gap: 6px; }
.lbn-jb-field label { font-size: .875rem; font-weight: 600; color: var(--jb-heading); }
.lbn-jb-required { color: var(--jb-danger); }
.lbn-jb-hint { font-size: .78rem; color: var(--jb-muted); }

.lbn-jb-field-input {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--jb-border);
    border-radius: var(--jb-radius-sm);
    font-size: .9375rem;
    font-family: inherit;
    background: var(--jb-card);
    color: var(--jb-text);
    box-shadow: var(--jb-inset);
    transition: var(--jb-transition);
    -webkit-appearance: none;
}
.lbn-jb-field-input:focus { outline: 2px solid var(--jb-primary); outline-offset: 1px; border-color: var(--jb-primary); }
.lbn-jb-field-input::placeholder { color: var(--jb-muted); }

/* Content direction radio */
.lbn-jb-content-dir-wrap { display: flex; gap: 16px; align-items: center; }
.lbn-jb-content-dir-wrap label { font-weight: normal; font-size: .9rem; cursor: pointer; display: flex; align-items: center; gap: 6px; }

/* ── Card form (submit/login) ─────────────────────────────────────── */
.lbn-jb-card {
    max-width: 540px;
    margin: 40px auto;
    padding: 32px 28px;
    background: var(--jb-card);
    border: 1px solid var(--jb-border);
    border-radius: var(--jb-radius);
    box-shadow: var(--jb-shadow);
}
.lbn-jb-card-wide  { max-width: 800px; }
.lbn-jb-card-title { margin: 0 0 24px; font-size: 1.35rem; font-weight: 700; color: var(--jb-heading); text-align: center; }

/* ── Single job ───────────────────────────────────────────────────── */
.lbn-jb-single-wrap  { max-width: 1000px; margin: 0 auto; padding: 24px 16px 48px; }
.lbn-jb-breadcrumb   { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font-size: .85rem; color: var(--jb-muted); margin: 0 0 20px; }
.lbn-jb-breadcrumb a { color: var(--jb-primary); text-decoration: none; }
.lbn-jb-breadcrumb a:hover { text-decoration: underline; }
.lbn-jb-breadcrumb-sep { color: var(--jb-border); }

.lbn-jb-single-layout { display: grid; grid-template-columns: 1fr 320px; gap: 28px; align-items: flex-start; }
.lbn-jb-single-header { margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--jb-border); }
.lbn-jb-single-title  { font-size: 1.6rem; font-weight: 700; color: var(--jb-heading); margin: 0 0 8px; }
.lbn-jb-single-company { font-size: 1.05rem; color: var(--jb-muted); margin: 0 0 12px; display: flex; align-items: center; gap: 6px; }

.lbn-jb-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.lbn-jb-tag  { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 20px; font-size: .8rem; font-weight: 500; }
.lbn-jb-tag-type     { background: var(--jb-info-bg);    color: var(--jb-info);    border: 1px solid var(--jb-info); }
.lbn-jb-tag-location { background: var(--jb-subtle);     color: var(--jb-muted); }
.lbn-jb-tag-salary   { background: var(--jb-success-bg); color: var(--jb-success); border: 1px solid var(--jb-success); }
.lbn-jb-tag-deadline { background: var(--jb-warning-bg); color: var(--jb-warning); border: 1px solid var(--jb-warning); }
.lbn-jb-tag-closed   { background: var(--jb-danger-bg);  color: var(--jb-danger);  border: 1px solid var(--jb-danger); }
.lbn-jb-tag-featured { background: var(--jb-featured-bg); color: var(--jb-featured); border: 1px solid var(--jb-featured); }

.lbn-jb-job-cats  { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.lbn-jb-cat-badge { background: var(--jb-subtle); border: 1px solid var(--jb-border); color: var(--jb-muted); padding: 2px 8px; border-radius: 999px; font-size: .78rem; }

.lbn-jb-single-content { color: var(--jb-text); line-height: 1.75; }
.lbn-jb-single-content p  { margin-bottom: 16px; }
.lbn-jb-single-content ul,
.lbn-jb-single-content ol { padding-inline-start: 24px; margin-bottom: 16px; }
.lbn-jb-single-content li { margin-bottom: 6px; }

.lbn-jb-apply-box {
    background: var(--jb-card);
    border-radius: var(--jb-radius);
    box-shadow: var(--jb-shadow-md);
    padding: 24px;
    position: sticky;
    top: 80px;
}
.lbn-jb-apply-box h3 { margin: 0 0 16px; font-size: 1rem; color: var(--jb-heading); }
.lbn-jb-apply-email-note { margin-top: 12px; font-size: .82rem; color: var(--jb-muted); }
.lbn-jb-back-link { margin-top: 32px; }
.lbn-jb-back-link a { color: var(--jb-primary); text-decoration: none; font-size: .9375rem; display: inline-flex; align-items: center; gap: 6px; }
.lbn-jb-back-link a:hover { text-decoration: underline; }
.lbn-jb-empty { color: var(--jb-muted); font-size: .9375rem; margin: 24px 0; text-align: center; }

/* ── Dashboard header ─────────────────────────────────────────────── */
.lbn-jb-dashboard-header {
    display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 12px;
}
.lbn-jb-dashboard-header h2 { margin: 0; font-size: 1.25rem; color: var(--jb-heading); }

/* ── Tables ───────────────────────────────────────────────────────── */
.lbn-jb-table-wrap { overflow-x: auto; }
.lbn-jb-table {
    width: 100%; border-collapse: collapse; font-size: .875rem;
    background: var(--jb-card);
    border: 1px solid var(--jb-border);
    border-radius: var(--jb-radius);
    overflow: hidden;
}
.lbn-jb-table th,
.lbn-jb-table td { padding: 12px 14px; border-bottom: 1px solid var(--jb-border); }
.lbn-jb-table th { background: var(--jb-subtle); font-weight: 600; font-size: .8rem; color: var(--jb-muted); text-transform: uppercase; letter-spacing: .03em; }
.lbn-jb-table tr:last-child td { border-bottom: none; }
.lbn-jb-table tr:hover td { background: var(--jb-bg); }
.lbn-jb-apps-row td { background: var(--jb-bg); padding: 0; }
.lbn-jb-apps-row details { padding: 12px 16px; }
.lbn-jb-apps-row summary { cursor: pointer; font-size: .82rem; color: var(--jb-primary); font-weight: 600; margin-bottom: 8px; }
.lbn-jb-apps-table { width: 100%; border-collapse: collapse; font-size: .82rem; margin-top: 8px; }
.lbn-jb-apps-table th,
.lbn-jb-apps-table td { padding: 8px 10px; border-bottom: 1px solid var(--jb-border); }
.lbn-jb-actions { white-space: nowrap; display: flex; gap: 6px; align-items: center; }

/* ── Status badges ────────────────────────────────────────────────── */
.lbn-jb-status {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 12px;
    font-size: .78rem;
    font-weight: 600;
    background: var(--jb-subtle);
    color: var(--jb-muted);
    border: 1px solid var(--jb-border);
}
.lbn-jb-status.status-live      { background: var(--jb-success-bg); color: var(--jb-success); border-color: var(--jb-success); }
.lbn-jb-status.status-published { background: var(--jb-success-bg); color: var(--jb-success); border-color: var(--jb-success); }
.lbn-jb-status.status-pending   { background: var(--jb-warning-bg); color: var(--jb-warning); border-color: var(--jb-warning); }
.lbn-jb-status.status-closed    { background: var(--jb-danger-bg);  color: var(--jb-danger);  border-color: var(--jb-danger); }
.lbn-jb-status.status-draft     { background: var(--jb-subtle);     color: var(--jb-muted); }
.lbn-jb-status.status-hired     { background: var(--jb-success-bg); color: var(--jb-success); border-color: var(--jb-success); }
.lbn-jb-status.status-rejected  { background: var(--jb-danger-bg);  color: var(--jb-danger);  border-color: var(--jb-danger); }
.lbn-jb-status.status-shortlisted { background: var(--jb-info-bg); color: var(--jb-info);     border-color: var(--jb-info); }

/* ── Pagination ───────────────────────────────────────────────────── */
.lbn-jb-pagination {
    display: flex; justify-content: center; margin-top: 24px; padding: 0 16px;
}
.lbn-jb-pagination .page-numbers {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border-radius: var(--jb-radius-sm);
    border: 1px solid var(--jb-border);
    background: var(--jb-card);
    color: var(--jb-text);
    font-size: .875rem;
    text-decoration: none;
    margin: 0 2px;
    transition: var(--jb-transition);
}
.lbn-jb-pagination .page-numbers.current,
.lbn-jb-pagination .page-numbers:hover { background: var(--jb-primary); color: var(--jb-on-primary); border-color: var(--jb-primary); }

/* ── No results ───────────────────────────────────────────────────── */
.lbn-jb-no-results { text-align: center; padding: 40px 20px; }
.lbn-jb-no-results p { color: var(--jb-muted); margin-bottom: 16px; }

/* ── Expired status badge ─────────────────────────────────────────── */
.lbn-jb-status.status-expired { background: var(--jb-muted); color: #fff; border-color: var(--jb-muted); opacity: .85; }

/* ── Muted helper ─────────────────────────────────────────────────── */
.lbn-jb-muted { color: var(--jb-muted); font-size: .85rem; }

/* ── Collapsible section ──────────────────────────────────────────── */
.lbn-jb-collapsible-section {
    border: 1px solid var(--jb-border);
    border-radius: var(--jb-radius);
    background: var(--jb-card);
    box-shadow: var(--jb-shadow);
    margin-bottom: 20px;
    overflow: hidden;
}
.lbn-jb-collapsible-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: .9375rem;
    font-weight: 600;
    color: var(--jb-heading);
    font-family: inherit;
    text-align: start;
    gap: 12px;
    transition: background .15s;
}
.lbn-jb-collapsible-toggle:hover { background: var(--jb-subtle); }
.lbn-jb-collapsible-toggle[aria-expanded="true"] .lbn-jb-chevron { transform: rotate(180deg); }
.lbn-jb-chevron { transition: transform .2s ease; color: var(--jb-muted); font-size: .85rem; }
.lbn-jb-collapsible-body { padding: 0 18px 18px; }

/* CV incomplete badge */
.lbn-jb-cv-incomplete-badge {
    background: var(--jb-warning-bg);
    color: var(--jb-warning);
    border: 1px solid var(--jb-warning);
    border-radius: 12px;
    font-size: .72rem;
    padding: 2px 7px;
    font-weight: 600;
    margin-inline-start: 8px;
}

/* CV wrap header */
.lbn-jb-cv-wrap { padding: 0; }
.lbn-jb-cv-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.lbn-jb-cv-header h2 { margin: 0; font-size: 1.1rem; color: var(--jb-heading); }
.lbn-jb-cv-updated { font-size: .8rem; }

/* Company form */
.lbn-jb-company-wrap { padding: 0; }
.lbn-jb-logo-preview { margin: 6px 0 4px; }

/* ── Multi-step submit form ────────────────────────────────────────── */
.lbn-jb-steps {
    display: flex;
    align-items: center;
    margin-bottom: 28px;
    gap: 0;
}
.lbn-jb-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex: 0;
    white-space: nowrap;
}
.lbn-jb-step-num {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--jb-subtle);
    color: var(--jb-muted);
    display: flex; align-items: center; justify-content: center;
    font-size: .85rem; font-weight: 700;
    border: 2px solid var(--jb-border);
    transition: var(--jb-transition);
}
.lbn-jb-step--active .lbn-jb-step-num   { background: var(--jb-primary); color: var(--jb-on-primary); border-color: var(--jb-primary); }
.lbn-jb-step--done .lbn-jb-step-num     { background: var(--jb-success); color: #fff; border-color: var(--jb-success); }
.lbn-jb-step-label { font-size: .75rem; color: var(--jb-muted); font-weight: 500; }
.lbn-jb-step--active .lbn-jb-step-label { color: var(--jb-primary); font-weight: 600; }
.lbn-jb-step-line  { flex: 1; height: 2px; background: var(--jb-border); margin-bottom: 16px; min-width: 20px; }

/* Preview card */
.lbn-jb-preview-card {
    background: var(--jb-bg);
    border: 1px solid var(--jb-border);
    border-radius: var(--jb-radius);
    padding: 20px;
    margin-bottom: 20px;
}
.lbn-jb-preview-card h3 { margin: 0 0 6px; font-size: 1.15rem; color: var(--jb-heading); }
.lbn-jb-preview-card .preview-company { font-size: .9rem; color: var(--jb-muted); margin-bottom: 12px; }
.lbn-jb-preview-card .preview-desc    { font-size: .9rem; color: var(--jb-text); white-space: pre-wrap; line-height: 1.6; margin-top: 12px; max-height: 200px; overflow-y: auto; }
.lbn-jb-preview-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ── About the Company (single job page) ─────────────────────────── */
.lbn-jb-about-company {
    margin-top: 32px;
    padding: 20px;
    background: var(--jb-card);
    border: 1px solid var(--jb-border);
    border-radius: var(--jb-radius);
    box-shadow: var(--jb-shadow);
}
.lbn-jb-about-company-title {
    font-size: .9rem;
    font-weight: 600;
    color: var(--jb-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--jb-border);
}
.lbn-jb-about-company-inner {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.lbn-jb-co-logo {
    width: 60px; height: 60px;
    object-fit: contain;
    border-radius: var(--jb-radius-sm);
    border: 1px solid var(--jb-border);
    padding: 4px;
    background: #fff;
    flex-shrink: 0;
}
.lbn-jb-co-name { font-size: 1rem; font-weight: 700; color: var(--jb-heading); margin: 0 0 4px; }
.lbn-jb-co-name a { color: var(--jb-primary); text-decoration: none; }
.lbn-jb-co-name a:hover { text-decoration: underline; }
.lbn-jb-co-tagline { font-size: .875rem; color: var(--jb-muted); margin: 0 0 8px; font-style: italic; }
.lbn-jb-co-bio { font-size: .875rem; color: var(--jb-text); margin: 0; line-height: 1.65; }

/* ── Modal dialog ─────────────────────────────────────────────────── */
.lbn-jb-modal {
    border: none;
    border-radius: var(--jb-radius);
    padding: 0;
    box-shadow: var(--jb-shadow-md), 0 0 0 100vmax rgba(0,0,0,.4);
    max-width: min(96vw, 600px);
    width: 100%;
    max-height: 90vh;
    overflow: hidden;
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
}
.lbn-jb-modal::backdrop { background: rgba(0,0,0,.45); }
.lbn-jb-modal-inner  { display: flex; flex-direction: column; max-height: 90vh; }
.lbn-jb-modal-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 16px 20px;
    background: var(--jb-primary);
    color: var(--jb-on-primary);
    flex-shrink: 0;
}
.lbn-jb-modal-header h3 { margin: 0; font-size: 1rem; color: inherit; }
.lbn-jb-modal-close {
    background: none; border: none; cursor: pointer;
    color: inherit; font-size: 1rem; padding: 4px 6px;
    border-radius: 4px; transition: background .15s;
}
.lbn-jb-modal-close:hover { background: rgba(255,255,255,.15); }
.lbn-jb-modal-body { padding: 20px; overflow-y: auto; flex: 1; background: var(--jb-card); }

/* CV in modal */
.lbn-jb-cv-view { font-size: .9rem; }
.lbn-jb-cv-view-section { margin-bottom: 16px; }
.lbn-jb-cv-view-section h4 {
    font-size: .78rem; font-weight: 600; color: var(--jb-muted);
    text-transform: uppercase; letter-spacing: .04em;
    margin: 0 0 4px; padding-bottom: 4px;
    border-bottom: 1px solid var(--jb-border);
}
.lbn-jb-cv-view-section p { margin: 0; color: var(--jb-text); white-space: pre-wrap; line-height: 1.6; }
.lbn-jb-cv-file-link { margin-top: 16px; }

/* Upload row */
.lbn-jb-upload-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }

/* ── RTL Support ──────────────────────────────────────────────────── */
[dir="rtl"] .lbn-jb-container,
.rtl .lbn-jb-container { direction: rtl; text-align: right; }

[dir="rtl"] .lbn-jb-single-content ul,
[dir="rtl"] .lbn-jb-single-content ol,
.rtl .lbn-jb-single-content ul,
.rtl .lbn-jb-single-content ol { padding-right: 24px; padding-left: 0; }

[dir="rtl"] .lbn-jb-table th,
[dir="rtl"] .lbn-jb-table td,
.rtl .lbn-jb-table th,
.rtl .lbn-jb-table td { text-align: right; }

[dir="rtl"] .lbn-jb-apps-table th,
[dir="rtl"] .lbn-jb-apps-table td,
.rtl .lbn-jb-apps-table th,
.rtl .lbn-jb-apps-table td { text-align: right; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .lbn-jb-jobs-grid { grid-template-columns: repeat(2, 1fr); }
    .lbn-jb-filter-pill-inner { border-radius: var(--jb-radius); padding: 8px; }
    .lbn-jb-filter-pill-sep   { display: none; }
    .lbn-jb-filter-pill-item  { min-width: 100%; flex: 1 1 100%; border-bottom: 1px solid var(--jb-border); }
    .lbn-jb-filter-pill-item:last-child { border-bottom: none; }
    .lbn-jb-filter-pill-item--btn { min-width: auto; flex: 1 1 auto; }
    .lbn-jb-filter-pill-search    { width: 100%; justify-content: center; }
}

@media (max-width: 680px) {
    .lbn-jb-jobs-grid         { grid-template-columns: 1fr; }
    .lbn-jb-single-layout     { grid-template-columns: 1fr; }
    .lbn-jb-apply-box         { position: static; }
    .lbn-jb-form-row          { grid-template-columns: 1fr; }
    .lbn-jb-card              { margin: 20px 16px; padding: 24px 18px; }
    .lbn-jb-dashboard-header  { flex-direction: column; align-items: flex-start; }
    .lbn-jb-hero              { min-height: 260px; }
}

/* ── Role Switcher (job-dashboard shortcode) ──────────────────────── */
.lbn-jb-dashboard-wrap { padding-top: 32px; }

.lbn-jb-role-switcher {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    max-width: 560px;
    margin: 0 auto 32px;
}

.lbn-jb-role-card {
    background: var(--jb-card);
    border: 2px solid var(--jb-border);
    border-radius: var(--r-md, 14px);
    padding: 32px 20px;
    text-align: center;
    cursor: pointer;
    transition: var(--jb-transition);
    box-shadow: var(--jb-shadow);
    font-family: inherit;
    width: 100%;
}
.lbn-jb-role-card:hover {
    border-color: var(--jb-primary);
    box-shadow: var(--jb-shadow-md);
    transform: translateY(-2px);
}
.lbn-jb-role-card.lbn-jb-role-active {
    border-color: var(--jb-primary);
    background: color-mix(in srgb, var(--jb-primary) 8%, var(--jb-card));
}
.lbn-jb-role-card-icon {
    display: block;
    font-size: 2.25rem;
    color: var(--jb-primary);
    margin-bottom: 12px;
}
.lbn-jb-role-card h3 {
    margin: 0 0 6px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--jb-heading);
}
.lbn-jb-role-card p {
    margin: 0;
    font-size: .85rem;
    color: var(--jb-muted);
    line-height: 1.4;
}
.lbn-jb-role-card.lbn-jb-role-loading {
    opacity: .6;
    pointer-events: none;
}

.lbn-jb-role-prompt {
    text-align: center;
    color: var(--jb-muted);
    font-size: .95rem;
    margin-top: 0;
}

/* Role switcher toggle styles live in portal.css (lbn-user-portal)
   since the toggle renders inside the User Portal dashboard. */

/* ── Pending / rejected state ─────────────────────────────────────── */
.lbn-jb-pending-state {
    text-align: center;
    padding: 48px 28px;
    background: var(--jb-warning-bg);
    border: 1px solid var(--jb-warning);
    border-radius: var(--r-md, 14px);
    max-width: 520px;
    margin: 0 auto;
}
.lbn-jb-pending-state > i {
    font-size: 3rem;
    color: var(--jb-warning);
    margin-bottom: 16px;
    display: block;
}
.lbn-jb-pending-state h3 {
    margin: 0 0 10px;
    color: var(--jb-heading);
}
.lbn-jb-pending-state p { color: var(--jb-text); margin: 0 0 8px; }
.lbn-jb-pending-hint { font-size: .85rem; color: var(--jb-muted); }

.lbn-jb-pending-rejected {
    background: var(--jb-danger-bg);
    border-color: var(--jb-danger);
}
.lbn-jb-pending-rejected > i { color: var(--jb-danger); }

@media (max-width: 480px) {
    .lbn-jb-role-switcher { grid-template-columns: 1fr; max-width: 320px; }
    .lbn-jb-role-card     { padding: 24px 16px; }
}

/* ── Favorites ────────────────────────────────────────────────────── */
.lbn-jb-title-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.lbn-jb-title-row .lbn-jb-single-title { flex: 1; margin: 0; }
.lbn-jb-card-fav-btn,
.lbn-jb-fav-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 1.25rem;
    line-height: 1;
    color: var(--jb-muted);
    transition: color .15s, transform .12s;
    flex-shrink: 0;
    min-height: auto;
}
.lbn-jb-card-fav-btn:hover,
.lbn-jb-fav-btn:hover { color: var(--c-danger, #c0392b); transform: scale(1.15); }
.lbn-jb-fav-active { color: var(--c-danger, #c0392b) !important; }
.lbn-jb-fav-btn { font-size: 1.6rem; margin-inline-start: 4px; }