
/* ===== AeroCore 风格 CSS 变量 ===== */
/* --ac-color-link / --ac-theme-color 继承后台设置的主题色 */
:root {
--ac-theme-color: var(--Maincolor);
--ac-border-radius: 8px;
--ac-border-radius-sm: 6px;
--ac-bg-card: #fff;
--ac-bg-hover: #f1f5f9;
--ac-bg-secondary: #f8fafc;
--ac-text-primary: #1e293b;
--ac-text-secondary: #475569;
--ac-text-tertiary: #64748b;
--ac-text-muted: #94a3b8;
--ac-text-content: #334155;
--ac-border-primary: #e5e7eb;
--ac-border-secondary: #f1f5f9;
--ac-color-link: var(--Maincolor);
--ac-shadow-sm: 0 1px 3px rgba(0,0,0,0.05);
--ac-shadow-md: 0 4px 12px rgba(0,0,0,0.1);
}
@media (prefers-color-scheme: dark) {
:root {
--ac-bg-card: #2a2a2a;
--ac-bg-hover: #3a3a3a;
--ac-bg-secondary: #222222;
--ac-text-primary: #e8e8e8;
--ac-text-secondary: #b0b0b0;
--ac-text-tertiary: #888888;
--ac-text-muted: #666666;
--ac-text-content: #cccccc;
--ac-border-primary: #3a3a3a;
--ac-border-secondary: #333333;
--ac-shadow-sm: 0 1px 3px rgba(0,0,0,0.2);
--ac-shadow-md: 0 4px 12px rgba(0,0,0,0.3);
}
}

/* ===== AeroCore 内联 SVG 图标 ===== */
.aerocore-icon-eye,
.aerocore-icon-comment,
.aerocore-icon-like {
display: inline-block;
width: 14px;
height: 14px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
vertical-align: middle;
opacity: 0.5;
}
.aerocore-icon-eye {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}
.aerocore-icon-comment {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
}
.aerocore-icon-like {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme: dark) {
.aerocore-icon-eye {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}
.aerocore-icon-comment {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
}
.aerocore-icon-like {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3'/%3E%3C/svg%3E");
}
}

/* ===== main-article-list 容器 ===== */
.main-article-list {
margin-bottom: 14px;
overflow: hidden;
background: var(--ac-bg-card);
border-radius: var(--ac-border-radius);
padding: 20px 24px;
min-width: 0;
}
.main-article-list img {
max-width: 100%;
}

/* ===== article-tabs 标签栏 ===== */
.article-tabs {
display: flex;
justify-content: flex-start;
gap: 10px;
width: 100%;
max-width: 100%;
min-width: 0;
flex-wrap: nowrap;
overflow-x: auto;
overflow-y: hidden;
scrollbar-width: none;
-ms-overflow-style: none;
-webkit-overflow-scrolling: touch;
touch-action: pan-x pinch-zoom;
margin-bottom: 20px;
}
.article-tabs::-webkit-scrollbar {
display: none;
}
.article-tabs--right {
justify-content: flex-end;
}
.article-tab {
display: inline-flex;
align-items: center;
flex: 0 0 auto;
gap: 6px;
padding: 6px 16px;
background: var(--ac-bg-secondary, #f0f2f5);
border: none;
font-size: 14px;
font-weight: 600;
color: var(--ac-text-tertiary);
cursor: pointer;
border-radius: 20px;
transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
white-space: nowrap;
}
.article-tab:hover {
color: var(--ac-text-primary);
}
.article-tab.active {
background-color: var(--ac-color-link);
color: #fff;
}

/* ===== article-list 基础 ===== */
.article-list {
min-height: 100px;
}
.article-list .article-item {
position: relative;
}
.article-list .article-item__title a {
color: inherit;
text-decoration: none;
}
/* 覆盖全局 a:visited 颜色，防止点击后变色 */
.article-list .article-item__title a:visited {
color: inherit;
}
.article-list .article-item__title a:hover,
.article-list .article-item__title a:active {
color: var(--ac-color-link);
}
.article-list .article-item__thumb {
display: block;
}

/* ===== article-item__meta-main ===== */
.article-item__meta-main {
display: flex;
align-items: center;
gap: 10px;
min-width: 0;
}

/* ===== article-item__author ===== */
.article-item__author {
display: inline-flex;
align-items: center;
gap: 6px;
min-width: 0;
max-width: 180px;
}
.article-item__author-avatar {
width: 18px;
height: 18px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
}
.article-item__author-name {
font-size: 12px;
color: var(--ac-text-muted);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

/* ===== article-item__sticky / new 标签 ===== */
.article-item__sticky {
display: inline-block;
font-size: 12px;
color: #fff;
background-color: var(--ac-theme-color);
margin-right: 6px;
padding: 1px 4px;
border-radius: 3px;
vertical-align: middle;
}
.article-item__new {
position: absolute;
right: 10px;
top: 10px;
display: inline-block;
font-size: 12px;
color: #fff;
background-color: #F56C6C;
padding: 1px 4px;
border-radius: 4px;
z-index: 1;
}

/* ===== article-item__stats ===== */
.article-item__stats {
display: flex;
align-items: center;
gap: 6px;
}
.article-item__stat {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 12px;
color: var(--ac-text-muted);
}

/* ===== article-list--image_text 图文列表 ===== */
.article-list--image_text .article-item {
display: flex;
gap: 16px;
padding: 16px 0;
border-bottom: 1px solid var(--ac-border-secondary);
text-decoration: none;
color: inherit;
overflow: hidden;
}
.article-list--image_text .article-item:last-child {
border-bottom: none;
}
.article-list--image_text .article-item:hover .article-item__title,
.article-list--image_text .article-item__title a:hover {
color: var(--ac-color-link);
}
.article-list--image_text .article-item__thumb {
width: 200px;
height: 134px;
flex-shrink: 0;
border-radius: var(--ac-border-radius);
overflow: hidden;
background: var(--ac-bg-hover);
}
.article-list--image_text .article-item__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
}
.article-list--image_text .article-item__content {
flex: 1;
display: flex;
flex-direction: column;
min-width: 0;
}
.article-list--image_text .article-item__title {
font-size: 16px;
font-weight: 600;
color: var(--ac-text-primary);
margin: 0 0 8px;
line-height: 1.5;
transition: color 0.2s;
}
.article-list--image_text .article-item__excerpt {
font-size: 14px;
color: var(--ac-text-tertiary);
line-height: 1.6;
margin: 0;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
word-break: break-all;
}
.article-list--image_text .article-item__meta {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
padding-top: 8px;
}
.article-list--image_text .article-item__meta-main {
flex: 1;
}
.article-list--image_text .article-item__author-avatar {
width: 20px;
height: 20px;
}
.article-list--image_text .article-item__date {
font-size: 12px;
color: var(--ac-text-muted);
}

/* ===== 加载更多按钮样式 ===== */
.index-load-more-btn,
.article-load-more .load-more-btn {
display: block;
width: 100%;
padding: 10px 0;
margin-top: 16px;
background: var(--ac-bg-secondary);
border: 1px solid var(--ac-border-primary);
border-radius: var(--ac-border-radius);
font-size: 14px;
color: var(--ac-text-secondary);
cursor: pointer;
transition: background-color 0.2s, color 0.2s;
}
.index-load-more-btn:hover,
.article-load-more .load-more-btn:hover {
background: var(--ac-bg-hover);
color: var(--ac-text-primary);
}
.index-load-more-btn:disabled,
.article-load-more .load-more-btn:disabled {
cursor: not-allowed;
opacity: 0.6;
}

/* ===== 响应式 ===== */
@media (max-width: 768px) {
.article-list--image_text .article-item {
flex-direction: column;
gap: 12px;
}
.article-list--image_text .article-item__thumb {
width: 100%;
height: 180px;
}
.main-article-list {
padding: 16px;
}
.article-item__author {
max-width: 110px;
}
}

/* ===== 导航栏增强样式 ===== */
.header-main .menu-header-list .menu-item a {
    color: #4e5358;
    font-weight: 500;
    transition: color 0.2s ease;
}
.header-main .menu-header-list .menu-item a:hover {
    color: var(--ac-color-link, #409EFF);
}
.header-main .menu-header-list .current-menu-item a {
    color: var(--ac-color-link, #409EFF);
    font-weight: 600;
}
