/* ============================================================
 * 页脚样式（app-footer）
 * ------------------------------------------------------------
 * 用途：全站统一页脚样式，包含品牌标语 + 版权信息
 * 调用：在 base.html head 中统一引入本文件
 * 依赖：使用 style.css 中定义的 CSS 变量（--color-* / --radius-*）
 * 响应式：断点规则已统一收敛至 responsive.css（⑨ 页脚断点），本文件仅保留基础样式
 * 代码规范：4空格缩进，CSS变量优先，0硬编码颜色
 * ============================================================ */

/* ------------------------------------------------------------
 * ① 基础样式（桌面端，>1200px）
 * ------------------------------------------------------------ */
.app-footer {
    grid-column: 2;
    grid-row: 2;
    position: relative;
    z-index: 20;
    margin-top: 0;
    padding: 20px 0;
    border-top: 1px solid var(--color-border);
    background: transparent;   /* 页脚底色始终透明（浅色/深色一致），不随后台方案 footer_bg 变量 */
}

.app-footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 24px;
    font-size: 12px;
    /* 背景透明：文字改用主题变量跟随浅/深色（原为硬编码白色，仅适配旧深色背景） */
    color: var(--color-text-secondary);
}

.app-footer-slogan {
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text-title);
}

.app-footer-text {
    color: var(--color-text-dim);
}

.app-footer a {
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: opacity 0.2s, color 0.2s;
}

.app-footer a:hover {
    color: var(--color-accent);
    opacity: 1;
}