/* =====================================================================
 * [partner_logos] – slider logo đối tác
 * Khung slider: destination-slider.css + featured-tours.css
 * Màu: chỉ dùng biến :root (--hg-primary, --hg-text, --hg-button, --green-natural)
 * ===================================================================== */
.pl-slider.ds-slider { --ds-cols: 6; --ds-gap: 24px; }
.pl-slider .ds-viewport { padding: 0; margin: 0; }

/* Ô logo: cùng chiều cao, logo nằm giữa – logo dài hay vuông đều thẳng hàng */
.pl-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: calc(var(--pl-h, 48px) + 32px);
	padding: 0 8px;
	text-decoration: none !important;
}
.pl-logo .pl-img {
	display: block;
	width: 100% !important;
	max-width: var(--pl-w, 140px);
	height: var(--pl-h, 48px) !important;
	margin: 0 auto;
	object-fit: contain;
	transition: transform .25s;
}
a.pl-logo:hover .pl-img { transform: scale(1.06); }

/* Chấm phân trang – giống slider Tour doanh nghiệp (thanh bo tròn, thanh đang xem màu xanh đậm) */
.pl-slider .fts-dots { gap: 8px; margin-top: 12px; }
.pl-slider .fts-dots button,
.pl-slider .fts-dots button.is-active { width: 24px; height: 8px; }
.pl-slider .fts-dots button { background: color-mix(in srgb, var(--hg-text) 20%, #fff) !important; transition: background .25s; }
.pl-slider .fts-dots button:hover { background: color-mix(in srgb, var(--hg-text) 35%, #fff) !important; }
.pl-slider .fts-dots button.is-active { background: var(--hg-primary) !important; }

/* ---------- Màn hình nhỏ hơn ---------- */
@media (max-width: 1099px) { .pl-slider.ds-slider { --ds-cols: 5; --ds-gap: 20px; } }
@media (max-width: 849px)  { .pl-slider.ds-slider { --ds-cols: 4; --ds-gap: 16px; } }
@media (max-width: 549px)  {
	.pl-slider.ds-slider { --ds-cols: 3; --ds-gap: 12px; }
	.pl-slider { --pl-h: 36px !important; }
}
