/* ==========================================================================
   DS 全局基础样式 — v3.0
   命名空间:ds-base-
   设计令牌:颜色/圆角/阴影/动效 全局统一,三套模板共用

   v7.32.2 hotfix:
   全局 [hidden]{display:none!important} 兜底,防止任何模块的
   display:flex/grid 覆盖 [hidden] 导致弹窗误显示。
   ================================================================ */

/* 0. hidden 兜底(特异性压过 .ds-xxx { display:flex }) */
[hidden] { display: none !important; }

/* 1. CSS 变量(全模板可继承,模板内可覆盖) */
:root {
    /* 主色系(亮色) */
    --ds-color-primary:        #165DFF;
    --ds-color-primary-light:  #4080FF;
    --ds-color-primary-dark:   #0E42D2;
    --ds-color-success:        #00B42A;
    --ds-color-warning:        #FF7D00;
    --ds-color-danger:         #F53F3F;

    /* 中性色(亮色) */
    --ds-color-white:    #FFFFFF;
    --ds-color-bg:       #F5F7FA;
    --ds-color-bg-soft:  #FAFBFC;
    --ds-color-text-1:   #1D2129;
    --ds-color-text-2:   #4E5969;
    --ds-color-text-3:   #86909C;
    --ds-color-border:   #E5E6EB;
    --ds-color-divider:  #F2F3F5;

    /* 圆角分层 */
    --ds-radius-lg:   12px;   /* 弹窗 / 大容器 */
    --ds-radius-md:   8px;    /* 内容卡片 */
    --ds-radius-sm:   6px;    /* 按钮 / 输入框 / 标签 */

    /* 阴影分层 */
    --ds-shadow-card:  0 4px 12px rgba(22, 93, 255, 0.08);
    --ds-shadow-nav:   0 2px 8px rgba(0, 0, 0, 0.06);
    --ds-shadow-modal: 0 12px 32px rgba(0, 0, 0, 0.12);
    --ds-shadow-btn:   0 1px 3px rgba(0, 0, 0, 0.06);

    /* 间距 */
    --ds-gap-sm:   8px;
    --ds-gap-md:   16px;
    --ds-gap-lg:   24px;
    --ds-gap-xl:   32px;

    /* 字号 */
    --ds-fs-xs:    12px;
    --ds-fs-sm:    13px;
    --ds-fs-base:  14px;
    --ds-fs-md:    16px;
    --ds-fs-lg:    18px;
    --ds-fs-xl:    20px;
    --ds-fs-2xl:   24px;

    /* 动效 */
    --ds-tx: 0.2s ease;

    /* 字体 */
    --ds-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    --ds-font-mono: "SF Mono", Menlo, Consolas, "Courier New", monospace;
}

/* 2. 全局重置(box-sizing 关键) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0,0,0,0); }
body {
    margin: 0;
    font-family: var(--ds-font);
    font-size: var(--ds-fs-base);
    line-height: 1.45;
    color: var(--ds-color-text-1);
    background: var(--ds-color-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--ds-color-primary); text-decoration: none; transition: color var(--ds-tx); }
a:hover { color: var(--ds-color-primary-dark); }
button { font-family: inherit; cursor: pointer; border: none; background: none; padding: 0; }
input, textarea, select { font-family: inherit; font-size: inherit; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; line-height: 1.3; color: var(--ds-color-text-1); }

/* 3. 移动端紧凑/宽松布局开关(全局) */
.ds-layout-compact .ds-base-container { padding: 12px; }
.ds-layout-compact .ds-base-card    { padding: 16px; }
.ds-layout-compact .ds-base-section { margin-bottom: 16px; }
.ds-layout-loose  .ds-base-container { padding: 16px; }
.ds-layout-loose  .ds-base-card    { padding: 20px; }
.ds-layout-loose  .ds-base-section { margin-bottom: 24px; }

/* 4. 通用容器(模板内可用) */
.ds-base-container { max-width: 1280px; margin: 0 auto; }

/* 5. 通用卡片 */
.ds-base-card {
    background: var(--ds-color-white);
    border-radius: var(--ds-radius-md);
    box-shadow: var(--ds-shadow-card);
    border: 1px solid var(--ds-color-border);
    transition: transform var(--ds-tx), box-shadow var(--ds-tx);
}
.ds-base-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(22, 93, 255, 0.12); }

/* 6. 通用按钮(三套模板通用基线,模板内可重写) */
.ds-base-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;       /* 移动端最小触控 */
    padding: 0 20px;
    border-radius: var(--ds-radius-sm);
    font-size: var(--ds-fs-base);
    font-weight: 500;
    text-align: center;
    transition: transform 0.1s, box-shadow var(--ds-tx), background var(--ds-tx);
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
.ds-base-btn:active { transform: scale(0.98); }

.ds-base-btn-primary {
    background: var(--ds-color-primary);
    color: var(--ds-color-white);
}
.ds-base-btn-primary:hover { background: var(--ds-color-primary-light); }

.ds-base-btn-success {
    background: var(--ds-color-success);
    color: var(--ds-color-white);
}

.ds-base-btn-danger {
    background: var(--ds-color-danger);
    color: var(--ds-color-white);
}

.ds-base-btn-ghost {
    background: transparent;
    color: var(--ds-color-text-2);
    border: 1px solid var(--ds-color-border);
}
.ds-base-btn-ghost:hover { border-color: var(--ds-color-primary); color: var(--ds-color-primary); }

/* 7. 通用徽章 */
.ds-base-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--ds-radius-sm);
    font-size: var(--ds-fs-xs);
    font-weight: 500;
    line-height: 1.5;
}
.ds-base-badge-primary { background: rgba(22, 93, 255, 0.1); color: var(--ds-color-primary); }
.ds-base-badge-success { background: rgba(0, 180, 42, 0.1); color: var(--ds-color-success); }
.ds-base-badge-warning { background: rgba(255, 125, 0, 0.1); color: var(--ds-color-warning); }
.ds-base-badge-danger  { background: rgba(245, 63, 63, 0.1);  color: var(--ds-color-danger); }

/* 8. 通用表单 */
.ds-base-input {
    width: 100%;
    min-height: 44px;
    padding: 0 14px;
    background: var(--ds-color-white);
    border: 1px solid var(--ds-color-border);
    border-radius: var(--ds-radius-sm);
    color: var(--ds-color-text-1);
    font-size: var(--ds-fs-base);
    transition: border-color var(--ds-tx), box-shadow var(--ds-tx);
}
.ds-base-input:focus {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: 0 0 0 3px rgba(22, 93, 255, 0.12);
}

/* 9. 通用分隔线 */
.ds-base-divider {
    height: 1px;
    background: var(--ds-color-divider);
    margin: var(--ds-gap-md) 0;
}

/* 10. 通用文字 */
.ds-base-text-1 { color: var(--ds-color-text-1); }
.ds-base-text-2 { color: var(--ds-color-text-2); }
.ds-base-text-3 { color: var(--ds-color-text-3); }
.ds-base-text-primary { color: var(--ds-color-primary); }
.ds-base-text-success { color: var(--ds-color-success); }
.ds-base-text-warning { color: var(--ds-color-warning); }
.ds-base-text-danger  { color: var(--ds-color-danger); }

.ds-base-fs-xs  { font-size: var(--ds-fs-xs); }
.ds-base-fs-sm  { font-size: var(--ds-fs-sm); }
.ds-base-fs-md  { font-size: var(--ds-fs-md); }
.ds-base-fs-lg  { font-size: var(--ds-fs-lg); }

.ds-base-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ds-base-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 11. 通用动效 */
.ds-base-fadein {
    animation: ds-base-fadein 200ms ease;
}
@keyframes ds-base-fadein {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 12. 通用 modal 弹窗(单例) */
.ds-base-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}
.ds-base-modal.is-show { display: flex; animation: ds-base-fadein 200ms ease; }
.ds-base-modal-box {
    width: 90%;
    max-width: 480px;
    background: var(--ds-color-white);
    border-radius: var(--ds-radius-lg);
    box-shadow: var(--ds-shadow-modal);
    overflow: hidden;
}
.ds-base-modal-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--ds-color-divider);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.ds-base-modal-title { font-size: var(--ds-fs-md); font-weight: 600; }
.ds-base-modal-close {
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--ds-radius-sm);
    color: var(--ds-color-text-3);
    cursor: pointer;
    transition: background var(--ds-tx);
}
.ds-base-modal-close:hover { background: var(--ds-color-bg); }
.ds-base-modal-body { padding: 20px; }
.ds-base-modal-foot {
    padding: 12px 20px;
    border-top: 1px solid var(--ds-color-divider);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}

/* 13. 通用 toast 提示 */
.ds-base-toast {
    position: fixed;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
    background: rgba(29, 33, 41, 0.92);
    color: var(--ds-color-white);
    padding: 10px 20px;
    border-radius: var(--ds-radius-md);
    font-size: var(--ds-fs-sm);
    box-shadow: var(--ds-shadow-modal);
    animation: ds-base-toast 200ms ease;
}
@keyframes ds-base-toast {
    from { opacity: 0; transform: translate(-50%, -10px); }
    to   { opacity: 1; transform: translate(-50%, 0); }
}

/* 14. 浮动返回顶部按钮 */
.ds-base-back-top {
    position: fixed;
    right: 20px;
    bottom: 100px;
    z-index: 100;
    width: 44px;
    height: 44px;
    background: var(--ds-color-white);
    border: 1px solid var(--ds-color-border);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ds-color-text-2);
    box-shadow: var(--ds-shadow-card);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--ds-tx), visibility var(--ds-tx);
}
.ds-base-back-top.is-show { opacity: 1; visibility: visible; }
.ds-base-back-top:hover { color: var(--ds-color-primary); border-color: var(--ds-color-primary); }

/* 15. 资源/博客通用卡片(模板可覆盖) */
.ds-base-resource-card {
    display: flex;
    gap: 12px;
    padding: 12px;
    background: var(--ds-color-white);
    border-radius: var(--ds-radius-md);
    border: 1px solid var(--ds-color-border);
    transition: transform var(--ds-tx), box-shadow var(--ds-tx);
}
.ds-base-resource-card:hover { transform: translateY(-2px); box-shadow: var(--ds-shadow-card); }
.ds-base-resource-thumb {
    flex-shrink: 0;
    width: 120px;
    height: 80px;
    border-radius: var(--ds-radius-sm);
    overflow: hidden;
    background: var(--ds-color-bg);
    display: flex; align-items: center; justify-content: center;
    color: var(--ds-color-text-3);
    font-size: 24px;
}
.ds-base-resource-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ds-base-resource-body { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; }
.ds-base-resource-title {
    font-size: var(--ds-fs-md);
    font-weight: 600;
    color: var(--ds-color-text-1);
    margin: 0 0 4px;
    line-height: 1.4;
}
.ds-base-resource-meta { display: flex; gap: 12px; font-size: var(--ds-fs-xs); color: var(--ds-color-text-3); flex-wrap: wrap; }

/* 16. 资源类型标签 */
.ds-base-access {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 2px 8px;
    border-radius: var(--ds-radius-sm);
    font-size: var(--ds-fs-xs);
    font-weight: 500;
}
.ds-base-access-free  { background: rgba(0, 180, 42, 0.1);  color: var(--ds-color-success); }
.ds-base-access-login { background: rgba(91, 123, 154, 0.1); color: #5B7B9A; }
.ds-base-access-vip   { background: rgba(255, 125, 0, 0.1);  color: var(--ds-color-warning); }
.ds-base-access-pay   { background: rgba(245, 63, 63, 0.1);  color: var(--ds-color-danger); }
.ds-base-access-dead  { background: var(--ds-color-bg);       color: var(--ds-color-text-3); }

/* 17. 加载动画(轻量化) */
.ds-base-spinner {
    display: inline-block;
    width: 18px; height: 18px;
    border: 2px solid var(--ds-color-border);
    border-top-color: var(--ds-color-primary);
    border-radius: 50%;
    animation: ds-base-spin 0.8s linear infinite;
}
@keyframes ds-base-spin { to { transform: rotate(360deg); } }

/* 18. 空状态 */
.ds-base-empty {
    padding: 60px 20px;
    text-align: center;
    color: var(--ds-color-text-3);
}
.ds-base-empty-icon { font-size: 48px; margin-bottom: 12px; opacity: 0.5; }

/* 19. 移动端全局 */
@media (max-width: 768px) {
    .ds-base-back-top { right: 12px; bottom: 80px; }
    .ds-base-resource-thumb { width: 88px; height: 64px; }
    .ds-base-resource-title { font-size: var(--ds-fs-sm); }
}

/* 20. 折叠屏/超小屏 */
@media (max-width: 360px) {
    :root { --ds-fs-base: 13px; }
    .ds-base-resource-thumb { width: 72px; height: 56px; }
}

/* 21. 减少动效模式(老旧设备) */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* 22. 隐藏 wp-block-library 与 7B2 父主题可能冲突的元素(子主题接管) */
.ds-hide-parent { display: none !important; }

/* 分享按钮条(资源正文末尾) */
.ds-share-bar {
    margin-top: 24px;
    padding: 16px;
    background: var(--ds-color-bg);
    border-radius: var(--ds-radius-md);
    display: flex;
    justify-content: center;
    gap: 8px;
}
.ds-share-bar .ds-share-btn {
    padding: 8px 20px;
    font-size: 14px;
}

/* 注:页脚默认隐藏改为 ds-assets.php 动态输出
 * (受 ds_footer_enabled 选项控制,后台可一键开启)
 */