/* ============================================================
   footer.css - new.html 底部样式（独立文件）
   参考 index.html 的 footer 视觉：
   顶部 45px 蓝条 + 白底内容区（左 logo / 中 友情链接下拉框 / 右 三个圆形分享图标）
   + 分隔线 + 居中两行版权文字
   说明：new.html 底部 HTML 不允许修改，logo 与分享图标通过
   .w1080 的 ::before / ::after 伪元素以背景图方式补出；
   友情链接 9 个链接（.link-a）复刻原站 .a-select 的悬停下拉交互。
   ============================================================ */

/* ---------- 整体 ---------- */
.footer {
    border-top: 45px solid #265ca3; /* 顶部蓝条（index: #footer inline border-top 45px） */
    background: #fff;
}

/* ---------- 上半区：友情链接带（index: .footer-widgets-wrap padding 50px 0） ---------- */
.footer .links {
    background: #fff;
    padding: 50px 0;
}

.footer .links .w1080 {
    width: 100%;
    max-width: 1500px;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative; /* 作为 ::before/::after 与下拉面板的定位基准 */
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
}

/* 左侧校徽 logo（index: col-lg-3 img.foot-logo，图为校徽+校名横排） */
.footer .links .w1080::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 255px;
    height: 47px;
    background: url("https://xwcbxy.nnnu.edu.cn/dfiles/16267/template/309470/skin/images/indeximg_03.jpg") no-repeat left center / contain;
}

/* 右侧三个圆形分享图标：真实 HTML（.col-lg-3，与 index.html 相同的行内样式），
   绝对定位到行的最右侧（原 index 中由 col 栅格 + flex-end 实现） */
.footer .links .w1080 .col-lg-3 {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

/* ---------- 中间：友情链接下拉框（index: .a-select > .select-div） ---------- */
.footer .links .linkTit {
    float: none; /* 抵消模板 .fl */
    display: block;
    width: 630px;
    box-sizing: border-box;
    border: 1px solid #265ca3;
    background: #fff;
    color: #000;
    font-size: 16px;
    line-height: 36px;
    height: 36px;
    text-align: center;
    cursor: pointer;
}

/* 图中框内只有"友情链接 ⌄"，隐藏英文小字 */
.footer .links .linkTit font {
    display: none;
}

/* 下拉箭头（index: chevron svg） */
.footer .links .linkTit::after {
    content: "";
    display: inline-block;
    margin-left: 6px;
    border: 5px solid transparent;
    border-top-color: #000;
    transform: translateY(2px);
}

/* ---------- 下拉面板（index: .a-select ul，向上展开、蓝底白字） ---------- */
.footer .links .link-a {
    float: none; /* 抵消模板 .fl */
    display: none;
    position: absolute;
    left: 50%;
    bottom: calc(50% + 19px); /* 贴在下拉框上沿（框高 38px 的一半 + 1px 边框） */
    transform: translateX(-50%);
    width: 630px;
    box-sizing: border-box;
    background: #265ca3;
    border: 1px solid #265ca3;
    border-bottom: 0;
    padding: 5px 0;
    z-index: 10;
}

/* 悬停"友情链接"框本身展开（原站为 JS slideToggle，此处用 :has() 纯 CSS 复刻）；
   面板自身被悬停时保持展开，避免从框移入面板瞬间闪烁消失 */
.footer .links .w1080:has(.linkTit:hover) .link-a,
.footer .links .w1080 .link-a:hover {
    display: block;
}

.footer .links .link-a a {
    display: block;
    line-height: 40px;
    text-align: center;
    color: #fff;
    text-decoration: none;
    font-size: 15px;
}

.footer .links .link-a a:hover {
    font-weight: bold;
    background: rgba(255, 255, 255, 0.08);
}

/* ---------- 版权区（index: #copyrights，顶部分隔线 + 居中两行） ---------- */
.footer .copyright {
    background: #fff;
    border-top: 1px solid #dee2e6;
    padding: 18px 0 45px;
    text-align: center;
    font-size: 15px;
    color: #333;
}

.footer .copyright p {
    margin: 0 0 28px;
    line-height: 1.6;
}

.footer .copyright p:last-child {
    margin-bottom: 0;
}

.footer .copyright a {
    color: #1966bd;
    text-decoration: none;
}

.footer .copyright a:hover {
    text-decoration: underline;
}

/* ---------- 微信二维码弹窗（点击 .weixin-trigger 触发，遮罩 + 居中弹出） ---------- */
#mask {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 998;
}

#LoginBox {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
    background: #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
    padding: 12px;
    text-align: center;
}

#LoginBox .e_ma {
    margin: 0;
}

#LoginBox .e_ma p {
    margin: 8px 0 0;
    font-size: 14px;
    color: #333;
}

/* ---------- 窄屏适配（≤991px，对齐 Bootstrap lg 断点：
   index.html 在此宽度以下 logo/友链/图标不再同一行，改为换行堆叠） ---------- */
@media (max-width: 991px) {
    .footer .links { padding: 24px 0; }
    .footer .links .w1080 { flex-wrap: wrap; }           /* 允许换行 */
    .footer .links .w1080::before { display: none; }     /* 左 logo 隐藏（空间不足） */
    /* 友情链接框独占一行 */
    .footer .links .linkTit { flex: 0 0 100%; width: 100%; }
    .footer .links .link-a { width: 100%; }
    /* 分享图标换到下一行：脱离绝对定位，整行居中（行内 justify-content:flex-end 需 !important 覆盖） */
    .footer .links .w1080 .col-lg-3 {
        position: static;
        transform: none;
        flex: 0 0 100%;
        margin-top: 15px;
        justify-content: center !important;
    }

    .footer .copyright { padding: 14px 4% 30px; }
    .footer .copyright p { margin-bottom: 14px; }
}