/* =============================================================
   CC Job Archives — Shortcode & Single Page Styles  v0.2.2
   Self-contained: does not rely on theme CSS for layout.
   ============================================================= */

/* ── Design tokens ── */
.cc-job-archives,
.jb-single--archived {
	--ja-green:       #8ead35;
	--ja-green-dark:  #6d8e28;
	--ja-green-light: #f2f7e6;
	--ja-border:      #e5e7eb;
	--ja-bg:          #ffffff;
	--ja-bg-subtle:   #f9fafb;
	--ja-bg-hover:    #f7faf0;
	--ja-text:        #1a1a1a;
	--ja-muted:       #6b7280;
	--ja-radius:      6px;
	--ja-radius-sm:   4px;
	--ja-h:           44px;       /* shared control height */
}

/* =============================================================
   FILTER BAR
   ============================================================= */

.cc-job-archives .cc-ja-filters {
	display:        flex;
	gap:            10px;
	flex-wrap:      wrap;
	align-items:    center;
	margin-bottom:  20px;
}

/* ── Search input ── */
.cc-job-archives .cc-ja-search-wrap {
	position:  relative;
	flex:      1 1 0;
	min-width: 0;
	height:    44px;
}

.cc-job-archives .cc-ja-search-wrap::before,
.cc-job-archives .cc-ja-search-wrap::after { content: none !important; display: none !important; }

.cc-job-archives .cc-ja-search-wrap input.cc-ja-search {
	display:            block            !important;
	width:              100%             !important;
	height:             44px             !important;
	min-height:         0                !important;
	max-height:         44px             !important;
	padding:            0 14px 0 38px    !important;
	margin:             0                !important;
	font-size:          14px             !important;
	font-family:        inherit          !important;
	line-height:        normal           !important;
	color:              var(--ja-text)   !important;
	background:         var(--ja-bg)     !important;
	background-image:   none             !important;
	border:             1px solid var(--ja-border) !important;
	border-radius:      var(--ja-radius) !important;
	box-shadow:         none             !important;
	outline:            none             !important;
	box-sizing:         border-box       !important;
	-webkit-appearance: none             !important;
	appearance:         none             !important;
	transition:         border-color .15s;
}

.cc-job-archives .cc-ja-search-wrap input.cc-ja-search:focus {
	border-color: var(--ja-green) !important;
	outline:      none            !important;
	box-shadow:   none            !important;
}

.cc-job-archives .cc-ja-search-wrap input.cc-ja-search::placeholder {
	color: var(--ja-muted) !important; opacity: 1;
}

.cc-job-archives .cc-ja-search-icon {
	position:       absolute;
	left:           12px;
	top:            50%;
	transform:      translateY(-50%);
	pointer-events: none;
	color:          var(--ja-muted);
	display:        flex;
	z-index:        2;
	line-height:    0;
}

.cc-job-archives .cc-ja-search-icon svg { width: 15px; height: 15px; display: block; }

/* ── Custom dropdown (JS-built, replaces native <select>) ── */
.cc-job-archives .cc-ja-type-wrap {
	position:  relative;
	flex:      1 1 0;
	min-width: 0;
}

/* Hide the native select + anything Jobify injects around it, and the
   legacy arrow span — the custom dropdown button handles everything */
.cc-job-archives .cc-ja-type-wrap select.cc-ja-type-filter,
.cc-job-archives .cc-ja-type-wrap .select,
.cc-job-archives .cc-ja-select-arrow {
	display:        none !important;
	pointer-events: none !important;
}

/* Custom dropdown button */
.cc-ja-dropdown-btn {
	display:        flex            !important;
	align-items:    center          !important;
	justify-content: space-between  !important;
	gap:            24px            !important;
	width:          100%            !important;
	height:         44px            !important;
	padding:        0 14px          !important;
	background:     var(--ja-bg)    !important;
	color:          var(--ja-text)  !important;
	border:         1px solid var(--ja-border) !important;
	border-radius:  var(--ja-radius) !important;
	font-size:      14px            !important;
	font-family:    inherit         !important;
	font-weight:    400             !important;
	line-height:    1               !important;
	white-space:    nowrap          !important;
	cursor:         pointer         !important;
	box-shadow:     none            !important;
	box-sizing:     border-box      !important;
	-webkit-appearance: none        !important;
	appearance:     none            !important;
	transition:     border-color .15s;
}

.cc-ja-dropdown-btn:focus { outline: none !important; border-color: var(--ja-green) !important; }
.cc-ja-dropdown-btn:hover { border-color: var(--ja-green) !important; }

.cc-ja-dropdown-btn[aria-expanded="true"] {
	border-color:   var(--ja-green)     !important;
	border-radius:  var(--ja-radius) var(--ja-radius) 0 0 !important;
}

.cc-ja-dropdown-btn-label { flex: 1 1 0; text-align: left; min-width: 0; overflow: hidden; text-overflow: ellipsis; }

.cc-ja-dropdown-btn-chevron {
	flex-shrink:  0;
	width:        10px;
	height:       6px;
	color:        var(--ja-muted);
	transition:   transform .15s;
	display:      block;
}

.cc-ja-dropdown-btn[aria-expanded="true"] .cc-ja-dropdown-btn-chevron { transform: rotate(180deg); }

/* Dropdown list */
.cc-ja-dropdown-list {
	position:      absolute;
	top:           100%;
	left:          -1px;
	right:         -1px;
	z-index:       9999;
	background:    var(--ja-bg);
	border:        1px solid var(--ja-green);
	border-top:    none;
	border-radius: 0 0 var(--ja-radius) var(--ja-radius);
	margin:        0;
	padding:       4px 0;
	list-style:    none;
	max-height:    240px;
	overflow-y:    auto;
	box-shadow:    0 4px 12px rgba(0,0,0,.1);
}

.cc-ja-dropdown-list[hidden] { display: none; }

.cc-ja-dropdown-list li {
	padding:     9px 14px 9px 36px;
	font-size:   14px;
	color:       var(--ja-text);
	cursor:      pointer;
	list-style:  none;
	transition:  background .1s;
	position:    relative;
}

/* Coloured dot for each job type */
.cc-ja-dropdown-list li::before {
	content:       '';
	position:      absolute;
	left:          14px;
	top:           50%;
	transform:     translateY(-50%);
	width:         8px;
	height:        8px;
	border-radius: 50%;
	background:    var(--ja-border);
	flex-shrink:   0;
}

/* "All job types" — no dot */
.cc-ja-dropdown-list li[data-slug=""]::before { display: none; }
.cc-ja-dropdown-list li[data-slug=""]          { padding-left: 14px; }

.cc-ja-dropdown-list li:hover     { background: var(--ja-bg-hover); }
.cc-ja-dropdown-list li.is-active { font-weight: 600; }

/* Per-type dot colours matching the jb-tag pills */
.cc-ja-dropdown-list li[data-slug="entry-level-graduate"]::before      { background:#93d6d8; }
.cc-ja-dropdown-list li[data-slug="mid-level"]::before                 { background:#8faf2e; }
.cc-ja-dropdown-list li[data-slug="senior"]::before                    { background:#f9c93e; }
.cc-ja-dropdown-list li[data-slug="volunteer-internships"]::before     { background:#599140; }
.cc-ja-dropdown-list li[data-slug="courses-training"]::before          { background:#f4865e; }
.cc-ja-dropdown-list li[data-slug="conservation-scholarships"]::before { background:#eb42a4; }
.cc-ja-dropdown-list li[data-slug="research-projects"]::before         { background:#acd461; }
.cc-ja-dropdown-list li[data-slug="events"]::before                    { background:#5c3626; }

/* Active item gets text colour to match */
.cc-ja-dropdown-list li[data-slug="entry-level-graduate"].is-active      { color:#2a7e80; }
.cc-ja-dropdown-list li[data-slug="mid-level"].is-active                 { color:#5c7a10; }
.cc-ja-dropdown-list li[data-slug="senior"].is-active                    { color:#9a7200; }
.cc-ja-dropdown-list li[data-slug="volunteer-internships"].is-active     { color:#3a6128; }
.cc-ja-dropdown-list li[data-slug="courses-training"].is-active          { color:#b84920; }
.cc-ja-dropdown-list li[data-slug="conservation-scholarships"].is-active { color:#a01470; }
.cc-ja-dropdown-list li[data-slug="research-projects"].is-active         { color:#5a7a10; }
.cc-ja-dropdown-list li[data-slug="events"].is-active                    { color:#5c3626; }

/* Mobile */
@media (max-width: 600px) {
	.cc-job-archives .cc-ja-filters { flex-direction: column; align-items: stretch; gap: 8px; }
	.cc-job-archives .cc-ja-search-wrap { max-width: none; }
	.cc-ja-dropdown-btn { width: 100% !important; }
}

/* =============================================================
   STATUS / COUNT
   ============================================================= */

.cc-job-archives .cc-ja-status {
	min-height:    22px;
	margin-bottom: 10px;
	font-size:     13px;
	color:         var(--ja-muted);
}

.cc-job-archives .cc-ja-status--empty { font-style: italic; }
.cc-job-archives .cc-ja-status--error { color: #dc2626; font-style: normal; }

/* =============================================================
   LOADING SPINNER
   ============================================================= */

.cc-job-archives.cc-ja--loading .cc-ja-filters { pointer-events: none; opacity: .6; }

/* Spinner shown above the results list while loading */
.cc-ja-spinner-wrap {
	display:         none;
	justify-content: center;
	align-items:     center;
	padding:         40px 0;
}

.cc-job-archives.cc-ja--loading .cc-ja-spinner-wrap { display: flex; }
.cc-job-archives.cc-ja--loading .cc-ja-results      { display: none; }

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

.cc-ja-spinner {
	width:         36px;
	height:        36px;
	border:        3px solid var(--ja-border);
	border-top-color: var(--ja-green);
	border-radius: 50%;
	animation:     cc-ja-spin .65s linear infinite;
}

/* =============================================================
   RESULTS LIST CONTAINER
   ============================================================= */

.cc-job-archives ul.cc-ja-results {
	list-style:    none   !important;
	margin:        0      !important;
	padding:       0      !important;
	display:       block  !important;
	border:        1px solid var(--ja-border);
	border-radius: var(--ja-radius);
	overflow:      hidden;
	background:    var(--ja-bg);
}

/* =============================================================
   ARCHIVED JOB ROW  (self-contained — does not rely on theme)
   ============================================================= */

.cc-job-archives .cc-ja-archived-row {
	position:   relative;
	display:    block;
	margin:     0;
	padding:    0;
	list-style: none;
	border:     none;
	border-bottom: 1px solid var(--ja-border);
	background: var(--ja-bg);
	transition: background .15s ease;
}

.cc-job-archives .cc-ja-archived-row:last-child { border-bottom: none; }

.cc-job-archives .cc-ja-archived-row:hover { background: var(--ja-bg-hover); }

/* Full-row click target */
.cc-job-archives .cc-ja-archived-row .jb-row__link,
.cc-job-archives .cc-ja-archived-row .job_listing-clickbox {
	position: absolute;
	inset:    0;
	z-index:  1;
	display:  block;
}

/* Row inner layout */
.cc-job-archives .cc-ja-archived-row .jb-row {
	display:     flex  !important;
	align-items: center !important;
	gap:         16px  !important;
	padding:     16px 20px !important;
	min-height:  72px  !important;
	box-sizing:  border-box;
}

/* ── Logo ── */
.cc-job-archives .cc-ja-archived-row .jb-row__logo {
	flex:            0 0 48px !important;
	width:           48px;
	height:          48px;
	border-radius:   var(--ja-radius-sm);
	background:      var(--ja-bg-subtle);
	border:          1px solid var(--ja-border);
	display:         flex;
	align-items:     center;
	justify-content: center;
	padding:         4px;
	box-sizing:      border-box;
	overflow:        hidden;
}

.cc-job-archives .cc-ja-archived-row .jb-row__logo img {
	max-width:  100%;
	max-height: 100%;
	width:      auto !important;
	height:     auto !important;
	display:    block;
	object-fit: contain;
}

.cc-job-archives .cc-ja-archived-row .jb-row__logo-placeholder {
	width:       100%;
	height:      100%;
	background:  linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
	border-radius: var(--ja-radius-sm);
}

/* ── Body ── */
.cc-job-archives .cc-ja-archived-row .jb-row__body {
	flex:      1 1 0;
	min-width: 0;
}

.cc-job-archives .cc-ja-archived-row .jb-row__title {
	font-size:     15px       !important;
	font-weight:   600        !important;
	color:         var(--ja-text) !important;
	margin:        0 0 3px    !important;
	line-height:   1.3;
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
}

.cc-job-archives .cc-ja-archived-row .jb-row__company {
	font-size:     13px !important;
	color:         var(--ja-text) !important;
	margin:        0;
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
}

.cc-job-archives .cc-ja-archived-row .jb-row__location {
	display:       flex;
	align-items:   center;
	gap:           4px;
	margin-top:    5px;
	font-size:     13px !important;
	color:         var(--ja-muted) !important;
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
}

.cc-job-archives .cc-ja-archived-row .jb-row__location svg {
	width:       14px;
	height:      14px;
	flex-shrink: 0;
}

/* ── Meta (right column) ── */
.cc-job-archives .cc-ja-archived-row .jb-row__meta {
	flex:           0 0 auto !important;
	display:        flex;
	flex-direction: column;
	align-items:    flex-end;
	gap:            6px;
}

.cc-job-archives .cc-ja-archived-row .jb-row__meta-top {
	display:         flex;
	align-items:     center;
	gap:             6px;
	flex-wrap:       wrap;
	justify-content: flex-end;
}

.cc-job-archives .cc-ja-archived-row .jb-row__date {
	font-size:   12px;
	color:       var(--ja-muted);
	white-space: nowrap;
}

/* Archived badge */
.cc-job-archives .cc-ja-archived-badge {
	display:       inline-block;
	font-size:     11px;
	font-weight:   500;
	padding:       2px 8px;
	border-radius: 20px;
	background:    #fef3c7;
	color:         #92400e;
	border:        1px solid #fde68a;
	white-space:   nowrap;
	position:      relative;
	z-index:       2;
}

/* =============================================================
   JOB TYPE TAGS
   ============================================================= */

.cc-job-archives .jb-tag,
.jb-single--archived .jb-tag {
	display:       inline-block;
	font-size:     11px;
	font-weight:   500;
	padding:       3px 9px;
	border-radius: 20px;
	background:    var(--ja-bg-subtle);
	color:         var(--ja-muted);
	border:        1px solid var(--ja-border);
	white-space:   nowrap;
	position:      relative;
	z-index:       2;
}

.cc-job-archives .jb-tag--entry-level-graduate,      .jb-single--archived .jb-tag--entry-level-graduate      { background:#edf9fa; color:#2a7e80; border-color:#93d6d8; }
.cc-job-archives .jb-tag--mid-level,                 .jb-single--archived .jb-tag--mid-level                 { background:#f2f7e6; color:#5c7a10; border-color:#8faf2e; }
.cc-job-archives .jb-tag--senior,                    .jb-single--archived .jb-tag--senior                    { background:#fef7dc; color:#9a7200; border-color:#f9c93e; }
.cc-job-archives .jb-tag--volunteer-internships,     .jb-single--archived .jb-tag--volunteer-internships     { background:#e8f2e3; color:#3a6128; border-color:#599140; }
.cc-job-archives .jb-tag--courses-training,          .jb-single--archived .jb-tag--courses-training          { background:#fdeee8; color:#b84920; border-color:#f4865e; }
.cc-job-archives .jb-tag--conservation-scholarships, .jb-single--archived .jb-tag--conservation-scholarships { background:#fce9f5; color:#a01470; border-color:#eb42a4; }
.cc-job-archives .jb-tag--research-projects,         .jb-single--archived .jb-tag--research-projects         { background:#f0f9e0; color:#5a7a10; border-color:#acd461; }
.cc-job-archives .jb-tag--events,                    .jb-single--archived .jb-tag--events                    { background:#ede8e5; color:#5c3626; border-color:#5c3626; }
.cc-job-archives .jb-tag--full-time,                 .jb-single--archived .jb-tag--full-time                 { background:#f2f7e6; color:#5c7a10; border-color:#8faf2e; }
.cc-job-archives .jb-tag--part-time,                 .jb-single--archived .jb-tag--part-time                 { background:#edf9fa; color:#2a7e80; border-color:#93d6d8; }
.cc-job-archives .jb-tag--internship,                .jb-single--archived .jb-tag--internship                { background:#e8f2e3; color:#3a6128; border-color:#599140; }
.cc-job-archives .jb-tag--volunteer,                 .jb-single--archived .jb-tag--volunteer                 { background:#e8f2e3; color:#3a6128; border-color:#599140; }
.jb-single--archived .jb-tag--remote                                                                          { background:#eef2ff; color:#3730a3; border-color:#c7d2fe; }

/* =============================================================
   LOAD MORE
   ============================================================= */

.cc-job-archives .cc-ja-load-more-wrap {
	margin-top: 20px;
	text-align: center;
}

.cc-job-archives .cc-ja-load-more {
	display:       inline-flex;
	align-items:   center;
	gap:           8px;
	padding:       11px 28px;
	background:    var(--ja-green);
	color:         #fff;
	border:        none;
	border-radius: var(--ja-radius);
	font-size:     14px;
	font-weight:   600;
	cursor:        pointer;
	transition:    background .15s;
}

.cc-job-archives .cc-ja-load-more:hover    { background: var(--ja-green-dark); }
.cc-job-archives .cc-ja-load-more:disabled { opacity: .6; cursor: not-allowed; }

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

@media (max-width: 768px) {
	.cc-job-archives .cc-ja-archived-row .jb-row {
		padding:    12px !important;
		gap:        10px !important;
		min-height: unset !important;
	}

	.cc-job-archives .cc-ja-archived-row .jb-row__logo { display: none !important; }

	.cc-job-archives .cc-ja-archived-row .jb-row__title {
		font-size:          13px  !important;
		white-space:        normal;
		display:            -webkit-box;
		-webkit-line-clamp: 2;
		line-clamp:         2;
		-webkit-box-orient: vertical;
		overflow:           hidden;
	}

	.cc-job-archives .cc-ja-archived-row .jb-row__company { font-size: 12px !important; }
	.cc-job-archives .cc-ja-archived-row .jb-row__date    { display: none; }
}

@media (max-width: 480px) {
	.cc-job-archives .cc-ja-filters   { flex-direction: column; }
	.cc-job-archives .cc-ja-search-wrap { max-width: none; }
	.cc-job-archives .cc-ja-type-wrap  { width: 100%; }
	.cc-job-archives .cc-ja-type-wrap select.cc-ja-type-filter { width: 100% !important; }
}

/* =============================================================
   SINGLE ARCHIVED JOB PAGE
   Self-contained — all rules scoped to .jb-single--archived so the
   page looks polished regardless of the active theme's CSS, and so
   live job pages are never affected.
   ============================================================= */

.jb-single--archived {
	background: var(--ja-bg);
	color:      var(--ja-text);
}

/* ── Header band ── */
.jb-single--archived .jb-single__header {
	background:    var(--ja-bg-subtle);
	border-bottom: 1px solid var(--ja-border);
	padding:       28px 0 24px;
}

.jb-single--archived .jb-single__header .container,
.jb-single--archived .jb-single__content.container {
	max-width: 1140px;
	margin:    0 auto;
	padding:   0 24px;
	box-sizing: border-box;
}

/* ── Breadcrumb ── */
.jb-single--archived .jb-breadcrumb {
	display:       flex;
	align-items:   center;
	flex-wrap:     wrap;
	gap:           6px;
	font-size:     13px;
	color:         var(--ja-muted);
	margin-bottom: 16px;
}

.jb-single--archived .jb-breadcrumb a {
	color:           var(--ja-muted);
	text-decoration: none;
	transition:      color .15s;
}

.jb-single--archived .jb-breadcrumb a:hover { color: var(--ja-green-dark); }

.jb-single--archived .jb-breadcrumb__sep { color: #cbd5e1; }

.jb-single--archived .jb-breadcrumb__current {
	color:         var(--ja-text);
	font-weight:   500;
	max-width:     320px;
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
}

/* ── Header inner: title + logo ── */
.jb-single--archived .jb-single__header-inner {
	display:         flex;
	align-items:     flex-start;
	justify-content: space-between;
	gap:             24px;
}

.jb-single--archived .jb-single__header-body { flex: 1 1 0; min-width: 0; }

.jb-single--archived .jb-single__title {
	font-size:   28px;
	font-weight: 700;
	line-height: 1.2;
	color:       var(--ja-text);
	margin:      0 0 12px;
}

.jb-single--archived .jb-single__header-logo {
	flex:            0 0 88px;
	width:           88px;
	height:          88px;
	border:          1px solid var(--ja-border);
	border-radius:   var(--ja-radius);
	background:      var(--ja-bg);
	display:         flex;
	align-items:     center;
	justify-content: center;
	padding:         8px;
	box-sizing:      border-box;
	overflow:        hidden;
}

.jb-single--archived .jb-single__header-logo img {
	max-width:  100%;
	max-height: 100%;
	width:      auto;
	height:     auto;
	object-fit: contain;
	display:    block;
}

/* ── Archived ribbon ── */
.jb-archived-ribbon {
	display:       inline-flex;
	align-items:   center;
	gap:           6px;
	font-size:     12px;
	font-weight:   600;
	color:         #92400e;
	background:    #fef3c7;
	border:        1px solid #fde68a;
	border-radius: 20px;
	padding:       4px 12px;
	margin-bottom: 12px;
}

/* ── Meta bar ── */
.jb-single--archived .jb-single__meta {
	display:     flex;
	align-items: center;
	flex-wrap:   wrap;
	gap:         8px 10px;
	font-size:   14px;
	color:       var(--ja-muted);
	margin-top:  4px;
}

.jb-single--archived .jb-meta-item {
	display:     inline-flex;
	align-items: center;
	gap:         5px;
}

.jb-single--archived .jb-meta-item svg {
	width:       15px;
	height:      15px;
	flex-shrink: 0;
	color:       var(--ja-muted);
}

.jb-single--archived .jb-meta-sep { color: #d1d5db; font-size: 15px; line-height: 1; }

/* ── Two-column layout ── */
.jb-single--archived .jb-single__content { padding-top: 0; padding-bottom: 0; }

.jb-single--archived .jb-single__layout {
	display:               grid;
	grid-template-columns: 1fr 320px;
	gap:                   40px;
	align-items:           start;
	padding:               36px 0 48px;
}

.jb-single--archived .jb-single__main { min-width: 0; }

/* ── Prose typography for the archived description ── */
.jb-single--archived .jb-single__main {
	font-size:   16px;
	line-height: 1.75;
	color:       #2d2d2d;
}

.jb-single--archived .jb-single__main h2,
.jb-single--archived .jb-single__main h3,
.jb-single--archived .jb-single__main h4 {
	color:       var(--ja-text);
	line-height: 1.3;
	margin:      1.6em 0 0.5em;
}

.jb-single--archived .jb-single__main h2 { font-size: 22px; font-weight: 700; }
.jb-single--archived .jb-single__main h3 { font-size: 18px; font-weight: 700; }
.jb-single--archived .jb-single__main h4 { font-size: 16px; font-weight: 700; }

.jb-single--archived .jb-single__main p { margin: 0 0 1.3em; }

.jb-single--archived .jb-single__main ul,
.jb-single--archived .jb-single__main ol {
	margin:       0 0 1.3em;
	padding-left: 1.4em;
}

.jb-single--archived .jb-single__main li { margin-bottom: 0.4em; }

.jb-single--archived .jb-single__main a {
	color:           var(--ja-green-dark);
	text-decoration: underline;
}

.jb-single--archived .jb-single__main img {
	max-width:     100%;
	height:        auto;
	border-radius: var(--ja-radius);
}

.jb-single--archived .jb-single__main blockquote {
	border-left:   3px solid var(--ja-green);
	background:    var(--ja-green-light);
	margin:        1.6em 0;
	padding:       12px 18px;
	border-radius: 0 var(--ja-radius) var(--ja-radius) 0;
	color:         var(--ja-muted);
	font-style:    italic;
}

.jb-archived-no-desc { color: var(--ja-muted); font-style: italic; }

/* ── Sidebar ── */
.jb-single--archived .jb-single__sidebar {
	display:        flex;
	flex-direction: column;
	gap:            16px;
	position:       sticky;
	top:            24px;
	align-self:     start;
}

.jb-single--archived .jb-sidebar-card {
	background:    var(--ja-bg);
	border:        1px solid var(--ja-border);
	border-radius: var(--ja-radius);
	padding:       20px;
}

.jb-single--archived .jb-sidebar-card__title {
	font-size:      12px;
	font-weight:    700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color:          var(--ja-muted);
	margin:         0 0 16px;
}

/* ── Details list ── */
.jb-single--archived .jb-details {
	margin:         0;
	display:        flex;
	flex-direction: column;
	gap:            14px;
}

.jb-single--archived .jb-details__row {
	display:        flex;
	flex-direction: column;
	gap:            3px;
}

.jb-single--archived .jb-details__row dt {
	font-size:      11px;
	font-weight:    700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color:          var(--ja-muted);
}

.jb-single--archived .jb-details__row dd {
	margin:    0;
	font-size: 14px;
	color:     var(--ja-text);
}

.jb-single--archived .jb-details__row dd .jb-tag { margin-top: 2px; }

/* ── Apply card (archived) ── */
.jb-archived-apply-notice {
	display:       flex;
	align-items:   flex-start;
	gap:           7px;
	font-size:     13px;
	color:         #92400e;
	background:    #fef3c7;
	border:        1px solid #fde68a;
	border-radius: var(--ja-radius-sm);
	padding:       10px 12px;
	margin-bottom: 14px;
	line-height:   1.5;
}

.jb-archived-apply-notice svg { flex-shrink: 0; margin-top: 1px; }

.jb-apply-btn--archived {
	display:         flex;
	align-items:     center;
	justify-content: center;
	width:           100%;
	background:      var(--ja-bg-subtle);
	color:           var(--ja-muted) !important;
	border:          1px solid var(--ja-border);
	border-radius:   var(--ja-radius);
	padding:         11px 20px;
	font-size:       14px;
	font-weight:     600;
	text-decoration: none !important;
	transition:      border-color .15s, color .15s, background .15s;
	text-align:      center;
}

.jb-apply-btn--archived:hover {
	border-color: var(--ja-green);
	background:   var(--ja-green-light);
	color:        var(--ja-green-dark) !important;
}

/* ── Sidebar company logo ── */
.jb-single--archived .jb-sidebar-logo { width: 100%; margin-bottom: 4px; }

.jb-single--archived .jb-sidebar-logo img {
	max-width: 120px;
	height:    auto;
	display:   block;
	margin:    0 auto;
}

.jb-single--archived .jb-company-jobs-link {
	color:           var(--ja-green-dark);
	font-weight:     500;
	text-decoration: none;
}

.jb-single--archived .jb-company-jobs-link:hover {
	color:           var(--ja-green);
	text-decoration: underline;
}

/* ── Back link ── */
.jb-archived-back-link {
	font-size:       13px;
	color:           var(--ja-muted);
	text-decoration: none;
}

.jb-archived-back-link:hover { color: var(--ja-green-dark); text-decoration: underline; }

/* ── Responsive ── */
@media (max-width: 960px) {
	.jb-single--archived .jb-single__layout {
		grid-template-columns: 1fr;
		gap:                   0;
		padding:               28px 0 40px;
	}

	.jb-single--archived .jb-single__sidebar {
		position:    static;
		margin-top:  32px;
		padding-top: 28px;
		border-top:  1px solid var(--ja-border);
	}
}

@media (max-width: 640px) {
	.jb-single--archived .jb-single__header { padding: 22px 0 20px; }
	.jb-single--archived .jb-single__header .container,
	.jb-single--archived .jb-single__content.container { padding: 0 16px; }
	.jb-single--archived .jb-single__title { font-size: 22px; }
	.jb-single--archived .jb-single__header-logo { width: 60px; height: 60px; flex-basis: 60px; }
}