/* 全局基础样式（你原有的代码） */
body {
	font-size: 14px;
	overflow-x: hidden;
	font-family: ;
	font-family: -apple-system, BlinkMacSystemFont, Open Sauce One, "Segoe UI", Roboto, Arial, sans-serif;
	padding-top: 150px;
}

h1,
h2,
h3,
h4,
h5,
dl {
	margin-top: 0em;
}

a {
	color: #000000;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
	color: #000;
}

ul {
	margin: 0px;
	padding: 0px;
}

li {
	list-style: none;
}

.fs-7 {
	font-size: 0.8rem !important;
}

.text-primary {
	color: #1452f0 !important
}

.btn-primary {
	background-color: #1452f0 !important;
}

.bg-border {
	background-color: #e5e7eb;
}
.bg-f4{ background-color: #f4f5f6;}
.logo {
	font-size: 24px
}

.search input {
	width: 500px;
}

.menu i {
	font-size: 26px
}

.signup {
	font-size: 14px;
}

.nav a {
	margin: 5px 10px;
	color: #77808d
}

.nav a:first-child {
	margin-left: 0px;
	color: #000
}

.nav a:hover {
	color: #000;
}

.line {
	height: 20px
}

/* More 菜单容器：避免滚动影响下拉层 */
.more-menu {
	position: relative;
	display: inline-block;
	z-index: 10;
}

.more-menu::after {
	content: "";
	display: inline-block;
	margin-left: -10px;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #666;
	vertical-align: middle;
	transition: transform 0.2s ease-in-out;
}

.more-menu:hover::after {
	transform: rotate(180deg) translateY(2px);
	border-top-color: #333;
}

.more-dropdown {
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: calc(100% + 4px);
	left: 50%;
	min-width: 160px;
	background-color: #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	border-radius: 6px;
	padding: 8px 0;
	margin: 0;
	z-index: 9999;
	transition: visibility 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
	transform: translateY(8px);
	margin-left: -80px !important;
}

.more-menu:hover .more-dropdown {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

.more-dropdown a {
	display: block;
	padding: 10px 16px;
	color: #555;
	text-decoration: none;
	font-size: 14px;
	transition: background-color 0.2s ease;
}

.more-dropdown a:hover {
	background-color: #f8f9fa;
	color: #222;
}

.more-menu>a {
	display: inline-block;
	padding: 10px 12px;
	color: #666;
	text-decoration: none;
	font-size: 14px;
	vertical-align: middle;
}

.more-dropdown a:first-child {
	margin-left: 10px
}



.u-t-log-in {
	position: relative;
	display: inline-block;
	z-index: 100;
}

.u-t-log-in::after {
	content: "";
	display: inline-block;
	margin-left: -10px;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #666;
	vertical-align: middle;
	transition: transform 0.2s ease-in-out;
}

.u-t-log-in:hover::after {
	transform: rotate(180deg) translateY(2px);
	border-top-color: #333;
}

.u-dropdown {
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: calc(100% + 14px);
	left: 50%;
	min-width: 240px;
	background-color: #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	border-radius: 6px;
	padding: 8px 0;
	margin: 0;
	z-index: 9999;
	transition: visibility 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
	transform: translateY(8px);
	margin-left: -220px !important;
}

.u-t-log-in:hover .u-dropdown {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

.u-dropdown a {
	display: block;
	padding: 10px 16px;
	color: #555;
	text-decoration: none;
	font-size: 14px;
	transition: background-color 0.2s ease;
}

.u-dropdown a:hover {
	background-color: #f8f9fa;
	color: #222;
}

.u-t-log-in>a {
	display: inline-block;
	padding: 10px 12px;
	color: #666;
	text-decoration: none;
	font-size: 14px;
	vertical-align: middle;
}

.icon-color-1 { color: #0d6efd; } /* 蓝色 - activity */
.icon-color-2 { color: #198754; } /* 绿色 - layout-wtf */
.icon-color-3 { color: #ffc107; } /* 黄色 - gift */
.icon-color-4 { color: #dc3545; } /* 红色 - flower2 */







.form-control {
	border-radius: 10px !important;
	border: 1px solid #e0e0e0 !important;
	transition: border-color 0.2s ease;
	font-size: 14px;
	padding-left: 30px !important;
	background-color: #f4f5f6;
}

.form-control:focus {
	border-color: #b0b0b0 !important;
	box-shadow: none !important;
	outline: none;
}

.tab-scroll-container {
	display: flex;
	align-items: center;
	/* 核心：箭头与文字垂直居中 */
	gap: 8px;
	max-width: 100%;
	/* 去掉整体背景，仅保留间距和高度 */
	border-radius: 8px;
	box-sizing: border-box;
}

/* 滚动容器：核心是overflow-x-auto + 高度继承 */
.tab-scroll-wrap {
	flex-grow: 1;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	/* 隐藏Firefox滚动条 */
	-ms-overflow-style: none;
	/* 隐藏IE滚动条 */
	scroll-behavior: smooth;
	/* 平滑滚动 */
	height: 100%;
	/* 继承容器高度 */
}

/* 隐藏Chrome滚动条 */
.tab-scroll-wrap::-webkit-scrollbar {
	display: none;
}

/* 标签列表：不换行 + 高度100% + 垂直居中 */
.tab-list {
	display: flex;
	gap: 6px;
	/* 标签间距优化 */
	white-space: nowrap;
	padding: 0 4px;
	height: 100%;
	/* 高度100%，保证文字垂直居中 */
}

/* 标签基础样式：高度100% + 垂直居中 */
.tab-item {
	background: transparent;
	border: none;
	padding: 0 12px;
	/* 左右内边距，增加点击区域 */
	color: #495057;
	font-size: 15px;
	cursor: pointer;
	border-radius: 8px;
	/* 圆角背景 */
	transition: all 0.2s ease;
	height: 30px;
	/* 标签高度（小于容器高度，视觉更协调） */
	display: flex;
	/* 核心：文字垂直居中 */
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	flex-shrink: 0;
	/* 防止标签被挤压 */
	margin-top: 5px
}

/* 选中态（All标签）：添加背景 + 文字变色 */
.tab-item.active {
	color: #fff;
	background-color: #0d6efd;
	/* 选中背景色 */
	font-weight: 500;
}

/* hover态：非选中标签浅背景 */
.tab-item:not(.active):hover {
	color: #212529;
	background-color: #f1f3f5;
}

/* 箭头按钮：统一尺寸 + 垂直居中 + 优化样式 */
.tab-arrow {
	background: transparent;
	border: none;
	color: #6c757d;
	cursor: pointer;
	width: 36px;
	/* 固定宽高，与标签高度一致 */
	height: 36px;
	border-radius: 50%;
	/* 圆形按钮 */
	display: flex;
	/* 图标垂直居中 */
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	flex-shrink: 0;
	/* 防止箭头被挤压 */
}

.tab-arrow:hover {
	color: #212529;
	background-color: #e9ecef;
}

.tab-arrow.visually-hidden {
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
}

.main .card {
	cursor: pointer;
	transition: all 0.3s ease;
	transform: translateY(0);
}

.main .card:hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 24px rgba(0, 0, 0, 0.12);
}

.main .card a:hover {
	text-decoration: underline;
}

.scrollable-area {
	overflow-y: auto;
	/* Firefox隐藏滚动条 */
	scrollbar-width: none;
	/* IE/Edge隐藏滚动条 */
	-ms-overflow-style: none;
	min-height: 55px;
	max-height: 55px;
}

/* Chrome/Safari隐藏滚动条 */
.scrollable-area::-webkit-scrollbar {
	display: none;
}

.card-bt {
	height: 50px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
}

.card-n {
	height: 40px;
}


.yes-big {
	background-color: #e8f5e9 !important;
	color: #2e7d32 !important;
}

.no-big {
	background-color: #ffebee !important;
	color: #c62828 !important;
}

/* 按钮hover显示数字（纯CSS，无遮挡） */
.vote-btn {
	position: relative;
	/* 为伪元素做定位容器 */
	z-index: 1;
	/* 按钮自身层级 */
}

/* 数字提示框（默认隐藏） */
.vote-btn::after {
	content: attr(data-vote);
	/* 读取data-vote里的数值 */
	position: absolute;
	left: -22px;
	/* 显示在按钮上方，避开遮挡 */
	left: 50%;
	transform: translateX(-50%);
	/* 水平居中 */
	background-color: #2e7d32;
	color: #fff;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 10px;
	white-space: nowrap;
	opacity: 0;
	/* 默认透明 */
	pointer-events: none;
	/* 不干扰按钮点击 */
	z-index: 999;
	/* 最高层级，防止被其他元素遮挡 */
	transition: opacity 0.2s ease;
}

/* 鼠标hover时显示数字 */
.vote-btn:hover::after,
.vote-btnr:hover::after {
	opacity: 1;
}

/* 按钮hover显示数字（纯CSS，无遮挡） */
.vote-btnr {
	position: relative;
	/* 为伪元素做定位容器 */
	z-index: 1;
	/* 按钮自身层级 */
}

/* 数字提示框（默认隐藏） */
.vote-btnr::after {
	content: attr(data-vote);
	/* 读取data-vote里的数值 */
	position: absolute;
	left: -22px;
	/* 显示在按钮上方，避开遮挡 */
	left: 50%;
	transform: translateX(-50%);
	/* 水平居中 */
	background-color: #c62828;
	color: #fff;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 10px;
	white-space: nowrap;
	opacity: 0;
	/* 默认透明 */
	pointer-events: none;
	/* 不干扰按钮点击 */
	z-index: 999;
	/* 最高层级，防止被其他元素遮挡 */
	transition: opacity 0.2s ease;
}

/* footer容器：仅作为载体，始终存在 */
footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;

	padding: 0;
	/* 清空默认padding，避免占位 */
}

/* .foot初始样式：隐藏 + 过渡动画 */
.foot {
	background-color: #fff;

	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* .foot显示的样式类 */
.foot.show {
	opacity: 1;
	visibility: visible;
}

/* 分享图标间距 */
.share a {
	margin-left: 1rem;
	color: #6c757d;
	/* 灰色，可自定义 */
	text-decoration: none;
}

.share a:hover {
	color: #0d6efd;
	/* 蓝色hover效果，可自定义 */
}

.sticky-right {
	position: sticky;
	/* 粘性定位：滚动时固定 */
	top: 150px;
	/* 距离顶部20px固定，可自定义 */
	align-self: flex-start;
	/* 配合d-flex，避免高度拉伸 */
}

.break-left-title {
	background-color: #e7edfd;
}

/* 隐藏Chrome/Safari等webkit内核浏览器的滚动条（关键） */
.break-left-nav-container::-webkit-scrollbar {
	display: none !important;
}

/* 菜单项基础样式 */
.break-left-nav .nav-item {
	color: #666;
	/* 默认文字颜色 */
	background-color: #f8f9fa;
	/* 默认背景色 */
	transition: background-color 0.2s ease;
	/* 悬浮过渡 */
}

/* 激活项样式（匹配设计图） */
.break-left-nav .nav-item.active {
	background-color: #007bff;
	/* 激活态蓝色背景 */
	color: #fff;
	/* 激活态白色文字 */
}

/* PC端悬浮效果（手机端无hover，不影响） */
.break-left-nav .nav-item:hover:not(.active) {
	background-color: #e9ecef;
	/* 悬浮浅灰色 */
}

.break-left-list h6 {
	font-size: 0.9rem;
	color: #333;
}

.break-left-list .fs-5 {
	font-size: 1rem !important;
}

.break-left-list-item:hover {
	background-color: #f4f5f6;
	cursor: pointer;
	border-radius: 5px;
}

.breaking-right-top i {
	font-size: 20px;
}

.breaking-right {
	position: sticky !important;
	/* 粘性定位（核心） */
	top: 130px !important;
	/* 距离顶部150像素 */
	z-index: 1020 !important;
	/* 高于普通元素，避免被遮挡（可选） */
	/* 以下为示例样式，可根据实际需求调整 */
	background-color: #fff;
	padding: 1rem;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	width: 320px;
	/* 匹配之前的卡片宽度 */
	margin: 0 auto;
}

.list-item:hover {
	background-color: #f4f5f6;
}

.scrollbar-hidden {
	/* Chrome/Safari/Edge */
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.scrollbar-hidden::-webkit-scrollbar {
	display: none;
}

.breaking-details-left-2 img {
	width: 80px;
	height: 80px;
}

.breaking-details-left-2-icon i {
	font-size: 20px
}

.breaking-details-left-2-icon i:first-of-type {
	margin-right: 8px;
	font-size: 26px;
}

.breaking-outcome-item:hover {
	background-color: #f4f5f6;
	cursor: pointer;
	border-radius: 3px;
}

.breaking-ai:hover {
	background-color: #f4f5f6;
}

/* 核心样式：适配你的 breaking-ins 容器 */
.breaking-ins {
	font-size: 1rem;
	line-height: 1.6;
	/* 行高，用于计算显示行数 */
	color: #333;
}

.breaking-ins h6 {
	font-weight: bold;
	margin-bottom: 0.5rem;
}

/* 内容容器：默认显示3行，超出隐藏 */
.breaking-ins .content-wrap {
	max-height: calc(1.6rem * 2);
	/* 3行高度 = 行高 * 行数 */
	overflow: hidden;
	transition: max-height 0.3s ease;
	/* 平滑展开/收起动画 */
}

/* 展开状态：取消高度限制 */
.breaking-ins .content-wrap.expanded {
	max-height: 9999px;
	/* 足够大的数值适配任意内容 */
}

/* 展开/收起按钮样式 */
.breaking-ins .toggle-btn {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.3rem;
	border: none;
	background: transparent;
	color: #0d6efd;
	/* Bootstrap 主色 */
	padding: 0.5rem 0;
	margin-top: 0.5rem;
	cursor: pointer;
	font-size: 0.9rem;
}

.breaking-ins .toggle-btn:hover {
	color: #0a58ca;
	/* Bootstrap 主色 hover */
}

/* 箭头旋转动画 */
.breaking-ins .toggle-icon {
	transition: transform 0.3s ease;
}

.breaking-ins .toggle-icon.rotate {
	transform: rotate(180deg);
}

/* 1. 顶部标签栏样式（严格匹配图片） */
.comment-tabs {
	border-bottom: none;
	/* 取消默认边框，自定义激活线下划线 */
	margin-bottom: 15px;
}

.comment-tabs .nav-link {
	color: #333;
	padding: 0 15px 8px;
	margin-right: 10px;
	border: none;
	border-radius: 0;
	font-weight: 500;
}

.comment-tabs .nav-link.active {
	color: #333;
	background-color: transparent !important;
	/* 强制覆盖Bootstrap默认激活背景 */
	border-bottom: 2px solid #000;
	/* 激活态下划线 */
	font-weight: 700;
}

.comment-tabs .nav-link:hover {
	border-color: transparent;
}

/* 2. 评论输入框样式 */
.comment-input-wrap {
	position: relative;
	margin-bottom: 15px;
}

.comment-input {
	width: 100%;
	height: 40px;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	padding: 8px 12px;
	font-size: 14px;
}

.comment-input::placeholder {
	color: #9ca3af;
}

.post-btn {
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	background: transparent;
	border: none;
	color: #6366f1;
	/* 邮政/发布按钮文字色 */
	font-size: 14px;
	cursor: pointer;
}

/* 3. 筛选栏样式 */
.filter-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 20px;
}

.filter-left {
	display: flex;
	align-items: center;
	gap: 15px;
}

.filter-dropdown {
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	padding: 4px 8px;
	font-size: 14px;
	background-color: #fff;
}

.holder-checkbox {
	display: flex;
	align-items: center;
	gap: 5px;
}

.holder-checkbox input {
	width: 16px;
	height: 16px;
}

.filter-right {
	display: flex;
	align-items: center;
	gap: 5px;
	color: #6b7280;
	font-size: 13px;
}

.filter-right i {
	font-size: 14px;
}

/* 4. 评论项核心样式 */
.comment-item {
	margin-bottom: 20px;
	width: 100%;
}

.comment-header {
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}

.avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	margin-right: 12px;
	object-fit: cover;
}

.user-info {
	flex-grow: 1;
}

.username {
	font-weight: 500;
	margin-right: 8px;
}

.user-tag {
	background-color: #d1fae5;
	/* 浅绿色标签背景 */
	color: #065f46;
	font-size: 12px;
	padding: 2px 6px;
	border-radius: 4px;
	margin-right: 8px;
}

.comment-time {
	color: #6b7280;
	font-size: 13px;
}

.more-btn {
	background: transparent;
	border: none;
	color: #6b7280;
	font-size: 16px;
	cursor: pointer;
}

.comment-content {
	margin-left: 48px;
	/* 对齐头像右侧：36px(头像)+12px(间距) */
	margin-bottom: 8px;
	line-height: 1.5;
}

.like-wrap {
	margin-left: 48px;
	display: flex;
	align-items: center;
	gap: 5px;
	color: #6b7280;
	font-size: 13px;
	margin-bottom: 8px;
}

.like-icon {
	cursor: pointer;
}

.hide-reply {
	margin-left: 48px;
	color: #6b7280;
	font-size: 13px;
	cursor: pointer;
	margin-bottom: 10px;
}

/* 5. 返回顶部按钮样式（优化优先级） */
.back-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	background-color: #f3f4f6;
	border: none;
	border-radius: 20px;
	padding: 6px 12px;
	font-size: 13px;
	display: flex !important;
	/* 强制显示控制 */
	align-items: center;
	gap: 5px;
	color: #333;
	cursor: pointer;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	z-index: 9999;
	/* 置顶，避免被遮挡 */
	display: none;
	/* 默认隐藏 */
}

.flag-icon {
	background-color: #dc2626;
	/* 红色背景 */
	color: white;
	padding: 2px 6px;
	border-radius: 2px;
	margin-right: 8px;
}

.trade-tab .nav-link {
	border: none !important;
	border-radius: 0 !important;
	color: #6c757d !important;
	font-size: 14px;
	font-weight: 500;
	padding: 0.25rem 0.75rem !important;
}

/* 激活态样式：强制生效 */
.trade-tab .nav-link.active {
	color: #0d6efd !important;
	/* 蓝色突出激活态 */
	border-bottom: 2px solid #0d6efd !important;
	background: transparent !important;
}

/* 其他优化样式 */
.btn-outline-secondary:hover {
	background-color: #f8f9fa;
}

.form-control:focus {
	box-shadow: 0 0 0 0.1rem rgba(0, 123, 255, 0.25);
	border-color: #80bdff;
}

.card {
	border: none !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
}



/* 其他保留样式（交易卡片+列表） */
.trade-tab .nav-link {
	border: none !important;
	border-radius: 0 !important;
	color: #6c757d !important;
	font-size: 14px;
	font-weight: 500;
	padding: 0.25rem 0.75rem !important;
}

.trade-tab .nav-link.active {
	color: #0d6efd !important;
	border-bottom: 2px solid #0d6efd !important;
	background: transparent !important;
}

.btn-outline-secondary:hover {
	background-color: #f8f9fa;
}

.form-control:focus {
	box-shadow: 0 0 0 0.1rem rgba(0, 123, 255, 0.25);
	border-color: #80bdff;
}

.card {
	border: none !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
}

.terms-text {
	font-size: 12px;
	color: #6c757d;
	margin: 1rem 0;
}

.poll-item {
	display: flex;
	align-items: center;
	padding: 0.8rem 0;
	border-bottom: 1px solid #f1f3f5;
}

.poll-item:last-child {
	border-bottom: none;
}

.poll-flag {
	width: 32px;
	height: 20px;
	border-radius: 3px;
	margin-right: 0.8rem;
	object-fit: cover;
}

.poll-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	margin-right: 0.8rem;
	object-fit: cover;
}

.poll-title {
	flex: 1;
	font-size: 14px;
	color: #212529;
	line-height: 1.4;
}

.poll-percent {
	font-size: 15px;
	font-weight: 600;
}

.percent-red {
	color: #dc3545;
}

.percent-blue {
	color: #0d6efd;
}

.percent-gray {
	color: #6c757d;
}


.tabs-scroll-container {
	overflow-x: auto !important;
	/* 强制横向滚动 */
	overflow-y: hidden !important;
	-webkit-overflow-scrolling: touch !important;
	/* 移动端顺滑滚动 */
	scrollbar-width: none !important;
	/* 隐藏Firefox滚动条 */
	max-width: 100% !important;
	/* 适应父容器宽度 */
	width: 100% !important;
	/* 强制占满父容器 */
	padding: 0 !important;
	margin: 0 !important;
}

/* 隐藏Chrome/Safari滚动条（关键：不隐藏滚动功能） */
.tabs-scroll-container::-webkit-scrollbar {
	display: none !important;
}

/* 标签栏UL：强制flex布局，宽度随内容自适应（超出容器才会滚动） */
.poll-tabs {
	display: flex !important;
	flex-wrap: nowrap !important;
	/* 禁止换行（核心） */
	gap: 10px !important;
	/* 标签间距 */
	padding: 0 !important;
	margin: 0 !important;
	width: max-content !important;
	/* 宽度=内容总宽度（超出容器触发滚动） */
	min-width: 100% !important;
	/* 至少占满容器，避免空白 */
}

/* 标签项：不收缩、不拉伸，保持原宽度 */
.poll-tabs .nav-item {
	flex: 0 0 auto !important;
	margin: 0 !important;
}

/* 标签文字：不换行，保证标签宽度完整 */
.poll-tabs .nav-link {
	white-space: nowrap !important;
	padding: 8px 16px !important;
	border-radius: 4px !important;
}

.percentage {
	width: 200px
}


.sticky {
	position: sticky !important;
	top: 150px !important;
	z-index: 1020 !important;
}

/* 菜单容器样式 */
.dashboard-menu {
	max-width: 200px;
	/* 限制菜单宽度 */
	padding: 20px;
}

/* 菜单标题样式 */
.menu-title {
	text-transform: uppercase;
	font-size: 0.85rem;
	color: #6c757d;
	/* Bootstrap次要文本色 */
	letter-spacing: 0.5px;
	margin-bottom: 10px;
}

/* 菜单项基础样式 */
.menu-item {
	display: block;
	padding: 8px 12px;
	border-radius: 6px;
	color: #212529;
	text-decoration: none;
	margin-bottom: 4px;
	transition: background-color 0.2s;
}

/* 菜单项图标间距 */
.menu-item i {
	margin-right: 8px;
	width: 18px;
	/* 统一图标宽度，对齐文字 */
}

/* 选中态样式 */
.menu-item.active {
	background-color: #e9ecef;
	/* Bootstrap浅灰背景 */
	font-weight: 500;
}

/*  hover效果 */
.menu-item:hover:not(.active) {
	background-color: #f8f9fa;
}

/* 标题栏样式 */
.header-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}

.header-bar h1 {
	font-size: 1.8rem;
	font-weight: 700;
	margin: 0;
}

.polymarket-logo {
	color: #6c757d;
	font-size: 0.9rem;
	display: flex;
	align-items: center;
}

.polymarket-logo i {
	margin-right: 5px;
	font-size: 1.2rem;
}

/* 选举卡片样式 */
.election-card {
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 15px;
	margin-bottom: 15px;
	height: 230px
}

/* 卡片头部（国家+日期+类型） */
.card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}

.country-info {
	line-height: 1.2;
}

.country-info .date {
	font-size: 0.8rem;
	color: #6c757d;
}

.country-info .type {
	font-size: 0.9rem;
	color: #6c757d;
}

.country-flag {
	width: 40px;
	height: 28px;
	object-fit: cover;
	border-radius: 4px;
}

/* 候选人/政党列表项 */
.candidate-item {
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}

.candidate-item .percentage {
	width: 40px;
	font-weight: 500;
}

.candidate-item .avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	margin: 0 8px;
	object-fit: cover;
}

.candidate-item .progress-bar {
	flex: 1;
	height: 8px;
	background-color: #e5e7eb;
	border-radius: 4px;
	overflow: hidden;
}

.candidate-item .progress-bar-fill {
	height: 100%;
	background-color: #bdd5ea;
	border-radius: 4px;
}

.candidate-item .name {
	margin-left: 8px;
	font-size: 0.9rem;
}

/* 标题区域 */
.section-header {
	margin-bottom: 20px;
}

.section-title {
	font-size: 24px;
	font-weight: 600;
	color: #000000;
	margin-bottom: 8px;
}

.section-desc {
	font-size: 14px;
	color: #666666;
}


.event-card:hover {
	background-color: #f4f5f6;
	cursor: pointer;
}

/* 标题区域 - 响应式字号 */
.section-header {
	margin-bottom: 20px;
}

.section-title {
	font-size: clamp(1.25rem, 5vw, 1.5rem);
	/* 移动端自适应字号 */
	font-weight: 600;
	color: #000000;
	margin-bottom: 8px;
}

.section-desc {
	font-size: clamp(0.8rem, 3vw, 0.875rem);
	color: #666666;
	line-height: 1.5;
}

/* 事件卡片容器 - 响应式布局核心 */
.event-card {
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 12px;
	display: flex;
	flex-direction: column;
	/* 移动端默认垂直布局 */
	gap: 12px;
	/* 垂直布局时间距 */
}

/* 卡片左侧（日期+图标+标题+辅助信息） */
.card-left {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	/* 占满宽度 */
}

.date-block {
	text-align: center;
	min-width: 40px;
}

.date-number {
	font-size: 20px;
	font-weight: 600;
	color: #000000;
	line-height: 1;
}

.date-month {
	font-size: 12px;
	color: #666666;
}

.event-icon {
	width: 40px;
	height: 40px;
	border-radius: 6px;
	object-fit: cover;
	background-color: #f0f0f0;
	flex-shrink: 0;
	/* 防止图标被压缩 */
}

.event-info {
	line-height: 1.4;
	flex: 1;
	/* 占满剩余宽度 */
	min-width: 0;
	/* 解决文字溢出问题 */
}

.event-title {
	font-size: clamp(0.875rem, 4vw, 0.9375rem);
	font-weight: 500;
	color: #000000;
	margin-bottom: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	/* 超长标题省略 */
}

.event-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	/* 移动端减小间距 */
	font-size: 11px;
	/* 移动端减小字号 */
	color: #666666;
	flex-wrap: wrap;
	/* 内容过多时换行 */
}

.live-badge {
	background-color: #fef3f2;
	color: #dc3545;
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 10px;
	font-weight: 500;
}

/* 卡片右侧（标签+按钮）- 移动端优化 */
.card-right {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	/* 占满宽度 */
	flex-wrap: wrap;
	/* 标签和按钮自适应换行 */
	justify-content: space-between;
	/* 两端对齐 */
	align-items: center;
}

.tag-group {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	flex: 1;
	/* 标签组占满剩余宽度 */
	margin-right: 8px;
}

.event-tag {
	background-color: #f5f5f5;
	color: #666666;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 11px;
	/* 移动端减小字号 */
	white-space: nowrap;
	/* 标签不换行 */
}

.trade-btn {
	background-color: #0d6efd;
	color: #ffffff;
	border: none;
	border-radius: 6px;
	padding: 6px 12px;
	font-size: 12px;
	/* 移动端减小字号 */
	font-weight: 500;
	cursor: pointer;
	flex-shrink: 0;
	/* 按钮不被压缩 */
	min-width: 70px;
	/* 按钮最小宽度，保证点击区域 */
}

.trade-btn:hover {
	background-color: #0b5ed7;
}




/* 顶部导航栏（严格匹配原图样式） */
.top-nav {
	background-color: #f8f9fa;
	border-bottom: 1px solid #e9ecef;
	padding: 0.5rem 1rem;
	overflow-x: auto;
	white-space: nowrap;
	font-size: 0.75rem;
}

.top-nav-item {
	display: inline-flex;
	align-items: center;
	margin-right: 1rem;
	color: #6c757d;
}

.top-nav-badge {
	background-color: #dc3545;
	color: #fff;
	font-size: 0.65rem;
	padding: 0.1rem 0.3rem;
	border-radius: 0.25rem;
	font-weight: 600;
	margin-right: 0.3rem;
}

.top-nav-logo {
	width: 1rem;
	height: 1rem;
	border-radius: 0.15rem;
	margin-right: 0.3rem;
	object-fit: cover;
}

.top-nav-odds {
	color: #212529;
	font-weight: 500;
	margin-left: 0.3rem;
}

/* 主容器：Bootstrap标准container + 自适应布局 */

.main-wrapper {
	display: grid;
	grid-template-columns: 160px 1fr 300px;
	min-height: calc(100vh - 46px);
}

/* 左侧侧边栏（导航核心） */
.sidebar {
	background-color: #fff;
	border-right: 1px solid #e9ecef;
	padding: 1rem;
}

.sidebar-nav-item {
	display: flex;
	align-items: center;
	padding: 0.5rem 0.75rem;
	border-radius: 0.375rem;
	margin-bottom: 0.25rem;
	color: #212529;
	text-decoration: none;
	font-size: 0.875rem;
	cursor: pointer;
	transition: background-color 0.2s;
}

.sidebar-nav-item.active {
	background-color: #e9ecef;
	font-weight: 500;
}

.sidebar-nav-item:hover:not(.active) {
	background-color: #f8f9fa;
}

.sidebar-nav-item i {
	width: 1.1rem;
	margin-right: 0.5rem;
	text-align: center;
}

.sidebar-nav-item .count {
	margin-left: auto;
	color: #6c757d;
	font-weight: 400;
}

/* 中间内容区 */
.content-area {
	padding: 1rem;
	overflow-y: auto;
}

.content-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem;
}

.content-title {
	font-size: 1.375rem;
	font-weight: 600;
	margin: 0;
}

.toggle-switch-wrapper {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.875rem;
	color: #212529;
}

.sport-tabs {
	display: flex;
	gap: 1.5rem;
	margin-bottom: 1rem;
	border-bottom: 1px solid #e9ecef;
	padding-bottom: 0.5rem;
}

.sport-tab {
	font-size: 0.875rem;
	font-weight: 500;
	color: #6c757d;
	cursor: pointer;
	padding-bottom: 0.25rem;
	border-bottom: 2px solid transparent;
}

.sport-tab.active {
	color: #212529;
	border-bottom-color: #212529;
}

/* 赛事卡片（1:1还原原图） */
.event-card {
	border: 1px solid #e9ecef;
	border-radius: 0.5rem;
	padding: 0.75rem;
	margin-bottom: 0.75rem;
}

.event-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 0.75rem;
	font-size: 0.8rem;
}

.event-live {
	color: #dc3545;
	font-weight: 500;
}

.event-vol {
	color: #6c757d;
}

.event-link {
	color: #6c757d;
	text-decoration: none;
	font-size: 0.8rem;
}

.team-row {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.5rem;
}

.team-score {
	color: #6c757d;
	font-size: 0.875rem;
	width: 1.5rem;
	text-align: right;
}

.team-logo {
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 0.2rem;
	object-fit: cover;
}

.team-name {
	font-size: 0.875rem;
	font-weight: 500;
	flex: 1;
}

.team-record {
	font-size: 0.75rem;
	color: #6c757d;
}

.odds-group {
	display: flex;
	gap: 0.5rem;
	margin-left: auto;
}

.odds-btn {
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
	font-size: 0.8rem;
	font-weight: 500;
	min-width: 3rem;
	text-align: center;
}

/* 赔率按钮配色（严格匹配原图） */
.odds-btn.red {
	background: #f8d7da;
	color: #dc3545;
}

.odds-btn.green {
	background: #d1e7dd;
	color: #198754;
}

.odds-btn.pink {
	background: #fce8f3;
	color: #d946ef;
}

.odds-btn.orange {
	background: #fff3cd;
	color: #fd7e14;
}

.odds-btn.blue {
	background: #cff4fc;
	color: #0dcaf0;
}

/* 右侧交易面板 */
.trade-panel {
	background-color: #fff;
	border-left: 1px solid #e9ecef;
	padding: 1rem;
}

.panel-header {
	font-size: 1rem;
	font-weight: 600;
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.panel-team-tag {
	background: #f8d7da;
	color: #dc3545;
	padding: 0.15rem 0.4rem;
	border-radius: 0.25rem;
	font-size: 0.75rem;
	font-weight: 500;
}

.buy-sell-tabs {
	display: flex;
	margin-bottom: 1rem;
	border-bottom: 1px solid #e9ecef;
}

.buy-sell-tab {
	flex: 1;
	text-align: center;
	padding: 0.5rem;
	font-size: 0.875rem;
	font-weight: 500;
	cursor: pointer;
	border-bottom: 2px solid transparent;
}

.buy-sell-tab.active {
	border-bottom-color: #dc3545;
	color: #dc3545;
}

.price-btn-group {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 1rem;
}

.price-btn {
	flex: 1;
	padding: 0.5rem;
	border-radius: 0.25rem;
	font-weight: 500;
	text-align: center;
	font-size: 0.875rem;
}

.price-btn.buy {
	background: #dc3545;
	color: #fff;
}

.price-btn.sell {
	background: #e9ecef;
	color: #6c757d;
}

.limit-control {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
	font-size: 0.875rem;
}

.limit-input {
	width: 3rem;
	padding: 0.25rem 0.5rem;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	text-align: center;
	font-size: 0.875rem;
}

.shares-control {
	margin-bottom: 1rem;
}

.shares-label {
	font-size: 0.875rem;
	margin-bottom: 0.5rem;
	display: block;
}

.shares-input {
	width: 100%;
	padding: 0.5rem;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
}

.shares-btn-group {
	display: flex;
	gap: 0.5rem;
}

.shares-btn {
	flex: 1;
	padding: 0.25rem;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	font-size: 0.75rem;
	text-align: center;
	cursor: pointer;
	background: #fff;
}

.expiration-toggle {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem;
	font-size: 0.875rem;
}

.total-row {
	display: flex;
	justify-content: space-between;
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
}

.total-value {
	color: #0d6efd;
	font-weight: 500;
}

.trade-btn {
	width: 100%;
	padding: 0.6rem;
	background: #0d6efd;
	color: #fff;
	border: none;
	border-radius: 0.25rem;
	font-weight: 500;
	cursor: pointer;
	font-size: 0.875rem;
	margin-bottom: 0.5rem;
}

.terms-text {
	font-size: 0.75rem;
	color: #6c757d;
	text-align: center;
}




/* 顶部导航容器（核心滚动样式） */
.top-scroll-nav {
	background-color: #f8f9fa;
	border-bottom: 1px solid #e9ecef;
	padding: 0.4rem 1rem;
	overflow-x: auto;
	white-space: nowrap;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	gap: 1.2rem;
	scrollbar-width: none;
	/* 隐藏滚动条 */
}

.top-scroll-nav::-webkit-scrollbar {
	display: none;
	/* 隐藏滚动条（Chrome/Safari） */
}

/* 左侧日期区域 */
.nav-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 40px;
	margin-right: 0.5rem;
}

.nav-day {
	font-weight: 600;
	font-size: 0.9rem;
}

.nav-date-num {
	font-size: 1.1rem;
	font-weight: 700;
}

.nav-month {
	font-size: 0.7rem;
	color: #6c757d;
}

/* LIVE赛事状态 */
.nav-live {
	display: flex;
	align-items: center;
	color: #dc3545;
	font-weight: 500;
	margin-right: 1rem;
}

.nav-live-badge {
	background-color: #dc3545;
	color: #fff;
	font-size: 0.65rem;
	padding: 0.1rem 0.3rem;
	border-radius: 0.25rem;
	margin-right: 0.3rem;
}

.nav-vol {
	color: #6c757d;
	margin-left: 0.5rem;
}

/* 时间标签 */
.nav-time {
	color: #6c757d;
	min-width: 45px;
	text-align: center;
}

/* 赛事条目（双列队伍） */
.nav-event {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}

.nav-team {
	display: flex;
	align-items: center;
	gap: 0.4rem;
}

.nav-team-score {
	min-width: 18px;
	text-align: right;
	color: #6c757d;
}

.nav-team-logo {
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 0.15rem;
	object-fit: cover;
}

.nav-team-name {
	font-weight: 500;
	min-width: 30px;
}

.nav-team-odds {
	color: #212529;
	font-weight: 500;
}

/* 右侧箭头按钮 */
.nav-arrow {
	background: none;
	border: none;
	color: #6c757d;
	cursor: pointer;
	font-size: 1rem;
	margin-left: 0.5rem;
}




/* 标题+筛选栏 */
.activity-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	position: relative;
	/* 用于下拉菜单定位 */
}

.activity-title {
	font-size: 1.5rem;
	font-weight: 600;
	margin: 0;
}

.filter-group {
	display: flex;
	gap: 10px;
}

.filter-btn {
	background-color: #f5f5f7;
	border: 1px solid #e5e7eb;
	border-radius: 6px;
	padding: 6px 12px;
	font-size: 0.875rem;
	display: flex;
	align-items: center;
	gap: 5px;
	cursor: pointer;
	position: relative;
	min-width: 120px;
	justify-content: space-between;
}

.filter-btn.active {
	background-color: #eff1f3;
	border-color: #d1d5db;
}

/* 下拉菜单样式 */
.filter-dropdown {
	position: absolute;
	top: 100%;
	right: 0;
	margin-top: 5px;
	background-color: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	padding: 8px 0;
	width: 200px;
	z-index: 100;
	display: none;
}

.filter-dropdown.show {
	display: block;
}

.dropdown-option {
	padding: 8px 16px;
	font-size: 0.875rem;
	cursor: pointer;
	transition: background-color 0.2s;
}

.dropdown-option:hover {
	background-color: #f5f5f7;
}

.dropdown-option.selected {
	background-color: #eff1f3;
	color: #0066cc;
	font-weight: 500;
}

.dropdown-divider {
	height: 1px;
	background-color: #e5e7eb;
	margin: 4px 0;
}

/* Activity列表容器 */
.activity-list {
	border-top: 1px solid #e5e7eb;
}

/* Activity条目 */
.activity-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 15px 0;
	border-bottom: 1px solid #e5e7eb;
}

.item-icon {
	width: 36px;
	height: 36px;
	border-radius: 6px;
	object-fit: cover;
	flex-shrink: 0;
}

.item-content {
	flex: 1;
}

.item-title {
	font-size: 0.9375rem;
	font-weight: 500;
	margin-bottom: 4px;
	color: #1a1a1a;
}

.item-action {
	font-size: 0.875rem;
	color: #4b5563;
	line-height: 1.4;
}

.action-highlight {
	color: #0066cc;
	font-weight: 500;
}

.item-meta {
	font-size: 0.75rem;
	color: #9ca3af;
	display: flex;
	align-items: center;
	gap: 5px;
	margin-left: auto;
	flex-shrink: 0;
}


/* 标题+标签栏 */
.leaderboard-header {
	margin-bottom: 20px;
}

.leaderboard-title {
	font-size: 1.5rem;
	font-weight: 600;
	margin-bottom: 15px;
}

.period-tabs {
	display: flex;
	gap: 2px;
	margin-bottom: 15px;
}

.period-tab {
	padding: 6px 12px;
	font-size: 0.875rem;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	cursor: pointer;
	background-color: #f5f5f7;
}

.period-tab.active {
	background-color: #ffffff;
	border-color: #d1d5db;
	font-weight: 500;
}

/* 搜索+筛选栏 */
.filter-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}

.search-input {
	padding: 6px 12px;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	font-size: 0.875rem;
	width: 200px;
	background-color: #f5f5f7;
}

.category-filter {
	padding: 6px 12px;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	font-size: 0.875rem;
	background-color: #f5f5f7;
	cursor: pointer;
}

/* 排行榜表头 */
.leaderboard-header-row {
	display: flex;
	justify-content: flex-end;
	gap: 40px;
	padding: 8px 12px;
	font-size: 0.875rem;
	color: #6b7280;
	border-bottom: 1px solid #e5e7eb;
}

.header-item {
	cursor: pointer;
}

.header-item.active {
	font-weight: 500;
	color: #1a1a1a;
	border-bottom: 2px solid #1a1a1a;
}

/* 排行榜列表 */
.leaderboard-list {
	margin-bottom: 20px;
}

.leaderboard-item {
	display: flex;

	padding: 12px;
	border-bottom: 1px solid #e5e7eb;
}

.item-rank {
	font-size: 0.875rem;
	color: #6b7280;
	width: 20px;
	margin-right: 10px;
}

.item-avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	object-fit: cover;
	margin-right: 10px;
}

.item-username {
	font-size: 0.875rem;
	font-weight: 500;
	flex: 1;
}

.item-profit {
	font-size: 0.875rem;
	font-weight: 500;
	color: #059669;
	width: 120px;
	text-align: right;
}

.item-volume {
	font-size: 0.875rem;
	color: #6b7280;
	width: 120px;
	text-align: right;
}

/* 第一名高亮 */
.leaderboard-item:first-child {
	background-color: #fef3f2;
	border-radius: 4px;
	border: 1px solid #fecdd3;
	margin-bottom: 8px;
}

/* 右侧最大收益模块 */
.biggest-wins {
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 15px;
}

.wins-title {
	font-size: 0.9375rem;
	font-weight: 600;
	margin-bottom: 15px;
}

.wins-list {
	list-style: none;
	padding: 0;
}

.wins-item {
	display: flex;
	align-items: center;
	padding: 8px 0;
	border-bottom: 1px solid #f5f5f7;
}

.wins-rank {
	font-size: 0.75rem;
	color: #6b7280;
	width: 15px;
	margin-right: 8px;
}

.wins-avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	object-fit: cover;
	margin-right: 8px;
}

.wins-content {
	flex: 1;
}

.wins-username {
	font-size: 0.75rem;
	font-weight: 500;
	margin-bottom: 2px;
}

.wins-detail {
	font-size: 0.7rem;
	color: #6b7280;
}

.wins-profit {
	font-size: 0.75rem;
	color: #059669;
	text-align: right;
}

/* 分类标签栏 */
.category-tabs {
	display: flex;
	gap: 8px;
	margin-bottom: 15px;
	overflow-x: auto;
	padding-bottom: 8px;
	scrollbar-width: none;
	/* 隐藏滚动条 */
}

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

.category-tab {
	padding: 6px 12px;
	border-radius: 20px;
	font-size: 0.875rem;
	cursor: pointer;
	background-color: #f5f5f7;
	white-space: nowrap;
	transition: all 0.2s;
}

.category-tab.active {
	background-color: #0d6efd;
	color: #ffffff;
}

/* 右上角功能按钮 */
.top-right-actions {
	display: flex;
	gap: 10px;
	margin-bottom: 15px;
	justify-content: flex-end;
}

.action-btn {
	width: 32px;
	height: 32px;
	border-radius: 4px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: #6b7280;
}

.action-btn:hover {
	background-color: #f5f5f7;
}

/* 搜索栏 */
.search-bar {
	margin-bottom: 15px;
}

.search-input {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	font-size: 0.875rem;
}

/* 桌面端表头（PC/平板） */
.table-header {
	display: grid;
	grid-template-columns: 3fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 24px 24px;
	/* 新增2个图标列 */
	padding: 8px 12px;
	font-size: 0.8rem;
	color: #6b7280;
	border-bottom: 1px solid #e5e7eb;
	font-weight: 500;
	align-items: center;
}

.header-item {
	display: flex;
	align-items: center;
	gap: 4px;
	cursor: pointer;
}

.header-icon {
	color: #6b7280;
	cursor: pointer;
	font-size: 14px;
}

.header-icon:hover {
	color: #1a1a1a;
}

/* 市场列表容器 */
.market-list {
	border-bottom: 1px solid #e5e7eb;
}

/* 桌面端市场项（PC/平板） */
.market-item {
	display: grid;
	grid-template-columns: 3fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 24px 24px;
	/* 新增2个图标列 */
	align-items: center;
	padding: 12px;
	border-bottom: 1px solid #f5f5f7;
}

.market-item:last-child {
	border-bottom: none;
}

.market-content {
	display: flex;
	align-items: center;
	gap: 10px;
}

.market-icon {
	width: 28px;
	height: 28px;
	border-radius: 4px;
	object-fit: cover;
}

.market-title-wrap {
	flex: 1;
}

.market-title {
	font-size: 0.875rem;
	font-weight: 500;
	margin-bottom: 2px;
	line-height: 1.2;
}

.market-rules {
	font-size: 0.75rem;
	color: #0d6efd;
	text-decoration: underline;
	cursor: pointer;
}

.market-value {
	font-size: 0.8rem;
	color: #6b7280;
	text-align: right;
	/* 所有数值列右对齐 */
}

.reward-bar {
	display: flex;
	gap: 2px;
	height: 8px;
	width: 80%;
	margin: 0 auto;
}

.reward-segment {
	flex: 1;
	background-color: #e5e7eb;
	border-radius: 2px;
}

.reward-segment.active {
	background-color: #22c55e;
}

.price-group {
	display: flex;
	flex-direction: column;
	gap: 2px;
	width: 80%;
	margin-left: auto;
}

.price-yes {
	font-size: 0.8rem;
	color: #059669;
	background-color: #f0fdf4;
	padding: 2px 4px;
	border-radius: 2px;
	text-align: right;
}

.price-no {
	font-size: 0.8rem;
	color: #dc2626;
	background-color: #fef2f2;
	padding: 2px 4px;
	border-radius: 2px;
	text-align: right;
}

.item-icon {
	color: #6b7280;
	cursor: pointer;
	font-size: 14px;
	text-align: center;
}

.item-icon:hover {
	color: #0d6efd;
}

.mobile-only {
	display: none;
}
 /* 隐藏原生input */
    .file-input {
      display: none;
    }

    /* 上传按钮样式 */
    .upload-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 8px 16px;
      background-color: #0d6efd;
      color: #ffffff;
      border: none;
      border-radius: 4px;
      font-size: 14px;
      cursor: pointer;
      transition: background-color 0.2s;
    }

    .upload-btn:hover {
      background-color: #0b5ed7;
    }

    .upload-btn:active {
      background-color: #0a58ca;
    }

    /* 上传状态提示 */
    .upload-tip {
      margin-top: 8px;
      font-size: 12px;
      color: #6c757d;
    }
	.u-l-nav a{ font-size:16px; font-weight: bold;padding: 10px 12px;}
	.u-l-nav a.active{ background-color: #f4f5f6; border-radius: 6px; }
	
	
/* 1. 特大屏（xxl）：≥1400px（可选，针对超宽屏微调） */
@media (min-width: 1400px) {
	body {
		font-size: 15px;
	}

	.section-title {
		font-size: 24px;
	}

	.section-desc {
		font-size: 14px;
	}

	.event-title {
		font-size: 15px;
	}
}

/* 2. 超大屏（xl）：1200px ~ 1399.98px */
@media (min-width: 1200px) and (max-width: 1399.98px) {
	body {
		padding-top: 120px;
	}

}

/* 3. 大屏（lg）：992px ~ 1199.98px（对应你原有的1366px附近） */
@media (min-width: 992px) and (max-width: 1199.98px) {
	body {
		padding-top: 100px;
		font-size: 13px;
	}

	.nav-wrap {
		overflow-x: visible;
	}

	.break-left-nav-container {
		overflow-x: visible;
		/* 大屏显示全部菜单，不滚动 */
	}
}

/* 4. 中屏（md）：768px ~ 991.98px（平板尺寸） */
@media (min-width: 768px) and (max-width: 991.98px) {
	body {
		padding-top: 80px;
	}

	.event-card {
		flex-direction: row;
		/* PC端恢复水平布局 */
		gap: 0;
		align-items: center;
		justify-content: space-between;
	}

	.card-right {
		width: auto;
		/* PC端恢复自适应宽度 */
		flex-wrap: nowrap;
	}

	.event-meta {
		gap: 12px;
		/* PC端恢复间距 */
		font-size: 12px;
	}

	.live-badge {
		font-size: 11px;
	}

	.event-tag {
		font-size: 12px;
	}

	.trade-btn {
		font-size: 13px;
	}
}

/* 5. 小屏（sm）：576px ~ 767.98px（手机横屏） */
@media (min-width: 576px) and (max-width: 767.98px) {
	body {
		padding-top: 70px;
		font-size: 12px;
	}
}

/* 6. 超小屏（xs）：< 576px（手机竖屏，你原有的767px断点优化） */
@media (max-width: 575.98px) {
	body {
		padding-top: 130px;
		overflow-x: hidden;
	}

	.logo {
		font-size: 20px
	}

	.nav-wrap {
		width: 100%;
		-ms-overflow-style: none;
		scrollbar-width: none;
		overflow-x: auto !important;
	}

	.nav-wrap::-webkit-scrollbar {
		display: none;
	}

	.nav a {
		font-size: 16px
	}

	.break-left-list .gap-3 {
		gap: 1.5rem !important;
	}

	.break-left-list h6 {
		font-size: 0.8rem;
	}

	.break-left-list .w-25 {
		width: 30% !important;
	}

	.percentage {
		width: 100px
	}

	.scroll-container {
		padding: 4px 0 !important;
		/* 调整内边距，更紧凑 */
	}

	.scroll-item {
		padding: 8px 12px !important;
		/* 优化点击区域 */
		font-size: 14px !important;
		/* 适配手机字体大小 */
	}

	/* 针对目标列表容器的精确样式 */
	ul.list-group.list-group-flush.scroll-container {
		display: flex !important;
		flex-direction: row !important;
		/* 强制水平排列 */
		flex-wrap: nowrap !important;
		/* 禁止换行 */
		overflow-x: auto !important;
		/* 横向滚动 */
		overflow-y: hidden !important;
		/* 隐藏纵向滚动 */
		padding: 0.5rem 0 !important;
		/* 调整内边距 */
		margin: 0 !important;
		scroll-behavior: smooth !important;
		-ms-overflow-style: none !important;
		/* 隐藏IE滚动条 */
		scrollbar-width: none !important;
		/* 隐藏Firefox滚动条 */
	}

	/* 隐藏Chrome/Safari滚动条 */
	ul.list-group.list-group-flush.scroll-container::-webkit-scrollbar {
		display: none !important;
	}

	/* 列表项样式调整 */
	ul.list-group.list-group-flush.scroll-container .list-group-item {
		flex: 0 0 auto !important;
		/* 不收缩不拉伸 */
		white-space: nowrap !important;
		/* 文字不换行 */
		margin-right: 0.75rem !important;
		/* 项间距 */
		border: none !important;
		/* 移除默认边框 */
		padding: 0.5rem 0.75rem !important;
		/* 调整内边距 */
		background: transparent !important;
		/* 透明背景 */
	}

	.scroll-item {
		/* 已有的样式保持不变 */
		flex-direction: column;
		/* 强制图标和文字上下排列（如果需要更严格的垂直布局） */
		gap: 4px;
		/* 图标与文字之间的间距 */
		justify-content: center;
		/* 垂直居中对齐 */
	}

	.scroll-item>span:last-child {
		/* 这里写样式，比如隐藏 */
		display: none !important;
	}

	.activity-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.item-meta {
		margin-left: 0;
		margin-top: 8px;
	}

	.activity-item {
		flex-direction: column;
		align-items: flex-start;
	}

	.filter-bar {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.search-input {
		width: 100%;
	}

	.leaderboard-header-row {
		gap: 20px;
	}

	.item-profit,
	.item-volume {
		width: 80px;
	}

	/* 隐藏桌面端表头 */
	.table-header {
		display: none;
	}

	/* 移动端市场项：上下结构 */
	.market-item {
		display: flex;
		flex-direction: column;
		padding: 15px;
		border: 1px solid #e5e7eb;
		border-radius: 8px;
		margin-bottom: 10px;
	}

	/* 移动端顶部：标题+操作图标 */
	.mobile-top {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 10px;
		width: 100%;
	}

	.mobile-market-content {
		display: flex;
		align-items: center;
		gap: 10px;
		flex: 1;
	}

	.mobile-actions {
		display: flex;
		gap: 8px;
	}

	/* 移动端数据行：网格布局展示核心数据 */
	.mobile-data-row {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		width: 100%;
		margin-bottom: 8px;
	}

	.mobile-data-item {
		display: flex;
		flex-direction: column;
		gap: 2px;
	}

	.mobile-data-label {
		font-size: 0.7rem;
		color: #6b7280;
	}

	.mobile-data-value {
		font-size: 0.8rem;
		font-weight: 500;
	}

	/* 移动端奖励条+价格组 */
	.mobile-reward-price {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		margin-top: 8px;
	}

	.mobile-reward-bar {
		flex: 1;
		margin-right: 10px;
	}

	.mobile-price-group {
		min-width: 80px;
	}

	.desktop-only {
		display: none;
	}

	.mobile-only {
		display: block;
	}
	
	.mobile-nav-btn {
	      position: fixed;
	      bottom: 50px;
	      right: 15px;
	      z-index: 999;
	      width: 40px;
	      height: 40px;
	      border-radius: 50%;
	      background-color: #0d6efd;
	      color: #fff;
	      border: none;
	      display: flex;
	      align-items: center;
	      justify-content: center;
	      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
	    }
	
	    /* Offcanvas样式定制 */
	    .offcanvas-nav {
	      width: 280px !important;
	    }
	
	    .offcanvas-header {
	      border-bottom: 1px solid #e9ecef;
	      padding: 15px 20px;
	    }
	
	    .offcanvas-body {
	      padding: 20px 15px;
	    }
	
	
}