/**
 * utilities.css · 少量工具类（不写颜色字面量，全部引用 tokens）
 *
 * @package wig-brand
 */

/* 读屏可见、视觉隐藏（label / caption / 说明） */
.u-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* 跳过链接聚焦时把隐藏元素重新显示（配合 .wig-skip 使用） */
.u-visually-hidden-focusable:focus,
.u-visually-hidden-focusable:focus-within {
	position: static !important;
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip: auto;
	clip-path: none;
	white-space: normal;
}

.u-hidden {
	display: none !important;
}

.u-block {
	display: block;
}

.u-flex {
	display: flex;
}

.u-flex-between {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.u-flex-col {
	display: flex;
	flex-direction: column;
}

.u-wrap {
	flex-wrap: wrap;
}

.u-gap-2 {
	gap: var(--space-2);
}

.u-gap-3 {
	gap: var(--space-3);
}

.u-gap-4 {
	gap: var(--space-4);
}

.u-mt-2 {
	margin-top: var(--space-2);
}

.u-mt-3 {
	margin-top: var(--space-3);
}

.u-mt-4 {
	margin-top: var(--space-4);
}

.u-mt-5 {
	margin-top: var(--space-5);
}

.u-mt-6 {
	margin-top: var(--space-6);
}

.u-mt-8 {
	margin-top: var(--space-8);
}

.u-mb-0 {
	margin-bottom: 0;
}

.u-mb-4 {
	margin-bottom: var(--space-4);
}

.u-mb-6 {
	margin-bottom: var(--space-6);
}

.u-mb-8 {
	margin-bottom: var(--space-8);
}

.u-text-center {
	text-align: center;
}

.u-text-sm {
	font-size: var(--font-size-body-sm);
	line-height: var(--line-height-body-sm);
}

.u-color-3 {
	color: var(--color-text-3);
}

.u-full {
	width: 100%;
}

.u-nowrap {
	white-space: nowrap;
}

.u-clamp-2 {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.u-clamp-3 {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* 移动端才显示 / 桌面才显示 */
.u-md-up {
	display: none;
}

@media (min-width: 768px) {
	.u-md-up {
		display: initial;
	}

	.u-md-down {
		display: none !important;
	}
}

/* 只给键盘用的元素（如模态遮罩按钮） */
.u-focusable-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
}

/* 长串英文/URL 不撑破容器 */
.u-break {
	overflow-wrap: anywhere;
	word-break: break-word;
}