/* Shared HCM detail hub styles. */
/* Shared Team/National hub styles previously in hub-base.css. */
/* Shared Team/National hub styles extracted from page-team.php and page-national.php. */
.hcm-team-hub .md-filter-select {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.hcm-team-hub .md-filter-select:hover {
	border-color: var(--hcm-divider, #e5e7eb) !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.hcm-team-hub .md-filter-select:focus {
	outline: none;
	border-color: #3b82f6 !important;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}
.hcm-team-hub .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --- 高级自定义下拉菜单 (FotMob 级质感重塑) --- */
/* 1. 恢复纯白卡片底色，与背景拉开高级反差 */
.hcm-team-hub .md-stats-toolbar {
	background: var(--card-bg) !important; /* 使用系统统一的纯白卡片底色 */
	border-radius: var(--radius); /* 统一的 12px 圆角 */
	box-shadow: var(--card-shadow); /* 统一的高级弥散阴影 */
	padding: 16px 20px !important; /* 恢复舒适的卡片内边距 */
	margin-bottom: var(--hcm-layout-gap);
	display: flex;
	align-items: center;
	position: relative;
	z-index: 50;
	width: 100%;
}

/* 2. 解除容器宽度的强行限制，让它随文字自然收缩 */
.hcm-team-hub .hcm-custom-select {
	position: relative;
	display: inline-block;
	width: auto;
	min-width: 0 !important; /* 彻底解除之前 240px 的限制 */
	font-family: inherit;
}

/* 3. 剔除一切按钮伪装，让文字和箭头无缝贴合在白卡片上 */
.hcm-team-hub .hcm-custom-select-trigger {
	background: transparent !important; /* 彻底透明 */
	border: none !important; /* 无边框 */
	box-shadow: none !important; /* 无阴影 */
	padding: 0 !important; /* 无内边距，完全靠外层的白卡片撑起空间 */
	display: flex;
	align-items: center;
	gap: 6px; /* 让箭头紧紧贴在文字旁边！ */
	cursor: pointer;
	font-size: 15px;
	font-weight: 700;
	color: var(--text);
	outline: none !important;
	transition: opacity 0.2s ease;
	width: auto !important; /* 强制覆盖掉底部的 100% 规则 */
}

/* 4. 悬浮时只需文字变淡，禁止出现任何色块 */
.hcm-team-hub .hcm-custom-select-trigger:hover {
	background: transparent !important;
	opacity: 0.6;
	border-color: transparent !important;
}

/* 5. 展开时禁止出现原生光圈或阴影 */
.hcm-team-hub .hcm-custom-select.active .hcm-custom-select-trigger {
	border: none !important;
	box-shadow: none !important;
	outline: none !important;
}
.hcm-team-hub .hcm-custom-select-trigger:focus {
	outline: none !important;
}
.hcm-team-hub .hcm-custom-select-trigger:focus-visible,
.hcm-team-hub .hcm-custom-select__trigger:focus-visible {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(31, 185, 99, 0.15) !important;
	border-radius: inherit;
}
/* 箭头翻转动画 */
.hcm-team-hub .hcm-custom-select-trigger svg {
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	opacity: 0.5;
}
.hcm-team-hub .hcm-custom-select.active .hcm-custom-select-trigger svg {
	transform: rotate(180deg); /* 展开时箭头平滑朝上 */
}
.hcm-team-hub .hcm-custom-select-value {
	display: flex;
	align-items: center;
	gap: 10px;
}
.hcm-team-hub .hcm-custom-select-value img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}
.hcm-team-hub .hcm-custom-select-menu {
	position: absolute;
	top: calc(100% + 8px); /* 距离胶囊按钮更近一点，跨过外面灰色通栏区域 */
	left: 0;
	min-width: 280px; /* 保证弹出的菜单有足够的宽度 */
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.04);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
	border-radius: 12px;
	padding: 8px 0;
	max-height: 280px; /* 锁死最大高度，强制触发滚动条 */
	overflow-y: auto;
	display: none;
	transform-origin: top center;
	z-index: 100; /* 确保悬浮在最上层 */
}
/* 极致细节：接管系统滚动条，打造 App 级悬浮胶囊体验 */
.hcm-team-hub .hcm-custom-select-menu::-webkit-scrollbar {
	width: 6px; /* 纤细的滚动条 */
}
.hcm-team-hub .hcm-custom-select-menu::-webkit-scrollbar-track {
	background: transparent;
	margin: 8px 0; /* 上下留出呼吸距，不贴边 */
}
.hcm-team-hub .hcm-custom-select-menu::-webkit-scrollbar-thumb {
	background: #d1d5db; /* 柔和的灰色 */
	border-radius: 10px;
}
.hcm-team-hub .hcm-custom-select-menu::-webkit-scrollbar-thumb:hover {
	background: #9ca3af;
}
.hcm-team-hub .hcm-custom-select.active .hcm-custom-select-menu {
	display: block;
	animation: hcm-stats-dd-slide-down 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
/* 选项列表去线化，重塑悬浮态 */
.hcm-team-hub .hcm-custom-select-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500; /* 列表字体偏细，制造层级感 */
	color: var(--text);
	border-bottom: none !important; /* 彻底干掉丑陋的分割线 */
	background: transparent;
	transition: background-color 0.2s;
	width: 100%;
	text-align: left;
}
.hcm-team-hub .hcm-custom-select-item:hover,
.hcm-team-hub .hcm-custom-select-item.selected {
	background: #f4f5f7 !important; /* 更柔和的列表反馈灰 */
}
.hcm-team-hub .hcm-custom-select-item img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}
@keyframes hcm-stats-dd-slide-down {
	from { opacity: 0; transform: scaleY(0.95); }
	to { opacity: 1; transform: scaleY(1); }
}
/* Native <button> 归一化（结构不变，剥离浏览器默认边框/外观） */
.hcm-team-hub button.hcm-custom-select-trigger,
.hcm-team-hub button.hcm-custom-select-item {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin: 0;
	font: inherit;
}
.hcm-team-hub button.hcm-custom-select-trigger {
	width: auto !important;
	box-sizing: border-box;
	text-align: left;
}
.hcm-team-hub button.hcm-custom-select-item {
	border: none;
	border-radius: 0;
}

.hcm-team-hub {
	--text: #111;
	--text-color: #111;
	--text-muted: #6b7280;
	--border: #e5e7eb;
	--border-color: #e5e7eb;
	--card-bg: #fff;
	--card-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
	--radius: 12px;
	--gap: var(--hcm-layout-gap);
	--form-win: #10b981;
	--form-draw: #9ca3af;
	--form-loss: #ef4444;
	--pitch: #12a35a;
	--pitch-deep: #0a6e44;
	--chart-bg-soft: #f8f9fa;
	/* 浅灰胶囊（非第一名）：与文字对比，忌用继承的 --text 作字色 */
	--stat-pill-bg: #f3f4f6;
	--stat-pill-fg: #111827;
	--stat-pill-lead-bg: #e11d48;
	--stat-pill-lead-fg: #ffffff;
	/* 版心由 style.css @media (min-width: 993px) 统一为 1350px */
	width: 100%;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
	padding: 0 16px 40px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--text);
	box-sizing: border-box;
}
.hcm-team-hub *, .hcm-team-hub *::before, .hcm-team-hub *::after { box-sizing: border-box; }

/* Hub 地板：壳层 padding-bottom 40px + 页脚 margin-top 64px = 104px */
.hcm-team-hub .team-tab-container,
.hcm-team-hub .home-main-grid,
.hcm-team-hub .hcm-overview-layout,
.hcm-team-hub .hcm-grid-layout,
.hcm-team-hub .hcm-league-split {
	margin-bottom: 0;
}

.hcm-team-hub .hcm-card {
	background: var(--card-bg);
	border-radius: var(--radius);
	box-shadow: var(--card-shadow);
	padding: 18px 20px;
	margin-bottom: var(--gap);
}
.hcm-team-hub .hcm-card:last-child { margin-bottom: 0; }
.hcm-team-hub .hcm-card__title {
	margin: 0 0 14px;
	font-size: 1rem;
	font-weight: 700;
}

/* --- 双栏：赛程 Tab 等复用 --- */
.hcm-team-hub .hcm-grid-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: var(--gap);
	align-items: start;
}
@media (max-width: 960px) {
	.hcm-team-hub .hcm-grid-layout {
		grid-template-columns: 1fr;
	}
}
.hcm-team-hub .hcm-layout-main,
.hcm-team-hub .hcm-layout-side {
	min-width: 0;
}

/* --- Trận đấu: 赛程列表 (左侧) --- */
.hcm-team-hub .md-match-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
	margin-bottom: 12px;
}
.hcm-team-hub .md-match-header-btn {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: none;
	background: var(--stat-pill-bg, #f9fafb);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-muted);
	transition: opacity 0.2s, background-color 0.2s;
}

.hcm-team-hub .md-match-header-btn:focus {
	outline: none !important;
	box-shadow: none !important;
}

.hcm-team-hub .md-match-header-btn:hover:not(:disabled):not(.is-disabled),
.hcm-team-hub .md-match-header-btn:focus:hover:not(:disabled):not(.is-disabled) {
	opacity: 0.7;
}

.hcm-team-hub .md-match-header-btn:focus:not(:focus-visible):not(:hover) {
	background: var(--stat-pill-bg, #f9fafb) !important;
	color: var(--text-muted) !important;
}

.hcm-team-hub .md-match-header-btn:focus-visible {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(31, 185, 99, 0.15) !important;
}

.hcm-team-hub .md-match-header-btn:disabled,
.hcm-team-hub .md-match-header-btn.is-disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.hcm-team-hub .md-match-header-btn:disabled:focus:not(:focus-visible):not(:hover),
.hcm-team-hub .md-match-header-btn.is-disabled:focus:not(:focus-visible):not(:hover) {
	background: var(--stat-pill-bg, #f9fafb) !important;
}
.hcm-team-hub .md-match-header-title {
	font-weight: 700;
	font-size: 15px;
	margin: 0;
}
.hcm-team-hub .md-match-row {
	display: flex;
	align-items: center;
	padding: 16px 0;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
	font-size: 13px;
}
.hcm-team-hub .md-match-row:last-child {
	border-bottom: none;
}

/* Shared rule-level styles duplicated across hub detail pages. */
.hcm-team-hub .hcm-league-stat-badge {
	display: inline-block;
	border-radius: 12px;
	padding: 4px 10px;
	font-weight: 700;
	font-size: 13px;
	min-width: 44px;
	text-align: center;
	white-space: nowrap;
	flex-shrink: 0;
	background: var(--stat-pill-bg);
	color: var(--stat-pill-fg);
}

.hcm-team-hub .hcm-league-stat-badge--lead {
	background-color: var(--stat-pill-lead-bg, #e11d48) !important;
	color: var(--stat-pill-lead-fg, #ffffff) !important;
}

/* ----- 头部：队徽 + 操作 + Tab ----- */
.team-header-card {
	background: var(--card-bg);
	border-radius: var(--radius);
	box-shadow: var(--card-shadow);
	overflow: visible;
	margin-bottom: var(--gap);
}

.team-header-card__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--hcm-layout-gap);
	padding: 20px 22px;
}

.team-header-card__brand {
	display: flex;
	align-items: center;
	gap: var(--hcm-layout-gap);
	min-width: 0;
}

.team-header-card__logo {
	width: 64px;
	height: 64px;
	object-fit: contain;
	flex-shrink: 0;
}

.team-header-card__titles h1 {
	margin: 0;
	font-size: clamp(1.25rem, 3vw, 1.65rem);
	font-weight: 700;
	line-height: 1.15;
}

.team-header-card__country {
	margin: 4px 0 0;
	font-size: 0.875rem;
	color: var(--text-muted);
}

.team-tabs {
	display: flex;
	flex-wrap: nowrap;
	gap: 25px;
	padding: 0 16px 0 22px;
	border-top: 1px solid var(--hcm-divider, #e5e7eb);
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.team-tabs::-webkit-scrollbar {
	display: none;
}

.team-tabs__item {
	display: inline-block;
	flex-shrink: 0;
	padding: 12px 0;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--text-muted);
	white-space: nowrap;
	border: none;
	background: none;
	font-family: inherit;
	cursor: pointer;
	text-decoration: none;
	position: relative;
	transition: color 0.2s;
}

.team-tabs a.team-tabs__item { color: var(--text-muted); }

.team-tabs__item--active {
	color: var(--text);
}

.team-tabs a.team-tabs__item--active { color: var(--text); }

.team-tabs__item--active::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: var(--text);
	border-radius: 3px 3px 0 0;
	pointer-events: none;
}

.team-tabs__item:hover {
	color: var(--text);
}

.team-tabs a.team-tabs__item:hover { color: var(--text); }

.team-tabs a:focus-visible,
.team-tabs .team-tabs__item:focus-visible {
	outline: none !important;
	box-shadow: inset 0 -3px 0 #1fb963 !important;
}

.hcm-team-hub .team-tab-placeholder {
	margin: 0;
	text-align: center;
	color: var(--text-muted);
	padding: 40px;
}

.hcm-team-hub .hcm-card--md-bxh .md-table-wrap {
	margin: 0;
	padding: 0 0 20px;
}

.hcm-team-hub .md-table-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.hcm-team-hub .md-table-wrap::-webkit-scrollbar {
	display: none;
}

.hcm-team-hub .md-table-filters {
	display: flex;
	gap: 10px;
	margin-bottom: 0;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.hcm-team-hub .md-table-filters::-webkit-scrollbar {
	display: none;
}

.hcm-team-hub .md-filter-pill {
	font: inherit;
	background-color: transparent;
	border: 1px solid rgba(128, 128, 128, 0.2);
	color: var(--hcm-text-main, #0f172a);
	padding: 6px 16px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
	transition: all 0.2s;
	flex-shrink: 0;
}

.hcm-team-hub .md-filter-pill:hover {
	background-color: rgba(128, 128, 128, 0.05);
}

.hcm-team-hub .md-filter-pill.active {
	background-color: var(--hcm-text-main, #0f172a);
	color: var(--hcm-bg-card, #fff);
	border-color: var(--hcm-text-main, #0f172a);
}

@media (hover: hover) and (pointer: fine) {
	.hcm-team-hub .md-filter-pill:focus:not(.active) {
		background-color: transparent;
		color: var(--hcm-text-main, #0f172a);
		border-color: rgba(128, 128, 128, 0.2);
		outline: none;
	}

	.hcm-team-hub .md-filter-pill.active:focus {
		background-color: var(--hcm-text-main, #0f172a);
		color: var(--hcm-bg-card, #fff);
		border-color: var(--hcm-text-main, #0f172a);
		outline: none;
	}

	.hcm-team-hub .md-transfer-filter-btn:focus:not(.active) {
		background-color: #fff;
		color: var(--text);
		border-color: var(--hcm-divider, #e5e7eb);
		outline: none;
	}

	.hcm-team-hub .md-transfer-filter-btn.active:focus {
		background-color: #111;
		color: #fff;
		border-color: #111;
		outline: none;
	}
}

.hcm-team-hub .md-filter-pill:focus-visible,
.hcm-team-hub .md-transfer-filter-btn:focus-visible,
.hcm-team-hub .fixture-sub-tab:focus-visible {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(31, 185, 99, 0.15) !important;
}

.hcm-team-hub .md-data-table td {
	padding: 8px 4px;
	border-bottom: none;
	border-left: none !important;
	border-right: none !important;
	color: var(--hcm-text-main, #0f172a);
	vertical-align: middle;
	white-space: nowrap;
}

.hcm-team-hub .md-data-table .t-left {
	text-align: left;
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 500;
}

.hcm-team-hub .md-data-table .t-left img {
	width: 18px !important;
	height: 18px !important;
	min-width: 18px;
	object-fit: contain;
	flex-shrink: 0;
	display: block;
}

.hcm-team-hub .md-data-table tbody tr.highlight-row,
.hcm-team-hub .md-bxh-table tr.highlight-row {
	background-color: var(--hcm-bg-subtle, #eeeeee) !important;
}

.hcm-team-hub .md-data-table tbody tr.highlight-row td {
	font-weight: 600;
}

.hcm-team-hub .md-data-table tbody tr:hover {
	background-color: rgba(128, 128, 128, 0.06);
}

.hcm-team-hub .md-data-table tbody tr {
	height: 38px;
}

.hcm-team-hub .md-bxh-table th {
	padding: 12px 8px 16px;
}

.hcm-team-hub .md-bxh-table td {
	padding: 8px 4px;
}

.hcm-team-hub .md-bxh-table .col-rank {
	text-align: center;
	position: relative;
	padding-left: 12px;
}

.hcm-team-hub .col-rank.zone-cl::before,
.hcm-team-hub .col-rank.zone-el::before,
.hcm-team-hub .col-rank.zone-ecl::before,
.hcm-team-hub .col-rank.zone-relegation::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 18px;
	border-radius: 0 2px 2px 0;
}

.hcm-team-hub .zone-cl::before { background-color: #10b981; }

.hcm-team-hub .zone-el::before { background-color: #2563eb; }

.hcm-team-hub .zone-ecl::before { background-color: #0ea5e9; }

.hcm-team-hub .zone-relegation::before { background-color: #ef4444; }

.hcm-team-hub .md-bxh-table .col-points {
	font-weight: 700;
	color: var(--hcm-text-main, #0f172a);
}

.hcm-team-hub .md-team-name-bold {
	font-weight: 600;
}

.hcm-team-hub .col-form {
	display: flex;
	gap: 6px;
	justify-content: center;
	align-items: center;
	min-width: 100px;
}

.hcm-team-hub .md-form-block {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
	position: relative;
}

.hcm-team-hub .form-t { background-color: #10b981; }

.hcm-team-hub .form-h { background-color: #9ca3af; }

.hcm-team-hub .form-b { background-color: #ef4444; }

/* 每一行状态列最后一个圆圈（最新一场）底部横线 */
.hcm-team-hub .md-form-block:last-child::after {
	content: "";
	position: absolute;
	bottom: -6px;
	left: 50%;
	transform: translateX(-50%);
	width: 14px;
	height: 3px;
	border-radius: 2px;
}

.hcm-team-hub .form-t:last-child::after {
	background-color: #10b981;
}

.hcm-team-hub .form-h:last-child::after {
	background-color: #9ca3af;
}

.hcm-team-hub .form-b:last-child::after {
	background-color: #ef4444;
}

/* 球员统计 Tab：统计卡片区网格（不依赖内联 display；空分类用 .hcm-stats-category--hidden） */
.hcm-team-hub .js-stats-section,
.hcm-team-hub .md-stats-cards-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	gap: var(--hcm-layout-gap);
	align-items: start;
}

.hcm-team-hub #pane-thong-ke-cau-thu .hcm-stats-category--hidden {
	display: none !important;
}

.hcm-team-hub #pane-thong-ke-cau-thu .js-stats-section--lead,
.hcm-team-hub #pane-thong-ke-doi .js-stats-section--lead {
	margin-bottom: 32px;
}

/* 暗黑：统一列表 / 表格 / 内联分割线为高级深灰 */
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub tr,
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub td,
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub th,
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub hr,
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub .hcm-card > div,
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub a[style*="border-bottom"],
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub div[style*="border-bottom"],
:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark) .hcm-team-hub div[style*="border-top"] {
	border-color: var(--border-color, #38383a) !important;
}

.hcm-team-hub #pane-tran-dau .hcm-layout-main > .hcm-card {
	overflow: hidden;
}

.hcm-team-hub #pane-tran-dau .md-match-list-body {
	padding: 10px 20px 4px;
	border-radius: 0 0 var(--radius) var(--radius);
	overflow: hidden;
	background: var(--card-bg);
}

.hcm-team-hub #pane-tran-dau .js-match-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 0;
	border-bottom: 1px solid var(--border, var(--hcm-divider, #e5e7eb));
	font-size: 13px;
	box-sizing: border-box;
	height: 52px;
	overflow: hidden;
	flex-shrink: 0;
}

.hcm-team-hub #pane-tran-dau .js-match-item__date {
	flex: 1;
	min-width: 0;
	color: var(--text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hcm-team-hub #pane-tran-dau .js-match-item__center {
	flex: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-width: 0;
}

.hcm-team-hub #pane-tran-dau .js-match-item__team {
	flex: 1;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hcm-team-hub #pane-tran-dau .js-match-item__team--home {
	text-align: right;
}

.hcm-team-hub #pane-tran-dau .js-match-item__team--away {
	text-align: left;
}

.hcm-team-hub #pane-tran-dau .js-match-item__score {
	min-width: 50px;
	text-align: center;
	flex-shrink: 0;
}

.hcm-team-hub #pane-tran-dau .md-match-item-league {
	flex: 1;
	min-width: 0;
	max-width: 38%;
	text-align: right;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	color: var(--text-muted);
	font-size: 12px;
	overflow: hidden;
}

.hcm-team-hub #pane-tran-dau .md-match-item-league__name {
	line-height: 1.2;
	overflow: hidden;
	word-break: break-word;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

.hcm-team-hub #pane-tran-dau .md-match-item-league img {
	flex-shrink: 0;
	width: 14px;
	height: 14px;
	object-fit: contain;
}

.hcm-team-hub #pane-tran-dau .js-match-item.is-last-visible {
	border-bottom: none !important;
	padding-bottom: 20px;
	height: 58px;
}

/* Trận đấu Tab · 移动端：对齐 Tổng quan 侧栏赛程（日期左上、联赛右上、对阵下行） */
@media (max-width: 992px) {
	.hcm-team-hub #pane-tran-dau .js-match-item {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		grid-template-rows: auto auto;
		align-items: start;
		row-gap: 10px;
		height: auto;
		min-height: 0;
		overflow: visible;
	}

	.hcm-team-hub #pane-tran-dau .js-match-item__date {
		grid-column: 1;
		grid-row: 1;
		flex: none;
		font-size: 12px;
		color: var(--text-muted);
		white-space: normal;
		overflow: visible;
		text-overflow: unset;
	}

	.hcm-team-hub #pane-tran-dau .md-match-item-league {
		grid-column: 2;
		grid-row: 1;
		flex: none;
		max-width: none;
		justify-self: end;
		align-self: start;
		font-size: 12px;
	}

	.hcm-team-hub #pane-tran-dau .md-match-item-league__name {
		-webkit-line-clamp: unset;
		line-clamp: unset;
		display: inline;
		overflow: visible;
		word-break: normal;
	}

	.hcm-team-hub #pane-tran-dau .js-match-item__center {
		grid-column: 1 / -1;
		grid-row: 2;
		flex: none;
		width: 100%;
		gap: 8px;
	}

	.hcm-team-hub #pane-tran-dau .js-match-item__team {
		flex: 1;
		min-width: 0;
		font-size: 13px;
		font-weight: 500;
		white-space: normal;
		word-break: break-word;
		overflow: visible;
		text-overflow: unset;
		line-height: 1.2;
	}

	.hcm-team-hub #pane-tran-dau .js-match-item__center > img {
		width: 20px;
		height: 20px;
		flex-shrink: 0;
		object-fit: contain;
	}

	.hcm-team-hub #pane-tran-dau .js-match-item__score {
		min-width: 40px;
		flex-shrink: 0;
	}

	.hcm-team-hub #pane-tran-dau .js-match-item.is-last-visible {
		height: auto;
		padding-bottom: 18px;
	}
}

.hcm-team-hub .md-match-league {
	width: 140px;
	color: var(--text-muted);
	text-align: right;
	flex-shrink: 0;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hcm-team-hub .md-match-league img {
	width: 16px;
	height: 16px;
	object-fit: contain;
}

.hcm-team-hub .md-match-center {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-width: 0;
}

.hcm-team-hub .md-match-team {
	width: 130px;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hcm-team-hub .md-match-team.t-right {
	justify-content: flex-end;
	text-align: right;
}

.hcm-team-hub .md-match-team.t-left {
	justify-content: flex-start;
	text-align: left;
}

.hcm-team-hub .md-match-team img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}

.hcm-team-hub .md-match-score {
	padding: 4px 10px;
	border-radius: 6px;
	font-weight: 700;
	font-size: 13px;
	color: #fff;
	min-width: 48px;
	text-align: center;
}

.hcm-team-hub .md-match-score.s-loss {
	background: var(--form-loss);
}

.hcm-team-hub .md-match-score.s-draw {
	background: var(--form-draw);
}

.hcm-team-hub .md-match-score.s-win {
	background: var(--form-win);
}

.hcm-team-hub .md-match-score.s-future {
	background: transparent;
	color: var(--text);
	font-weight: 600;
}

/* --- Trận đấu: 右侧统计对比 --- */
.hcm-team-hub .md-stat-divider {
	height: 1px;
	background: #f3f4f6;
	margin: 20px 0;
}

.hcm-team-hub .md-stat-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
	font-size: 13px;
}

.hcm-team-hub .md-stat-row:last-child {
	margin-bottom: 0;
}

.hcm-team-hub .md-stat-label {
	color: var(--text-muted);
	font-weight: 500;
	flex: 1;
	text-align: center;
}

.hcm-team-hub .md-stat-val-left {
	background: #c8102e;
	color: #fff;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 12px;
	font-size: 12px;
	min-width: 32px;
	text-align: center;
}

.hcm-team-hub .md-stat-val-right {
	font-weight: 700;
	font-size: 13px;
	min-width: 32px;
	text-align: right;
}

.hcm-team-hub .md-tran-dau-kickoff {
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: center;
	margin-top: 16px;
}

.hcm-team-hub .md-tran-dau-kickoff__crest img {
	width: 36px;
	height: 36px;
	object-fit: contain;
}

.hcm-team-hub .md-tran-dau-kickoff__name {
	font-size: 12px;
	margin-top: 6px;
}

.hcm-team-hub .md-tran-dau-kickoff__time {
	font-weight: 800;
	font-size: 18px;
}

.hcm-team-hub .md-tran-dau-kickoff__date {
	font-size: 12px;
	color: var(--text-muted);
	margin-top: 4px;
}

.hcm-team-hub .md-tran-dau-sidebar .hcm-card__title {
	font-size: 14px;
	margin: 0;
}

.hcm-team-hub .md-tran-dau-sidebar .team-next__league {
	font-size: 12px;
}

.hcm-team-hub .md-tran-dau-sidebar .team-next__league img {
	width: 16px;
	height: 16px;
}

/* --- Đội hình: 阵容全宽表格 --- */
#pane-doi-hinh .hcm-card {
	border-radius: var(--radius);
	overflow: hidden;
	padding: 0;
}

#pane-doi-hinh .md-squad-table {
	border-collapse: separate;
	border-spacing: 0;
}

#pane-doi-hinh .md-squad-table tbody tr:last-child td {
	border-bottom: none;
	background: var(--card-bg);
}

#pane-doi-hinh .md-squad-table tbody tr:last-child td:first-child {
	border-bottom-left-radius: var(--radius);
}

#pane-doi-hinh .md-squad-table tbody tr:last-child td:last-child {
	border-bottom-right-radius: var(--radius);
}

#pane-doi-hinh .md-squad-table tbody tr:last-child:hover td {
	background: #f9fafb;
}

html.dark-mode .hcm-team-hub #pane-doi-hinh .md-squad-table tbody tr:last-child:hover td {
	background: rgba(255, 255, 255, 0.06);
}

#pane-doi-hinh .md-squad-wrap,
.hcm-team-hub .md-squad-wrap {
	width: 100%;
	border-radius: 0 0 var(--radius) var(--radius);
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.hcm-team-hub .md-squad-wrap::-webkit-scrollbar {
	display: none;
}

.hcm-team-hub .md-squad-table {
	width: 100%;
	min-width: 800px;
	border-collapse: collapse;
	font-size: 13px;
	text-align: center;
}

.hcm-team-hub .md-squad-table th {
	color: var(--text-muted);
	font-weight: 500;
	padding: 16px 8px;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
	white-space: nowrap;
	border-left: none !important;
	border-right: none !important;
}

/* 阵容表头排序交互样式 (胶囊悬浮 + 双向箭头) */
.hcm-team-hub .sortable-header {
	cursor: pointer;
	user-select: none;
}

.hcm-team-hub .md-squad-table th.col-player {
	padding-left: 8px; /* 减去胶囊的内边距，保持视觉对齐 */
}

.hcm-team-hub .sort-label {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	border-radius: 20px;
	transition: background-color 0.2s, color 0.2s;
}

.hcm-team-hub .sortable-header:hover .sort-label,
.hcm-team-hub .sortable-header.active .sort-label {
	background-color: #f3f4f6; /* FotMob 同款浅灰胶囊底色 */
	color: var(--text);
}

.hcm-team-hub .sort-icon {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 6px;
	fill: currentColor;
	opacity: 0.3; /* 默认半透明 */
	transition: opacity 0.2s;
}

.hcm-team-hub .sortable-header:hover .sort-icon,
.hcm-team-hub .sortable-header.active .sort-icon {
	opacity: 1; /* 激活或悬浮时箭头亮起 */
}

.hcm-team-hub .sort-icon .sort-up,
.hcm-team-hub .sort-icon .sort-down {
	transition: opacity 0.2s;
}

/* 升序时上面黑下面灰，降序时下面黑上面灰 */
.hcm-team-hub .sortable-header.active.asc .sort-down { opacity: 0.2; }

.hcm-team-hub .sortable-header.active.desc .sort-up { opacity: 0.2; }

.hcm-team-hub .md-squad-table td {
	padding: 14px 8px;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
	color: var(--text);
	vertical-align: middle;
	border-left: none !important;
	border-right: none !important;
}

.hcm-team-hub .md-squad-table tbody tr:hover {
	background-color: #f9fafb;
}

.hcm-team-hub .md-squad-table th.col-player,
.hcm-team-hub .md-squad-table td.col-player {
	text-align: left;
}

.hcm-team-hub .md-squad-table td.col-player {
	padding-left: 20px;
}

.hcm-team-hub .md-player-cell {
	display: flex;
	align-items: center;
	gap: 14px;
}

/* 球衣号码胶囊：勿继承单元格 var(--text)，否则黑夜下浅字+浅底不可读 */
.hcm-team-hub .md-squad-num-badge {
	display: inline-block;
	min-width: 28px;
	text-align: center;
	border-radius: 6px;
	padding: 2px 6px;
	font-weight: 600;
	background: var(--stat-pill-bg);
	color: var(--stat-pill-fg);
}

.hcm-team-hub .md-player-avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
	background: #f3f4f6;
}

.hcm-team-hub .md-player-info {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.hcm-team-hub .md-player-name {
	font-weight: 600;
	font-size: 14px;
}

.hcm-team-hub .md-player-status {
	font-size: 12px;
	color: var(--text-muted);
	display: flex;
	align-items: center;
	gap: 4px;
}

.hcm-team-hub .md-icon-cross {
	color: #ef4444;
	font-weight: 800;
	font-size: 12px;
	background: #fee2e2;
	width: 14px;
	height: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
}

.hcm-team-hub .md-country-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.hcm-team-hub .md-country-flag {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	object-fit: cover;
}

/* --- Thống kê cầu thủ: 球员统计分类 --- */
.hcm-team-hub .md-stats-filter {
	padding: 16px 20px;
	background: var(--card-bg);
	border-radius: var(--radius);
	margin-bottom: 32px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	box-shadow: var(--card-shadow);
}

.hcm-team-hub .md-stats-section-title {
	font-size: 1.125rem;
	font-weight: 700;
	margin: 0 0 16px 0;
}

.hcm-team-hub .md-stats-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--gap);
	margin-bottom: 32px;
}

/* Tổng quan 左栏三卡：间距仅由 .home-left-col gap 承担，避免与 style.css / 本文件 margin 叠加 */
.hcm-team-hub .home-left-col > .md-stats-grid {
	margin-top: 0;
	margin-bottom: 0;
}

.hcm-team-hub .md-stat-mini-card {
	background: var(--card-bg);
	border-radius: var(--radius);
	padding: 18px 20px;
	box-shadow: var(--card-shadow);
}

.hcm-team-hub .md-stat-mini-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: 600;
	font-size: 14px;
	margin-bottom: var(--hcm-layout-gap);
	color: var(--text);
	cursor: pointer;
}

.hcm-team-hub .md-stat-mini-header-arrow {
	color: #9ca3af;
	font-size: 12px;
}

.hcm-team-hub .md-stat-player-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 0;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
}

.hcm-team-hub .md-stat-player-item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.hcm-team-hub .md-stat-player-info {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	font-weight: 500;
}

.hcm-team-hub .md-stat-player-info img {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	object-fit: cover;
	background: #f3f4f6;
}

.hcm-team-hub .md-stat-badge {
	background: #c8102e; /* FotMob 风格的暗红色 */
	color: #fff;
	font-weight: 700;
	font-size: 12px;
	padding: 3px 8px;
	border-radius: 12px;
	min-width: 32px;
	text-align: center;
}

/* --- Chuyển nhượng: 转会表特调 --- */
.hcm-team-hub .md-transfer-filters {
	margin-bottom: var(--hcm-layout-gap);
	display: flex;
	gap: 12px;
}

.hcm-team-hub .md-transfer-filter-btn {
	background-color: #fff;
	border: 1px solid var(--hcm-divider, #e5e7eb);
	color: var(--text);
	padding: 8px 16px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s;
}

.hcm-team-hub .md-transfer-filter-btn.active {
	background-color: #111;
	color: #fff;
	border-color: #111;
}

.hcm-team-hub .md-transfer-filter-btn:focus:not(:focus-visible),
.hcm-team-hub .md-transfer-filter-btn:focus:not(.active) {
	background-color: #fff;
	color: var(--text);
	border-color: var(--hcm-divider, #e5e7eb);
	outline: none;
}

.hcm-team-hub .md-transfer-filter-btn.active:focus:not(:focus-visible) {
	background-color: #111;
	color: #fff;
	border-color: #111;
	outline: none;
}

.hcm-team-hub .md-transfer-team {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 500;
}

.hcm-team-hub .md-transfer-team img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}

.hcm-team-hub .md-badge-position {
	background: #f3f4f6;
	color: var(--text-muted);
	font-size: 12px;
	font-weight: 700;
	padding: 4px 8px;
	border-radius: 6px;
}

/* --- BXH：与 page-match-detail / style.css 同系（自包含，不依赖全量引入顺序） --- */
.hcm-team-hub .hcm-card--md-bxh {
	padding: 0;
}

.hcm-team-hub .md-data-table {
	table-layout: fixed; /* 强制锁定，配合 colgroup 使用 */
	width: 100%;
	min-width: 600px;
	border-collapse: collapse;
	font-size: 13px;
	text-align: center;
}

.hcm-team-hub .md-data-table th {
	vertical-align: bottom;
	border-left: none !important;
	border-right: none !important;
	color: #9ca3af;
	font-weight: 500;
	font-size: 12px;
	padding: 12px 8px 16px;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
	white-space: nowrap;
}

.hcm-team-hub .home-left-col,
.hcm-team-hub .home-right-col {
	display: flex;
	flex-direction: column;
	gap: var(--gap);
	min-width: 0;
}

.hcm-team-hub .home-left-col > .hcm-card,
.hcm-team-hub .home-right-col > .hcm-card {
	margin-bottom: 0;
}

.hcm-team-hub .home-top-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gap);
	margin-bottom: 0;
}

.hcm-team-hub .home-top-row > .hcm-card {
	margin-bottom: 0;
	min-height: 180px;
	display: flex;
	flex-direction: column;
}

.hcm-team-hub .home-top-row > .hcm-card .team-form-strip,
.hcm-team-hub .home-top-row > .hcm-card .team-next__body {
	margin-top: auto;
	margin-bottom: auto;
}

/* --- Tổng quan: About 模块特调 --- */
.hcm-team-hub .md-about-card {
	position: relative;
}

.hcm-team-hub .md-about-content {
	font-size: 14px;
	line-height: 1.7;
	color: var(--text);
}

.hcm-team-hub .md-about-content p {
	margin-bottom: var(--hcm-layout-gap);
}

.hcm-team-hub .md-about-content a {
	color: var(--form-win);
	text-decoration: none;
	font-weight: 500;
}

.hcm-team-hub .md-about-content a:hover {
	text-decoration: underline;
}

.hcm-team-hub .md-about-extra {
	display: none;
}

.hcm-team-hub .md-about-extra.is-about-expanded {
	display: block;
}

.hcm-team-hub .md-about-toggle {
	text-align: center;
	padding: 10px 0;
	color: var(--form-win);
	font-weight: 700;
	font-size: 14px;
	cursor: pointer;
	margin-top: 10px;
}

/* Phong độ — 圆角矩形比分 + 队徽在下 */
.team-form-strip {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 14px;
}

.team-form-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	flex: 0 1 auto;
	min-width: 48px;
}

.team-form-score {
	min-width: 52px;
	padding: 10px 12px;
	border-radius: 10px;
	font-size: 0.75rem;
	font-weight: 800;
	color: #fff;
	text-align: center;
	line-height: 1;
}

.team-form-score--w { background: var(--form-win); }

.team-form-score--l { background: var(--form-loss); }

.team-form-score--d { background: var(--form-draw); }

.team-form-item img {
	width: 32px;
	height: 32px;
	object-fit: contain;
}

/* Trận đấu tiếp theo */
.team-next__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 18px;
}

.team-next__head .hcm-card__title,
.team-next__head .hcm-tran-dau-sidebar__title {
	margin: 0;
	flex-shrink: 0;
	white-space: nowrap;
}

.team-next__league {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--text-muted);
}

.team-next__league img { width: 24px; height: 24px; object-fit: contain; }

.team-next__body {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px 20px;
	text-align: center;
}

.team-next__club {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	font-size: 0.9375rem;
	min-width: 0;
}

.team-next__club img { width: 48px; height: 48px; object-fit: contain; }

.team-next__club--away { grid-column: 3; }

.team-next__center .team-next__time {
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.team-next__center .team-next__date {
	margin-top: 4px;
	font-size: 0.8125rem;
	color: var(--text-muted);
}

/* --- Phase 2: extracted static inline styles --- */

.hcm-team-hub #pane-thong-ke-cau-thu .js-stat-card.hcm-card {
	padding: 20px;
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 1px;
}

.hcm-stats-pane__empty {
	text-align: center;
	color: var(--text-muted);
	padding: 40px 0;
}

.hcm-stats-pane__section-title {
	font-size: 18px;
	font-weight: 800;
	margin-bottom: var(--hcm-layout-gap);
	color: var(--text);
	letter-spacing: -0.01em;
}

.hcm-stats-pane__section-title--spaced {
	margin-top: 32px;
}

.hcm-team-hub .js-overview-sidebar-match-item {
	display: block;
	padding: 14px 0;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
	text-decoration: none;
	color: inherit;
}

.hcm-team-hub .js-overview-sidebar-match-item.is-tail-page-hidden,
.hcm-team-hub #pane-tran-dau .js-match-item.is-tail-page-hidden {
	display: none !important;
}

.hcm-overview-match-meta {
	display: flex;
	justify-content: space-between;
	font-size: 12px;
	color: var(--text-muted);
	margin-bottom: 10px;
}

.hcm-overview-match-league {
	display: flex;
	align-items: center;
	gap: 4px;
}

.hcm-overview-match-side img,
.hcm-overview-match-league img {
	object-fit: contain;
	object-position: center;
	flex-shrink: 0;
}

.hcm-overview-match-row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
}

.hcm-overview-match-side {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1;
}

.hcm-overview-match-side--home {
	justify-content: flex-end;
}

.hcm-overview-match-side--away {
	justify-content: flex-start;
}

.hcm-overview-match-team {
	font-weight: 500;
	font-size: 13px;
}

.hcm-overview-match-center {
	min-width: 40px;
	text-align: center;
}

.team-form-score.hcm-hub-match-center-badge {
	width: auto;
	padding: 2px 8px;
	border-radius: 6px;
	font-weight: 700;
	font-size: 14px;
}

.hcm-hub-match-center-time {
	font-weight: 700;
	font-size: 14px;
}

.hcm-hub-empty-slot {
	grid-column: 1 / -1;
	text-align: center;
	color: var(--text-muted);
	font-size: 14px;
	padding: 20px 0;
}

.hcm-hub-empty-slot--sidebar {
	padding: 20px 0;
	text-align: center;
	color: var(--text-muted);
	font-size: 13px;
}

.hcm-tran-dau-sidebar__head {
	margin-bottom: var(--hcm-layout-gap);
}

.hcm-tran-dau-sidebar__title {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: var(--hcm-layout-gap);
	color: var(--text-color, var(--text));
}

.team-next__body--sidebar-divider {
	padding-bottom: 24px;
	border-bottom: 1px solid var(--border);
}

.team-next__body--sidebar-divider .team-next__time {
	font-size: 24px;
}

.hcm-tran-dau-sidebar__stats {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	font-size: 13px;
}

.hcm-tran-dau-sidebar__stat-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.hcm-tran-dau-sidebar__stat-pill {
	width: 40px;
	text-align: center;
	background: #e11d48;
	color: #fff;
	border-radius: 12px;
	padding: 4px 0;
	font-weight: 700;
}

.hcm-tran-dau-sidebar__stat-pill--plain {
	width: 40px;
	text-align: center;
	font-weight: 700;
	background: transparent;
	color: inherit;
}

.hcm-tran-dau-sidebar__stat-label {
	color: var(--text-muted);
}

.hcm-hub-muted-note {
	font-size: 13px;
	color: var(--text-muted);
}

.hcm-hub-muted-note--sm {
	font-size: 12px;
	color: var(--text-muted);
	margin-top: 12px;
}

.hcm-team-hub .md-stats-grid.md-stats-grid--flush {
	margin-top: 0;
	margin-bottom: 0;
}

.hcm-card__title--center {
	text-align: center;
	margin-bottom: var(--hcm-layout-gap);
}

.hcm-about-section-title {
	font-weight: 700;
	margin: 20px 0 10px;
}

.hcm-about-monospace {
	font-family: monospace;
	font-size: 13px;
	color: var(--text-muted);
}

.hcm-form-result--loss {
	color: var(--form-loss);
}

.hcm-form-result--win {
	color: var(--form-win);
}

.hcm-about-muted {
	color: var(--text-muted);
	font-size: 14px;
}

.hcm-about-muted--spaced {
	margin-top: 10px;
}

.hcm-card--sidebar-pad {
	padding: 18px 20px;
}

.hcm-overview-upcoming__toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 20px 12px;
	border-bottom: 1px solid var(--hcm-divider, #e5e7eb);
}

.hcm-overview-nav-btn {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: none;
	background: var(--stat-pill-bg, #f9fafb);
	cursor: pointer;
	color: var(--text-muted);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	transition: opacity 0.2s, background-color 0.2s;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}

/* GP button:focus 粘滞：点击后焦点留在按钮上时不应出现深色残留底 */
.hcm-overview-nav-btn:focus {
	outline: none !important;
	box-shadow: none !important;
}

.hcm-overview-nav-btn:hover:not(:disabled):not(.is-disabled),
.hcm-overview-nav-btn:focus:hover:not(:disabled):not(.is-disabled) {
	opacity: 0.7;
}

.hcm-overview-nav-btn:focus:not(:focus-visible):not(:hover) {
	background: var(--stat-pill-bg, #f9fafb) !important;
	color: var(--text-muted) !important;
}

.hcm-overview-nav-btn:focus-visible {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(31, 185, 99, 0.15) !important;
}

.hcm-overview-nav-btn:disabled,
.hcm-overview-nav-btn.is-disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.hcm-overview-nav-btn:disabled:focus:not(:focus-visible):not(:hover),
.hcm-overview-nav-btn.is-disabled:focus:not(:focus-visible):not(:hover) {
	background: var(--stat-pill-bg, #f9fafb) !important;
}

.hcm-overview-upcoming__title {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	color: var(--text, var(--hcm-text-main));
	text-align: center;
	flex: 1;
}

/* Tổng quan · Trận đấu 侧栏（球队 / 国家队共用） */
.hcm-team-hub .team-overview-upcoming,
.hcm-team-hub .national-overview-upcoming {
	width: 100%;
	box-sizing: border-box;
	overflow: hidden;
	border-radius: var(--radius);
}

.hcm-team-hub .team-overview-upcoming .team-overview-match-list,
.hcm-team-hub .national-overview-upcoming .team-overview-match-list {
	padding: 0 20px 4px;
	border-radius: 0 0 var(--radius) var(--radius);
	overflow: hidden;
	background: var(--card-bg);
}

.hcm-team-hub .team-overview-upcoming .js-overview-sidebar-match-item.is-last-visible,
.hcm-team-hub .national-overview-upcoming .js-overview-sidebar-match-item.is-last-visible {
	border-bottom: none !important;
	padding-bottom: 18px;
}

.hcm-overview-bxh-head {
	padding: 20px 20px 0;
}

.hcm-card__title--inline-logo {
	display: flex;
	align-items: center;
	gap: 8px;
}

.hcm-pitch-empty-label {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.hcm-fixture-subtitle-row {
	display: flex;
	align-items: center;
	gap: 6px;
}

.hcm-fixture-card-title {
	margin: 0;
	font-size: 15px;
}

.hcm-fixture-difficulty-row {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	margin-top: 12px;
	width: 100%;
}

.hcm-hub-inline-link {
	display: inline-flex;
	text-decoration: none;
	color: inherit;
}

.hcm-team-hub .md-bxh-table col.col-rank {
	width: 36px;
}

.hcm-team-hub .md-bxh-table col.col-team {
	width: auto;
}

.hcm-team-hub .md-bxh-table col.col-stat {
	width: 40px;
}

.hcm-team-hub .md-bxh-table col.col-goals {
	width: 64px;
}

.hcm-team-hub .md-bxh-table col.col-form {
	width: 160px;
}

.hcm-bxh-tbody--hidden {
	display: none;
}

.hcm-overview-bxh-league-head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 20px 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--text);
	opacity: 0.9;
}

.hcm-overview-bxh-league-head img {
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.hcm-bxh-legend {
	display: flex;
	flex-wrap: wrap;
	gap: var(--hcm-layout-gap) 24px;
	padding: 24px 20px 20px;
	font-size: 12px;
	color: var(--text-muted);
	border-top: 1px solid rgba(128, 128, 128, 0.05);
}

.hcm-bxh-legend__item {
	display: flex;
	align-items: center;
	gap: 6px;
}

.hcm-bxh-legend__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.hcm-bxh-legend__dot--ucl {
	background: #10b981;
}

.hcm-bxh-legend__dot--uel {
	background: #2563eb;
}

.hcm-bxh-legend__dot--uecl {
	background: #0ea5e9;
}

.hcm-bxh-legend__dot--rel {
	background: #ef4444;
}

.hcm-table-empty-row {
	text-align: center;
	padding: 30px;
	color: var(--text-muted);
}

.hcm-team-hub .hcm-card.hcm-squad-card,
.hcm-team-hub .hcm-card.home-sidebar-item--flush {
	padding: 0;
	overflow: hidden;
}

.hcm-team-hub .hcm-card.hcm-card--padded {
	padding: 24px;
}

.hcm-team-hub .md-squad-coach-row {
	border-bottom: 1px solid var(--border);
	background: var(--chart-bg-soft, rgba(0, 0, 0, 0.02));
}

.hcm-team-hub .md-squad-table td.md-squad-cell {
	padding: 16px 20px;
}

.hcm-team-hub .md-squad-player-link {
	display: flex;
	align-items: center;
	gap: var(--hcm-layout-gap);
	min-width: 0;
}

.hcm-team-hub .md-squad-player-avatar {
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid var(--hcm-divider, #e5e7eb);
}

.hcm-team-hub .md-squad-coach-row .md-squad-player-avatar {
	border-color: var(--border);
}

.hcm-team-hub .md-squad-player-meta {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.hcm-team-hub .md-squad-player-name {
	font-weight: 600;
	font-size: 15px;
}

.hcm-team-hub .md-squad-player-flex {
	display: flex;
	align-items: center;
	gap: var(--hcm-layout-gap);
}

.hcm-team-hub .md-squad-pos-cell {
	font-weight: 500;
}

.hcm-team-hub .md-squad-pos-cell--coach {
	font-weight: 600;
	color: var(--primary, #e11d48);
}

.hcm-team-hub .md-squad-empty-cell {
	text-align: center;
	padding: 40px;
	color: var(--text-muted);
}

/*
 * 昼夜切换：与 page-league.php 高级暗灰调色板对齐（html.dark-mode / functions.php）。
 */
html.dark-mode .hcm-team-hub,
body.dark-mode .hcm-team-hub,
html[data-theme="dark"] .hcm-team-hub,
.dark .hcm-team-hub {
	/* 核心背景与文字颜色反转 (对齐联赛详情页质感) */
	--card-bg: #1c1c1e !important;
	--bg-card: #1c1c1e !important;
	--bg-secondary: #2c2c2e !important;
	--bg-hover: #3a3a3c !important;
	--text-primary: #f5f5f7 !important;
	--text: #f5f5f7 !important;
	--text-color: #f5f5f7 !important;
	--text-muted: #a1a1aa !important;
	--border-color: #38383a !important;
	--border: #38383a !important;
	--stat-pill-bg: rgba(255, 255, 255, 0.12) !important;
	--stat-pill-fg: #f5f5f7 !important;
	--chart-bg-soft: rgba(255, 255, 255, 0.06) !important;
	--card-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
	--hcm-text-main: #f5f5f7 !important;
	color: var(--text);
}

html.dark-mode .hcm-team-hub .hcm-custom-select-menu {
	background: var(--card-bg) !important;
	border-color: var(--border) !important;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
}

html.dark-mode .hcm-team-hub .md-filter-select {
	background-color: var(--card-bg) !important;
	color: var(--text) !important;
	border-color: var(--border) !important;
}

html.dark-mode .hcm-team-hub .hcm-custom-select-item:hover,
html.dark-mode .hcm-team-hub .hcm-custom-select-item.selected {
	background: rgba(255, 255, 255, 0.06) !important;
}

html.dark-mode .hcm-team-hub .md-match-header {
	border-bottom-color: var(--border) !important;
}

html.dark-mode .hcm-team-hub .md-match-header-btn,
body.dark-mode .hcm-team-hub .md-match-header-btn,
html[data-theme="dark"] .hcm-team-hub .md-match-header-btn,
.dark .hcm-team-hub .md-match-header-btn {
	background: var(--stat-pill-bg, rgba(255, 255, 255, 0.12)) !important;
	color: var(--text-muted) !important;
}

html.dark-mode .hcm-team-hub .md-match-header-btn:focus:not(:focus-visible):not(:hover),
body.dark-mode .hcm-team-hub .md-match-header-btn:focus:not(:focus-visible):not(:hover),
html[data-theme="dark"] .hcm-team-hub .md-match-header-btn:focus:not(:focus-visible):not(:hover),
.dark .hcm-team-hub .md-match-header-btn:focus:not(:focus-visible):not(:hover),
html.dark-mode .hcm-team-hub .md-match-header-btn:disabled:focus:not(:focus-visible):not(:hover),
body.dark-mode .hcm-team-hub .md-match-header-btn:disabled:focus:not(:focus-visible):not(:hover),
html.dark-mode .hcm-team-hub .md-match-header-btn.is-disabled:focus:not(:focus-visible):not(:hover),
body.dark-mode .hcm-team-hub .md-match-header-btn.is-disabled:focus:not(:focus-visible):not(:hover) {
	background: var(--stat-pill-bg, rgba(255, 255, 255, 0.12)) !important;
	color: var(--text-muted) !important;
}

html.dark-mode .hcm-overview-nav-btn:focus:not(:focus-visible):not(:hover),
body.dark-mode .hcm-overview-nav-btn:focus:not(:focus-visible):not(:hover),
html[data-theme="dark"] .hcm-overview-nav-btn:focus:not(:focus-visible):not(:hover),
.dark .hcm-overview-nav-btn:focus:not(:focus-visible):not(:hover),
html.dark-mode .hcm-overview-nav-btn:disabled:focus:not(:focus-visible):not(:hover),
body.dark-mode .hcm-overview-nav-btn:disabled:focus:not(:focus-visible):not(:hover),
html.dark-mode .hcm-overview-nav-btn.is-disabled:focus:not(:focus-visible):not(:hover),
body.dark-mode .hcm-overview-nav-btn.is-disabled:focus:not(:focus-visible):not(:hover) {
	background: var(--stat-pill-bg, rgba(255, 255, 255, 0.12)) !important;
	color: var(--text-muted) !important;
}

html.dark-mode .hcm-team-hub .md-data-table tbody tr.highlight-row,
html.dark-mode .hcm-team-hub .md-bxh-table tr.highlight-row {
	background-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-mode .hcm-team-hub .sortable-header:hover .sort-label,
html.dark-mode .hcm-team-hub .sortable-header.active .sort-label,
body.dark-mode .hcm-team-hub .sortable-header:hover .sort-label,
body.dark-mode .hcm-team-hub .sortable-header.active .sort-label {
	background-color: var(--border) !important;
}

html.dark-mode .hcm-team-hub .md-transfer-filter-btn {
	background-color: rgba(255, 255, 255, 0.08) !important;
	border-color: var(--border) !important;
	color: var(--text) !important;
}

html.dark-mode .hcm-team-hub .md-transfer-filter-btn.active {
	background: var(--text-primary, #f5f5f7) !important;
	color: var(--bg-card, #1c1c1e) !important;
	border-color: var(--text-primary, #f5f5f7) !important;
}

html.dark-mode .hcm-team-hub .md-transfer-filter-btn:focus:not(:focus-visible),
html.dark-mode .hcm-team-hub .md-transfer-filter-btn:focus:not(.active) {
	background-color: rgba(255, 255, 255, 0.08) !important;
	color: var(--text) !important;
	border-color: var(--border) !important;
	outline: none;
}

html.dark-mode .hcm-team-hub .md-transfer-filter-btn.active:focus,
body.dark-mode .hcm-team-hub .md-transfer-filter-btn.active:focus {
	background: var(--text-primary, #f5f5f7) !important;
	color: var(--bg-card, #1c1c1e) !important;
	border-color: var(--text-primary, #f5f5f7) !important;
	outline: none;
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub .md-filter-pill:focus:not(.active) {
	background-color: transparent !important;
	color: var(--text, #f5f5f7) !important;
	border-color: rgba(128, 128, 128, 0.2) !important;
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub .md-filter-pill.active:focus {
	background-color: #f8fafc !important;
	color: #111827 !important;
	border-color: #f8fafc !important;
}

/* Shared Hub rules promoted from League/Team/National page CSS. */
html.dark-mode .hcm-team-hub .md-squad-table tbody tr:hover,
body.dark-mode .hcm-team-hub .md-squad-table tbody tr:hover {
	background-color: rgba(255, 255, 255, 0.06);
}

/* Đội hình · 国家队 / 球队页暗色统一（桌面 + 移动） */
:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .hcm-squad-card {
	background: var(--card-bg, #1c1c1e);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-coach-row {
	background: var(--chart-bg-soft, rgba(255, 255, 255, 0.06));
	border-bottom-color: var(--border, #38383a);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-table th {
	color: var(--text-muted, #a1a1aa);
	border-bottom-color: var(--border, #38383a);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-table td {
	border-bottom-color: var(--border, #38383a);
	color: var(--text, #f5f5f7);
	background: transparent;
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-table td.md-squad-pos-cell {
	color: var(--text-muted, #a1a1aa);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-player-name {
	color: var(--text, #f5f5f7);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-player-avatar {
	border-color: var(--border, #38383a);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .md-squad-num-badge {
	background: var(--stat-pill-bg, rgba(255, 255, 255, 0.12));
	color: var(--text, #f5f5f7);
}

:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .sortable-header:hover .sort-label,
:is(html.dark-mode, body.dark-mode) .hcm-team-hub #pane-doi-hinh .sortable-header.active .sort-label {
	background-color: var(--border, #38383a);
	color: var(--text, #f5f5f7);
}

/*
 * Tổng quan · Trận đấu 分页钮：移动端与桌面一致保留圆形 pill
 * hcm-hub 在 hcm-touch-ui 之后加载，此处兜底覆盖 GP 移动端 button:focus 异色灰底。
 */
@media (hover: none) and (pointer: coarse) {
	.hcm-team-hub .hcm-overview-nav-btn {
		display: flex !important;
		width: 28px !important;
		height: 28px !important;
		min-width: 28px !important;
		min-height: 28px !important;
		border-radius: 50% !important;
		flex-shrink: 0 !important;
		background: var(--stat-pill-bg, #f9fafb) !important;
		background-color: var(--stat-pill-bg, #f9fafb) !important;
		-webkit-appearance: none !important;
		appearance: none !important;
	}

	.hcm-team-hub .hcm-overview-nav-btn:is(
		:hover,
		:focus,
		:focus:hover,
		:focus:not(:focus-visible),
		:active
	) {
		background: var(--stat-pill-bg, #f9fafb) !important;
		background-color: var(--stat-pill-bg, #f9fafb) !important;
		color: var(--text-muted) !important;
		outline: none !important;
		box-shadow: none !important;
	}

	:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark)
		.hcm-team-hub
		.hcm-overview-nav-btn,
	:is(html.dark-mode, body.dark-mode, html[data-theme="dark"], .dark)
		.hcm-team-hub
		.hcm-overview-nav-btn:is(
			:hover,
			:focus,
			:focus:hover,
			:focus:not(:focus-visible),
			:active
		) {
		background: var(--stat-pill-bg, rgba(255, 255, 255, 0.12)) !important;
		background-color: var(--stat-pill-bg, rgba(255, 255, 255, 0.12)) !important;
	}
}
