/* Footer (block vo/footer). Desktop: [tên][cột link] / [pháp lý][affiliate]; mobile xếp dọc. */

.vo-footer {
	/* Chỉnh ở đây */
	--vo-footer-bg: var(--vo-bg);                       /* Nền footer */
	--vo-footer-pad: clamp(40px, 6vw, 64px);            /* Đệm trên */

	background: var(--vo-footer-bg);
	color: var(--vo-ink);
	font-size: var(--vo-fs-sm);
	line-height: 1.6;
}

.vo-footer__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "brand" "cols" "disc" "legal";
	gap: var(--vo-space-6);
	max-width: var(--vo-wrap);
	margin-inline: auto;
	padding: var(--vo-footer-pad) var(--vo-gutter) calc(var(--vo-space-6) + env(safe-area-inset-bottom, 0px)) var(--vo-gutter);
}

.vo-footer p { margin: 0; }
.vo-footer ul { margin: 0; padding: 0; list-style: none; }
.vo-footer a { color: inherit; text-decoration: none; }
@media (hover: hover) {
	.vo-footer a:hover { text-decoration: underline; text-underline-offset: 3px; }
}

.vo-footer__brand { grid-area: brand; }   /* không giới hạn bề rộng: ở desktop cột đã tự giới hạn, dưới 981px chữ chạy hết dòng như các khối khác (cùng lý do .vo-footer__disclosure) */
.vo-footer__head { display: flex; align-items: center; gap: var(--vo-space-3); margin-bottom: var(--vo-space-3); }   /* logo cạnh tên, cùng 1 hàng */
.vo-footer .vo-logo { display: block; flex: none; }
.vo-footer .vo-logo img { display: block; width: auto; height: 40px; }
.vo-footer .vo-footer__name { margin: 0; font-size: var(--vo-fs-md); font-weight: 700; line-height: 1.1; }   /* line-height thấp như tiêu đề cột bên phải: dòng 1.6 của footer đẩy chữ tên thấp hơn tiêu đề cột ~3px */
.vo-footer__tagline { color: var(--vo-muted); }
.vo-footer .vo-footer__byline { margin-top: var(--vo-space-3); color: var(--vo-muted); font-size: var(--vo-fs-xs); }

.vo-footer__cols {
	grid-area: cols;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--vo-space-6) var(--vo-space-5);
}
.vo-footer__title {
	margin: 0 0 var(--vo-space-3);
	color: var(--vo-ink);
	font-size: var(--vo-fs-sm);
	font-weight: 700;
	letter-spacing: normal;
}
.vo-footer__col li + li { margin-top: var(--vo-space-2); }

.vo-footer__legal { grid-area: legal; }
.vo-footer__legal > ul { display: flex; flex-wrap: wrap; gap: var(--vo-space-1) var(--vo-space-5); margin-bottom: var(--vo-space-2); }
.vo-footer__legal > ul a { font-weight: 650; text-underline-offset: 3px; }   /* con trực tiếp: không đè lên danh sách chọn ngôn ngữ bên trong */
.vo-footer__copy { color: var(--vo-muted); font-size: var(--vo-fs-xs); }

/* Chọn ngôn ngữ (render.php, view.js): nằm trên dòng affiliate ở góc dưới phải. Bảng thả LÊN như menu tài khoản (account.css): cùng bo góc, bóng, mờ + trượt;
   vuốt / cuộn trang thì tắt. Desktop 3 cột, điện thoại / tablet rộng hết khung footer, 2 cột. */
.vo-langpick { position: relative; display: inline-block; margin-top: var(--vo-space-4); }
.vo-langpick__btn {
	display: inline-flex;
	align-items: center;
	gap: var(--vo-space-2);
	min-height: var(--vo-btn);
	padding: 0 var(--vo-space-4);
	border: 1px solid var(--vo-divider);
	border-radius: var(--vo-radius-pill);
	background: none;
	color: inherit;
	font: inherit;
	font-weight: 650;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
@media (hover: hover) { .vo-langpick__btn:hover { background: var(--vo-hover); } }
.vo-langpick__caret { transition: transform var(--vo-dur-fast) var(--vo-ease); }
.vo-langpick.is-open .vo-langpick__caret { transform: rotate(180deg); }
.vo-footer .vo-langpick__list {
	position: absolute;
	bottom: calc(100% + var(--vo-space-2));
	left: 0;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(3, max-content);
	gap: 0 var(--vo-space-2);
	max-height: var(--_room, 70vh);
	overflow-y: auto;
	padding: var(--vo-space-2);   /* .vo-footer ul { padding: 0 } (0,1,1) thắng luật 1 class: phải có .vo-footer */
	border-radius: var(--vo-radius-md);
	background: var(--vo-surface);
	box-shadow: 0 0 12px rgba(0,0,0,.12), var(--vo-shadow-mega);   /* vo-allow: cùng bóng menu tài khoản (--vo-acc-menu-shadow) */
	visibility: hidden;
	opacity: 0;
	transform: translateY(var(--vo-space-2));
	transition: opacity var(--vo-dur-fast) ease, transform var(--vo-dur) var(--vo-ease), visibility 0s linear var(--vo-dur);
}
.vo-langpick.is-open .vo-langpick__list { visibility: visible; opacity: 1; transform: none; transition: opacity var(--vo-dur-fast) ease, transform var(--vo-dur) var(--vo-ease), visibility 0s; }
@media (max-width: 980px) {
	.vo-langpick { display: block; }
	.vo-footer .vo-langpick__list { right: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vo-langpick__item { white-space: normal; }
}
.vo-langpick__item {
	display: flex;
	align-items: center;
	gap: var(--vo-space-3);
	min-height: var(--vo-btn);
	padding: 0 var(--vo-space-3);
	border-radius: var(--vo-radius-sm);
	font-weight: 650;
	white-space: nowrap;
}
@media (hover: hover) { .vo-footer a.vo-langpick__item:hover { background: var(--vo-hover); text-decoration: none; } }
.vo-langpick__label { display: grid; padding-block: var(--vo-space-2); line-height: 1.25; }
.vo-langpick__sub { color: var(--vo-muted); font-size: var(--vo-fs-xs); font-weight: 400; }
.vo-langpick__item .vo-icon { margin-left: auto; color: var(--vo-primary); }
.vo-langpick__item.is-off { color: var(--vo-muted); cursor: not-allowed; }
.vo-langpick__item small { margin-left: auto; font-size: var(--vo-fs-xs); font-weight: 400; }

.vo-footer__disc { grid-area: disc; }
.vo-footer__disc > .vo-langpick { margin: calc(var(--vo-space-4) - var(--vo-space-6)) 0 var(--vo-space-4); }   /* trên và dưới nút đều chỉ 16px: bù khe 32px của grid phía trên bằng lề âm */
.vo-footer__disclosure {
	/* không giới hạn bề rộng: câu ngắn 2 dòng, chặn 68ch làm chữ xuống dòng sớm khi cột còn trống */
	color: var(--vo-muted);
	font-size: var(--vo-fs-xs);
	text-wrap: wrap;   /* chữ đầy hết dòng mới xuống */
}
.vo-footer__disclosure strong { color: var(--vo-ink); }

@media (min-width: 600px) {
	.vo-footer__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 981px) {
	.vo-footer__inner {
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		grid-template-areas: "brand cols" "legal disc";
		gap: var(--vo-space-6) var(--vo-space-7);
		align-items: end;
	}
	.vo-footer__brand, .vo-footer__cols { align-self: start; }
}

/* Thanh cuộn của bảng ngôn ngữ: xem ghi chú ở account.css */
.vo-footer .vo-langpick__list::-webkit-scrollbar { width: var(--vo-space-2); }
.vo-footer .vo-langpick__list::-webkit-scrollbar-track { margin-block: var(--vo-radius-md); background: none; }
.vo-footer .vo-langpick__list::-webkit-scrollbar-thumb { border-radius: var(--vo-radius-pill); background: var(--vo-line); }