/*
 * t10 模板自定义样式
 * 包含：PC 端布局补丁、章节工具栏、详情页、排行榜、移动端补充
 * 加载顺序：56zw.css → responsive.css → custom.css
 */

/* ══════════════════════════════════════════════
   全局：列表项取消默认 list-style（含有序列表）
══════════════════════════════════════════════ */
ol li { list-style: none; }

/* ══════════════════════════════════════════════
   全局：连载 / 完结状态标签
══════════════════════════════════════════════ */
.tag-done {
  display: inline-block; font-size: 10px; padding: 0 4px; line-height: 16px;
  border-radius: 2px; background: #e8f5e9; color: #388e3c;
  border: 1px solid #a5d6a7; margin-left: 4px; vertical-align: middle;
}
.tag-ongoing {
  display: inline-block; font-size: 10px; padding: 0 4px; line-height: 16px;
  border-radius: 2px; background: #e3f2fd; color: #1565c0;
  border: 1px solid #90caf9; margin-left: 4px; vertical-align: middle;
}

/* ══════════════════════════════════════════════
   PC 端：栏目页精品连载 .ll .item 布局
══════════════════════════════════════════════ */
#hotcontent .ll .item {
  display: flex !important;
  align-items: flex-start !important;
  float: left;
  width: 315px;
}
#hotcontent .ll .item .image {
  float: none !important;
  flex-shrink: 0;
  width: 120px;
}
#hotcontent .ll .item dl {
  float: none !important;
  flex: 1 !important;
  width: auto !important;
  min-width: 0;
  padding: 0 5px !important;
}

/* ══════════════════════════════════════════════
   排行榜页
══════════════════════════════════════════════ */
#tops_nav {
  margin-top: 15px; height: 30px;
  border: 1px solid #9AE6C5; background-color: #E3F4E7;
}
#tops_nav ol { margin: 0 auto; width: 960px; line-height: 30px; }
#tops_nav ol li { float: left; padding-top: 4px; width: 320px; text-align: center; }

.box {
  float: left; padding-top: 25px; margin: 25px 4px auto 4px;
  width: 234px; height: auto; min-height: 549px;
  border-style: solid; border-width: 1px; position: relative;
}
.box h3 {
  top: -13px; left: 37px; width: 161px; height: 24px; line-height: 24px;
  border-style: solid; border-width: 1px; font-size: 12px;
  text-align: center; position: absolute;
}
.box ul { width: 96%; }
.box ul li {
  padding-left: 10px; height: 24px; line-height: 25px;
  border-bottom: 1px solid #e4e4e4; font-size: 12px;
  text-align: left; position: relative;
}
.box ul li a { margin-left: 4px; color: #3366BB; }
.box ul li a:hover { color: #F60; text-decoration: underline; }
.box ul li .rank-no { color: #aaa; font-size: 11px; margin-right: 2px; }
.box ul li:nth-child(-n+3) .rank-no { color: #c83030; font-weight: bold; }

.b1, .b1 h3 { border-color: #F9CDDE; }
.b1 h3      { background-color: #FCDEEA; }
.b2, .b2 h3 { border-color: #B0DBEC; }
.b2 h3      { background-color: #D6ECF7; }
.b3, .b3 h3 { border-color: #EFEAAA; }
.b3 h3      { background-color: #FAF1D4; }
.b4, .b4 h3 { border-color: #D5E6B9; }
.b4 h3      { background-color: #E5F8CB; }

#main { overflow: hidden; padding-bottom: 20px; }

/* ══════════════════════════════════════════════
   小说详情页：书籍信息区 Grid 布局
══════════════════════════════════════════════ */
.ni-cover img {
  width: 100% !important; height: auto !important;
  display: block; border-radius: 4px;
}
#book_info {
  display: grid !important;
  grid-template-columns: 160px 1fr;
  gap: 0 16px;
  float: none !important; width: auto !important; margin: 0 !important;
}
#book_info > .ni-cover   { grid-column: 1; grid-row: 1; align-self: start; }
#book_info > #info       { grid-column: 2; grid-row: 1; float: none !important; width: auto !important; margin: 0 !important; }
#book_info > .detail-btns { grid-column: 1 / 3; }
#book_info > #intro      { grid-column: 1 / 3; }
#book_info > .lm         { grid-column: 1 / 3; }

#intro {
  margin: 10px 0 8px; padding: 10px 14px;
  background: #f5fafd;
  border-left: 3px solid #88c6e5;
  border-radius: 0 4px 4px 0;
  line-height: 1.8; color: #555; font-size: 13px;
}
#intro p { margin: 0; padding: 0; }

/* ── 章节导航外层 ── */
.chapter-nav-outer  { padding: 10px 0 6px; }
.chapter-nav-wrap   { width: 100%; text-align: center; }
.chapter-range-wrap { display: inline-block; margin-bottom: 6px; position: relative; }
.chapter-page-row   { display: block; text-align: center; }
.chapter-page-row .pagelink { display: inline-block !important; overflow: hidden; }

.chapter-range-btn {
  display: inline-block; padding: 6px 20px;
  background: #fff; border: 1px solid #88c6e5; border-radius: 4px;
  color: #3487dd; font-size: 13px; cursor: pointer;
  transition: background .15s; white-space: nowrap; user-select: none;
}
.chapter-range-btn:hover { background: #e8f4fb; }

.chapter-range-drop {
  display: none; position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: calc(100% + 6px); z-index: 1000;
  background: #fff; border: 1px solid #c3dfea; border-radius: 4px;
  box-shadow: 0 -4px 16px rgba(0,0,0,.12);
  min-width: 170px; max-height: 300px; overflow-y: auto; text-align: left;
}
.chapter-range-item {
  display: block; padding: 9px 18px; font-size: 13px; color: #444;
  border-bottom: 1px solid #eef5fb; white-space: nowrap;
  text-decoration: none; transition: background .12s;
}
.chapter-range-item:last-child { border-bottom: none; }
.chapter-range-item:hover  { background: #e8f4fb; color: #3487dd; }
.chapter-range-item.active { background: #3487dd; color: #fff; font-weight: bold; }

/* ══════════════════════════════════════════════
   章节阅读页：面包屑行 + 工具栏（仅限章节页）
══════════════════════════════════════════════ */
.pg-chapter .con_top {
  display: flex !important; align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap; gap: 6px;
  height: auto !important; min-height: 32px;
  padding: 4px 10px !important;
}
.pg-chapter .con_top_crumb {
  flex: 1; min-width: 0; overflow: hidden;
  white-space: nowrap; text-overflow: ellipsis;
  font-size: 12px; line-height: 1.4;
}

.read-toolbar { display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0; }

.rtb-size-wrap { display: inline-flex; align-items: center; gap: 2px; }
.rtb-size-btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 24px; padding: 0 6px;
  background: #fff; border: 1px solid #aad0e8; border-radius: 3px;
  cursor: pointer; font-size: 12px; font-weight: bold;
  color: #3487dd; white-space: nowrap; transition: background .12s;
}
.rtb-size-btn:hover { background: #d6ecf8; }
.rtb-size-val {
  min-width: 18px; max-width: 32px; text-align: center;
  color: #666; line-height: 1; transition: font-size .15s; overflow: hidden;
}
.rtb-sep { width: 1px; height: 18px; background: #c0d8e8; margin: 0 2px; flex-shrink: 0; }

.rtb-bg-list { display: inline-flex; align-items: center; gap: 4px; }
.rtb-bg-swatch {
  width: 22px; height: 18px; border-radius: 3px; cursor: pointer;
  border: 2px solid transparent; transition: border-color .12s; flex-shrink: 0;
}
.rtb-bg-swatch.active { border-color: #3487dd; box-shadow: 0 0 0 2px rgba(52,135,221,.3); }

.rtb-item {
  position: relative; display: inline-flex; align-items: center;
  height: 24px; padding: 0 6px; cursor: pointer; border-radius: 3px;
  color: #444; white-space: nowrap; user-select: none; font-size: 12px;
  background: #fff; border: 1px solid #aad0e8; transition: background .12s;
}
.rtb-item:hover { background: #d6ecf8; }
.rtb-item .rtb-arr { font-size: 9px; margin-left: 2px; color: #888; }

.rtb-drop {
  display: none; position: absolute;
  top: calc(100% + 4px); right: 0; z-index: 500;
  background: #fff; border: 1px solid #b8daea; border-radius: 5px;
  box-shadow: 0 4px 16px rgba(0,0,0,.12); min-width: 120px; padding: 4px 0;
}
.rtb-item.open .rtb-drop { display: block; }

.rtb-drop-item {
  display: block; padding: 6px 14px; color: #444; font-size: 13px;
  cursor: pointer; transition: background .1s; white-space: nowrap;
}
.rtb-drop-item:hover  { background: #e8f4fb; color: #3487dd; }
.rtb-drop-item.active { background: #3487dd; color: #fff; }

/* 正文过渡与间距 */
.box_con #content {
  transition: color .2s, background .2s;
  padding: 10px 16px !important;
  line-height: 1.95 !important;
}

/* 正文宽度模式 */
html[data-width="narrow"] .box_con { max-width: 680px !important; margin: 0 auto; }
html[data-width="wide"]   .box_con { max-width: 1100px !important; }

/* ══════════════════════════════════════════════
   章节主题色
══════════════════════════════════════════════ */
html[data-theme="default"] #content { background: transparent; color: inherit; }

html[data-theme="green"]                     { background: #c7edcc !important; }
html[data-theme="green"] .content_read,
html[data-theme="green"] #head               { background: #c7edcc !important; }
html[data-theme="green"] .box_con            { background: #d4f0d8 !important; border-color: #9ecfa5 !important; }
html[data-theme="green"] #content            { background: #d4f0d8; color: #2a3a2a; }
html[data-theme="green"] .bookname h1        { color: #2c4a2e !important; }
html[data-theme="green"] .con_top,
html[data-theme="green"] .con_top a          { color: #4a6a4c !important; }

html[data-theme="warm"]                      { background: #f0e9d6 !important; }
html[data-theme="warm"] .content_read,
html[data-theme="warm"] #head                { background: #f0e9d6 !important; }
html[data-theme="warm"] .box_con             { background: #fdf6e8 !important; border-color: #d4c090 !important; }
html[data-theme="warm"] #content             { background: #fdf6e8; color: #3c2e14; }
html[data-theme="warm"] .bookname h1         { color: #4a3820 !important; }
html[data-theme="warm"] .con_top,
html[data-theme="warm"] .con_top a           { color: #8a6840 !important; }

html[data-theme="gray"]                      { background: #d0d0d0 !important; }
html[data-theme="gray"] .content_read,
html[data-theme="gray"] #head                { background: #d0d0d0 !important; }
html[data-theme="gray"] .box_con             { background: #e0e0e0 !important; border-color: #b0b0b0 !important; }
html[data-theme="gray"] #content             { background: #e0e0e0; color: #333; }
html[data-theme="gray"] .bookname h1         { color: #222 !important; }

html[data-theme="dark"]                      { background: #1a1a1a !important; }
html[data-theme="dark"] .content_read,
html[data-theme="dark"] #head                { background: #1a1a1a !important; }
html[data-theme="dark"] .box_con             { background: #252525 !important; border-color: #383838 !important; }
html[data-theme="dark"] #content             { background: #252525; color: #c0c0c0; }
html[data-theme="dark"] .bookname h1         { color: #e0e0e0 !important; }
html[data-theme="dark"] .con_top,
html[data-theme="dark"] .con_top a           { color: #666 !important; background: #1e1e1e !important; }
html[data-theme="dark"] .page_chapter li     { background: #2e2e2e !important; border-color: #444 !important; }
html[data-theme="dark"] .page_chapter li a   { color: #999 !important; }
html[data-theme="dark"] .footer_link a       { color: #555 !important; }
html[data-theme="dark"] .footer_cont p       { color: #555 !important; }
html[data-theme="dark"] .rtb-size-btn        { background: #333; border-color: #505050; color: #88c6e5; }
html[data-theme="dark"] .rtb-size-val        { color: #888; }
html[data-theme="dark"] .rtb-sep             { background: #444; }
html[data-theme="dark"] .rtb-item            { background: #333; border-color: #505050; color: #aaa; }
html[data-theme="dark"] .rtb-drop            { background: #2c2c2c; border-color: #444; }
html[data-theme="dark"] .rtb-drop-item       { color: #bbb; }
html[data-theme="dark"] .rtb-drop-item:hover { background: #383838; color: #88c6e5; }

/* ══════════════════════════════════════════════
   移动端补充（配合 responsive.css，填补未覆盖项）
══════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* 精品推荐侧栏 li：flex 行 */
  #hotcontent .r li {
    display: flex !important; align-items: center !important;
    height: auto !important; min-height: 28px !important;
    overflow: hidden !important; padding: 3px 0 !important;
  }
  #hotcontent .r li span { float: none !important; display: inline !important; }
  #hotcontent .r li .s1 {
    width: auto !important; flex-shrink: 0 !important;
    white-space: nowrap !important; font-size: 12px !important;
    padding-right: 4px !important; color: #888 !important;
  }
  #hotcontent .r li .s2 {
    flex: 1 !important; width: auto !important; min-width: 0 !important;
    overflow: hidden !important; white-space: nowrap !important; text-overflow: ellipsis !important;
  }
  #hotcontent .r li .s5 {
    width: 52px !important; flex-shrink: 0 !important;
    font-size: 11px !important; text-align: right !important; color: #aaa !important;
    overflow: hidden !important; white-space: nowrap !important;
  }

  /* 分类小说模块 ul 包 BFC，li 超长截断 */
  .novelslist .content ul { overflow: hidden !important; display: block !important; }
  .novelslist .content ul li {
    height: auto !important; line-height: 1.6 !important;
    white-space: nowrap !important; text-overflow: ellipsis !important;
    box-sizing: border-box !important;
  }

  /* 章节阅读工具栏 */
  .pg-chapter .con_top { flex-wrap: wrap !important; height: auto !important; }
  .pg-chapter .con_top_crumb { font-size: 11px !important; }
  .rtb-size-btn { height: 28px; padding: 0 8px; font-size: 13px; }
  .rtb-bg-swatch { width: 22px; height: 18px; }
  .rtb-width-item { display: none !important; }

  /* 详情页网格列宽、章节范围选择器 */
  #book_info { grid-template-columns: 110px 1fr !important; }
  #intro { font-size: 12px; padding: 8px 10px; margin: 8px 0 6px; }
  .chapter-range-btn { padding: 9px 24px; font-size: 14px; }
  .chapter-range-drop {
    min-width: 190px; max-height: 240px;
    left: 50%; transform: translateX(-50%);
    bottom: calc(100% + 6px);
  }
  .chapter-range-item { padding: 12px 18px; font-size: 14px; }

}

/* ── 链轮区块 ─────────────────────────────────────────────────── */
.lw-box {
  width: 968px;
  margin: 10px auto;
  border: 3px solid #88c6e5;
  background: #fef9ef;
  overflow: hidden;
  clear: both;
  font-size: 12px;
}
.lw-box h2 {
  background-color: #a6d3e8;
  border-bottom: 1px solid #ddd;
  font-size: 14px;
  font-weight: bold;
  height: 30px;
  line-height: 30px;
  overflow: hidden;
  padding: 0 0 0 10px;
  margin: 0;
}
.lw-links {
  padding: 8px 10px;
  line-height: 24px;
  color: #555;
}
.lw-links a {
  color: #6f78a7;
  display: inline;
}
.lw-links a:hover {
  color: #e83030;
  text-decoration: underline;
}
@media (max-width: 980px) {
  .lw-box { width: auto; margin: 8px 10px; }
}

/* ══════════════════════════════════════════════
   会员系统：顶部登录区 .nri
   注意：56zw.css 已定义 .nri { float: right }，此处不覆盖 display/float
══════════════════════════════════════════════ */

/* 登录框输入框美化（覆盖 56zw.css 原始尺寸） */
.nri .cc .inp input {
  height: 20px;
  width: 87px;
  border: 1px solid #a6d3e8;
  padding: 0 3px;
}

/* 登录按钮样式 */
.nri .frii input.int {
  background: #4a8ec2;
  border: none;
  color: #fff;
  height: 22px;
  line-height: 22px;
  width: 51px;
  cursor: pointer;
  font-size: 12px;
}
.nri .frii input.int:hover { background: #3577b0; }

/* 忘记密码 / 用户注册链接颜色覆盖 */
.nri .ccc .txtt a { color: #3487dd; }
.nri .ccc .txtt a:hover { color: #e83030; text-decoration: underline; }

/* 已登录状态：float:left 内联在 .nri 容器内，保持右对齐 */
.nri-loggedin {
  float: left;
  line-height: 28px;
  font-size: 12px;
  color: #555;
}
.nri-loggedin .hi { color: #e83030; font-weight: bold; margin-right: 4px; }
.nri-loggedin a {
  color: #3487dd;
  padding: 0 6px;
  border-right: 1px solid #bbb;
  line-height: 28px;
}
.nri-loggedin a:last-child { border-right: none; }
.nri-loggedin a:hover { color: #e83030; text-decoration: underline; }

/* ══════════════════════════════════════════════
   会员系统：表单页通用样式（注册/登录/找密码/资料）
══════════════════════════════════════════════ */
.m-page {
  width: 980px;
  margin: 20px auto;
  min-height: 300px;
  font-size: 13px;
  color: #333;
}
.m-form-box {
  width: 580px;
  margin: 0 auto;
  border: 1px solid #ccc;
  background: #fff;
}
.m-form-box .m-form-title {
  background: #dce9f5;
  border-bottom: 1px solid #ccc;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: bold;
  color: #2a5f8f;
  text-align: center;
}
.m-form-row {
  display: flex;
  align-items: center;
  padding: 8px 20px;
  border-bottom: 1px solid #f0f0f0;
}
.m-form-row:last-child { border-bottom: none; }
.m-form-label {
  width: 110px;
  text-align: right;
  padding-right: 10px;
  color: #555;
  flex-shrink: 0;
}
.m-form-label .req { color: #c00; font-weight: bold; }
.m-form-field { flex: 1; }
.m-form-field input[type="text"],
.m-form-field input[type="password"],
.m-form-field input[type="email"] {
  width: 200px;
  height: 24px;
  padding: 0 6px;
  border: 1px solid #aaa;
  border-radius: 2px;
  font-size: 13px;
}
.m-form-field input[type="text"]:focus,
.m-form-field input[type="password"]:focus,
.m-form-field input[type="email"]:focus {
  border-color: #4a8ec2;
  outline: none;
}
.m-form-field select {
  height: 26px;
  padding: 0 4px;
  border: 1px solid #aaa;
  border-radius: 2px;
  font-size: 13px;
}
.m-form-field .m-hint {
  font-size: 11px;
  color: #888;
  margin-left: 6px;
}
.m-form-field label { margin-right: 10px; cursor: pointer; }
.m-form-submit {
  text-align: center;
  padding: 14px 0;
}
.m-form-submit input[type="submit"],
.m-form-submit button {
  background: #4a8ec2;
  color: #fff;
  border: none;
  border-radius: 2px;
  padding: 6px 30px;
  font-size: 14px;
  cursor: pointer;
}
.m-form-submit input[type="submit"]:hover,
.m-form-submit button:hover { background: #3577b0; }
.m-form-links {
  text-align: center;
  padding: 8px 0 14px;
  font-size: 12px;
  color: #888;
}
.m-form-links a { color: #3487dd; margin: 0 6px; }
.m-form-links a:hover { color: #e83030; text-decoration: underline; }
.m-msg-error {
  background: #fff0f0;
  border: 1px solid #f5c0c0;
  color: #c00;
  padding: 8px 14px;
  margin: 10px 0;
  border-radius: 2px;
  font-size: 13px;
}

/* 登录成功页 */
.m-success-box {
  width: 400px;
  margin: 40px auto;
  border: 1px solid #c8d8ea;
  background: #f0f5fb;
}
.m-success-box .m-success-title {
  background: #dce9f5;
  border-bottom: 1px solid #c8d8ea;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: bold;
  color: #2a5f8f;
}
.m-success-box .m-success-body {
  padding: 20px 16px;
  font-size: 13px;
  color: #333;
  line-height: 1.9;
}
.m-success-box .m-success-body a { color: #3487dd; }
.m-success-box .m-success-body a:hover { color: #e83030; text-decoration: underline; }

@media (max-width: 640px) {
  .m-page { width: 100%; }
  .m-form-box { width: 96%; }
  .m-form-row { flex-wrap: wrap; }
  .m-form-label { width: 100%; text-align: left; padding-right: 0; margin-bottom: 4px; }
  .m-form-field input[type="text"],
  .m-form-field input[type="password"],
  .m-form-field input[type="email"] { width: 90%; }
}

/* ── 书架表格响应式 ──────────────────────────────────────────── */

/* 桌面端：固定布局，列宽明确 */
.shelf-table { table-layout: auto; width: 100%; }
.shelf-table .col-chk     { width: 30px; }
.shelf-table .col-time    { width: 120px; }
.shelf-table .col-op      { width: 48px; }
/* 书名和章节列自动平分剩余空间 */

/* 移动端（≤768px）：隐藏时间列，书名和读到各占一半可用空间 */
@media (max-width: 768px) {
  /* 隐藏"最近阅读"时间列 */
  .shelf-table th:nth-child(4),
  .shelf-table td:nth-child(4) {
    display: none !important;
  }
  /* 复选框极窄 */
  .shelf-table th:nth-child(1),
  .shelf-table td:nth-child(1) {
    width: 28px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  /* 操作列极窄，只够放"移出/删除"二字 */
  .shelf-table th:nth-child(5),
  .shelf-table td:nth-child(5) {
    width: 36px !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  /* 书名和读到：各占剩余空间的一半（calc: 减去复选框28px+操作36px=64px，各取一半） */
  .shelf-table th:nth-child(2),
  .shelf-table td:nth-child(2),
  .shelf-table th:nth-child(3),
  .shelf-table td:nth-child(3) {
    width: calc(50% - 32px) !important;
  }
}

/* ── 移动端会员导航 #memberNavMobile ─────────────────────────── */

/* 桌面端隐藏 */
#memberNavMobile { display: none; }

@media (max-width: 768px) {
  /* 注入到 .header 后，使其居中 logo 与搜索框之间弹性撑开 */
  #memberNavMobile {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    margin-left: auto;
    padding-right: 8px;
  }

  /* 通用按钮基础样式 */
  .m-nav-btn {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 12px;
    text-decoration: none !important;
    white-space: nowrap;
    line-height: 1.6;
    cursor: pointer;
  }

  /* 登录：蓝底白字 */
  .m-nav-login {
    background: #3487dd;
    color: #fff !important;
    border: 1px solid #3487dd;
  }

  /* 注册：蓝边蓝字 */
  .m-nav-reg {
    background: transparent;
    color: #3487dd !important;
    border: 1px solid #3487dd;
  }

  /* 书架：浅蓝背景 */
  .m-nav-shelf {
    background: #88c6e5;
    color: #fff !important;
    border: 1px solid #88c6e5;
  }

  /* 退出：灰色 */
  .m-nav-out {
    background: transparent;
    color: #888 !important;
    border: 1px solid #ccc;
  }

  /* 已登录时的用户名行 */
  .m-nav-user {
    display: flex;
    align-items: center;
    gap: 5px;
  }
  .m-nav-user > span {
    font-size: 11px;
    color: #3487dd;
    font-weight: bold;
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}