/* 背景渐变颜色 */
#top-simple-header-bar {
    background: linear-gradient(135deg, rgb(206, 181, 104) 5%, rgb(125, 180, 147) 40%, rgb(78, 170, 153) 50%);
    position: fixed;
    width: 100%;
    z-index: 9999;
    height: 40px; /* top-bar 高度 */
    top: 0; /* 确保 top-bar 始终位于顶部 */
    display: flex;
    align-items: center; /* 保持 top-bar 本身的内容垂直居中 */
}

/* 在 CSS 中为 body 设置初始 padding-top，防止内容被 Top Bar 遮挡 */
body {
    padding-top: 40px; /* 默认的 padding-top，避免内容被遮挡 */
}

/* 布局样式 */
.top-bar-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    height: 100%; /* 确保内容占据整个 top-bar 高度 */
}

.top-bar-item {
    flex: 1;
    text-align: center;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center; /* 确保每个 top-bar-item 内的内容垂直居中 */
    height: 100%; /* 确保 item 高度与 top-bar 一致 */
    line-height: 40px; /* 与 top-bar 高度一致，确保文本垂直居中 */
}

/* 自定义文字样式 */
.custom-text {
    font-size: 16px !important;
}

/* 简繁切换链接样式 */
#StranLink {
    font-size: 16px !important;
    color: #fff;
    text-decoration: none;
}

#StranLink:hover {
    text-decoration: underline;
}

/* 响应式处理 - 移动端隐藏自定义文字 */
@media (max-width: 768px) {
    .top-bar-content {
        flex-direction: row;
        justify-content: space-around;
    }

    .custom-text {
        display: none;
    }
}