/* 禁漫天堂 - 图标样式 */
/* 自定义图标样式和动画 */

/* 图标基础样式 */
.fas, .fab {
    transition: all 0.3s ease;
}

/* 导航图标 */
.category-nav .fas,
.top-links .fas {
    font-size: 1.1em;
}

/* 搜索图标 */
.search-btn .fas {
    font-size: 1.2em;
}

/* 评分星星 */
.comic-rating {
    color: #ff9f43;
    font-size: 0.9em;
}

/* 分类图标颜色 */
.category-nav .fa-star { color: #ff9f43; }
.category-nav .fa-heart { color: #ff4757; }
.category-nav .fa-school { color: #60a5fa; }
.category-nav .fa-city { color: #34d399; }
.category-nav .fa-magic { color: #a78bfa; }
.category-nav .fa-robot { color: #fbbf24; }
.category-nav .fa-ghost { color: #c084fc; }
.category-nav .fa-theater-masks { color: #f87171; }

/* 侧边栏图标 */
.sidebar-widget .fa-tags { color: #60a5fa; }
.sidebar-widget .fa-chart-line { color: #34d399; }
.sidebar-widget .fa-calendar-alt { color: #fbbf24; }
.sidebar-widget .fa-user-edit { color: #ff4757; }
.sidebar-widget .fa-bullhorn { color: #a78bfa; }
.sidebar-widget .fa-shield-alt { color: #34d399; }

/* 章节标题图标 */
.section-title .fa-crown { color: #ff9f43; }
.section-title .fa-clock { color: #60a5fa; }

/* 页脚图标 */
.footer-section .fa-skull-crossbones { color: #ff4757; }
.social-links .fa-weibo { color: #e6162d; }
.social-links .fa-qq { color: #12b7f5; }
.social-links .fa-telegram { color: #2aabee; }
.social-links .fa-discord { color: #5865f2; }

/* 图标动画 */
@keyframes iconPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

@keyframes iconSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes iconBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* 悬停效果 */
.category-nav a:hover .fas {
    animation: iconPulse 0.5s ease;
}

.search-btn:hover .fas {
    animation: iconSpin 0.5s ease;
}

.comic-card:hover .fas {
    animation: iconBounce 0.5s ease;
}

.social-links a:hover .fab {
    animation: iconPulse 0.5s ease;
}

/* 加载图标 */
.loading .fas {
    animation: iconSpin 1s linear infinite;
}

/* 通知图标 */
.notification .fa-info-circle {
    margin-right: 8px;
    font-size: 1.2em;
}

/* 模态框图标 */
.modal-close .fas {
    font-size: 1.2em;
}

/* 滚动到顶部图标 */
.scroll-to-top .fas {
    font-size: 1.3em;
}

/* 夜间模式切换图标 */
.dark-mode-toggle .fas {
    font-size: 1.3em;
}

/* 响应式图标大小 */
@media (max-width: 768px) {
    .category-nav .fas {
        font-size: 1em;
    }
    
    .section-title .fas {
        font-size: 1.2em;
    }
}

@media (max-width: 480px) {
    .category-nav .fas {
        display: none; /* 在小屏幕上隐藏图标以节省空间 */
    }
    
    .section-title .fas {
        font-size: 1.1em;
    }
}

/* 特殊图标效果 */
.new-badge {
    font-family: 'Font Awesome 6 Free', sans-serif;
    font-weight: 900;
}

.new-badge:before {
    content: '\f005';
    margin-right: 3px;
}

/* 排名图标 */
.rank {
    font-family: 'Font Awesome 6 Free', sans-serif;
    font-weight: 900;
}

/* 作者头像占位图标 */
.author-avatar:empty {
    background: linear-gradient(135deg, #ff4757, #ff9f43);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.2em;
}

.author-avatar:empty:before {
    content: '\f007'; /* 用户图标 */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

/* 安全提示图标 */
.safety-tips p:before {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    margin-right: 5px;
}

.safety-tips p:nth-child(1):before { content: '\f21b'; } /* 成人图标 */
.safety-tips p:nth-child(2):before { content: '\f1ae'; } /* 禁止图标 */
.safety-tips p:nth-child(3):before { content: '\f0e3'; } /* 法律图标 */
.safety-tips p:nth-child(4):before { content: '\f21e'; } /* 健康图标 */

/* 工具提示图标 */
[data-tooltip]:before {
    font-family: 'Font Awesome 6 Free', sans-serif;
    font-weight: 900;
}

/* 自定义图标类 */
.icon-adult:before {
    content: '\f21b';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

.icon-mature:before {
    content: '\f06e';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

.icon-restricted:before {
    content: '\f023';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

/* 图标颜色工具类 */
.icon-red { color: #ff4757; }
.icon-orange { color: #ff9f43; }
.icon-blue { color: #60a5fa; }
.icon-green { color: #34d399; }
.icon-purple { color: #a78bfa; }
.icon-yellow { color: #fbbf24; }
.icon-pink { color: #f472b6; }
