/* 萌主题 extra.css — 补充样式 */

/* 文章内容区透明度 */
.moe-article.has-content-opacity { background: transparent; }

/* 评论区深色模式 */
[data-theme="dark"] .moe-comments .comment-body { background: var(--c-surface-s); }
[data-theme="dark"] .moe-comments .comment-form input,
[data-theme="dark"] .moe-comments .comment-form textarea { background: var(--c-surface-s); border-color: var(--c-border); }

/* 友链模板 */
.moe-links-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 14px; margin-top: 16px; }
.moe-link-card { display: flex; align-items: center; gap: 12px; padding: 14px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius); text-decoration: none; transition: all var(--trans); }
.moe-link-card:hover { border-color: var(--c-primary); box-shadow: 0 4px 16px rgba(94,179,217,0.15); transform: translateY(-2px); }
.moe-link-card__avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--c-bg); }
.moe-link-card__avatar--text { display: flex; align-items: center; justify-content: center; font-size: 18px; }
.moe-link-card__name { font-size: 14px; font-weight: 600; color: var(--c-text); display: block; }
.moe-link-card__desc { font-size: 12px; color: var(--c-text-3); display: block; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 140px; }

/* [pinglun1] 评论可见短代码 */
.moe-comment-lock { text-align: center; padding: 22px; background: var(--c-bg); border-radius: var(--radius); border: 1px dashed var(--c-border); margin: 14px 0; }
.moe-comment-lock__icon { font-size: 28px; display: block; margin-bottom: 6px; }
.moe-comment-lock p { font-size: 14px; color: var(--c-text-2); margin: 0 0 10px; }
.moe-quick-comment-btn { background: var(--c-primary); color: #fff; border: none; border-radius: 100px; padding: 7px 18px; font-size: 13px; cursor: pointer; transition: opacity var(--trans); }
.moe-quick-comment-btn:hover { opacity: 0.85; }

/* ── 互动按钮区域布局修复 ─────────────────────────────────
 * 明确 flex-direction: row，防止在部分移动端浏览器中
 * align-items:flex-start 与 flex-wrap 组合导致每项撑满一行 */
.moe-action-row {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}
.moe-action-wrap {
  flex: 0 0 auto; /* 不拉伸，使用按钮自然宽度 */
}

/* ── 互动按钮 loading 状态 ───────────────────────────────── */
.moe-action-btn:disabled {
  cursor: wait;
  opacity: .6;
  pointer-events: none;
}
.moe-action-btn:not(:disabled):active {
  transform: scale(0.95);
}

/* ── 分享弹窗层级 ────────────────────────────────────────── */
.moe-share-wrap { z-index: 10; }

/* ── 卡片缩略图占位色 ───────────────────────────────────── */
.moe-card__thumb { background: var(--c-border); }

/* ══ 侧边栏小工具标题 ::before emoji 图标（按类型显示）══ */
.moe-widget__title {
  padding-left: 2.0em !important;  /* emoji宽(~1em) + 间距(~1.0em) */
  position: relative;
}
.moe-widget__title::before {
  content: '📌';
  position: absolute;
  left: 0.6em;                    /* 与左边框有一定距离，不贴边 */
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.85em;
  line-height: 1;
  display: block;
}
.widget_text             .moe-widget__title::before { content: '📢'; }
.widget_tag_cloud        .moe-widget__title::before { content: '🏷️'; }
.widget_recent_comments  .moe-widget__title::before { content: '💬'; }
.widget_recent_entries   .moe-widget__title::before { content: '📄'; }
.widget_categories       .moe-widget__title::before { content: '📂'; }
.widget_search           .moe-widget__title::before { content: '🔍'; }
.widget_archive          .moe-widget__title::before { content: '📅'; }
.widget_calendar         .moe-widget__title::before { content: '🗓️'; }
.widget_nav_menu         .moe-widget__title::before { content: '🗺️'; }
.widget_media_image      .moe-widget__title::before { content: '🖼️'; }
.widget_moe_notice_widget .moe-widget__title::before { content: '📢'; }
.widget_moe_tags          .moe-widget__title::before { content: '🏷️'; }
.widget_moe_comments      .moe-widget__title::before { content: '💬'; }
.widget_moe_popular       .moe-widget__title::before { content: '🔥'; }
.widget_moe_adcard        .moe-widget__title::before { content: '🖼️'; }

/* ══ 标签随机变色（不依赖 JS，用 nth-child 覆盖8色）══════ */
.moe-tag-link:nth-child(8n+1) { background:rgba(94,179,217,0.12); color:#5eb3d9; }
.moe-tag-link:nth-child(8n+2) { background:rgba(224,92,111,0.1);  color:#e05c6f; }
.moe-tag-link:nth-child(8n+3) { background:rgba(58,168,224,0.1);  color:#3aa8e0; }
.moe-tag-link:nth-child(8n+4) { background:rgba(58,190,130,0.1);  color:#3abe82; }
.moe-tag-link:nth-child(8n+5) { background:rgba(224,179,58,0.1);  color:#e0b33a; }
.moe-tag-link:nth-child(8n+6) { background:rgba(224,124,58,0.1);  color:#e07c3a; }
.moe-tag-link:nth-child(8n+7) { background:rgba(155,89,182,0.1);  color:#9b59b6; }
.moe-tag-link:nth-child(8n+8) { background:rgba(224,85,85,0.1);   color:#e05555; }
.moe-tag-link:hover { filter: brightness(1.1); color:#fff; }
/* 侧边栏 tag cloud（WP原生）同色方案 */
.widget_tag_cloud .tag-cloud-link:nth-child(8n+1) { background:rgba(94,179,217,0.12)!important; color:#5eb3d9!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+2) { background:rgba(224,92,111,0.1)!important;  color:#e05c6f!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+3) { background:rgba(58,168,224,0.1)!important;  color:#3aa8e0!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+4) { background:rgba(58,190,130,0.1)!important;  color:#3abe82!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+5) { background:rgba(224,179,58,0.1)!important;  color:#e0b33a!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+6) { background:rgba(224,124,58,0.1)!important;  color:#e07c3a!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+7) { background:rgba(155,89,182,0.1)!important;  color:#9b59b6!important; }
.widget_tag_cloud .tag-cloud-link:nth-child(8n+8) { background:rgba(224,85,85,0.1)!important;   color:#e05555!important; }

/* ══ 底部菜单重构 ══════════════════════════════════════════ */
.moe-footer__inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
}
.moe-footer__brand {
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
}
.moe-footer__site-icon { width: 24px; height: 24px; border-radius: 4px; object-fit: contain; flex-shrink: 0; }
.moe-footer__logo-img  { height: 28px; width: auto; }
.moe-footer__logo-text {
  font-family: 'ZCOOL KuaiLe', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  font-weight: 400; font-size: 18px; letter-spacing: 1px;
  background: linear-gradient(90deg, #1a5d7e 0%, #5eb3d9 50%, #1a5d7e 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  animation: moe-logo-flow 5s linear infinite;
}
.moe-footer__copy { font-size: 13px; color: var(--c-text-3); white-space: nowrap; }
.moe-footer__nav { display: flex; }
.moe-footer__menu {
  list-style: none; display: flex; flex-wrap: wrap;
  gap: 4px 20px; margin: 0; padding: 0; justify-content: center;
}
.moe-footer__menu li a,
.moe-footer__menu li span {
  font-size: 13px; color: var(--c-text-3); text-decoration: none;
  transition: color var(--trans); white-space: nowrap;
}
.moe-footer__menu li a:hover { color: var(--c-primary); }
.moe-footer__nav--right .moe-footer__menu { justify-content: flex-end; }

/* ══ 首页布局：侧边栏顶部与轮播顶部对齐 ══════════════════ */
/* 整体用 3 列 grid：内容区(1fr) + 侧边栏(280px)，轮播和推荐位在内容列 */
.moe-homepage-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  grid-template-rows: auto;
  gap: 24px;
  margin-top: 0;
  align-items: start;
}
.moe-content-area { min-width: 0; }
/* sidebar在PC端固定在第2列，移动端恢复正常流 */
@media (min-width: 901px) {
  .moe-sidebar { grid-row: 1 / -1; grid-column: 2; align-self: start; }
}
@media (max-width: 900px) {
  .moe-sidebar { grid-column: auto; grid-row: auto; order: 2; }
}

/* 轮播图区域：只占内容列（左列），不含侧边栏 */
.moe-carousel-section {
  display: block;        /* 不再是 grid，只是普通块 */
  margin-bottom: 20px;
}
/* PC端轮播固定高度 */
.moe-carousel-section .moe-carousel { min-height: 300px; }
.moe-carousel-section .moe-carousel__slide { height: 300px; }
.moe-carousel-sidebar { display: none; }   /* 轮播右侧公告槽暂不用，由侧边栏承担 */

/* ══ 移动端：不改动轮播图，只处理背景图和菜单 ══════════ */
@media (max-width: 768px) {
  .no-mobile-bg .moe-bg { display: none !important; }
  .no-mobile-bg .moe-article-bg { display: none !important; }
  /* 底部菜单移动端：垂直堆叠 */
  .moe-footer__inner {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 12px;
  }
  .moe-footer__brand { justify-content: center; }
  .moe-footer__menu { justify-content: center; }
  .moe-footer__nav--right { display: none; }
  /* 移动端轮播恢复全宽，高度还原（不改动 mobile.css 里的值） */
  .moe-carousel-section { grid-template-columns: 1fr; gap: 0; margin-bottom: 16px; }
  .moe-carousel-section .moe-carousel-sidebar { display: none; }
  /* 移动端轮播高度完全由 mobile.css 控制，这里明确不设置 */
  .moe-carousel-section .moe-carousel { min-height: 0 !important; height: auto !important; }
  .moe-carousel-section .moe-carousel__slide { height: 220px; }
}
@media (max-width: 480px) {
  .moe-carousel-section .moe-carousel__slide { height: 180px; }
}

/* ══ 小工具移动端隐藏（data-mobile-hide 属性）══════════ */
@media (max-width: 900px) {
  .moe-widget[data-mobile-hide="1"] { display: none !important; }
}

/* ══ 美观优化补丁 v1.2.2 ═══════════════════════════════════ */

/* 卡片：缩略图比例微调 + 标题悬停色 */
.moe-card__title a:hover { color: var(--c-primary); }
.moe-card__thumb-wrap { aspect-ratio: 3/2; }

/* 卡片 meta 信息更轻量 */
.moe-card__meta { font-size: 11px; color: var(--c-text-3); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* 卡片分类标签 pill 样式 */
.moe-card__cat {
  display: inline-block; font-size: 11px; padding: 1px 7px;
  border-radius: 100px; background: rgba(94,179,217,0.14);
  color: var(--c-primary); white-space: nowrap;
}

/* 首页 section head 视觉强化 */
.moe-section__title {
  font-size: 17px; font-weight: 700;
  padding-left: 0.7em; position: relative;
}
.moe-section__title::before {
  content: ''; position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 1.1em; border-radius: 2px;
  background: linear-gradient(180deg, var(--c-primary), var(--c-accent));
}
.moe-section__more {
  font-size: 13px; color: var(--c-text-3); white-space: nowrap;
  transition: color var(--trans);
}
.moe-section__more:hover { color: var(--c-primary); }

/* 侧边栏小工具：标题去掉下划线，改用上方细线 + 背景 */
.moe-widget__title {
  background: rgba(94,179,217,0.06);
  border-bottom: none !important;
  border-radius: var(--radius-s) var(--radius-s) 0 0;
  margin: -16px -16px 12px -16px !important;
  padding: 10px 16px 10px 2.0em !important;
}

/* footer 底部分隔更清晰 */
.moe-footer { border-top: 2px solid var(--c-primary); }

/* 搜索栏占位符 */
.moe-search-bar input::placeholder { color: var(--c-text-3); }

/* 卡片网格在有侧边栏时确保等高 */
.moe-card { height: 100%; }
.moe-card-grid { align-items: start; }

/* 头部 backdrop 增强 */
.moe-header { backdrop-filter: blur(20px) saturate(1.6); -webkit-backdrop-filter: blur(20px) saturate(1.6); }

/* 页面滚动条美化（Chrome/Edge） */
:root { scrollbar-width: thin; scrollbar-color: var(--c-primary) transparent; }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-thumb { background: var(--c-primary); border-radius: 3px; }
::-webkit-scrollbar-track { background: transparent; }
