// 组件变量
// 名称可按如下规则定义：
// <component>-[type]-[attrtype]-<attr>-[status]

// component: 组件名，如 button
// type: 组件类型，如 button 的次要按钮（line）
// attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（border）等
// attr: 属性名称，如 color、height、radius 等
// status: 表示组件状态或尺寸，如 hover、disabled、s、l 等

// 如：@button-line-bg-color-hover
// 如：@button-line-height-s

// 颜色
@file-card-item-bg: var(--td-bg-color-secondarycontainer);
@file-card-item-color: var(--td-text-color-primary);

// 字体尺寸、行高
@file-card-item-font: var(--td-font-body-medium);
@file-card-item-desc-font:  var(--td-font-body-small);

// 盒模型尺寸
@file-card-item-width: 168px;
@file-card-item-height: 52px;
@file-card-item-radius: var(--td-radius-medium);
@file-card-item-padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);

@file-card-icon-height: 32px;
@file-card-icon-width: 32px;

@file-card-icon-loading-color: var(--td-brand-color);
@file-card-icon-default-color: #8c8c8c;
@file-card-image-width: 52px;

@file-card-content-margin: var(--td-comp-margin-s);
@file-card-name-width: 110px;
@file-card-content-line-height: 16px;

@file-card-preview-width: 100%;
@file-card-preview-content-maxwidth: 90%;
@file-card-preview-img-maxwidth: 100%;
@file-card-preview-img-maxheight: 90vh;
@file-card-preview-mask-bg: rgba(0, 0, 0, 0.7);
@file-card-preview-close-padding: 8px;

@file-card-preview-close-top: 20px;