/**
 * Adsplus Recruitment Sections — CSS phía người dùng.
 *
 * Nguyên tắc chống theme đè:
 * 1. Mọi selector đều bắt đầu bằng `.adp-recruit.adp-recruit` (lặp class 2 lần)
 *    để đẩy độ ưu tiên lên 0,3,0 — cao hơn hầu hết selector của theme.
 * 2. Các thuộc tính quyết định bố cục đều có `!important`.
 * 3. Lớp reset liệt kê ĐÍCH DANH các class của plugin, không dùng `*`.
 *    Lý do: Splide gán width/transform bằng inline style, mà `width:auto !important`
 *    trong stylesheet sẽ thắng inline style và làm vỡ carousel.
 */

/* ---------- Biến ---------- */

.adp-recruit {
	--adp-accent: #ff7f27;
	--adp-accent-soft: rgba(255, 127, 39, 0.08);
	--adp-accent-glow: rgba(255, 127, 39, 0.22);
	--adp-accent-2: #2b7fff;
	--adp-accent-2-soft: rgba(43, 127, 255, 0.1);
	--adp-line: rgba(17, 17, 17, 0.1);
	--adp-surface: #fff;
	--adp-soft: #f5f6f8;
	--adp-ink: #3f4045;
	--adp-muted: rgba(17, 17, 17, 0.62);
	--adp-radius: 14px;
	--adp-gap: 20px;

	--adp-hero-pt: 11rem;
	--adp-hero-pb: 4rem;
	--adp-hero-max: 1200px;

	--adp-slide-gap: 16px;
	--adp-slide-ratio: 4 / 3;

	/* Đổi thành font stack cụ thể nếu muốn khóa hẳn, ví dụ: 'Inter', sans-serif */
	--adp-font: inherit;
}

/* ---------- Lớp reset (liệt kê đích danh) ---------- */

.adp-recruit.adp-recruit .adp-hero,
.adp-recruit.adp-recruit .adp-hero__inner,
.adp-recruit.adp-recruit .adp-hero__title,
.adp-recruit.adp-recruit .adp-hero__btn,
.adp-recruit.adp-recruit .adp-hero__btn-label,
.adp-recruit.adp-recruit .adp-recruit__section,
.adp-recruit.adp-recruit .adp-recruit__inner,
.adp-recruit.adp-recruit .adp-recruit__head,
.adp-recruit.adp-recruit .adp-recruit__title,
.adp-recruit.adp-recruit .adp-cards,
.adp-recruit.adp-recruit .adp-card,
.adp-recruit.adp-recruit .adp-card__badge,
.adp-recruit.adp-recruit .adp-card__title,
.adp-recruit.adp-recruit .adp-slide__frame {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	list-style: none !important;
	float: none !important;
	clear: none !important;
	max-width: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	text-transform: none !important;
	text-indent: 0 !important;
	letter-spacing: normal !important;
	word-spacing: normal !important;
	font-style: normal !important;
	font-family: var(--adp-font) !important;
	vertical-align: baseline !important;
	text-decoration: none !important;
}

.adp-recruit.adp-recruit,
.adp-recruit.adp-recruit *,
.adp-recruit.adp-recruit *::before,
.adp-recruit.adp-recruit *::after {
	box-sizing: border-box !important;
}

/* Theme hay gắn bullet giả hoặc gạch chân giả bằng pseudo element. */
.adp-recruit.adp-recruit li::before,
.adp-recruit.adp-recruit li::after,
.adp-recruit.adp-recruit h1::before,
.adp-recruit.adp-recruit h1::after,
.adp-recruit.adp-recruit h2::before,
.adp-recruit.adp-recruit h2::after,
.adp-recruit.adp-recruit h3::before,
.adp-recruit.adp-recruit h3::after {
	content: none !important;
	display: none !important;
}

/* ---------- Khối bao ---------- */

.adp-recruit.adp-recruit {
	display: block !important;
	position: relative !important;
	isolation: isolate !important;
	margin: 48px 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	text-align: left !important;
	font-family: var(--adp-font) !important;
}

.adp-recruit.adp-recruit.adp-recruit--hero {
	margin: 0 0 48px !important;
}

.adp-recruit.adp-recruit .adp-recruit__section {
	display: block !important;
}

.adp-recruit.adp-recruit .adp-recruit__section + .adp-recruit__section {
	margin-top: 56px !important;
}

/* ---------- Hero tiêu đề ---------- */

.adp-recruit.adp-recruit .adp-hero {
	display: block !important;
	position: relative !important;
	background: var(--adp-accent) !important;
	padding: var(--adp-hero-pt) 0 var(--adp-hero-pb) !important;
	overflow: hidden !important;
}

/* Tràn viền ra hết chiều rộng màn hình dù nằm trong container hẹp của theme. */
.adp-recruit.adp-recruit .adp-hero--bleed {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

.adp-recruit.adp-recruit .adp-hero__inner {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 32px !important;
	width: 100% !important;
	max-width: var(--adp-hero-max) !important;
	margin: 0 auto !important;
	padding: 0 20px !important;
}

.adp-recruit.adp-recruit .adp-hero__title {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	margin: 0 !important;
	font-size: clamp(28px, 4vw, 46px) !important;
	line-height: 1.18 !important;
	font-weight: 700 !important;
	color: #fff !important;
	text-align: left !important;
}

.adp-recruit.adp-recruit .adp-hero__btn {
	display: inline-flex !important;
	flex: 0 0 auto !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 15px 30px !important;
	background: #fff !important;
	color: var(--adp-accent) !important;
	border-radius: 999px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	white-space: nowrap !important;
	text-decoration: none !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14) !important;
	transition: transform 0.18s ease, box-shadow 0.18s ease !important;
}

.adp-recruit.adp-recruit .adp-hero__btn:hover,
.adp-recruit.adp-recruit .adp-hero__btn:focus-visible {
	transform: translateY(-2px) !important;
	box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2) !important;
	color: var(--adp-accent) !important;
}

.adp-recruit.adp-recruit .adp-hero__btn:focus-visible {
	outline: 3px solid rgba(255, 255, 255, 0.75) !important;
	outline-offset: 3px !important;
}

.adp-recruit.adp-recruit .adp-hero__btn-icon {
	display: block !important;
	width: 18px !important;
	height: 18px !important;
	flex: 0 0 18px !important;
	fill: none !important;
	stroke: currentColor !important;
	transition: transform 0.18s ease !important;
}

.adp-recruit.adp-recruit .adp-hero__btn:hover .adp-hero__btn-icon {
	transform: translateX(3px) !important;
}

/* ---------- Header 2 section ---------- */

.adp-recruit.adp-recruit .adp-recruit__head {
	display: block !important;
	margin: 0 0 32px !important;
	text-align: center !important;
}

.adp-recruit.adp-recruit .adp-recruit__title {
	display: block !important;
	margin: 0 auto !important;
	font-size: clamp(28px, 4vw, 42px) !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	text-align: center !important;
	color: var(--adp-accent) !important;
	text-transform: uppercase !important;
}

/* ---------- Section 1: card chính sách ---------- */

.adp-recruit.adp-recruit .adp-cards {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: var(--adp-gap) !important;
	list-style: none !important;
}

.adp-recruit.adp-recruit .adp-card {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 18px !important;
	padding: 22px 26px !important;
	background: var(--adp-surface) !important;
	border: 0 !important;
	border-radius: var(--adp-radius) !important;
	box-shadow: 0 2px 12px rgba(17, 17, 17, 0.07) !important;
	text-align: left !important;
	list-style: none !important;
	transition: box-shadow 0.2s ease, transform 0.2s ease !important;
}

.adp-recruit.adp-recruit .adp-card:hover {
	transform: translateY(-3px) !important;
	box-shadow: 0 12px 28px var(--adp-accent-glow) !important;
}

.adp-recruit.adp-recruit .adp-card__badge {
	display: inline-flex !important;
	flex: 0 0 38px !important;
	align-items: center !important;
	justify-content: center !important;
	width: 38px !important;
	height: 38px !important;
	color: var(--adp-accent) !important;
	background: none !important;
}

.adp-recruit.adp-recruit .adp-card__icon {
	display: block !important;
	width: 34px !important;
	height: 34px !important;
	max-width: none !important;
	fill: none !important;
	stroke: currentColor !important;
}

.adp-recruit.adp-recruit .adp-card__img {
	display: block !important;
	width: 38px !important;
	height: 38px !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	object-fit: contain !important;
}

.adp-recruit.adp-recruit .adp-card__title {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
	font-weight: 500 !important;
	text-align: left !important;
	color: var(--adp-ink) !important;
}

/* ---------- Section 2: carousel Splide ---------- */

.adp-recruit.adp-recruit .adp-recruit__inner {
	display: block !important;
}

/* Dải nền xám nhạt. */
.adp-recruit.adp-recruit .adp-recruit__section--culture.has-bg {
	background: var(--adp-soft) !important;
	border-radius: 20px !important;
	padding: 56px 28px !important;
}

/* Tràn hết chiều rộng màn hình, nội dung bên trong vẫn thẳng hàng với bài viết. */
.adp-recruit.adp-recruit .adp-recruit__section--culture.has-bg.is-bleed {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	border-radius: 0 !important;
	padding: 64px 20px !important;
}

.adp-recruit.adp-recruit .adp-recruit__section--culture.has-bg.is-bleed .adp-recruit__inner {
	width: 100% !important;
	max-width: var(--adp-hero-max) !important;
	margin: 0 auto !important;
}

/* Chỉ trung hòa nền/viền/bullet của theme. KHÔNG đụng vào width/position/transform
   vì Splide điều khiển các thuộc tính đó bằng inline style. */
.adp-recruit.adp-recruit .splide__list,
.adp-recruit.adp-recruit .splide__slide {
	background: none !important;
	border: 0 !important;
	list-style: none !important;
	text-indent: 0 !important;
}

.adp-recruit.adp-recruit .splide__slide::before,
.adp-recruit.adp-recruit .splide__slide::after {
	content: none !important;
	display: none !important;
}

.adp-recruit.adp-recruit .adp-carousel {
	position: relative !important;
	padding: 0 !important;
	visibility: visible !important;
}

/* Khung chứa track + mũi tên: mốc định vị để mũi tên căn giữa theo chiều cao ảnh,
   không bị chấm phân trang bên dưới kéo lệch xuống. */
.adp-recruit.adp-recruit .adp-carousel__stage {
	position: relative !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Trước khi Splide mount xong, hiện tạm dạng lưới để tránh nháy 1 cột dọc. */
.adp-recruit.adp-recruit .adp-carousel:not(.is-initialized) .splide__list {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: var(--adp-slide-gap) !important;
}

.adp-recruit.adp-recruit .adp-carousel:not(.is-initialized) .splide__slide:nth-child(n + 5) {
	display: none !important;
}

.adp-recruit.adp-recruit .adp-slide__frame {
	display: block !important;
	position: relative !important;
	width: 100% !important;
	aspect-ratio: var(--adp-slide-ratio) !important;
	overflow: hidden !important;
	border-radius: 12px !important;
	background: var(--adp-accent-2-soft) !important;
}

.adp-recruit.adp-recruit .adp-slide__frame::after {
	content: '' !important;
	position: absolute !important;
	inset: 0 !important;
	border-radius: inherit !important;
	box-shadow: inset 0 0 0 0 var(--adp-accent-2) !important;
	transition: box-shadow 0.2s ease !important;
	pointer-events: none !important;
}

.adp-recruit.adp-recruit .adp-slide:hover .adp-slide__frame::after {
	box-shadow: inset 0 0 0 3px var(--adp-accent-2) !important;
}

.adp-recruit.adp-recruit .adp-slide__img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	object-fit: cover !important;
	object-position: center !important;
	transition: transform 0.4s ease !important;
}

.adp-recruit.adp-recruit .adp-slide:hover .adp-slide__img {
	transform: scale(1.05) !important;
}

/* Mũi tên do Splide tự sinh. splide-core không định vị sẵn nên tự đặt ở đây. */
.adp-recruit.adp-recruit .splide__arrows {
	position: static !important;
}

.adp-recruit.adp-recruit .splide__arrow {
	position: absolute !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	z-index: 2 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 44px !important;
	height: 44px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: var(--adp-accent) !important;
	box-shadow: 0 4px 16px rgba(17, 17, 17, 0.16) !important;
	opacity: 1 !important;
	cursor: pointer !important;
	transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease !important;
}

.adp-recruit.adp-recruit .splide__arrow:hover:not(:disabled) {
	background: var(--adp-accent) !important;
	color: #fff !important;
	transform: translateY(-50%) scale(1.06) !important;
}

.adp-recruit.adp-recruit .splide__arrow:disabled {
	opacity: 0.35 !important;
	cursor: default !important;
}

.adp-recruit.adp-recruit .splide__arrow svg {
	display: block !important;
	width: 20px !important;
	height: 20px !important;
	max-width: none !important;
	fill: none !important;
	stroke: currentColor !important;
	transform: none !important;
}

.adp-recruit.adp-recruit .splide__arrow:focus-visible {
	outline: 3px solid var(--adp-accent) !important;
	outline-offset: 2px !important;
}

.adp-recruit.adp-recruit .splide__arrow--prev {
	left: -14px !important;
}

.adp-recruit.adp-recruit .splide__arrow--next {
	right: -14px !important;
}

/* Chấm phân trang. */
.adp-recruit.adp-recruit .splide__pagination {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	margin: 22px 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
	position: static !important;
}

.adp-recruit.adp-recruit .splide__pagination li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	line-height: 0 !important;
}

.adp-recruit.adp-recruit .splide__pagination__page {
	width: 9px !important;
	height: 9px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--adp-line) !important;
	opacity: 1 !important;
	transform: none !important;
	cursor: pointer !important;
	transition: width 0.2s ease, background-color 0.2s ease !important;
}

.adp-recruit.adp-recruit .splide__pagination__page.is-active {
	width: 26px !important;
	background: var(--adp-accent) !important;
}

/* ---------- Responsive ---------- */

@media (max-width: 1100px) {
	.adp-recruit.adp-recruit .adp-carousel:not(.is-initialized) .splide__list {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}

	.adp-recruit.adp-recruit .splide__arrow--prev {
		left: 4px !important;
	}

	.adp-recruit.adp-recruit .splide__arrow--next {
		right: 4px !important;
	}
}

@media (max-width: 900px) {
	.adp-recruit.adp-recruit .adp-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 820px) {
	.adp-recruit.adp-recruit .adp-carousel:not(.is-initialized) .splide__list {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 782px) {
	/* Admin bar của WordPress bám trên cùng ở bản mobile. */
	.adp-recruit.adp-recruit .adp-hero__inner {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 22px !important;
	}
}

@media (max-width: 600px) {
	.adp-recruit.adp-recruit {
		margin: 32px 0 !important;
	}

	.adp-recruit.adp-recruit.adp-recruit--hero {
		margin: 0 0 32px !important;
	}

	/* Giữ tỉ lệ do người dùng đặt nhưng thu lại cho vừa màn hình nhỏ. */
	.adp-recruit.adp-recruit .adp-hero {
		padding: calc(var(--adp-hero-pt) * 0.5) 0 calc(var(--adp-hero-pb) * 0.75) !important;
	}

	.adp-recruit.adp-recruit .adp-hero__btn {
		padding: 13px 24px !important;
		font-size: 15px !important;
	}

	.adp-recruit.adp-recruit .adp-cards {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 14px !important;
	}

	.adp-recruit.adp-recruit .adp-recruit__section--culture.has-bg {
		border-radius: 14px !important;
		padding: 34px 16px !important;
	}

	.adp-recruit.adp-recruit .adp-recruit__section--culture.has-bg.is-bleed {
		border-radius: 0 !important;
		padding: 38px 16px !important;
	}

	.adp-recruit.adp-recruit .adp-card {
		gap: 16px !important;
		padding: 18px 20px !important;
	}

	.adp-recruit.adp-recruit .adp-card__badge {
		flex: 0 0 34px !important;
		width: 34px !important;
		height: 34px !important;
	}

	.adp-recruit.adp-recruit .adp-card__icon {
		width: 30px !important;
		height: 30px !important;
	}
}

@media (max-width: 560px) {
	.adp-recruit.adp-recruit .adp-carousel:not(.is-initialized) .splide__list {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.adp-recruit.adp-recruit .adp-carousel:not(.is-initialized) .splide__slide:nth-child(n + 2) {
		display: none !important;
	}

	.adp-recruit.adp-recruit .splide__arrow {
		width: 38px !important;
		height: 38px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.adp-recruit.adp-recruit .adp-card,
	.adp-recruit.adp-recruit .adp-hero__btn,
	.adp-recruit.adp-recruit .adp-hero__btn-icon,
	.adp-recruit.adp-recruit .adp-slide__img,
	.adp-recruit.adp-recruit .adp-slide__frame::after,
	.adp-recruit.adp-recruit .splide__arrow,
	.adp-recruit.adp-recruit .splide__pagination__page {
		transition: none !important;
	}

	.adp-recruit.adp-recruit .adp-card:hover,
	.adp-recruit.adp-recruit .adp-hero__btn:hover,
	.adp-recruit.adp-recruit .adp-slide:hover .adp-slide__img,
	.adp-recruit.adp-recruit .adp-hero__btn:hover .adp-hero__btn-icon {
		transform: none !important;
	}
}
