/* ============================================================================
   K100 自定义样式汇总（追加到 /imgss/css/uikit.min.css 文件末尾）
   说明：所有页面都引用了 uikit.min.css，本段写在这里即可全站生效，无需逐页改。
   升级/替换 UIkit 框架时，请保留本段，或另行备份。
   ============================================================================ */

/* 1. 移动端导航统一深色背景 #222，文字/图标白色（PC 端导航本身已是 #222） */
@media (max-width: 959px) {
  .uk-navbar-container.uk-navbar-transparent {
    background-color: #222 !important;
  }
  /* 移动导航无论透明/非透明状态都强制 #222；并去掉 uk-margin 底部空隙 */
  nav.uk-navbar-container.uk-hidden\@m {
    background-color: #222 !important;
    margin-bottom: 0 !important;
    color: #fff;
  }
  /* 站名文字、汉堡图标改白色（深底上才可见） */
  nav.uk-navbar-container.uk-hidden\@m .uk-logo,
  nav.uk-navbar-container.uk-hidden\@m .uk-navbar-toggle {
    color: #fff !important;
  }
  /* 隐藏 PC 导航容器（消除空白） */
  .uk-margin-medium-bottom[uk-sticky] { display: none; }
  /* 内页正文（非首页 banner）顶部补间距，避免标题紧贴导航。
     首页 uk-container 的首项是 .home-banner（非 .uk-grid），不命中，故不影响 banner */
  .uk-container > .uk-grid:first-child { margin-top: 20px; }
  /* 移动端 logo 图与站名拉开间距并垂直居中；PC 端不生效 */
  .uk-logo { display: inline-flex; align-items: center; }
  .uk-logo img { margin-right: 10px; }
}

/* 2. 底部蓝色区域：内容不足时贴底，且内容上下居中 */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.footer {
  margin-top: auto !important;
  padding-top: 40px;
}
.footer .uk-section {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}
@media (max-width: 640px) {
  .footer .uk-section {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}

/* 3. 文章正文图片响应式（覆盖编辑器写死的固定宽高） */
.uk-article img {
  max-width: 100% !important;
  height: auto !important;
}

/* 4. 首页 Banner 移动端适配（首页才有 .home-banner，其它页自动忽略） */
@media (max-width: 959px) {
  /* 首页 banner 与导航之间保留适中间距（内页没有 .home-banner，不受影响） */
  .home-banner { margin-top: 12px; }
  .home-banner .uk-slideshow-items { height: 220px !important; }
  .home-banner .uk-overlay { padding: 12px 15px; }
  .home-banner .uk-overlay h3 { font-size: 17px; }
  .home-banner .uk-overlay p {
    font-size: 12px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}
@media (max-width: 480px) {
  .home-banner .uk-slideshow-items { height: 180px !important; }
  .home-banner .uk-overlay { padding: 8px 12px; }
  .home-banner .uk-overlay h3 { font-size: 15px; }
  .home-banner .uk-overlay p { display: none; }
}

/* 5. 列表页：卡片式文章（仅列表页有 .nl 元素，其它页自动忽略） */
.nl { background: #fff; }
.nl-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 14px;
  margin-bottom: 6px;
  border-bottom: 2px solid #f8c300;
}
.nl-title {
  font-size: 24px;
  font-weight: 700;
  color: #222;
  margin: 0;
  padding-left: 12px;
  position: relative;
}
.nl-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 20px;
  background: #f8c300;
  border-radius: 2px;
}
.nl-card {
  display: flex;
  gap: 18px;
  padding: 20px 4px;
  border-bottom: 1px solid #eee;
}
a.nl-thumb {
  display: block;
  flex: 0 0 190px;
  width: 190px;
  height: 124px;
  overflow: hidden;
  border-radius: 6px;
  background: #f2f2f2;
}
.nl-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s;
}
.nl-thumb:hover img { transform: scale(1.06); }
.nl-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.nl-t {
  font-size: 17px;
  font-weight: 600;
  margin: 0 0 8px;
  line-height: 1.4;
}
.nl-t a {
  color: #222;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nl-t a:hover { color: #c99700; }
.nl-meta {
  display: flex;
  gap: 18px;
  font-size: 12px;
  color: #999;
  margin-bottom: 8px;
}
.nl-date { color: #c99700; font-weight: 600; }
.nl-desc {
  font-size: 13px;
  color: #666;
  line-height: 1.7;
  margin: 0 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nl-more {
  margin-top: auto;
  align-self: flex-start;
  font-size: 13px;
  color: #222;
  font-weight: 600;
  text-decoration: none;
}
.nl-more::after { content: " \2192"; }
.nl-more:hover { color: #d9a400; }

/* 6. 列表页翻页按钮 */
.pagelist {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin: 30px 0 6px;
  padding: 0;
}
.pagelist li {
  min-width: 40px;
  height: 40px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  font-size: 14px;
  color: #333;
}
.pagelist li a {
  color: #333;
  text-decoration: none;
  display: block;
}
.pagelist li:hover { border-color: #f8c300; }
.pagelist li:hover a { color: #c99700; }
.pagelist li.thisclass {
  background: #222;
  border-color: #222;
  color: #fff;
}

/* 列表 + 移动端 */
@media (max-width: 640px) {
  a.nl-thumb { flex: 0 0 112px; width: 112px; height: 84px; }
  .nl-card { gap: 12px; padding: 15px 0; }
  .nl-t a { font-size: 15px; -webkit-line-clamp: 2; }
  .nl-desc { display: none; }
  .nl-meta { margin-bottom: 0; }
  .pagelist li { min-width: 34px; height: 34px; padding: 0 10px; font-size: 13px; }
}
