/**
 * KNN-资源下载 页面样式（自包含）
 * 数值对齐源模板内联 CSS（download.php L84-101：but-download min-width 200px、pay-extra-hide）
 */

/* 资源标题头 */
.knn-download-page .download-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 15px;
    margin-bottom: 1.5em;
    border-radius: var(--knn-border-radius);
    background: var(--knn-bg-color);
}

.knn-download-page .download-title {
    font-size: var(--knn-font-size-lg);
    font-weight: 600;
    margin-right: 6px;
}

.knn-download-page .download-title a {
    color: var(--knn-text-color);
}

.knn-download-page .download-title a:hover {
    color: var(--knn-color-primary);
}

/* 已购徽章（对齐源内联：12px / 2px 10px / line-height 1.4） */
.knn-download-page .download-paid-badge {
    font-size: 12px;
    padding: 2px 10px;
    line-height: 1.4;
    border-radius: 3px;
    background: rgba(221, 82, 77, 0.1);
    color: var(--knn-color-danger);
    font-weight: 500;
    white-space: nowrap;
}

/* 说明与详情 */
.knn-download-page .download-doc {
    line-height: 1.8;
}

.knn-download-page .download-details {
    margin: 2em 0;
    color: var(--knn-text-color-grey, #999);
}

/* 下载按钮区（对齐源：min-width 200px / padding .5em / margin-top 10px） */
.knn-download-page .download-buts-box {
    margin-bottom: 3em;
}

.knn-download-page .but-download > .but,
.knn-download-page .but-download > span {
    min-width: 200px;
    padding: .5em;
    margin-top: 10px;
}

.knn-download-page .but-download {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.knn-download-page .but-download .but {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--knn-border-radius);
    background: var(--knn-color-primary);
    color: #fff;
    text-align: center;
}

.knn-download-page .but-download .but:hover {
    opacity: .85;
}

.knn-download-page .but-download .badg {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
    background: var(--knn-bg-color);
    color: var(--knn-text-color-grey, #999);
}

.knn-download-page .but-download .knn-copy-key {
    color: var(--knn-color-primary);
    background: rgba(0, 122, 255, 0.08);
    cursor: pointer;
}

/* 隐藏内容盒（对齐源 .pay-extra-hide） */
.knn-download-page .pay-extra-hide {
    background: var(--knn-bg-color);
    display: block;
    margin: 10px 0;
    padding: 20px;
    color: var(--knn-text-color-grey, #999);
    border-radius: 4px;
}

.knn-download-page .download-pay-box {
    margin-bottom: 2em;
}

/* 提示条（is-error 对齐源 jb-red、is-warning 对齐源 jb-yellow 场景） */
.knn-download-page .download-alert {
    margin: 2em 0;
    padding: 14px 20px;
    border-radius: var(--knn-border-radius);
    font-size: var(--knn-font-size-lg);
    text-align: center;
}

.knn-download-page .download-alert.is-error {
    background: rgba(221, 82, 77, 0.1);
    color: var(--knn-color-danger);
}

.knn-download-page .download-alert.is-warning {
    background: rgba(240, 173, 78, 0.12);
    color: var(--knn-color-warning);
}

/* 返回文章按钮 */
.knn-download-page .download-back-but {
    display: inline-flex;
    align-items: center;
    margin-bottom: 2em;
    padding: 10px 24px;
    border-radius: var(--knn-border-radius);
    background: var(--knn-color-warning);
    color: #fff;
}

.knn-download-page .download-back-but:hover {
    opacity: .85;
    color: #fff;
}

/* 页面正文分隔 */
.knn-download-page .download-page-content {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--knn-border-color);
}

/* 暗色模式适配 */
body.dark-mode .knn-download-page .download-header,
body.dark-mode .knn-download-page .pay-extra-hide {
    background: var(--knn-bg-color-grey, rgba(255, 255, 255, 0.05));
}

/* 移动端 */
@media screen and (max-width: 767px) {
    .knn-download-page .but-download > .but,
    .knn-download-page .but-download > span {
        min-width: 0;
        flex: 1 1 auto;
    }
}
