/*
 * Task GD-04 (sheet "Giao diện" dòng 9) — section "Khách hàng và đối tác"
 * ở trang chủ: tiêu đề giữa có gạch chân, dải logo trượt ngang + mũi tên
 * (kiểu nút đã dùng ở trang /san-pham, task GD-09). Mockup đã duyệt:
 * docs/mockup/gd-04/.
 */
.thp-partner__title {
	text-align: center;
	color: #233179;
	font-size: 24px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .3px;
	margin: 0 0 10px;
	padding-left: 0; /* .home-title mặc định có padding-left cho gạch vàng bên trái — không dùng ở đây */
}
.thp-partner__bar {
	display: block;
	width: 56px;
	height: 3px;
	background: #233179;
	margin: 0 auto 26px;
}
.thp-partner__wrap {
	display: flex;
	align-items: center;
	gap: 8px;
}
.thp-partner__track {
	display: flex;
	gap: 20px;
	overflow-x: auto;
	flex: 1;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding: 4px 2px;
}
.thp-partner__track::-webkit-scrollbar {
	display: none;
}
.thp-partner__item {
	flex: 0 0 calc(20% - 16px);
	min-width: 120px;
	height: 116px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid #eee;
}
.thp-partner__item a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
.thp-partner__item img {
	max-width: 80%;
	max-height: 80px;
	width: auto;
	height: auto;
	object-fit: contain;
}
.thp-partner__nav {
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid #ddd;
	background: #fff;
	color: #233179;
	cursor: pointer;
}
.thp-partner__nav:hover,
.thp-partner__nav:focus {
	background: #233179;
	color: #fff;
}

@media (max-width: 767px) {
	.thp-partner__item {
		flex: 0 0 calc(50% - 10px);
	}
}

/*
 * Phản hồi lần 3 (04/10/2026, ô I7/I9): trượt bằng transform (thp-partner.js), không cuộn khung;
 * logo không khung viền như mẫu bmbsteel, 5 logo/khung, to hơn (cao 110px).
 */
.thp-partner__wrap { position: relative; }
.thp-partner__viewport { overflow: hidden; flex: 1; min-width: 0; }
.thp-partner__track.is-js {
	overflow: visible;
	scroll-behavior: auto;
	gap: 0;
	padding: 4px 0;
	will-change: transform;
}
.thp-partner__track.is-js .thp-partner__item { flex: 0 0 20%; min-width: 0; padding: 0 12px; }
.thp-partner__item { border: 0 !important; background: transparent !important; height: 120px; }
.thp-partner__item img { max-width: 100%; max-height: 100px; transition: transform .3s ease; }
.thp-partner__item a:hover img, .thp-partner__item a:focus img { transform: scale(1.06); }
.thp-partner__nav { display: inline-block !important; background: #eee; border-color: #eee; color: #999; }
@media (max-width: 991px) { .thp-partner__track.is-js .thp-partner__item { flex-basis: 33.333%; } }
@media (max-width: 575px) { .thp-partner__track.is-js .thp-partner__item { flex-basis: 50%; } }
