/* Boo Reader 图标字体系统 */
/* 使用Unicode字符和CSS伪元素创建图标 */

/* 基础图标样式 */
.icon {
    font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif;
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    text-align: center;
}

/* 菜单图标 */
.icon-menu::before { content: "☰"; }
.icon-book::before { content: "📚"; }
.icon-history::before { content: "🕒"; }
.icon-star::before { content: "⭐"; }
.icon-folder::before { content: "📁"; }
.icon-search::before { content: "🔍"; }
.icon-sync::before { content: "🔄"; }
.icon-moon::before { content: "🌙"; }
.icon-sun::before { content: "☀️"; }
.icon-cog::before { content: "⚙️"; }
.icon-upload::before { content: "📤"; }
.icon-arrow-left::before { content: "⬅️"; }
.icon-font::before { content: "🔤"; }
.icon-adjust::before { content: "🔅"; }
.icon-expand::before { content: "⛶"; }
.icon-chevron-left::before { content: "‹"; }
.icon-chevron-right::before { content: "›"; }
.icon-clock::before { content: "⏰"; }
.icon-file::before { content: "📄"; }
.icon-database::before { content: "💾"; }
.icon-cloud-upload::before { content: "☁️"; }
.icon-times::before { content: "✕"; }
.icon-eye::before { content: "👁️"; }
.icon-folder-open::before { content: "📂"; }
.icon-book-open::before { content: "📖"; }
.icon-book-reader::before { content: "👓"; }

/* 阅读器特定图标 */
.icon-grid::before { content: "⏹️"; }
.icon-list::before { content: "≡"; }

/* 大小变体 */
.icon-sm { font-size: 14px; }
.icon-md { font-size: 16px; }
.icon-lg { font-size: 20px; }
.icon-xl { font-size: 24px; }
.icon-2xl { font-size: 32px; }
.icon-3xl { font-size: 48px; }
.icon-4xl { font-size: 64px; }

/* 颜色变体 */
.icon-primary { color: var(--primary-color); }
.icon-secondary { color: var(--text-secondary); }
.icon-muted { color: var(--text-muted); }
.icon-white { color: white; }

/* 旋转动画 */
.icon-spin {
    animation: icon-spin 2s linear infinite;
}

@keyframes icon-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 脉冲动画 */
.icon-pulse {
    animation: icon-pulse 1s infinite;
}

@keyframes icon-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}