/* 兼容性修复和强制样式 */

/* 确保右下角标语在所有环境下都能显示 */
.bottom-right-slogan {
    position: fixed !important;
    bottom: 25px !important;
    right: 25px !important;
    z-index: 1000 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* 确保用户信息卡片正确显示 */
.user-info {
    display: flex !important;
    align-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 确保页脚信息正确显示 */
.main-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background-color: #ffffff !important;
}

/* 页脚文字颜色强制设置 */
.address-info, .copyright-info {
    color: #ffffff !important;
}

.group-link, .icp-link, .beian-link {
    color: #ffffff !important;
}

.separator {
    color: #ffffff !important;
}

/* 用户信息颜色强制设置 */
.current-user {
    color: #ffffff !important;
}

#current-username {
    color: #ffffff !important;
}

/* 修复可能的浏览器兼容性问题 */
.tech-header {
    display: flex !important;
    visibility: visible !important;
}

/* 确保标语文字可见 */
.slogan-text {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #ffffff !important;
}

/* 强制显示分隔符 */
.separator {
    opacity: 0.7 !important;
    visibility: visible !important;
}

/* 确保链接可见 */
.group-link, .icp-link, .beian-link {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 修复Internet Explorer兼容性 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .bottom-right-slogan {
        background: rgba(0, 255, 170, 0.2) !important;
        border: 1px solid rgba(0, 255, 170, 0.4) !important;
    }
    
    .user-info {
        background: rgba(0, 255, 170, 0.15) !important;
        border: 1px solid rgba(0, 255, 170, 0.3) !important;
    }
}

/* 修复Edge兼容性 */
@supports (-ms-ime-align: auto) {
    .bottom-right-slogan {
        background: rgba(0, 255, 170, 0.2) !important;
    }
}

/* 确保在所有浏览器中正确显示 */
* {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

/* 强制启用硬件加速 */
.bottom-right-slogan,
.user-info,
.tech-header {
    -webkit-transform: translateZ(0) !important;
    -moz-transform: translateZ(0) !important;
    -ms-transform: translateZ(0) !important;
    -o-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    
    -webkit-backface-visibility: hidden !important;
    -moz-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

/* 移动端优化 */
@media (max-width: 768px) {
    .bottom-right-slogan {
        bottom: 15px !important;
        right: 15px !important;
        padding: 6px 10px !important;
        min-width: 160px !important;
    }
    
    .slogan-text {
        font-size: 10px !important;
    }
    
    .user-info {
        padding: 4px 8px !important;
        gap: 4px !important;
    }
    
    .single-line-footer {
        flex-direction: column !important;
        gap: 5px !important;
    }
    
    .separator {
        display: none !important;
    }
}

/* 确保在低分辨率下的可读性 */
@media (max-width: 480px) {
    .title-label {
        font-size: 10px !important;
        line-height: 1.2 !important;
    }
    
    .address-info, .copyright-info {
        font-size: 8px !important;
        line-height: 1.3 !important;
    }
    
    .group-link, .icp-link, .beian-link {
        font-size: 8px !important;
        padding: 2px 4px !important;
    }
}

/* 修复可能的字体加载问题 */
@font-face {
    font-family: 'Microsoft YaHei Fallback';
    src: local('Microsoft YaHei'), local('微软雅黑'), local('SimHei'), local('黑体');
    font-weight: normal;
    font-style: normal;
}

.slogan-text {
    font-family: 'Microsoft YaHei', 'Microsoft YaHei Fallback', '微软雅黑', 'SimHei', '黑体', sans-serif !important;
}

/* 强制颜色显示 */
:root {
    --slogan-color-fallback: #ffffff;
    --header-bg-fallback: #001A37;
    --separator-color-fallback: #00FFAA;
}

.slogan-text {
    color: var(--slogan-color, var(--slogan-color-fallback)) !important;
}

.main-footer {
    background-color: var(--header-bg, var(--header-bg-fallback)) !important;
}

.separator {
    color: var(--separator-color, var(--separator-color-fallback)) !important;
}