/* 公共的样式 */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;

}

.nav {
    height: 50px;
    background-color: rgba(58, 58, 58, 0.3); /* 0.8是透明度，0=全透，1=不透明 */
    color: rgb(255, 255, 255);
    line-height: 50px;
    text-align: center;
	font-size: 13px;     /* 标题字体放大一点，更醒目 */
    font-weight: bold;   /* 字体加粗 */
    letter-spacing: 2px; /* 文字间距，更美观 */
}

.container {
    width: 100%;
    height: calc(100% - 50px);

    display: flex;
    align-items: center;
    justify-content: center;
}

/* 备案信息样式 */
.icp-info {
    position: fixed; 
    bottom: 10px;    
    left: 0;
    width: 100%;
    
    /* 将父容器改为 Flex 布局 */
    display: flex;
    justify-content: center; /* 水平居中（替代原先的 text-align: center） */
    align-items: center;     /* 垂直居中，解决高低不平的问题 */
    
    font-size: 12px;   
    color: #ffffff;    
    opacity: 0.8;      
}

/* 统一所有备案链接的样式和对齐方式 */
.icp-info .beian-link {
    display: inline-flex;
    align-items: center; /* 保持不变：确保链接内部的图标和文字对齐 */
    color: #ffffff;
    text-decoration: none;
}

.icp-info .beian-icon {
    height: 16px;
    margin-right: 6px;
}

.icp-info .separator {
    margin: 0 12px;
}

.icp-info a:hover {
    text-decoration: underline; 
}