/* ── 全站通用样式 ── */

/* ── 主题 CSS 变量（浅色默认）── */
:root {
    --bg-body:       #f8f9fa;
    --bg-card:       #ffffff;
    --bg-navbar:     #ffffff;
    --bg-sidebar:    #ffffff;
    --bg-footer:     #ffffff;
    --text-body:     #333333;
    --text-muted:    #6c757d;
    --border-color:  #e9ecef;
    --hljs-theme-url: url("https://cdn.bootcdn.net/ajax/libs/highlight.js/11.9.0/styles/github.min.css");
}

/* ── 深色主题变量 ── */
[data-theme="dark"] {
    --bg-body:       #1a1d23;
    --bg-card:       #24282f;
    --bg-navbar:     #1e2229;
    --bg-sidebar:    #24282f;
    --bg-footer:     #1e2229;
    --text-body:     #d4d8e0;
    --text-muted:    #8a90a0;
    --border-color:  #363c48;
    --hljs-theme-url: url("https://cdn.bootcdn.net/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css");
}

/* ── 跟随系统：当 data-theme="auto" 且系统深色时应用深色变量 ── */
@media (prefers-color-scheme: dark) {
    [data-theme="auto"] {
        --bg-body:       #1a1d23;
        --bg-card:       #24282f;
        --bg-navbar:     #1e2229;
        --bg-sidebar:    #24282f;
        --bg-footer:     #1e2229;
        --text-body:     #d4d8e0;
        --text-muted:    #8a90a0;
        --border-color:  #363c48;
        --hljs-theme-url: url("https://cdn.bootcdn.net/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css");
    }
}

/* ── 将 CSS 变量应用到实际元素 ── */
body {
    background-color: var(--bg-body) !important;
    color: var(--text-body) !important;
    transition: background-color .2s, color .2s;
}
.navbar {
    background-color: var(--bg-navbar) !important;
    border-bottom-color: var(--border-color) !important;
}
.card {
    background-color: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}
.card-header, .card-footer {
    background-color: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}
footer {
    background-color: var(--bg-footer) !important;
    border-top-color: var(--border-color) !important;
    color: var(--text-muted) !important;
}
.text-muted { color: var(--text-muted) !important; }
.text-dark  { color: var(--text-body) !important; }
.border, .border-bottom, .border-top, .border-right, .border-left {
    border-color: var(--border-color) !important;
}
.dropdown-menu {
    background-color: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}
.dropdown-item {
    color: var(--text-body) !important;
}
.dropdown-item:hover {
    background-color: var(--border-color) !important;
}
.list-group-item {
    background-color: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    color: var(--text-body) !important;
}
.bg-white { background-color: var(--bg-card) !important; }
.bg-light  { background-color: var(--bg-body)  !important; }
/* 输入框深色适配 */
[data-theme="dark"] .form-control,
[data-theme="auto"] .form-control {
    background-color: #2c313a;
    border-color: #454d5a;
    color: #d4d8e0;
}
[data-theme="dark"] .form-control:focus,
[data-theme="auto"] .form-control:focus {
    background-color: #2c313a;
    color: #d4d8e0;
}
@media (prefers-color-scheme: light) {
    [data-theme="auto"] .form-control { background-color: #fff; border-color: #ced4da; color: #495057; }
}

/* ── 主题切换按钮（navbar 内联） ── */
#theme-toggle {
    background: none;
    border: none;
    padding: 0 .5rem;
    opacity: .75;
    transition: opacity .2s;
    font-size: 1rem;
    color: inherit;
}
#theme-toggle:hover { opacity: 1; }

/* 字体大小工具类 */
.f-13 { font-size: 13px !important; }
.f-14 { font-size: 14px !important; }
.f-15 { font-size: 15px !important; }

/* 正文字体 */
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, "Noto Sans", sans-serif,
                 "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 15px;
}

/* 导航激活态 */
.navbar-nav .nav-link.active {
    color: #17a2b8 !important;
    font-weight: 600;
}

/* 卡片悬停微动效 */
.card {
    transition: box-shadow .15s ease-in-out, background-color .2s;
}
.card:hover {
    box-shadow: 0 .25rem .75rem rgba(0,0,0,.08) !important;
}

/* 回到顶部按钮 */
#back-to-top {
    opacity: .7;
    transition: opacity .2s;
}
#back-to-top:hover { opacity: 1; }

/* 标签云链接 */
.tag-cloud a:hover {
    background-color: #17a2b8 !important;
    color: #fff !important;
}

/* 分页 */
.pagination .page-link {
    color: #17a2b8;
}
.pagination .page-item.active .page-link {
    background-color: #17a2b8;
    border-color: #17a2b8;
}

/* 页脚 */
footer {
    font-size: 13px;
}

/* 首页文章列表卡片 */
.article-title-link {
    color: var(--text-body);
}
.article-title-link:hover {
    color: #17a2b8;
    text-decoration: none;
}
.article-summary {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
/* 深色模式下 card-header/footer 背景跟随卡片色 */
[data-theme="dark"] .card-header.bg-white,
[data-theme="dark"] .card-footer.bg-white {
    background-color: var(--bg-card) !important;
}
@media (prefers-color-scheme: dark) {
    [data-theme="auto"] .card-header.bg-white,
    [data-theme="auto"] .card-footer.bg-white {
        background-color: var(--bg-card) !important;
    }
}
/* 无封面图时右侧内容撑满 */
.article-thumb + div {
    min-width: 0;
}

/* ── 全局响应式自适应 ── */

/* 导航栏 */
/* 移动端/平板：导航品牌字体缩小，汉堡图标与主题按钮并排（<992px 折叠） */
@media (max-width: 991.98px) {
    .navbar-brand {
        font-size: 1rem !important;
    }
    /* 折叠菜单展开时撑满宽度 */
    #navMain .navbar-nav {
        width: 100%;
    }
    #navMain .nav-item {
        border-bottom: 1px solid var(--border-color);
    }
    #navMain .nav-item:last-child {
        border-bottom: none;
    }
}

/* 文章列表卡片 —— 移动端封面图缩小 */
@media (max-width: 575.98px) {
    /* xs：图片缩至 80px，避免挤占文字区域 */
    .article-thumb img {
        width: 80px !important;
        height: 60px !important;
    }
    /* 标题字号微缩 */
    .card-body h5 {
        font-size: 0.9rem !important;
    }
    /* 底部操作栏：阅读全文按钮右移 */
    .card-footer .ml-auto {
        font-size: .7rem !important;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    /* sm：图片缩至 100px */
    .article-thumb img {
        width: 100px !important;
        height: 75px !important;
    }
}

/* 侧边栏：中屏以下跟主内容纵向排列 */
@media (max-width: 991.98px) {
    /* 确保侧边栏不超出父容器 */
    aside .card {
        word-break: break-word;
    }
}

/* 文章详情页 */
@media (max-width: 767.98px) {
    /* 文章正文图片不超出屏宽 */
    .article-content img {
        max-width: 100%;
        height: auto !important;
    }
    /* 代码块水平滚动 */
    .article-content pre {
        overflow-x: auto;
    }
}

/* 表格响应式 */
@media (max-width: 767.98px) {
    .table-responsive-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* 归档页 —— 时间戳在超小屏隐藏 */
@media (max-width: 575.98px) {
    .d-sm-none-custom {
        display: none !important;
    }
}

/* 分页：移动端减小间距 */
@media (max-width: 575.98px) {
    .pagination .page-link {
        padding: .25rem .5rem;
        font-size: .8rem;
    }
}

/* 用户主页/编辑资料 —— 头像居中 */
@media (max-width: 767.98px) {
    .user-avatar-wrap {
        text-align: center;
    }
}

/* 首页轮播图：移动端隐藏文字说明 */
@media (max-width: 575.98px) {
    .carousel-caption {
        display: none !important;
    }
}

/* 搜索页/结果页 */
@media (max-width: 767.98px) {
    .search-result-title {
        font-size: 1rem;
    }
}

/* 主题切换按钮（移动端/平板，位于汉堡旁） */
@media (max-width: 991.98px) {
    #theme-toggle {
        padding: 0 .4rem;
        font-size: 0.95rem;
    }
}
