/*============================= 页脚备案容器开始 blog.yujiay.wang =============================*/

/* 为 #footer-bar 设置相对定位，作为备案容器的定位参考 */
#footer-bar {
    /* 为备案信息预留更多空间 */
    min-height: 100px;
    /* 底部内边距，确保有足够空间 */
    padding-bottom: 50px;
}

/* 备案链接容器样式 - 使用ID选择器 */
#beian-links {
    /* 定位样式 - 绝对定位在 footer-bar 底部居中 */
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);

    /* 文本和布局样式 */
    display: block;
    width: auto;
    text-align: center;
    white-space: nowrap;

    /* 字体样式 */
    font-size: 12px;
    color: var(--anzhiyu-fontcolor);
    line-height: 1.5;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    
    /* 确保在最上层 */
    z-index: 10;
}

/* 备案链接的样式 */
#beian-links a.footer-bar-link {
    color: var(--anzhiyu-fontcolor); /* 链接文字也设置为深色 */
    text-decoration: none;
    transition: color 0.3s ease; /* 添加过渡效果 */
}

#beian-links a.footer-bar-link:hover {
    text-decoration: none;
    color: var(--anzhiyu-lighttext); /* 悬停颜色 */
}

/* 移动端适配 */
@media (max-width: 768px) {
    #beian-links {
        margin: -30px 0;
        font-size: 11px;
        white-space: normal; /* 允许内容换行 */
        text-align: center; /* 确保换行后内容依然居中 */
        max-width: 90%;
        bottom: 10px;
        /* 使整个容器在移动端独占一行，居中效果更稳定 */
        display: block;
    }
    
    #beian-links a.footer-bar-link {
        display: inline-block;
        line-height: 1.8;
        padding: 2px 4px;
        /* 单独成行，可以设置为 block，并赋予宽度或使用其他布局 */
        /* display: block; */
    }

     /* 移动端适配链接样式 */
    #beian-links .separator {
            display: none !important; /* 上下排列时隐藏竖线分隔符 */
        }
    
}

/* 暗色模式适配 */
[data-theme="dark"] #beian-links a.footer-bar-link {
    color: var(--anzhiyu-fontcolor);;
}

[data-theme="dark"] #beian-links a.footer-bar-link:hover {
    color: var(--anzhiyu-lighttext);
    text-decoration: none;
}

/* 竖线分隔符样式 */
#beian-links .separator {
    color: #CCCCCC;
    margin: 0 10px;
    display: inline-block;
}

/* 暗色模式竖线适配 */
[data-theme="dark"] #beian-links .separator {
    color: #666666;
}

/*============================= 页脚备案容器结束 blog.yujiay.wang =============================*/