/* ========== 全局默认样式 ========== */
body {
    font-family: var(--font-family);
}

/* Tab 键焦点：与输入框选中态一致 —— 主题色细线框 + 3px 淡光晕（仅键盘导航时出现，鼠标点击不显示） */
:focus-visible {
    outline: none !important;
    border-color: var(--bg-main) !important;
    box-shadow: 0 0 0 3px var(--bg-second) !important;
}


/* ---------- 原子类 ---------- */

/* 排版字号 */
.dlx-fs-sm {
    font-size: var(--font-size-sm);
}

.dlx-fs-base {
    font-size: var(--font-size-base);
}

.dlx-fs-lg {
    font-size: var(--font-size-lg);
}

.dlx-fs-xl {
    font-size: var(--font-size-xl);
}

.dlx-fs-xxl {
    font-size: var(--font-size-xxl);
}

/* 字重 */
.dlx-fw-normal {
    font-weight: var(--font-weight-normal);
}

.dlx-fw-medium {
    font-weight: var(--font-weight-medium);
}

.dlx-fw-bold {
    font-weight: var(--font-weight-bold);
}


/* 字体颜色 */
.dlx-txt-main {
    color: var(--text-main);
}

/* 自适应缩放标题（site.js fitText）的初始态 —— 页面切换防跳变（2026-09-11）
   背景：.dlx-txt-main 只定义颜色不定义字号，带 .dlx-fit-text 的 h1 首绘会用 Bootstrap 默认 2.5rem，
   等 DOMContentLoaded 时被 fitText 改成 data-max-size（1.5rem），字号突变 40%，
   侧边栏 LOGO 区高度随之变化，把下方整块菜单顶上去 —— 观感即"切页时整个页面抖一下"。
   这里首绘就给到与 data-max-size 一致的 1.5rem，把突变抹掉；剩余微调交给同步执行的 fitText（首绘前完成）。 */
.dlx-fit-text {
    font-size: 1.5rem;
    white-space: nowrap;
}

.dlx-txt-sub {
    color: var(--text-sub);
}

.dlx-txt-accent {
    color: var(--text-accent);
}

.dlx-txt-on-brand {
    color: var(--text-on-brand);
}
/* 背景颜色 */
.dlx-bg-main {
    background-color: var(--bg-main);
}

.dlx-bg-second {
    background-color: var(--bg-second);
}

.dlx-bg-card {
    background-color: var(--bg-card);
}

.dlx-bg-page {
    background-color: var(--bg-page);
}

.dlx-bg-border{
    background-color: var(--bg-border);
}

/* 内边距 */
.dlx-p-sm {
    padding: var(--spacing-sm) !important;
}

.dlx-p-base {
    padding: var(--spacing-base) !important;
}

.dlx-p-lg {
    padding: var(--spacing-lg) !important;
}


.dlx-p-xl {
    padding: var(--spacing-xl) !important;
}


.dlx-p-xxl {
    padding: var(--spacing-xxl) !important;
}


/* 外边距 */
.dlx-m-sm {
    margin: var(--spacing-sm) !important;
}

.dlx-m-base {
    margin: var(--card-gap) !important; /* 卡片间距：取 --card-gap（20px，单一来源） */
}

.dlx-m-lg {
    margin: var(--spacing-lg) !important;
}

.dlx-m-xl {
    margin: var(--spacing-xl) !important;
}

.dlx-m-xxl {
    margin: var(--spacing-xxl) !important;
}

/* 间距 */
.dlx-gap-sm {
    gap: var(--spacing-sm) !important;
}

.dlx-gap-base {
    gap: var(--spacing-base) !important;
}

.dlx-gap-lg {
    gap: var(--spacing-lg) !important;
}
.dlx-gap-xl {
    gap: var(--spacing-xl) !important;
}
.dlx-gap-xxl {
    gap: var(--spacing-xxl ) !important;
}




/* 圆角 */
.dlx-radius-base {
    border-radius: var(--radius-base);
}

.dlx-radius-round {
    border-radius: var(--radius-round);
}

/* 阴影/过渡 */
.dlx-shadow-sm {
    box-shadow: var(--shadow-sm);
}

.dlx-shadow-md {
    box-shadow: var(--shadow-md);
}

.dlx-transition {
    transition: var(--transition-base);
}