/* ========================================
   TDesign Utility Classes
   辅助工具类
   ======================================== */

/* === 背景色 === */
.td-bg-page { background-color: var(--td-bg-color-page); }
.td-bg-container { background-color: var(--td-bg-color-container); }
.td-bg-container-hover { background-color: var(--td-bg-color-container-hover); }
.td-bg-secondary { background-color: var(--td-bg-color-secondarycontainer); }
.td-bg-brand-light { background-color: var(--td-brand-color-light); }

/* === 文字色 === */
.td-text-primary { color: var(--td-text-color-primary) !important; }
.td-text-secondary { color: var(--td-text-color-secondary) !important; }
.td-text-placeholder { color: var(--td-text-color-placeholder) !important; }
.td-text-disabled { color: var(--td-text-color-disabled) !important; }
.td-text-brand { color: var(--td-brand-color) !important; }
.td-text-link { color: var(--td-text-color-link) !important; }
.td-text-anti { color: var(--td-text-color-anti) !important; }
.td-text-success { color: var(--td-success-color) !important; }
.td-text-warning { color: var(--td-warning-color) !important; }
.td-text-error { color: var(--td-error-color) !important; }

/* === 投影 === */
.td-shadow-1 { box-shadow: var(--td-shadow-1); }
.td-shadow-2 { box-shadow: var(--td-shadow-2); }
.td-shadow-3 { box-shadow: var(--td-shadow-3); }
.td-shadow-none { box-shadow: none !important; }

/* === 圆角 === */
.td-radius-small { border-radius: var(--td-radius-small); }
.td-radius-default { border-radius: var(--td-radius-default); }
.td-radius-large { border-radius: var(--td-radius-large); }
.td-radius-round { border-radius: var(--td-radius-round); }

/* === 字号 === */
.td-fs-s { font-size: var(--td-font-size-s) !important; }
.td-fs-base { font-size: var(--td-font-size) !important; }
.td-fs-l { font-size: var(--td-font-size-l) !important; }
.td-fs-xl { font-size: var(--td-font-size-xl) !important; }

/* === 字重 === */
.td-fw-normal { font-weight: var(--td-font-weight) !important; }
.td-fw-medium { font-weight: var(--td-font-weight-medium) !important; }
.td-fw-bold { font-weight: var(--td-font-weight-bold) !important; }

/* === 间距辅助 === */
.td-mb-0 { margin-bottom: 0 !important; }
.td-mb-1 { margin-bottom: var(--td-spacer-1) !important; }
.td-mb-2 { margin-bottom: var(--td-spacer-2) !important; }
.td-mb-3 { margin-bottom: var(--td-spacer-3) !important; }
.td-mb-4 { margin-bottom: var(--td-spacer-4) !important; }
.td-mb-6 { margin-bottom: var(--td-spacer-6) !important; }

.td-mt-0 { margin-top: 0 !important; }
.td-mt-2 { margin-top: var(--td-spacer-2) !important; }
.td-mt-3 { margin-top: var(--td-spacer-3) !important; }
.td-mt-4 { margin-top: var(--td-spacer-4) !important; }

.td-p-0 { padding: 0 !important; }
.td-p-2 { padding: var(--td-spacer-2) !important; }
.td-p-3 { padding: var(--td-spacer-3) !important; }
.td-p-4 { padding: var(--td-spacer-4) !important; }

/* === 边框 === */
.td-border { border: 1px solid var(--td-border-level-1-color); }
.td-border-bottom { border-bottom: 1px solid var(--td-border-level-1-color); }
.td-border-top { border-top: 1px solid var(--td-border-level-1-color); }
.td-border-none { border: none !important; }

/* === Flex 辅助 === */
.td-flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.td-flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* === 隐藏/显示 === */
.td-hidden { display: none !important; }
.td-invisible { visibility: hidden !important; }

/* === 溢出 === */
.td-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* === 鼠标 === */
.td-cursor-pointer { cursor: pointer; }
.td-cursor-default { cursor: default; }