/* ========================================================================
   MineJobs modern job display: split archive preview + single job page
   ===================================================================== */

:root {
	--mjj-primary: #0e6bff;
	--mjj-primary-2: #3c8cff;
	--mjj-text: #111827;
	--mjj-muted: #718096;
	--mjj-border: #dbe6f5;
	--mjj-soft: #f5f9ff;
	--mjj-soft-2: #eef5ff;
	--mjj-card: #ffffff;
	--mjj-success: #16834f;
	--mjj-danger: #cf3e3e;
	--mjj-warning: #9a6800;
	--mjj-shadow: 0 20px 52px rgba(18, 52, 104, .09);
	--mjj-shadow-soft: 0 12px 28px rgba(18, 52, 104, .06);
}

.minejobs-modern-single-job-wrap {
	width: 100%;
}

.mjj-display {
	direction: rtl;
	color: var(--mjj-text);
}

.mjj-display--single {
	margin: 0 auto 34px;
}

.mjj-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 18px;
	padding: 20px;
	border-radius: 30px;
	background: #fff;
	border: 1px solid var(--mjj-border);
	box-shadow: var(--mjj-shadow);
	overflow: hidden;
}

.mjj-hero:before {
	content: '';
	position: absolute;
	inset: 0 0 auto;
	height: 4px;
	background: linear-gradient(90deg, transparent, var(--mjj-primary), transparent);
}

.mjj-hero__visual {
	position: relative;
	height: 260px;
	border-radius: 24px;
	overflow: hidden;
	background:
		radial-gradient(circle at 12% 24%, rgba(14,107,255,.22), transparent 30%),
		linear-gradient(135deg, #eaf3ff 0%, #f9fcff 100%);
}

.mjj-display--single .mjj-hero__visual {
	height: 330px;
}

.mjj-hero__visual img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.mjj-hero__visual:after {
	content: '';
	position: absolute;
	inset: auto 0 0;
	height: 42%;
	background: linear-gradient(180deg, transparent, rgba(9, 21, 42, .22));
	pointer-events: none;
}

.mjj-visual-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 12px;
	height: 100%;
	color: var(--mjj-primary);
	font-weight: 950;
}

.mjj-visual-placeholder i {
	font-size: 54px;
}

.mjj-hero__main {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 4px 12px 0;
}

.mjj-hero__topline {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: -54px;
	margin-bottom: 12px;
	z-index: 2;
}

.mjj-company-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 92px;
	height: 92px;
	border-radius: 24px;
	background: #fff;
	border: 1px solid var(--mjj-border);
	box-shadow: 0 14px 34px rgba(18, 52, 104, .12);
	overflow: hidden;
}

.mjj-company-logo img {
	max-width: 72px;
	max-height: 72px;
	object-fit: contain;
}

.mjj-company-logo--small {
	width: 58px;
	height: 58px;
	border-radius: 18px;
	box-shadow: none;
	flex: 0 0 58px;
}

.mjj-company-logo--small img {
	max-width: 46px;
	max-height: 46px;
}

.mjj-logo-placeholder,
.mja-logo-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 30px;
	color: var(--mjj-primary);
	background: linear-gradient(135deg, #f5f9ff, #fff);
}

.mjj-company-meta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: right;
	gap: 4px;
	padding: 10px 14px;
	border-radius: 18px;
	background: rgba(255,255,255,.92);
	border: 1px solid rgba(219, 230, 245, .8);
	box-shadow: 0 12px 24px rgba(18,52,104,.08);
}

.mjj-company-meta span {
	font-size: 13px;
	font-weight: 950;
	color: var(--mjj-text);
}

.mjj-company-meta em {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-style: normal;
	font-size: 12px;
	font-weight: 800;
	color: var(--mjj-muted);
}

.mjj-hero h1 {
	margin: 0;
	max-width: 780px;
	font-size: clamp(24px, 3vw, 36px);
	line-height: 1.55;
	font-weight: 950;
	color: var(--mjj-text);
}

.mjj-hero p {
	margin: 8px 0 0;
	color: var(--mjj-muted);
	font-size: 14px;
	font-weight: 800;
}

.mjj-hero__chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 16px;
}

.mjj-hero__chips span,
.mjj-chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 36px;
	padding: 8px 13px;
	border-radius: 999px;
	background: var(--mjj-soft);
	border: 1px solid var(--mjj-border);
	color: #4b5d75;
	font-size: 12px;
	font-weight: 900;
}

.mjj-hero__chips i,
.mjj-chip i {
	color: var(--mjj-primary);
}

.mjj-hero__chips .is-success {
	background: #edf9f2;
	border-color: #cbe8d5;
	color: var(--mjj-success);
}

.mjj-hero__chips .is-danger {
	background: #fff3f3;
	border-color: #f0c1c1;
	color: var(--mjj-danger);
}

.mjj-hero__chips .is-success i,
.mjj-hero__chips .is-danger i {
	color: currentColor;
}

.mjj-hero__actions {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 18px;
}

.mjj-apply-area {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.mjj-secondary-actions {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 9px;
}

.mjj-button,
.mjj-icon-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 18px;
	border-radius: 16px;
	font-size: 13px;
	font-weight: 950;
	text-decoration: none !important;
	transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.mjj-button:hover,
.mjj-icon-button:hover {
	transform: translateY(-1px);
}

.mjj-button--primary {
	border: 0;
	background: linear-gradient(135deg, var(--mjj-primary), var(--mjj-primary-2));
	color: #fff !important;
	box-shadow: 0 14px 30px rgba(14,107,255,.2);
}

.mjj-button--light,
.mjj-icon-button {
	background: #fff;
	border: 1px solid var(--mjj-border);
	color: var(--mjj-text) !important;
}

.mjj-icon-button {
	width: 48px;
	padding: 0;
	border-radius: 50%;
	font-size: 16px;
}

.mjj-overview-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 12px;
	margin: 18px 0;
}

.mjj-overview-item {
	padding: 14px 12px;
	border-radius: 20px;
	background: #fff;
	border: 1px solid var(--mjj-border);
	box-shadow: var(--mjj-shadow-soft);
	text-align: center;
}

.mjj-overview-item span {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-bottom: 7px;
	color: #9aabc0;
	font-size: 11px;
	font-weight: 950;
	text-transform: uppercase;
}

.mjj-overview-item span i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 10px;
	background: var(--mjj-soft-2);
	color: var(--mjj-primary);
	font-size: 13px;
}

.mjj-overview-item strong {
	display: block;
	color: var(--mjj-text);
	font-size: 13px;
	font-weight: 950;
	line-height: 1.6;
}

.mjj-content-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 310px;
	gap: 18px;
	align-items: start;
}

.mjj-content-main,
.mjj-content-side {
	min-width: 0;
}

.mjj-section,
.mjj-side-card {
	border-radius: 24px;
	background: #fff;
	border: 1px solid var(--mjj-border);
	box-shadow: var(--mjj-shadow-soft);
}

.mjj-section {
	padding: 24px;
	margin-bottom: 18px;
}

.mjj-section__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid #eef3fb;
}

.mjj-section__head span {
	order: 2;
	color: #d3e4fb;
	font-size: 13px;
	font-weight: 950;
	letter-spacing: .05em;
}

.mjj-section__head h2 {
	margin: 0;
	font-size: 20px;
	font-weight: 950;
	color: var(--mjj-text);
}

.mjj-section p,
.mjj-job-description {
	color: #2f3b4e;
	font-size: 14px;
	line-height: 2.05;
	font-weight: 650;
}

.mjj-job-description p,
.mjj-job-description ul,
.mjj-job-description ol {
	margin-top: 0;
	margin-bottom: 14px;
}

.mjj-job-description ul,
.mjj-job-description ol {
	padding-inline-start: 22px;
}

.mjj-side-card {
	padding: 18px;
	margin-bottom: 16px;
}

.mjj-side-card__head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 15px;
}

.mjj-side-card__head strong,
.mjj-side-card--apply > strong {
	display: block;
	font-size: 15px;
	font-weight: 950;
	color: var(--mjj-text);
	line-height: 1.6;
}

.mjj-side-card__head span,
.mjj-side-card--apply p {
	display: block;
	margin: 4px 0 0;
	color: var(--mjj-muted);
	font-size: 12px;
	line-height: 1.85;
	font-weight: 750;
}

.mjj-contact-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mjj-contact-list a,
.mjj-contact-list div {
	display: grid;
	grid-template-columns: 34px minmax(0, .7fr) minmax(0, 1.3fr);
	align-items: center;
	gap: 8px;
	min-height: 46px;
	padding: 8px 10px;
	border-radius: 15px;
	background: var(--mjj-soft);
	border: 1px solid #e6eefb;
	text-decoration: none !important;
}

.mjj-contact-list i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 12px;
	background: #fff;
	color: var(--mjj-primary);
}

.mjj-contact-list span {
	color: var(--mjj-muted);
	font-size: 11px;
	font-weight: 900;
}

.mjj-contact-list strong {
	color: var(--mjj-text);
	font-size: 12px;
	font-weight: 900;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mjj-empty-note,
.mjj-apply-notice {
	padding: 13px 14px;
	border-radius: 16px;
	background: var(--mjj-soft);
	border: 1px dashed var(--mjj-border);
	color: var(--mjj-muted);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.85;
}

.mjj-apply-notice {
	display: inline-flex;
	align-items: center;
	gap: 9px;
}

.mjj-apply-notice--done {
	background: #edf9f2;
	border-color: #cbe8d5;
	color: var(--mjj-success);
}

.mjj-apply-notice--expired,
.mjj-apply-notice--blocked {
	background: #fff8e6;
	border-color: #edd8aa;
	color: var(--mjj-warning);
}

.mjj-side-card--apply .mjj-apply-area {
	display: flex;
	margin-top: 14px;
}

.mjj-side-card--apply .mjj-button {
	width: 100%;
}

/* Comments and old JobMonster sections inside the modern page */
.minejobs-modern-single-job-wrap .job-tag,
.minejobs-modern-single-job-wrap .job-social,
.minejobs-modern-single-job-wrap .related-jobs,
.minejobs-modern-single-job-wrap #comments,
.minejobs-modern-single-job-wrap .comments-area {
	margin-top: 22px;
	padding: 22px;
	border-radius: 24px;
	background: #fff;
	border: 1px solid var(--mjj-border);
	box-shadow: var(--mjj-shadow-soft);
}

@media (max-width: 1180px) {
	.mjj-overview-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.mjj-content-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 760px) {
	.mjj-hero {
		padding: 16px;
		border-radius: 24px;
	}

	.mjj-hero__visual,
	.mjj-display--single .mjj-hero__visual {
		height: 210px;
		border-radius: 20px;
	}

	.mjj-hero__topline {
		margin-top: -42px;
		flex-direction: column;
	}

	.mjj-company-meta {
		align-items: center;
		text-align: center;
	}

	.mjj-company-logo {
		width: 76px;
		height: 76px;
		border-radius: 22px;
	}

	.mjj-hero h1 {
		font-size: 22px;
	}

	.mjj-overview-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mjj-section,
	.mjj-side-card {
		padding: 18px;
		border-radius: 20px;
	}

	.mjj-section__head {
		align-items: flex-start;
		flex-direction: column;
	}

	.mjj-hero__actions,
	.mjj-secondary-actions,
	.mjj-apply-area,
	.mjj-button {
		width: 100%;
	}

	.mjj-icon-button {
		width: 48px;
	}
}

/* v12: verified company badge beside company names. */
.mjj-company-meta > span,
.mjj-side-card__head strong,
.mj-apply-job-card span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.mjj-company-meta .minejobs-company-verified-badge,
.mjj-side-card__head .minejobs-company-verified-badge,
.mj-apply-job-card .minejobs-company-verified-badge {
	width: 18px;
	height: 18px;
	font-size: 10px;
	margin: 0 0 0 4px;
	flex: 0 0 18px;
}

/* v21: single job fullscreen polish + custom fields section */
body.minejobs-fullscreen-job .noo-page-heading,
body.minejobs-fullscreen-job .page-heading,
body.minejobs-fullscreen-job .page-heading-info,
body.minejobs-fullscreen-job .page-heading-bg,
body.minejobs-fullscreen-job .heading-bg,
body.minejobs-fullscreen-job .page-title-wrap,
body.minejobs-fullscreen-job .noo-page-title,
body.minejobs-fullscreen-job .parallax-section.page-heading,
body.single-noo_job .noo-page-heading,
body.single-noo_job .page-heading,
body.single-noo_job .page-title-wrap {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
}

body.minejobs-fullscreen-job #content,
body.minejobs-fullscreen-job .site-content,
body.minejobs-fullscreen-job .main-content,
body.minejobs-fullscreen-job .content-area,
body.minejobs-fullscreen-job .container,
body.minejobs-fullscreen-job .noo-container,
.minejobs-single-job-fullscreen,
.minejobs-modern-single-job-wrap {
	width: 100% !important;
	max-width: none !important;
	margin-right: 0 !important;
	margin-left: 0 !important;
}

.minejobs-modern-single-job-wrap {
	float: none !important;
	padding: 0 !important;
}

.mjj-display--single {
	width: min(1640px, calc(100% - 48px));
	margin: 28px auto 42px !important;
}

.mjj-display--single .mjj-hero {
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	padding: 28px;
	border-radius: 30px;
	background:
		radial-gradient(circle at 8% 0, rgba(14,107,255,.10), transparent 34%),
		linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.mjj-display--single .mjj-hero__visual {
	display: none !important;
}

.mjj-display--single .mjj-hero__main {
	align-items: flex-start;
	text-align: right;
	padding: 0;
}

.mjj-display--single .mjj-hero__topline {
	margin: 0 0 18px;
	justify-content: flex-start;
}

.mjj-display--single .mjj-hero h1 {
	max-width: none;
	text-align: right;
}

.mjj-display--single .mjj-hero p,
.mjj-display--single .mjj-hero__chips,
.mjj-display--single .mjj-hero__actions {
	justify-content: flex-start;
	text-align: right;
}

.mjj-display--single .mjj-hero__actions {
	margin-top: 0;
	align-self: stretch;
	min-width: 280px;
	justify-content: flex-end;
}

.mjj-display--single .mjj-content-layout {
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 22px;
}

.mjj-section--details {
	background: linear-gradient(180deg, #fff 0%, #fbfdff 100%);
}

.mjj-custom-info-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.mjj-custom-info-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	min-height: 66px;
	padding: 14px 16px;
	border-radius: 18px;
	background: #f6faff;
	border: 1px solid var(--mjj-border);
}

.mjj-custom-info-item span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--mjj-muted);
	font-size: 13px;
	font-weight: 900;
	white-space: nowrap;
}

.mjj-custom-info-item span i {
	color: var(--mjj-primary);
}

.mjj-custom-info-item strong {
	color: var(--mjj-text);
	font-size: 14px;
	font-weight: 950;
	line-height: 1.7;
	text-align: left;
}

.mjj-display--single .jm-related-job,
.mjj-display--single .jobs-related,
.mjj-display--single .related-jobs,
.minejobs-modern-single-job-wrap .jm-related-job,
.minejobs-modern-single-job-wrap .jobs-related,
.minejobs-modern-single-job-wrap .related-jobs {
	width: min(1640px, calc(100% - 48px));
	margin: 28px auto !important;
}

@media (max-width: 1180px) {
	.mjj-display--single .mjj-hero,
	.mjj-display--single .mjj-content-layout {
		grid-template-columns: 1fr;
	}

	.mjj-display--single .mjj-hero__actions {
		justify-content: flex-start;
		min-width: 0;
	}
}

@media (max-width: 767px) {
	.mjj-display--single {
		width: calc(100% - 22px);
		margin-top: 16px !important;
	}

	.mjj-display--single .mjj-hero {
		padding: 20px;
	}

	.mjj-custom-info-grid {
		grid-template-columns: 1fr;
	}

	.mjj-custom-info-item {
		align-items: flex-start;
		flex-direction: column;
	}
}

/* v24: custom application channels and cleaner custom fields */
.mjj-side-card__head--simple {
	align-items: center;
	padding-bottom: 12px;
	border-bottom: 1px solid #edf3fb;
}

.mjj-side-card__icon {
	width: 42px;
	height: 42px;
	border-radius: 15px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, #edf6ff 0%, #f7fbff 100%);
	color: var(--mjj-primary);
	border: 1px solid var(--mjj-border);
	flex: 0 0 auto;
}

.mjj-side-card--application-channels {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.mjj-application-channel-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mjj-application-channel-item {
	display: grid;
	grid-template-columns: 38px minmax(0, 1fr) 34px;
	align-items: center;
	gap: 10px;
	padding: 11px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid #e4edf9;
	box-shadow: 0 10px 24px rgba(18, 52, 104, .05);
}

.mjj-application-channel-item__icon {
	width: 38px;
	height: 38px;
	border-radius: 13px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #eef6ff;
	color: var(--mjj-primary);
}

.mjj-application-channel-item small {
	display: block;
	margin-bottom: 3px;
	font-size: 11px;
	font-weight: 900;
	color: var(--mjj-muted);
}

.mjj-application-channel-item strong {
	display: block;
	font-size: 13px;
	font-weight: 950;
	line-height: 1.75;
	color: var(--mjj-text);
	word-break: break-word;
	direction: ltr;
	text-align: right;
}

.mjj-application-channel-item a {
	width: 34px;
	height: 34px;
	border-radius: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--mjj-soft);
	color: var(--mjj-primary);
	text-decoration: none !important;
	transition: .18s ease;
}

.mjj-application-channel-item a:hover {
	background: var(--mjj-primary);
	color: #fff;
}

.mjj-custom-info-item strong {
	word-break: break-word;
	direction: rtl;
	text-align: left;
}

.mjj-custom-info-item strong:empty {
	display: none;
}

.minejobs-single-job-fullscreen .job-custom-fields,
.minejobs-modern-single-job-wrap > .job-custom-fields,
.minejobs-modern-single-job-wrap .noo-job-detail > .job-custom-fields {
	display: none !important;
}

/* v27: branded application channels + manager preview polish */
.mjj-application-channel-item {
	position: relative;
	border-color: color-mix(in srgb, var(--mjj-channel-color, #1473ff) 20%, #e4edf9);
	background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--mjj-channel-bg, #eef6ff) 65%, #fff) 100%);
}

.mjj-application-channel-item::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 14px;
	bottom: 14px;
	width: 3px;
	border-radius: 999px;
	background: var(--mjj-channel-color, var(--mjj-primary));
	opacity: .9;
}

.mjj-application-channel-item__icon {
	background: var(--mjj-channel-bg, #eef6ff);
	color: var(--mjj-channel-color, var(--mjj-primary));
	border: 1px solid color-mix(in srgb, var(--mjj-channel-color, #1473ff) 18%, transparent);
}

.mjj-application-channel-item small {
	color: color-mix(in srgb, var(--mjj-channel-color, #1473ff) 42%, var(--mjj-muted));
}

.mjj-application-channel-item a {
	background: var(--mjj-channel-bg, var(--mjj-soft));
	color: var(--mjj-channel-color, var(--mjj-primary));
}

.mjj-application-channel-item a:hover {
	background: var(--mjj-channel-color, var(--mjj-primary));
	color: #fff;
}

.mjj-application-channel-item__link-placeholder {
	width: 34px;
	height: 34px;
	border-radius: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #f6f8fb;
	color: #b7c2d2;
}

.mjj-application-channel-item--telegram .mjj-application-channel-item__icon,
.mjj-application-channel-item--whatsapp .mjj-application-channel-item__icon {
	font-size: 18px;
}

.mjj-application-channel-item--phone strong,
.mjj-application-channel-item--email strong,
.mjj-application-channel-item--telegram strong,
.mjj-application-channel-item--bale strong,
.mjj-application-channel-item--eitaa strong,
.mjj-application-channel-item--rubika strong,
.mjj-application-channel-item--whatsapp strong {
	direction: ltr;
	unicode-bidi: plaintext;
}

.mjj-apply-notice--manager {
	background: #edf7ff;
	border: 1px solid #cfe6ff;
	color: var(--mjj-primary);
}
