/* 加入我們（第五版 V5Careers）：岗位卡片、申请区。 */

.fm-jobs__list {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fm-job {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 22px 20px;
	border: 1px solid var(--fm-color-line);
	border-radius: var(--fm-radius-card);

	.fm-button {
		align-self: flex-start;
		min-height: 48px;
		padding-inline: 22px;
		font-size: 16px;
	}
}

.fm-job__text {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.fm-job__title {
	margin: 0;
	color: var(--fm-color-primary);
	font-family: var(--fm-font-display);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
}

.fm-job__desc {
	margin: 0;
	color: var(--fm-color-text-muted);
	font-size: 15px;
	line-height: 1.7;
}

/* 长说明：第一段之外收起来，点「查看完整說明」展开 */
.fm-job__more {
	summary {
		width: fit-content;
		color: var(--fm-color-primary);
		font-size: 15px;
		font-weight: 700;
		line-height: 1.7;
		cursor: pointer;
	}

	.fm-job__desc {
		margin-top: 10px;
	}
}

.fm-apply {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	align-items: flex-start;

	.fm-form-card {
		flex: 2 1 560px;
		min-width: 0;
	}

	&:focus {
		outline: none;
	}

	.fm-card__text strong {
		color: var(--fm-color-on-primary);
	}
}

@media (min-width: 768px) {

	.fm-job {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 14px 24px;
		align-items: center;
		justify-content: space-between;
		padding: 22px 24px;

		.fm-button {
			align-self: center;
		}
	}

	/* 有长说明时按钮放在标题旁边，不随展开收起上下移动 */
	.fm-job:has(.fm-job__more) {
		align-items: flex-start;

		.fm-button {
			align-self: flex-start;
		}
	}

	.fm-job__text {
		flex: 1 1 480px;
	}

	.fm-apply {
		padding-top: 0;
		padding-bottom: 64px;
	}
}

/* 在线申请表右边：其他申请方式、说明 */
.fm-apply__aside {
	display: flex;
	flex: 1 1 300px;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}