/**
 * Job detail page — loaded after WP Job Manager frontend CSS.
 *
 * @package JobScout
 */

/* Page — keep main background transparent/default */
.jobscout-job-detail.single-job_listing .site-main,
.jobscout-job-detail.single-job .site-main {
	padding: 24px 0 48px;
}

/* Breadcrumbs — below banner, above title */
.jobscout-job-detail .job-detail-breadcrumbs {
	padding: 16px 0 8px;
	margin: 0;
}

.jobscout-job-detail .job-detail-breadcrumbs + .job-detail-header {
	margin-top: 0;
}

/* Title row */
.jobscout-job-detail .job-detail-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	padding-bottom: 20px;
	margin-bottom: 24px;
}

.jobscout-job-detail .job-detail-header .entry-title {
	margin: 0;
	flex: 1 1 auto;
	min-width: 0;
}

.jobscout-job-detail .job-detail-header .job-type {
	flex: 0 0 auto;
	margin: 0;
}

.jobscout-job-detail .job-detail-badge.btn {
	display: inline-block;
	font-size: 0.875em;
	font-weight: 600;
	color: #2ace5e;
	background: rgba(42, 206, 94, 0.12);
	border: 1px solid rgba(42, 206, 94, 0.35);
	border-radius: 40px;
	padding: 6px 18px;
	cursor: default;
	text-transform: capitalize;
}

/* Card */
.jobscout-job-detail .single_job_listing .job-detail-card {
	display: block;
	background: #fff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 12px !important;
	padding: 24px !important;
	margin: 0 0 24px !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
	box-sizing: border-box;
}

.jobscout-job-detail .job-detail-card__divider {
	display: block;
	height: 1px;
	background: #e2e8f0;
	margin: 20px 0;
	border: none;
}

/* Company row — CSS grid, no WPJM .company class */
.jobscout-job-detail .job-detail-company {
	display: grid !important;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	box-shadow: none !important;
	position: static !important;
	min-height: 0 !important;
	clear: none !important;
}

.jobscout-job-detail .job-detail-company__logo {
	grid-column: 1;
	grid-row: 1;
	width: 64px;
	height: 64px;
	overflow: hidden;
	border-radius: 8px;
	background: #f0f2f5;
	display: flex;
	align-items: center;
	justify-content: center;
}

.jobscout-job-detail .job-detail-company__logo img,
.jobscout-job-detail .job-detail-company__logo .company_logo {
	display: block !important;
	width: 64px !important;
	height: 64px !important;
	max-width: 64px !important;
	object-fit: contain;
	border-radius: 8px;
	position: static !important;
	float: none !important;
	margin: 0 !important;
	left: auto !important;
	top: auto !important;
	box-shadow: none !important;
}

.jobscout-job-detail .job-detail-company__body {
	grid-column: 2;
	grid-row: 1;
	min-width: 0;
	overflow: hidden;
}

.jobscout-job-detail .job-detail-company__name {
	margin: 0 0 4px !important;
	padding: 0 !important;
	line-height: 1.4;
	width: 100%;
}

.jobscout-job-detail .job-detail-company__name strong {
	font-size: 1.125em;
	font-weight: 600;
	color: #000;
}

.jobscout-job-detail .job-detail-company__subline {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 0.875em;
	line-height: 1.5;
	color: rgba(0, 0, 0, 0.55);
}

.jobscout-job-detail .job-detail-company__website {
	color: #2ace5e;
	text-decoration: none;
	display: inline;
	float: none !important;
	position: static !important;
	margin: 0 !important;
}

.jobscout-job-detail .job-detail-company__website::before {
	display: none !important;
	content: none !important;
}

.jobscout-job-detail .job-detail-company__sep {
	margin: 0 6px;
}

/* Meta row */
.jobscout-job-detail .job-detail-card__meta-row {
	display: block;
}

/* Actions row — outside card: apply left, other buttons right */
.jobscout-job-detail .job-detail-actions-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 24px;
	width: 100%;
}

.jobscout-job-detail .job-detail-actions-row--extras-only {
	justify-content: flex-end;
}

.jobscout-job-detail .job-detail-actions__apply {
	flex: 1 1 280px;
	min-width: 0;
}

.jobscout-job-detail .job-detail-actions__apply .job_application {
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible;
	width: 100%;
}

.jobscout-job-detail .job-detail-actions__apply .application_button.button {
	display: block;
	width: 100%;
	margin: 0;
	padding: 14px 24px;
	text-align: center;
	box-sizing: border-box;
}

.jobscout-job-detail .job-detail-actions__apply .application_details {
	width: 100%;
	margin-top: 8px;
}

.jobscout-job-detail .job-detail-actions__extras {
	flex: 0 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
}

.jobscout-job-detail .job-detail-actions__extras .job-detail-extras {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
	margin: 0;
}

/* Meta inside card */
.jobscout-job-detail .job-detail-card .job-detail-meta {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	clear: none !important;
	overflow: visible !important;
}

.jobscout-job-detail .job-detail-card .job-detail-meta li {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 0 0 28px !important;
	font-size: 0.9375em;
	color: rgba(0, 0, 0, 0.65);
	position: relative;
	line-height: 1.5;
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	text-transform: none !important;
}

.jobscout-job-detail .job-detail-card .job-detail-meta li::before {
	content: "" !important;
	position: absolute;
	left: 0;
	top: 2px;
	width: 18px;
	height: 18px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	margin: 0 !important;
}

.jobscout-job-detail .job-detail-card .job-detail-meta li.job-type::before {
	background-image: url('data:image/svg+xml; utf-8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%232ace5e" d="M320 336c0 8.84-7.16 16-16 16h-96c-8.84 0-16-7.16-16-16v-48H0v144c0 25.6 22.4 48 48 48h416c25.6 0 48-22.4 48-48V288H320v48zm144-208h-80V80c0-25.6-22.4-48-48-48H176c-25.6 0-48 22.4-48 48v48H48c-25.6 0-48 22.4-48 48v80h512v-80c0-25.6-22.4-48-48-48zm-144 0H192V96h128v32z"></path></svg>');
}

.jobscout-job-detail .job-detail-card .job-detail-meta li.location::before {
	background-image: url('data:image/svg+xml; utf-8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path fill="%232ace5e" d="M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67-9.535 13.774-29.93 13.773-39.464 0zM192 272c44.183 0 80-35.817 80-80s-35.817-80-80-80-80 35.817-80 80 35.817 80 80 80z"></path></svg>');
}

.jobscout-job-detail .job-detail-card .job-detail-meta li.date-posted::before {
	background-image: url('data:image/svg+xml; utf-8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%232ace5e" d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm57.1 350.1L224.9 294c-3.1-2.3-4.9-5.9-4.9-9.7V116c0-6.6 5.4-12 12-12h48c6.6 0 12 5.4 12 12v137.7l63.5 46.2c5.4 3.9 6.5 11.4 2.6 16.8l-28.2 38.8c-3.9 5.3-11.4 6.5-16.8 2.6z"></path></svg>');
}

.jobscout-job-detail .job-detail-card .job-detail-meta li.salary::before {
	background-image: url('data:image/svg+xml; utf-8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%232ace5e" d="M0 405.3V448c0 35.3 86 64 192 64s192-28.7 192-64v-42.7C342.7 434.4 267.2 448 192 448S41.3 434.4 0 405.3zM320 128c106 0 192-28.7 192-64S426 0 320 0 128 28.7 128 64s86 64 192 64zM0 300.4V352c0 35.3 86 64 192 64s192-28.7 192-64v-51.6c-41.3 34-116.9 51.6-192 51.6S41.3 334.4 0 300.4zm416 11c57.4-11.4 96-31.7 96-55.4v-42.7c-23.2 16.4-57.3 27.6-96 34.5v63.6zM192 160C86 160 0 131.3 0 96V53.6C41.3 87.6 116.9 104 192 104s150.7-16.4 192-50.4V96c0 35.3-86 64-192 64z"></path></svg>');
}

/* Extras — outline buttons on the right */
.jobscout-job-detail .job-detail-extras {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
	margin: 0;
}

.jobscout-job-detail .job-detail-alerts-btn,
.jobscout-job-detail .job-detail-telegram-btn,
.jobscout-job-detail .job-detail-custom-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 8px;
	background: #fff;
	color: #000;
	font-size: 0.875em;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.jobscout-job-detail .job-detail-custom-btn__icon {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	object-fit: contain;
}

.jobscout-job-detail .job-detail-alerts-btn:hover,
.jobscout-job-detail .job-detail-telegram-btn:hover,
.jobscout-job-detail .job-detail-custom-btn:hover {
	border-color: #2ace5e;
	color: #2ace5e;
}

.jobscout-job-detail .single_job_listing .job_description {
	margin-top: 0;
	margin-bottom: 30px;
}

/* Mobile */
@media screen and (max-width: 767px) {
	.jobscout-job-detail .job-detail-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.jobscout-job-detail .job-detail-header .entry-title {
		width: 100%;
	}

	.jobscout-job-detail .single_job_listing .job-detail-card {
		padding: 20px 16px !important;
	}

	.jobscout-job-detail .job-detail-company {
		grid-template-columns: 56px minmax(0, 1fr);
		gap: 12px;
		align-items: start;
	}

	.jobscout-job-detail .job-detail-company__logo,
	.jobscout-job-detail .job-detail-company__logo img,
	.jobscout-job-detail .job-detail-company__logo .company_logo {
		width: 56px !important;
		height: 56px !important;
		max-width: 56px !important;
	}

	.jobscout-job-detail .job-detail-card .job-detail-meta {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.jobscout-job-detail .job-detail-card .job-detail-meta li {
		width: 100% !important;
	}

	.jobscout-job-detail .job-detail-actions-row {
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 12px;
		margin-bottom: 20px;
	}

	.jobscout-job-detail .job-detail-actions__apply {
		flex: 0 0 auto;
		width: 100%;
	}

	.jobscout-job-detail .job-detail-actions__extras {
		flex: 0 0 auto;
		width: 100%;
	}

	.jobscout-job-detail .job-detail-actions__extras,
	.jobscout-job-detail .job-detail-actions__extras .job-detail-extras {
		justify-content: flex-end;
		gap: 10px;
	}

	.jobscout-job-detail .job-detail-actions__extras .job-detail-extras {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
	}

	.jobscout-job-detail .job-detail-alerts-btn,
	.jobscout-job-detail .job-detail-telegram-btn,
	.jobscout-job-detail .job-detail-custom-btn {
		max-width: 100%;
		white-space: normal;
		text-align: center;
	}
}
