/* ===== Claude 中文知识站 · halocms 风格化覆盖 ===== */
:root{
  --theme-color: #0c97fe;
  --btn-bg: #0c97fe;
  --btn-hover: #0073d6;
  --text-main: #1f2937;
  --text-soft: #6b7280;
  --bg-page: #ffffff;
  --bg-card: #ffffff;
  --border-soft: #eef0f3;
  --shadow-card: 0 2px 12px rgba(17,24,39,.04);
  --shadow-card-hover: 0 8px 24px rgba(12,151,254,.10);
}

html, body{
  background: var(--bg-page);
  color: var(--text-main);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

#page-header{
  background: #ffffff !important;
  box-shadow: 0 1px 0 var(--border-soft);
}
#page-header.nav-fixed,
#page-header.nav-visible{
  background: rgba(255,255,255,.96) !important;
  backdrop-filter: saturate(180%) blur(10px);
  box-shadow: 0 1px 0 var(--border-soft);
}
#nav, #nav a, #nav #site-name, #nav .site-page{ color: var(--text-main) !important; }
#nav #search-button .site-page{ color: var(--text-main) !important; }
#nav .menus_item_child{ background: #fff; border: 1px solid var(--border-soft); box-shadow: var(--shadow-card); }
#nav .menus_item_child a{ color: var(--text-main) !important; }

#page-header.not-top-img{
  height: 60px !important; min-height: 60px !important;
}
#page-header.full_page{
  height: 340px !important; min-height: 340px !important;
  background: linear-gradient(135deg, #e8f4ff 0%, #f6f9fc 60%, #ffffff 100%) !important;
}
#page-header.full_page::before{ background: transparent !important; }
#page-header.full_page #site-info #site-title,
#page-header.full_page #site-info #site-subtitle,
#page-header #site-name{
  color: var(--text-main) !important;
  text-shadow: none !important;
}
#page-header.full_page #site-info #site-subtitle{
  color: var(--text-soft) !important;
}
#scroll-down .scroll-down-effects{ color: var(--theme-color) !important; }

/* ============ 首页文章卡片网格 ============ */
.recent-post-items{
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
}
@media (max-width: 900px){
  .recent-post-items{ grid-template-columns: 1fr !important; }
}

.recent-post-items .recent-post-item{
  width: auto !important;
  max-width: none !important;
  flex-direction: column !important;
  display: flex !important;
  border-radius: 10px !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: var(--shadow-card) !important;
  background: var(--bg-card) !important;
  overflow: hidden !important;
  margin: 0 !important;
  transition: transform .2s ease, box-shadow .2s ease;
}
.recent-post-items .recent-post-item:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow-card-hover) !important;
}

.recent-post-items .recent-post-item .post_cover{
  width: 100% !important;
  max-width: none !important;
  height: 200px !important;
  max-height: 200px !important;
  margin: 0 !important;
  order: 0 !important;
  float: none !important;
}
.recent-post-items .recent-post-item .post_cover.left,
.recent-post-items .recent-post-item .post_cover.right{
  margin: 0 !important;
}
.recent-post-items .recent-post-item .post_cover a{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}
.recent-post-items .recent-post-item .post_cover img,
.recent-post-items .recent-post-item .post_cover .post-bg{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.recent-post-items .recent-post-item .recent-post-info{
  width: 100% !important;
  max-width: none !important;
  padding: 18px 20px !important;
  order: 1 !important;
}
.recent-post-items .recent-post-info .article-title{
  font-size: 1.1rem !important;
  line-height: 1.45 !important;
  color: var(--text-main) !important;
  margin-bottom: 10px !important;
}
.recent-post-items .recent-post-info .article-title:hover{
  color: var(--theme-color) !important;
}
.recent-post-items .recent-post-info .content{
  color: var(--text-soft) !important;
  font-size: .9rem !important;
  -webkit-line-clamp: 2 !important;
}
.recent-post-items .article-meta-wrap{ margin-bottom: 8px; }

/* 主布局容器 */
.layout{
  max-width: 1200px !important;
  padding: 24px 16px !important;
}
@media (max-width: 900px){
  .layout{ padding: 16px 12px !important; }
}
#content-inner{
  display: flex !important;
  gap: 20px;
}
#content-inner.layout > .recent-posts,
#content-inner.layout > #post,
#content-inner.layout > #page,
#content-inner.layout > #archive{
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
#aside-content{
  flex: 0 0 300px !important;
  max-width: 300px !important;
}
@media (max-width: 900px){
  #content-inner{ flex-direction: column !important; }
  #aside-content{ flex: 0 0 auto !important; max-width: none !important; width: 100% !important; }
}

#aside-content .card-widget{
  border-radius: 10px !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: var(--shadow-card) !important;
  background: #fff !important;
}
#aside-content .item-headline{ color: var(--text-main); font-weight: 600; }
#aside-content .card-info a{ color: var(--theme-color); }
#aside-content .card-announcement-content{ color: var(--text-soft); font-size: .85rem; line-height: 1.7; }
#aside-content .author-info__name{ color: var(--text-main); }
#aside-content .author-info__description{ color: var(--text-soft); font-size: .85rem; }

#post #article-container,
#page #article-container{
  color: var(--text-main);
  font-size: 16px;
  line-height: 1.85;
}
#post h1, #post h2, #post h3, #post h4,
#page h1, #page h2, #page h3, #page h4{
  color: var(--text-main);
  border-left: 4px solid var(--theme-color);
  padding-left: 12px;
  margin: 1.8em 0 .8em;
}
#post h1, #page h1{ font-size: 1.6rem; }
#post h2, #page h2{ font-size: 1.35rem; }
#post h3, #page h3{ font-size: 1.15rem; }
#post a:not(.headerlink), #page a:not(.headerlink){
  color: var(--theme-color);
  border-bottom: 1px dashed rgba(12,151,254,.4);
}
#post a:not(.headerlink):hover, #page a:not(.headerlink):hover{
  border-bottom-color: var(--theme-color);
}
#post blockquote, #page blockquote{
  background: #f6f9fc;
  border-left: 4px solid var(--theme-color);
  color: var(--text-main);
  border-radius: 0 6px 6px 0;
  padding: 12px 16px;
  margin: 16px 0;
}

.btn-beautify, .button--animated, .post-button a{
  background: var(--btn-bg) !important;
  color: #fff !important;
  border-radius: 6px;
}
.btn-beautify:hover{ background: var(--btn-hover) !important; }

#pagination .page-number.current,
#pagination .extend.next:hover,
#pagination .extend.prev:hover{
  background: var(--theme-color) !important;
  color: #fff !important;
}

#footer{ background: #fafbfc !important; color: var(--text-soft); }
#footer::before{ background: transparent !important; }
#footer-wrap{ color: var(--text-soft) !important; }
#footer-wrap a{ color: var(--theme-color) !important; }

#post-info{ color: var(--text-main); }
#post-meta .post-meta-date,
#post-meta .post-meta__title{ color: var(--text-soft); }

#card-toc .toc-content .toc-link.active,
#card-toc .toc-content .toc-link:hover{
  color: var(--theme-color);
}

#archive .article-sort-item-title,
.tag-cloud-tags a{ color: var(--text-main); }
.tag-cloud-tags a:hover{ color: #fff !important; background: var(--theme-color); }

.cta-card{
  margin: 24px 0;
  padding: 18px 20px;
  border-radius: 10px;
  border: 1px solid var(--border-soft);
  background: linear-gradient(135deg, #e8f4ff 0%, #ffffff 100%);
  box-shadow: var(--shadow-card);
}
.cta-card .cta-title{ color: var(--text-main); font-weight: 600; margin-bottom: 6px; }
.cta-card a{ color: var(--theme-color); font-weight: 500; }
.cta-card .cta-desc{ color: var(--text-soft); font-size: .9rem; line-height: 1.7; }

figure.highlight, pre{ border-radius: 8px; font-size: 13px; }

#recent-posts .sticky_top{ display: none; }

#footer .framework-info{ display: none !important; }

/* ========== 视觉精修（halocms 风） ========== */

/* 首页顶图：更轻盈的渐变 + 大标题居中 */
#page-header.full_page{
  height: 380px !important; min-height: 380px !important;
  background:
    radial-gradient(1200px 400px at 50% -100px, rgba(12,151,254,.12), transparent 70%),
    linear-gradient(180deg, #f4f9ff 0%, #ffffff 100%) !important;
}
#page-header.full_page #site-info{
  padding-top: 40px;
}
#page-header.full_page #site-info #site-title{
  font-size: 2.6rem !important;
  font-weight: 700 !important;
  letter-spacing: -.5px;
  background: linear-gradient(135deg, #0c97fe 0%, #0073d6 100%);
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}
#page-header.full_page #site-info #site-subtitle{
  font-size: 1.05rem !important;
  margin-top: 10px;
  font-weight: 400;
}
#page-header.full_page #site-info .typed-cursor{ display: none; }

/* 导航字号与间距 */
#nav{ font-size: 14.5px; }
#nav #site-name{ font-weight: 600; }
#nav .menus_items .menus_item > a,
#nav .menus_items .menus_item > .site-page{
  padding: 0 10px;
  transition: color .15s ease;
}
#nav .menus_items .menus_item > a:hover,
#nav .menus_items .menus_item > .site-page:hover{
  color: var(--theme-color) !important;
}

/* 文章卡片整体更精致 */
.recent-post-items .recent-post-item{
  border-radius: 12px !important;
  border: 1px solid #edf0f4 !important;
  box-shadow: 0 1px 3px rgba(17,24,39,.03), 0 1px 2px rgba(17,24,39,.02) !important;
  transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, border-color .2s ease !important;
}
.recent-post-items .recent-post-item:hover{
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 28px rgba(12,151,254,.12), 0 4px 8px rgba(17,24,39,.04) !important;
  border-color: #d6e9fc !important;
}
.recent-post-items .recent-post-item .post_cover{
  height: 190px !important;
  max-height: 190px !important;
  background: linear-gradient(135deg, #eaf3fc 0%, #f7fafd 100%);
}
.recent-post-items .recent-post-item .post_cover img{
  transition: transform .6s cubic-bezier(.2,.8,.2,1) !important;
}
.recent-post-items .recent-post-item:hover .post_cover img{
  transform: scale(1.04);
}
.recent-post-items .recent-post-item .recent-post-info{
  padding: 20px 22px 22px !important;
}
.recent-post-items .recent-post-info .article-title{
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  letter-spacing: -.2px;
  margin-bottom: 10px !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.recent-post-items .article-meta-wrap{
  margin-bottom: 10px !important;
  font-size: 12.5px !important;
  color: var(--text-soft) !important;
}
.recent-post-items .article-meta-wrap .article-meta{
  color: var(--text-soft) !important;
}
.recent-post-items .article-meta-wrap a{
  color: var(--text-soft) !important;
  border-bottom: none !important;
}
.recent-post-items .article-meta-wrap a:hover{
  color: var(--theme-color) !important;
}
.recent-post-items .recent-post-info .content{
  font-size: .92rem !important;
  line-height: 1.7 !important;
  color: #6b7280 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 侧栏：更有层次 */
#aside-content .card-widget{
  border-radius: 12px !important;
  border: 1px solid #edf0f4 !important;
  padding: 18px 20px !important;
  margin-bottom: 18px !important;
}
#aside-content .card-widget .item-headline{
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f0f2f5;
}
#aside-content .card-widget .item-headline i{
  color: var(--theme-color);
  margin-right: 6px;
}
#aside-content .card-author{
  text-align: center;
}
#aside-content .card-info .avatar-img{
  width: 96px !important;
  height: 96px !important;
  border: 3px solid #fff;
  box-shadow: 0 2px 8px rgba(12,151,254,.12);
  margin: 0 auto 12px;
}
#aside-content .card-info #author-info__name{
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-main);
}
#aside-content .card-info #author-info__description{
  font-size: .85rem;
  color: var(--text-soft);
  line-height: 1.7;
  margin-top: 6px;
}
#aside-content .card-info .card-info-social-icons{ margin: 14px 0 8px; }
#aside-content .card-info .button--animated{
  width: 100%;
  padding: 10px 0;
  border-radius: 8px;
  font-weight: 500;
}
#aside-content .aside-list-item{
  padding: 8px 0;
  border-bottom: 1px dashed #f0f2f5;
}
#aside-content .aside-list-item:last-child{ border-bottom: none; }
#aside-content .aside-list-item .content .name{
  font-size: .88rem;
  color: var(--text-main);
}
#aside-content .aside-list-item:hover .content .name{ color: var(--theme-color); }
#aside-content .card-categories ul.card-category-list .card-category-list-item a{
  padding: 6px 0;
  color: var(--text-main);
}
#aside-content .card-categories ul.card-category-list .card-category-list-item a:hover{
  color: var(--theme-color);
  padding-left: 4px;
  transition: padding .15s ease;
}
#aside-content .card-tags .card-tag-cloud a{
  margin: 0 6px 8px 0;
  padding: 4px 10px;
  background: #f4f6f9;
  border-radius: 20px;
  font-size: 12.5px !important;
  color: var(--text-soft) !important;
  transition: all .15s ease;
}
#aside-content .card-tags .card-tag-cloud a:hover{
  background: var(--theme-color);
  color: #fff !important;
}

/* 文章正文：更克制的行距/字号 */
#post #article-container,
#page #article-container{
  font-size: 15.5px !important;
  line-height: 1.9 !important;
  color: #1f2937;
}
#post #article-container p,
#page #article-container p{
  margin: 1em 0;
}
#post #article-container h1,
#post #article-container h2,
#post #article-container h3,
#post #article-container h4,
#page #article-container h1,
#page #article-container h2,
#page #article-container h3,
#page #article-container h4{
  border-left: 3px solid var(--theme-color) !important;
  padding-left: 12px !important;
  color: var(--text-main) !important;
  font-weight: 600;
}
#post #article-container h2{ font-size: 1.35rem !important; margin-top: 2em !important; }
#post #article-container h3{ font-size: 1.15rem !important; margin-top: 1.6em !important; }
#post #article-container blockquote,
#page #article-container blockquote{
  background: linear-gradient(180deg, #f7fbff 0%, #f4f9fd 100%) !important;
  border-left: 3px solid var(--theme-color) !important;
  border-radius: 0 8px 8px 0;
  padding: 14px 18px !important;
  color: #374151 !important;
}
#post #article-container code,
#page #article-container code{
  background: #f1f5fb !important;
  color: #0c6ab8 !important;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 13.5px;
}
#post #article-container figure.highlight,
#page #article-container figure.highlight{
  border-radius: 10px !important;
  box-shadow: 0 2px 6px rgba(17,24,39,.06);
  border: 1px solid #eef0f3;
}
#post #article-container ul li,
#post #article-container ol li{
  margin: .3em 0;
}

/* 文章页顶部 meta 卡片 */
#post #post-info{
  padding: 20px 0 24px;
  border-bottom: 1px solid #eef0f3;
  margin-bottom: 24px;
}
#post #post-info .post-title{
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: -.3px;
  color: var(--text-main);
  margin-bottom: 14px;
}
#post #post-info #post-meta{
  font-size: 13px;
  color: var(--text-soft);
}

/* 相关文章 */
#related-posts .headline{
  font-size: 1.05rem;
  font-weight: 600;
  margin-bottom: 14px;
  padding-left: 10px;
  border-left: 3px solid var(--theme-color);
}
#related-posts .relatedPosts-list > div{
  border-radius: 10px;
  border: 1px solid #edf0f4;
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
#related-posts .relatedPosts-list > div:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-card-hover);
}

/* 分页器 */
#pagination{
  margin-top: 32px;
}
#pagination .pagination .page-number,
#pagination .pagination .extend{
  border-radius: 6px !important;
  padding: 6px 12px;
  font-size: 14px;
  color: var(--text-soft);
  background: #fff;
  border: 1px solid #edf0f4;
  margin: 0 3px;
}
#pagination .pagination .page-number:hover,
#pagination .pagination .extend:hover{
  color: var(--theme-color);
  border-color: var(--theme-color);
}
#pagination .pagination .page-number.current{
  background: var(--theme-color) !important;
  border-color: var(--theme-color);
  color: #fff !important;
}

/* 归档/分类页 */
#archive .article-sort-title{
  font-size: 1.1rem !important;
  font-weight: 600;
  padding-bottom: 6px;
  border-bottom: 1px solid #eef0f3;
}
#archive .article-sort-item{
  border-left: 2px solid #eef0f3;
  padding-left: 18px;
  position: relative;
}
#archive .article-sort-item::before{
  content: '';
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--theme-color);
  position: absolute;
  left: -5px; top: 10px;
}
#archive .article-sort-item .article-sort-item-title{
  font-size: 1rem !important;
  font-weight: 500;
}

/* 页脚 */
#footer{
  padding: 28px 20px !important;
  font-size: 13px;
}
#footer #footer-wrap{ line-height: 1.9; }
#footer #footer-wrap a:hover{ opacity: .75; }

/* 站群交叉链接区块（注入的 div） */
.site-cross-links-block-v1{
  max-width: 1200px !important;
  border-top: 1px solid #eef0f3 !important;
  padding: 24px 20px 8px !important;
  margin: 0 auto !important;
  font-size: 13px !important;
}
.site-cross-links-block-v1 strong{
  display: block;
  margin-bottom: 10px;
  font-size: 13.5px !important;
}
.site-cross-links-block-v1 a{
  color: var(--theme-color) !important;
  margin: 0 8px !important;
  transition: opacity .15s ease;
}
.site-cross-links-block-v1 a:hover{ opacity: .7; }

/* 滚动条 */
::-webkit-scrollbar{ width: 10px; height: 10px; }
::-webkit-scrollbar-thumb{ background: #d4dae3; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover{ background: var(--theme-color); }

/* 选中颜色 */
::selection{ background: rgba(12,151,254,.2); color: #0c6ab8; }

/* 右下角按钮 */
#rightside #rightside-config-hide button,
#rightside #rightside-config-show button,
#rightside .rightside-btn{
  background: #fff !important;
  color: var(--text-soft) !important;
  border: 1px solid #edf0f4 !important;
  box-shadow: var(--shadow-card) !important;
}
#rightside button:hover,
#rightside .rightside-btn:hover{
  color: var(--theme-color) !important;
  border-color: var(--theme-color) !important;
}

/* 搜索框 */
#local-search .search-dialog{
  border-radius: 12px !important;
  border: 1px solid #edf0f4;
}

/* 响应式优化 */
@media (max-width: 768px){
  #page-header.full_page{ height: 260px !important; min-height: 260px !important; }
  #page-header.full_page #site-info #site-title{ font-size: 1.9rem !important; }
  .recent-post-items{ gap: 16px !important; }
  .recent-post-items .recent-post-item .post_cover{ height: 160px !important; }
  #post #post-info .post-title{ font-size: 1.45rem; }
}