/* ==================== 路由页面样式修复 ==================== */
/* 确保项目页面在新架构下正常显示 */

/* 发现页容器调整 */
.faxian-container {
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* 移除发现页的独立标题栏（使用page-header代替） */
.faxian-header {
    display: none !important;
}

/* 发现页内容区域 - 直接复制直播页的成功模式 */
#faxian-content {
    padding: 16px 16px 64px 16px; /* 直接使用直播页的padding模式 */
    background: white;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* 响应式断点 - 复制直播页的响应式设置 */
@media (max-width: 768px) {
    #faxian-content {
        padding: 12px 12px 64px 12px; /* 复制直播页的768px断点设置 */
    }
}

@media (max-width: 480px) {
    #faxian-content {
        padding: 8px 8px 64px 8px; /* 复制直播页的480px断点设置 */
    }
}

#faxian-content .faxian-section {
    padding: 8px 12px;
}

/* 直播页容器调整 */
.live-container {
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* 移除直播页的独立标题栏（使用page-header代替） */
.live-header {
    display: none !important;
}

/* 直播页sticky tabs调整 */
.live-sticky-tabs {
    position: sticky;
    top: 0;
    z-index: 99;
}

/* 动态页容器调整 */
.dongtai-container {
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* 移除动态页的独立头部（使用page-header代替） */
.dongtai-header {
    display: none !important;
}

/* 动态页内容区域调整 */
.dongtai-content {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* 确保项目内容容器正确显示 */
#faxian-content .faxian-container,
#zhibo-content .live-container,
#dongtai-content .dongtai-container {
    position: relative;
}

/* 移除项目内容的多余padding */
.page-body > .faxian-container,
.page-body > .live-container,
.page-body > .dongtai-container {
    padding: 0;
    margin: 0;
}


/* 确保所有页面的底部导航都正常固定在底部 */
#page-home .bottom-nav,
#faxian-bottom-nav,
#zhibo-bottom-nav,
#dongtai-bottom-nav,
#shipin-bottom-nav,
#yuepao-bottom-nav {
    position: fixed !important;
    bottom: 0 !important;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 540px;
    z-index: 200 !important; /* 确保在页面内容之上 */
}

/* 为底部导航预留空间 */
#faxian-content,
#zhibo-content,
#dongtai-content,
#shipin-content,
#yuepao-content {
    padding-bottom: 64px; /* 底部导航高度 */
}


/* 确保直播展开页面在新架构下正常工作 */
/* .live-expand-page 保持原有fixed定位，因为这是直播页内部的模态框 */

/* 移除所有子页面的page-content padding，保持与首页一致 */
/* 覆盖 style.css 中旧的 .page-content 样式 */
.page-content {
    padding: 0 !important;
    height: 100% !important; /* 覆盖旧的 calc(100vh - 70px) */
    overflow-y: visible !important; /* 由子元素控制滚动 */
    display: flex !important; /* 确保flex布局生效 */
    flex-direction: column !important; /* 确保垂直布局 */
}

/* 覆盖 style.css 中旧的 .page-header 样式（第1080行） */
.page-header {
    text-align: left !important; /* 覆盖旧的 center */
    margin-bottom: 0 !important; /* 覆盖旧的 30px */
    padding: 8px 10px !important; /* 覆盖旧的 20px 0 */
    border: none !important; /* 去除边框 */
    border-radius: 0 !important; /* 去除圆角 */
    background: rgba(255, 255, 255, 0.95) !important; /* 使用简洁背景 */
}

/* 统一所有页面的滚动条样式 */
#page-home .main-container::-webkit-scrollbar,
.page-body::-webkit-scrollbar,
.faxian-container::-webkit-scrollbar,
.live-container::-webkit-scrollbar,
.dongtai-container::-webkit-scrollbar {
    width: 4px;
}

#page-home .main-container::-webkit-scrollbar-track,
.page-body::-webkit-scrollbar-track,
.faxian-container::-webkit-scrollbar-track,
.live-container::-webkit-scrollbar-track,
.dongtai-container::-webkit-scrollbar-track {
    background: #f1f1f1;
}

#page-home .main-container::-webkit-scrollbar-thumb,
.page-body::-webkit-scrollbar-thumb,
.faxian-container::-webkit-scrollbar-thumb,
.live-container::-webkit-scrollbar-thumb,
.dongtai-container::-webkit-scrollbar-thumb {
    background: var(--primary-color, #ff9500);
    border-radius: 2px;
}

#page-home .main-container::-webkit-scrollbar-thumb:hover,
.page-body::-webkit-scrollbar-thumb:hover,
.faxian-container::-webkit-scrollbar-thumb:hover,
.live-container::-webkit-scrollbar-thumb:hover,
.dongtai-container::-webkit-scrollbar-thumb:hover {
    background: #e6850e;
}

/* Firefox滚动条样式 */
#page-home .main-container,
.page-body,
.faxian-container,
.live-container,
.dongtai-container {
    scrollbar-width: thin;
    scrollbar-color: var(--primary-color, #ff9500) #f1f1f1;
}

/* Toast提示动画 */
@keyframes fadeInOut {
    0% { opacity: 0; transform: translate(-50%, -50%) scale(0.9); }
    10% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    90% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    100% { opacity: 0; transform: translate(-50%, -50%) scale(0.9); }
}

/* 首页特殊处理 - 让main-container可滚动，而不是page-home */
#page-home {
    overflow: hidden; /* page-home不滚动，避免影响fixed定位 */
}

#page-home .main-container {
    /* 保持原有的宽度和居中设置 */
    width: 100%;
    max-width: 540px;
    margin: 0 auto;
    
    /* 滚动相关设置 */
    position: relative;
    height: 100vh;
    height: 100dvh;
    overflow-y: auto; /* 滚动发生在main-container */
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 70px; /* 为底部导航预留空间 */
    box-sizing: border-box;
}