/* TeHii Collect V3 — Tabler Icons 尺寸规范 */

.icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    flex-shrink: 0;
    line-height: 1;
}

.icon-xs { font-size: 16px; width: 16px; height: 16px; }
.icon-sm { font-size: 16px; width: 16px; height: 16px; }
.icon-md { font-size: 18px; width: 18px; height: 18px; }
.icon-lg { font-size: 20px; width: 20px; height: 20px; }
.icon-xl { font-size: 24px; width: 24px; height: 24px; }

/* 菜单 / 侧栏 */
.nav-icon .ti,
.sidebar-brand-icon .ti,
.logo-icon .ti { font-size: 20px; }

.search-icon .ti { font-size: 18px; color: var(--text-muted); }

/* 按钮内图标 */
.btn .ti { font-size: 16px; }
.btn-sm .ti { font-size: 16px; }
.btn-lg .ti { font-size: 18px; }
.btn-icon .ti { font-size: 18px; }

.btn .ti + span,
.btn span + .ti { margin-inline: 0; }
.btn .ti:first-child:not(:last-child) { margin-right: 6px; }
.btn .ti:last-child:not(:first-child) { margin-left: 6px; }

/* 标题 / 区块 */
.section-header h2 .ti,
.admin-page h1 .ti,
.page-header h1 .ti,
.install-title .ti { font-size: 20px; margin-right: 8px; vertical-align: -3px; }

.section-icon { display: inline-flex; align-items: center; }

/* 空状态 */
.empty-state-icon .ti { font-size: 48px; opacity: 0.35; color: var(--text-muted); }

/* 错误页 */
.error-code .ti { font-size: 64px; opacity: 0.25; }

/* 星级 */
.star-rating { display: inline-flex; gap: 1px; align-items: center; }
.star-rating .ti { font-size: 14px; color: var(--warning); }
.star-rating-icon { color: var(--warning); }

/* 状态 badge 内图标 */
.badge .ti { font-size: 12px; margin-right: 3px; }

/* 插件图标容器 */
.plugin-icon .ti { font-size: 24px; }

/* 安装步骤 */
.install-step .ti { font-size: 18px; }
.install-brand-icon .ti { font-size: 28px; color: #fff; }

/* 成长等级 */
.growth-icon .ti { font-size: 14px; }

/* 深色 / 浅色主题兼容 */
[data-theme="light"] .ti { color: inherit; }
.ti-muted { color: var(--text-muted); }
.ti-primary { color: var(--primary); }
.ti-success { color: var(--success); }
.ti-danger { color: var(--danger); }
.ti-warning { color: var(--warning); }

/* 动画 */
.icon-spin { animation: icon-spin 1s linear infinite; }
@keyframes icon-spin { to { transform: rotate(360deg); } }