/* ==============================
   CNBL Portal / Forum Skin (DIY friendly)
   For Discuz! X3.5 - template/clwl1
   ============================== */

html, body { height: 100%; }

body{
  background:
    radial-gradient(1200px 600px at 15% 20%, rgba(120,220,255,.35), transparent 60%),
    radial-gradient(1200px 600px at 85% 60%, rgba(170,120,255,.25), transparent 55%),
    linear-gradient(180deg, #eaf8ff 0%, #f6fbff 55%, #ffffff 100%);
  background-attachment: fixed;
}

/* container */
.wp, #wp{ width: 1200px; margin: 0 auto; }
@media (max-width: 1240px){ .wp, #wp{ width: auto; margin: 0 12px; } }

/* header: cleaner */
#hd{
  background: rgba(255,255,255,.78);
  border-bottom: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(8px);
}

/* card */
.cnbl-card{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 10px 26px rgba(20,80,140,.10);
  border-radius: 12px;
  overflow: hidden;
}

/* three columns */
.cnbl-wrap{ display: flex; gap: 18px; margin: 18px 0; }
.cnbl-left{ width: 220px; flex: 0 0 220px; }
.cnbl-main{ flex: 1; min-width: 0; }
.cnbl-right{ width: 320px; flex: 0 0 320px; }
@media (max-width: 980px){
  .cnbl-wrap{ flex-direction: column; }
  .cnbl-left, .cnbl-right{ width: auto; flex: none; }
}

/* titles + body */
.cnbl-title{
  font-size: 14px;
  font-weight: 700;
  color: #2b5c9b;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0,0,0,.06);
  letter-spacing: .2px;
}
.cnbl-box{ padding: 12px 14px; }

/* portal: top full banner area */
.cnbl-banner{ height: 360px; border-radius: 12px; overflow: hidden; }
.cnbl-banner img{ width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 980px){ .cnbl-banner{ height: 220px; } }

/* left menu */
.cnbl-sidemenu{ padding: 10px; }
.cnbl-sidemenu h3{
  font-size: 13px;
  color: #2b5c9b;
  margin: 6px 10px 10px;
}
.cnbl-sidemenu ul{ list-style: none; margin: 0; padding: 0; }
.cnbl-sidemenu li a{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  color: #2a2a2a;
  text-decoration: none;
}
.cnbl-sidemenu li a:hover{ background: rgba(30,140,255,.10); }
.cnbl-dot{
  width: 8px; height: 8px; border-radius: 50%;
  background: #1e8cff;
  flex: 0 0 8px;
  box-shadow: 0 0 0 4px rgba(30,140,255,.12);
}

/* diy blocks spacing */
.area{ margin: 0; }
.cnbl-diy-pad{ padding: 12px 14px; }

/* DIY module templates */
.cnbl-ul{ list-style: none; margin: 0; padding: 0; }
.cnbl-ul li{ padding: 10px 0; border-bottom: 1px dashed rgba(0,0,0,.08); }
.cnbl-ul li:last-child{ border-bottom: 0; }
.cnbl-ul a{ color: #334; text-decoration: none; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cnbl-ul a:hover{ color: #1e8cff; }

.cnbl-news .item{ display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,.06); }
.cnbl-news .item:last-child{ border-bottom: 0; }
.cnbl-news .thumb{ width: 160px; height: 100px; border-radius: 10px; overflow: hidden; flex: 0 0 160px; }
.cnbl-news .thumb img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.cnbl-news .info{ flex: 1; min-width: 0; }
.cnbl-news .info h3{ font-size: 16px; margin: 0 0 6px; line-height: 1.4; }
.cnbl-news .info h3 a{ color: #223; }
.cnbl-news .info h3 a:hover{ color: #1e8cff; }
.cnbl-news .info .desc{ color: #667; font-size: 13px; line-height: 1.7; height: 44px; overflow: hidden; }
.cnbl-news .info .meta{ margin-top: 6px; color: #99a; font-size: 12px; }
@media (max-width: 980px){
  .cnbl-news .thumb{ width: 120px; height: 80px; flex-basis: 120px; }
  .cnbl-news .info .desc{ display: none; }
}

/* small buttons */
.cnbl-btn{
  display: inline-block;
  padding: 10px 12px;
  border-radius: 10px;
  background: #1e8cff;
  color: #fff !important;
  text-align: center;
  text-decoration: none !important;
}
.cnbl-btn:hover{ filter: brightness(.95); }
/* ================================
   CNBL 左侧导航模块样式
   模块「指定class」填写：cnbl-sidecard
   图标：25x25
   文字：垂直居中
================================ */

.cnbl-sidecard{
  background:#fff;
  border-radius:14px;
  padding:10px 8px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}

/* 列表重置 */
.cnbl-sidemenu{
  margin:0;
  padding:0;
  list-style:none;
}

.cnbl-item + .cnbl-item{
  margin-top:6px;
}

/* 单行结构：图标 + 文字 */
.cnbl-link{
  display:flex;
  align-items:center;          /* 垂直居中 */
  gap:10px;
  padding:10px;
  border-radius:12px;
  text-decoration:none;
  color:#333;
  line-height:1;
  transition:all .15s ease;
}

.cnbl-link:hover{
  background:rgba(64,120,255,.08);
}

.cnbl-item.is-active .cnbl-link{
  background:rgba(64,120,255,.12);
  font-weight:700;
}

/* 图标：固定 25x25 */
.cnbl-ico{
  width:25px;
  height:25px;
  flex:0 0 25px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.cnbl-ico img{
  width:25px;
  height:25px;
  display:block;
  border-radius:50%;
  object-fit:cover;            /* 原图多大都压成 25x25 */
}

/* 文字 */
.cnbl-text{
  font-size:14px;
  line-height:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ================================
   CNBL 门户帖子列表样式
   对应模块：论坛 → 帖子
================================ */

.cnbl-postlist{
  background:#fff;
  border-radius:14px;
  padding:6px 12px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.cnbl-postlist-ul{
  list-style:none;
  margin:0;
  padding:0;
}

.cnbl-postitem{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 0;
  border-bottom:1px solid #f0f0f0;
}

.cnbl-postitem:last-child{
  border-bottom:none;
}

/* 头像 */
.cnbl-post-avatar{
  width:40px;
  height:40px;
  flex:0 0 40px;
}

.cnbl-post-avatar img{
  width:40px;
  height:40px;
  border-radius:50%;
  display:block;
}

/* 中间主体 */
.cnbl-post-main{
  flex:1;
  min-width:0;
}

.cnbl-post-title{
  display:block;
  font-size:16px;
  font-weight:600;
  color:#1f2937;
  text-decoration:none;
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.cnbl-post-title:hover{
  color:#2563eb;
}

.cnbl-post-meta{
  margin-top:6px;
  font-size:12px;
  color:#9ca3af;
}

.cnbl-post-meta .cnbl-dot{
  margin:0 6px;
}

/* 右侧统计 */
.cnbl-post-stats{
  flex:0 0 auto;
  text-align:right;
  font-size:12px;
  color:#9ca3af;
  white-space:nowrap;
}

.cnbl-post-stats span{
  margin-left:10px;
}

/*  右侧公告/* 
/* ================================
   CNBL 站点介绍卡片（右侧）
================================ */
.cnbl-sitecard{
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.cnbl-sitecard-cover{
  position:relative;
  height:96px;
}

.cnbl-sitecard-coverbg{
  position:absolute;
  inset:0;
  background: radial-gradient(120px 80px at 20% 40%, rgba(255,255,255,.85), rgba(255,255,255,0)),
              radial-gradient(140px 90px at 60% 10%, rgba(255,255,255,.75), rgba(255,255,255,0)),
              linear-gradient(135deg, rgba(187,230,255,.9), rgba(221,214,255,.9));
}

/* logo 方块 */
.cnbl-sitecard-logo{
  position:absolute;
  left:16px;
  bottom:-18px;
  width:52px;
  height:52px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 10px 20px rgba(0,0,0,.10);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.cnbl-sitecard-logo img{
  width:36px;
  height:36px;
  display:block;
}

.cnbl-sitecard-body{
  padding:26px 16px 14px;
}

.cnbl-sitecard-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}

.cnbl-sitecard-titletext{
  font-size:18px;
  font-weight:800;
  color:#111827;
  letter-spacing:.5px;
}

.cnbl-sitecard-arrow{
  color:#9ca3af;
  font-size:14px;
}

.cnbl-sitecard-desc{
  color:#6b7280;
  font-size:13px;
  line-height:1.6;
  margin-bottom:14px;
}

/* 统计四宫格 */
.cnbl-sitecard-stats{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:8px;
  padding-top:12px;
  border-top:1px solid #eef2f7;
}

.cnbl-stat{
  text-align:center;
}

.cnbl-stat-label{
  font-size:12px;
  color:#9ca3af;
  margin-bottom:6px;
}

.cnbl-stat-num{
  font-size:16px;
  font-weight:800;
  color:#111827;
}
/* 红框顶部区域（静态） */
.cnbl-sitecard-top{ overflow:hidden; }

.cnbl-sitecard-cover{
  position:relative;
  height:96px;
}
.cnbl-sitecard-coverbg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(120px 80px at 20% 40%, rgba(255,255,255,.85), rgba(255,255,255,0)),
    radial-gradient(140px 90px at 60% 10%, rgba(255,255,255,.75), rgba(255,255,255,0)),
    linear-gradient(135deg, rgba(187,230,255,.9), rgba(221,214,255,.9));
}

.cnbl-sitecard-logo{
  position:absolute;
  left:16px;
  bottom:-18px;
  width:52px;
  height:52px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 10px 20px rgba(0,0,0,.10);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.cnbl-sitecard-logo img{
  width:36px;
  height:36px;
  display:block;
}

.cnbl-sitecard-body{
  padding:26px 16px 14px;
}
.cnbl-sitecard-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}
.cnbl-sitecard-titletext{
  font-size:18px;
  font-weight:800;
  color:#111827;
  letter-spacing:.5px;
}
.cnbl-sitecard-arrow{
  color:#9ca3af;
  font-size:14px;
}
.cnbl-sitecard-desc{
  color:#6b7280;
  font-size:13px;
  line-height:1.6;
  margin-bottom:8px;
}

/* 底部统计区：加分割线（更像你图） */
.cnbl-sitecard-stats{
  padding:12px 10px 14px;
  border-top:1px solid #eef2f7;
}

/*置顶
/* ================================
   CNBL 置顶 / 推荐列表样式
================================ */

.cnbl-toplist{
  list-style:none;
  margin:0;
  padding:0;
}

/* 单条 */
.cnbl-topitem{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
  border-bottom:1px solid #eef2f7;
}

.cnbl-topitem:last-child{
  border-bottom:none;
}

/* 左侧：图标 + 标题 */
.cnbl-toplink{
  display:flex;
  align-items:center;
  gap:10px;
  max-width:calc(100% - 90px);
  text-decoration:none;
}

/* 小图标（圆点/置顶感） */
.cnbl-topicon{
  width:18px;
  height:18px;
  border-radius:50%;
  background:linear-gradient(135deg,#ff7a18,#ffb347);
  flex:0 0 18px;
  position:relative;
}

/* 图标里一个小三角/箭头感（可删） */
.cnbl-topicon::after{
  content:"";
  position:absolute;
  left:6px;
  top:5px;
  width:0;
  height:0;
  border-left:5px solid #fff;
  border-top:4px solid transparent;
  border-bottom:4px solid transparent;
}

/* 标题（重点：大字号） */
.cnbl-toptitle{
  font-size:16px;       /* 你图里就是这种级别 */
  font-weight:600;
  color:#1f2937;
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.cnbl-toplink:hover .cnbl-toptitle{
  color:#2563eb;
}

/* 右侧日期 */
.cnbl-topdate{
  font-size:12px;
  color:#9ca3af;
  white-space:nowrap;
}

/*第一条显眼 */
.cnbl-topitem:first-child .cnbl-toptitle{
  font-size:17px;
  font-weight:700;
}

.cnbl-topitem:first-child .cnbl-topicon{
  background:linear-gradient(135deg,#ff3b3b,#ff7a7a);
}



/* ================================
   门户底部友情链接
================================ */

/* 整体容器 */
.cnbl-footer-links{
  margin: 30px auto 10px;
  padding: 0 10px;
  text-align: center;
}

/* 上下分割线 */
.cnbl-footer-line{
  height: 1px;
  background: rgba(0,0,0,.08);
  margin: 16px 0;
}

/* “友情链接”标题 */
.cnbl-footer-title{
  font-size: 15px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 12px;
}

/* DIY 内容区（只控制排版，不给边框） */
.cnbl-footer-diy{
  border: 0 !important;
  background: transparent !important;
}

/* 友情链接列表里的 a 标签样式（作用于DIY生成的内容） */
.cnbl-footer-diy a{
  display: inline-block;
  margin: 4px 10px;
  font-size: 13px;
  color: #374151;
  text-decoration: none;
  white-space: nowrap;
}

.cnbl-footer-diy a:hover{
  color: #2563eb;
  text-decoration: underline;
}