/* ============================================================
   基础组件样式
   ============================================================ */

* { box-sizing: border-box; }

body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--p); text-decoration: none; }
a:hover { color: var(--p-h); }

h1, h2, h3, h4, h5 { color: var(--text); }

/* ---------- 导航 ---------- */
.app-navbar {
    background: var(--nav-bg) !important;
    box-shadow: var(--shadow);
}
.app-navbar .navbar-brand {
    color: #fff !important;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}
.app-navbar .navbar-brand img { height: 30px; width: auto; }
.app-navbar .nav-link { color: var(--nav-text) !important; font-size: .95rem; }
.app-navbar .nav-link:hover,
.app-navbar .nav-link.active { color: #fff !important; }
.app-navbar .nav-link.active { font-weight: 600; }
.app-navbar .dropdown-menu {
    background: var(--surface);
    border: 1px solid var(--border);
}
.app-navbar .dropdown-item { color: var(--text); }
.app-navbar .dropdown-item:hover { background: var(--p-l); color: var(--p-h); }

/* ---------- 卡片 ---------- */
.card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    box-shadow: var(--shadow);
}
.card-header {
    background: transparent;
    border-bottom: 1px solid var(--border);
    font-weight: 600;
}

/* ---------- 按钮 ---------- */
.btn-primary, .btn-primary:active {
    background: var(--p);
    border-color: var(--p);
    color: #fff;
}
.btn-primary:hover, .btn-primary:focus {
    background: var(--p-h);
    border-color: var(--p-h);
    color: #fff;
}
.btn-outline-primary {
    color: var(--p);
    border-color: var(--p);
}
.btn-outline-primary:hover {
    background: var(--p);
    border-color: var(--p);
}
.text-primary { color: var(--p) !important; }

/* ---------- 徽章 ---------- */
.badge.bg-primary { background: var(--p) !important; }
.badge-soft {
    background: var(--p-l) !important;
    color: var(--p-h) !important;
}

/* ---------- 表单 ---------- */
.form-control, .form-select {
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--text);
}
.form-control:focus, .form-select:focus {
    border-color: var(--p);
    box-shadow: 0 0 0 .2rem rgba(0,0,0,.06);
    color: var(--text);
    background: var(--surface);
}
.input-group-text {
    background: var(--p-l);
    border: 1px solid var(--border);
    color: var(--p-h);
}

/* ---------- 表格 ---------- */
.table { color: var(--text); }
.table thead th { border-bottom-color: var(--border); }
.table td, .table th { border-color: var(--border); }
.table-light, .table-light th { background: var(--p-l) !important; }

/* ---------- 分页 ---------- */
.pagination .page-link {
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--p);
}
.pagination .page-item.active .page-link {
    background: var(--p);
    border-color: var(--p);
    color: #fff;
}
.pagination .page-item.disabled .page-link {
    background: var(--surface);
    color: var(--muted);
}

/* ---------- 提示 ---------- */
.text-muted { color: var(--muted) !important; }
hr { border-color: var(--border); opacity: .8; }

/* ---------- 主题选择器 ---------- */
.theme-menu { padding: 8px; min-width: 220px; }
.theme-dots {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}
.theme-dot {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    position: relative;
    transition: transform .15s;
}
.theme-dot:hover { transform: scale(1.12); }
.theme-dot.active { border-color: var(--text); }
.theme-menu .theme-label { font-size: .78rem; color: var(--muted); margin-top: 6px; text-align: center; }

/* ---------- 悬浮客服 ---------- */
.cs-float {
    position: fixed;
    right: 14px;
    bottom: 80px;
    z-index: 1030;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.cs-btn {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
    transition: transform .15s;
}
.cs-btn:hover { transform: translateY(-2px); color: #fff; }
.cs-qq { background: #12b7f5; }
.cs-wechat { background: #07c160; }
.cs-pop {
    position: absolute;
    right: 62px;
    bottom: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px;
    box-shadow: var(--shadow);
    display: none;
    width: 170px;
    text-align: center;
}
.cs-pop img { width: 150px; height: 150px; object-fit: cover; }
.cs-pop .pop-title { font-size: .85rem; color: var(--text); margin-top: 6px; }

/* ---------- 通用工具 ---------- */
.section-title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 1.4rem 0 .9rem;
    padding-left: 10px;
    border-left: 4px solid var(--p);
}
.empty-tip {
    text-align: center;
    color: var(--muted);
    padding: 40px 0;
}
.cover-fit {
    width: 100%;
    object-fit: cover;
}

/* ---------- 响应式微调 ---------- */
@media (max-width: 767px) {
    .container { padding-left: 12px; padding-right: 12px; }
    .cs-float { bottom: 60px; }
    .cs-btn { width: 46px; height: 46px; font-size: 1.3rem; }
    .table { font-size: .85rem; }
}

/* ---------- 首页 ---------- */
.hero-banner {
    background: linear-gradient(135deg, var(--p) 0%, var(--p-h) 100%);
    border-radius: 0 0 18px 18px;
}
.quick-entry {
    border: 1px solid var(--border);
    transition: transform .15s ease, box-shadow .15s ease;
    color: var(--text);
}
.quick-entry:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow);
}
.product-card {
    color: var(--text);
    border: 1px solid var(--border);
    overflow: hidden;
    transition: transform .15s ease, box-shadow .15s ease;
}
.product-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow);
}
.product-card .card-img-top {
    aspect-ratio: 1 / 1;
    object-fit: cover;
}
.product-name {
    font-size: .95rem;
    color: var(--text);
}
.section-title h5 { color: var(--text); }

/* 卡片统一边框/背景 */
.card {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text);
}
.card-header {
    background: var(--surface);
    border-color: var(--border);
    font-weight: 600;
}
.list-group-item {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text);
}
.text-muted { color: var(--muted) !important; }

/* 详情页价格区/支付选项 */
.price-box { background: var(--bg); border: 1px solid var(--border); }
.payment-option { padding: .5rem .75rem; border: 1px solid var(--border); border-radius: .5rem; }
.payment-option:has(input:checked) { border-color: var(--p); background: var(--p-l); }
.cat-scroll { max-height: 360px; overflow-y: auto; }
.product-desc { line-height: 1.8; white-space: normal; }

/* 软件列表 */
.cat-filter { flex-wrap: nowrap; }
@media (min-width: 576px) { .cat-filter { flex-wrap: wrap; } }
.min-w-0 { min-width: 0; }
.software-item .card-footer { border-color: var(--border); }

/* 视频 */
.video-card { color: var(--text); border:1px solid var(--border); transition: transform .15s, box-shadow .15s; }
.video-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.video-cover { position: relative; aspect-ratio: 16/9; background: #000; }
.video-cover img { width:100%; height:100%; object-fit: cover; }
.lock-badge { position:absolute; top:8px; right:8px; background: rgba(0,0,0,.55); color:#fff; border-radius:50%; width:30px;height:30px;display:flex;align-items:center;justify-content:center; }
.video-title { font-size:.95rem; color:var(--text); }
.video-player-wrap { background:#000; }
.video-player-wrap video { max-height: 70vh; }
.lock-panel { background: var(--bg); }

/* 图文 */
.article-content { line-height: 1.9; white-space: normal; }
.article-body { max-width: 860px; margin: 0 auto; }

/* 富文本正文排版 */
.article-content p { margin:0 0 .8em; }
.article-content h1,.article-content h2,.article-content h3,.article-content h4,.article-content h5 { margin:1.2em 0 .6em; line-height:1.4; }
.article-content img { max-width:100%; height:auto; border-radius:6px; }
.article-content blockquote { margin:.8em 0; padding:.4em 1em; border-left:4px solid var(--border,#dee2e6); color:#6c757d; }
.article-content pre { background:#f6f8fa; padding:12px 14px; border-radius:6px; overflow:auto; }
.article-content code { background:#f3f4f6; padding:1px 5px; border-radius:4px; }
.article-content pre code { background:none; padding:0; }
.article-content ul,.article-content ol { padding-left:1.6em; margin-bottom:.8em; }
.article-content table { border-collapse:collapse; width:100%; margin-bottom:1em; display:block; overflow-x:auto; }
.article-content table td,.article-content table th { border:1px solid var(--border,#dee2e6); padding:7px 12px; white-space:nowrap; }
.article-content a { text-decoration:underline; }
.article-content hr { margin:1.4em 0; }
@media (min-width:768px) {
    .article-content table { display:table; }
}

/* 任务卡片 */
.task-card { border:1px solid var(--border); }
.text-truncate-3 { display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden; }