/* =========================================================
   小红书签网 - Pinboard.in 风格样式
   极简：浅灰底、白卡片、蓝链接、虚线分隔
   ========================================================= */

/* ---------- Reset ---------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u,
i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
  margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit;
  vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; margin: 0; padding: 0; }
blockquote, q { quotes: none; }
table { border-collapse: collapse; border-spacing: 0; }
img { max-width: 100%; border: 0; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- 基础 ---------- */
html, body {
  background: #fff;
  color: #333;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.6;
}
a, a:link { color: #0066cc; }
a:visited { color: #609; }
a:hover { color: #004a99; }
h1, h2, h3 { font-weight: bold; color: #333; }
h1 { font-size: 18px; }
h2 { font-size: 16px; }
h3 { font-size: 14px; }
hr { border: 0; border-top: 1px solid #ddd; margin: 10px 0; }

/* ---------- 页面容器 ---------- */
#content {
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px 20px;
}

/* ---------- 顶部横幅（pinboard 风格） ---------- */
#banner {
  border-bottom: 1px solid #eee;
  padding: 8px 0;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px 10px;
}
#logo { line-height: 28px; }
#logo .pin_logo {
  width: 22px; height: 22px;
  vertical-align: middle;
  margin-right: 6px;
}
#pinboard_name {
  font-size: 20px;
  font-weight: bold;
  color: #0066cc;
  letter-spacing: 0.5px;
  vertical-align: middle;
}
#pinboard_name:hover { text-decoration: none; }
.user-tag { color: #666; font-size: 12px; margin-left: 6px; vertical-align: middle; }
#top_menu { font-size: 13px; line-height: 28px; margin-left: auto; text-align: right; }
#top_menu .sep { color: #bbb; margin: 0 2px; }
#top_menu a { color: #0066cc; margin: 0 2px; }
#top_menu a.active { font-weight: bold; color: #c00; }

/* 右上角站内通知 */
.notice-wrap { position: relative; display: inline-block; }
.notice-bell { color: #0066cc; }
.notice-count {
  display: none;
  min-width: 14px; height: 14px; line-height: 14px;
  background: #e84c3d; color: #fff; font-size: 10px; border-radius: 7px;
  text-align: center; padding: 0 3px; vertical-align: top; margin-left: 2px;
}
.notice-count.has { display: inline-block; }
.notice-panel {
  position: absolute; right: 0; top: 24px; width: 300px;
  background: #fff; border: 1px solid #ddd; box-shadow: 0 2px 10px rgba(0,0,0,.15);
  z-index: 999; text-align: left;
}
.notice-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 12px; border-bottom: 1px solid #eee; font-size: 13px; font-weight: bold;
}
.notice-head a { font-size: 12px; color: #999; font-weight: normal; }
.notice-list { max-height: 360px; overflow-y: auto; }
.notice-item { padding: 9px 12px; border-bottom: 1px solid #f2f2f2; cursor: pointer; }
.notice-item:hover { background: #f8f9fa; }
.notice-item.unread { background: #eef4ff; }
.notice-title { font-size: 13px; color: #333; }
.notice-content { font-size: 12px; color: #666; margin-top: 2px; }
.notice-time { font-size: 11px; color: #999; margin-top: 2px; }

/* ---------- 导航分隔线 ---------- */
.nav-line {
  height: 1px;
  border-top: 1px dotted #ccc;
  margin: 0 0 12px;
}

/* ---------- 主体卡片（无边框，参考 pinboard 无框极简） ---------- */
#main_body {
  padding: 0 0 14px;
  overflow: hidden;
}
#main_content { overflow: hidden; }

/* ---------- 页头信息 ---------- */
.page-title {
  font-size: 16px;
  font-weight: bold;
  color: #303030;
  padding-bottom: 6px;
  margin-bottom: 6px;
  border-bottom: 1px solid #ddd;
}
.page-info { color: #888; font-size: 12px; margin-bottom: 12px; }
.section-title {
  font-size: 13px; font-weight: bold; color: #303030;
  margin: 0 0 8px;
}

/* 用户信息卡片（个人页顶部） */
.user-card {
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  padding: 14px 16px;
  margin-bottom: 16px;
}
.user-card .uc-name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.user-card .uc-title { font-size: 18px; font-weight: bold; color: #0066cc; }
.user-card .uc-count { font-size: 12px; color: #888; }
.user-card .uc-btn {
  display: inline-block;
  padding: 4px 14px;
  border: 1px solid #336699;
  border-radius: 3px;
  font-size: 12px;
  color: #336699;
  text-decoration: none;
}
.user-card .uc-btn:hover { background: #336699; color: #fff; }

/* ---------- 书签条目（圆角卡片，参考 pinboard） ---------- */
.bookmark-item {
  background: #fff;
  border: 1px solid #e0e0e0;
  padding: 10px 110px 10px 10px;
  margin-bottom: 8px;
  border-radius: 3px;
  line-height: 1.6;
  position: relative;
}
.bookmark-item:last-child { margin-bottom: 0; }

/* 公共书签右上角网页缩略图（thum.io，不撑高条目） */
.bookmark-item .bk-thumb {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 100px;
  height: 75px;
  overflow: hidden;
  border: 1px solid #ddd;
  background: #fff;
}
.bookmark-item .bk-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 批量编辑：复选框放书签条目左侧，垂直居中 */
.batch-check { display: none; }
body.batch-edit .batch-check {
  display: inline-block;
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}
body.batch-edit .bookmark-item { padding-left: 32px; }

/* 公共书签：白底无边框，底部虚线分隔 */
.bookmark-item.public {
  border: none;
  background: #fff;
  border-bottom: 1px dotted #ccc;
  border-radius: 0;
  padding: 12px 110px 12px 0;
}
.bookmark-item.public:last-child { border-bottom: none; }

/* 私有书签：灰色背景（保留边框以区分） */
.bookmark-item.private {
  background: #e0e0e0;
}

/* 顶部第二行筛选条（参考 pinboard：all·private·public·...） */
#filter_bar {
  padding: 7px 0;
  font-size: 13px;
  margin-bottom: 10px;
}
#filter_bar a { color: #0066cc; margin-right: 8px; white-space: nowrap; }
#filter_bar a.active { font-weight: bold; color: #333; }
#filter_bar a.active:hover { text-decoration: none; }
#filter_bar .sep { color: #bbb; margin-right: 2px; }
#filter_bar .filter-user { color: #999; font-weight: bold; margin-right: 4px; }
#filter_bar .filter-user strong { color: #999; font-weight: bold; margin-left: 10px; }

.bk-title { font-size: 16px; font-weight: normal; line-height: 1.4; margin: 0 0 5px; }
.bk-title a { color: #0066cc; }
.bk-title a:hover { text-decoration: underline; }
.bk-title .bk-count { color: #cc0000; font-size: 13px; font-weight: bold; margin-left: 8px; }
.bk-title .bk-arrow { color: #666; font-size: 12px; margin-left: 4px; }
.bk-url { color: #006621; font-size: 12px; word-break: break-all; margin-top: 2px; }
.bk-desc { color: #333; font-size: 13px; margin-top: 5px; margin-bottom: 5px; }
.bk-tags { margin: 0 0 5px; font-size: 13px; color: #b35000; }
.bk-tags a { color: #b35000; margin-right: 8px; }
.bk-tags a:hover { text-decoration: underline; }
.bk-meta { color: #666; font-size: 12px; margin-top: 5px; }
.bk-meta a { color: #666; font-size: 12px; margin-right: 4px; }
.bk-meta a:hover { color: #0066cc; }
.bk-meta .star { color: #b35000; }
.bk-star { color: #b35000; margin-right: 4px; }
.bk-others { margin: 0 6px; color: #666; }
.bk-reads { color: #999; font-size: 12px; margin-right: 6px; }

/* 旧模板兼容 class */
.title_p { margin-top: 14px; }
.comm_p, .comm { font-size: 12px; color: #555; }
.bottom_p, .bottom { font-size: 11px; color: #999; margin-top: 2px; }
.tag_p { font-size: 12px; margin-top: 2px; }
.tag_p a { color: #b15511; }
.a1 { color: #336699; font-size: 14px; }
.a3 { color: #b15511; font-size: 12px; }
.a4 { color: #b15511; font-size: 12px; }
.comm_url { color: #006621; font-size: 12px; word-break: break-all; }
.ba_url { color: #ff4166; font-size: 12px; }
.bo2 { font-size: 12px; color: #555; }
.aa { font-size: 12px; color: #303030; }
.aa1 { font-size: 12px; color: #999; }
.ziti1, .ziti1_1 { font-size: 12px; color: #999; }
.edits, .edits_del { font-size: 12px; color: #999; }
.times { font-size: 11px; color: #767676; }
.user { color: #303030; }

/* ---------- 侧栏 ---------- */
#sidebar {
  float: right;
  width: 250px;
  margin-left: 40px;
  font-size: 12px;
}
#sidebar h3 {
  font-size: 13px; font-weight: bold; color: #333;
  border-bottom: 1px solid #eee; padding-bottom: 4px; margin-bottom: 8px;
}
.side-block { margin-bottom: 18px; }
.side-block .title {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; font-weight: bold; color: #333;
  border-bottom: 1px solid #eee; padding-bottom: 4px; margin-bottom: 8px;
}
.side-block .title a {
  font-size: 11px; font-weight: normal; color: #888;
}
.side-block .title a:hover { color: #0066cc; }

/* ---------- 标签云（流式，橙色分级，参考 pinboard ---------- */
.tag-cloud {
  font-size: 13px;
  line-height: 2.2;
}
.tag-cloud a { color: #b35000; margin-right: 8px; white-space: nowrap; }
.tag-cloud a:hover { text-decoration: underline; }
.tag-cloud .num { color: #999; font-size: 11px; margin-left: 2px; }
.tag-cloud .tag-xl { font-size: 22px; font-weight: 600; }
.tag-cloud .tag-large { font-size: 19px; font-weight: 500; }
.tag-cloud .tag-medium { font-size: 15px; }
.tag-cloud .tag-small { font-size: 12px; }
.taglist { color: #b35000; font-size: 13px; }
.tag-head { display: block; color: #666; font-size: 13px; line-height: 2.0; margin-bottom: 4px; }
.tag-head a { color: #0066cc; margin: 0 2px; }
.tag-head a.active { font-weight: bold; }
.tag-head .sep { color: #bbb; margin: 0 2px; }
.cloud-tags { line-height: 2.2; }
.tag-search { margin-top: 10px; }
.tag-search input[type="text"] {
  width: 70%; padding: 4px 6px; border: 1px solid #ccc; border-radius: 3px; font-size: 12px;
  font-family: inherit; box-sizing: border-box; vertical-align: middle;
}
.tag-search button {
  width: 26%; padding: 4px 6px; border: 1px solid #ccc; border-radius: 3px; font-size: 12px;
  background: #f5f5f5; cursor: pointer; vertical-align: middle;
}
.tag-search button:hover { background: #e8e8e8; }
.level_1 { color: #b35000; font-weight: bold; cursor: pointer; }
.level_1 a { color: #b35000; }
.level_2 { margin-left: 14px; }
.level_2 a { color: #b35000; font-size: 12px; margin-right: 8px; }
.categorys { font-size: 13px; font-weight: bold; color: #333; border-bottom: 1px solid #eee; padding-bottom: 4px; margin-bottom: 8px; }
.type-box {
  display: inline-block;
  text-align: left;
  margin: 0 12px 8px 0;
  vertical-align: top;
}
.type-box .level_2 {
  display: none;
  margin-left: 0;
  padding: 4px 0;
}
.type-box .level_2 a { margin-right: 10px; }

/* ---------- 搜索 ---------- */
.search-box { margin-bottom: 6px; }
.search-box input[type="text"], .search-box .in {
  padding: 5px; border: 1px solid #ccc; font-size: 13px; width: 100%;
  font-family: inherit; box-sizing: border-box; border-radius: 3px;
}
.search-actions { margin-top: 8px; font-size: 13px; }
.search-actions input[type="submit"] { padding: 3px 8px; }
.search-actions a { color: #0066cc; margin-left: 8px; }
.search-actions a:hover { text-decoration: underline; }

/* ---------- 表单 ---------- */
input[type="text"], input[type="password"], input[type="email"], input[type="url"], textarea {
  padding: 5px 8px; border: 1px solid #ccc; font-size: 13px;
  font-family: inherit; background: #fff; color: #303030;
  box-sizing: border-box;
}
input:focus, textarea:focus { outline: none; border-color: #336699; }
input[type="submit"], button, .btn {
  padding: 5px 14px; border: 1px solid #d1d5db; background: #fff;
  color: #444; font-size: 13px; cursor: pointer; font-family: inherit;
  border-radius: 4px;
}
input[type="submit"]:hover, button:hover, .btn:hover { background: #f5f6f7; }

/* 知乎风格主按钮：知乎蓝、白字、无边框、圆角、粗体 */
.btn-primary,
input[type="submit"].btn-primary,
button.btn-primary {
  background-color: #1772F6;
  border: none;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border-radius: 4px;
  padding: 6px 14px;
  cursor: pointer;
}
.btn-primary:hover,
input[type="submit"].btn-primary:hover,
button.btn-primary:hover { background-color: #1664d9; color: #fff; }

/* 删除等警示按钮：白底红字，保持清晰 */
input[type="submit"].danger, button.danger, .btn.danger {
  background: #fff; border-color: #ccc; color: #a00;
}
input[type="submit"].danger:hover, button.danger:hover, .btn.danger:hover { background: #fdeaea; color: #a00; }
label { font-size: 13px; color: #444; }
.ok { background: #1772F6; border: none; color: #fff; border-radius: 4px; }
.ng { background: #fff; border: 1px solid #1772F6; color: #1772F6; border-radius: 4px; }
.add_tag_1, .delete_tag, .ren_tag { background: #fff; border: 1px solid #bbb; color: #303030; padding: 4px 12px; cursor: pointer; }
.in { border: 1px solid #ccc; padding: 4px 8px; font-size: 13px; }
.in1 { border: 1px solid #ccc; padding: 4px 8px; font-size: 13px; }

/* ---------- 表格 ---------- */
table { border-collapse: collapse; width: 100%; font-size: 13px; }
th, td { padding: 6px 10px; border: 1px solid #ddd; text-align: left; vertical-align: top; }
th { background: #f5f5f5; font-weight: bold; }
td a { color: #336699; }
td a:hover { text-decoration: underline; }

/* ---------- 分页 ---------- */
.pagination, .pagestr { text-align: center; margin: 16px 0; font-size: 13px; }
.pagination a, .pagestr a { color: #336699; margin: 0 3px; }
.pagination .current, .pagestr .current { font-weight: bold; color: #303030; }

/* ---------- 页脚 ---------- */
#footer {
  text-align: center;
  font-size: 12px;
  color: #999;
  padding: 14px 0 6px;
  border-top: 1px dotted #aaa;
  margin-top: 12px;
}
#footer a { color: #999; margin: 0 4px; }
#footer a:hover { color: #336699; }
.footer { color: #999; font-size: 12px; }
.footer:hover { color: #336699; }

/* ---------- 下拉 ---------- */
.dropdown { position: relative; display: inline-block; }
.dropdown-content {
  display: none; position: absolute; background: #fff;
  border: 1px solid #ccc; min-width: 60px; z-index: 100;
}
.dropdown-content a { color: #336699; padding: 4px 10px; display: block; font-size: 12px; }
.dropdown-content a:hover { background: #f0f0f0; }
.dropdown:hover .dropdown-content { display: block; }

/* ---------- 弹框 ---------- */
.mask, .mask_add, .mask_ren {
  display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0;
  z-index: 999; background: rgba(0,0,0,.35);
}
#popupcontent, #popupcontent_ren {
  position: absolute; top: 40%; left: 50%;
  transform: translate(-50%,-50%);
  width: 320px; background: #fff; border: 1px solid #bbb;
  padding: 14px; box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
#popupcontent select, #popupcontent_ren select { width: 100%; border: 1px solid #ccc; padding: 4px; font-size: 13px; margin: 6px 0; }
#popupcontent input, #popupcontent_ren input { width: 100%; border: 1px solid #ccc; padding: 4px; font-size: 13px; margin: 4px 0; }
.guanbi { float: right; color: #999; font-size: 12px; cursor: pointer; }
.guanbi:hover { color: #303030; }

/* ---------- 常用网址（旧模板） ---------- */
.changyong { font-size: 12px; margin-bottom: 10px; }
.changyong a { color: #336699; }

/* ---------- 编辑模式 ---------- */
.edit-mode, .myedit { background: #f7f7f7; border: 1px solid #eee; padding: 8px 10px; margin-bottom: 10px; font-size: 12px; }
.edit-mode a, .myedit a { color: #336699; margin-right: 6px; }
.mycheck { margin-right: 4px; }

/* ---------- 快捷标签导航（旧模板） ---------- */
.navtab { margin: 8px 0 12px; }
.tab-hd li { display: inline-block; margin-right: 10px; font-size: 12px; color: #888; }
.tab-hd li.active { border-bottom: 2px solid #336699; color: #303030; }
.tab-hd a { color: #888; }
.tab-hd a:hover { color: #336699; }

/* ---------- 热门/最新页块 ---------- */
.hot-block { margin-bottom: 14px; }

/* ---------- 响应式 ---------- */
@media (max-width: 720px) {
  #content { padding: 0 10px 15px; }
  #logo { float: none; margin-bottom: 6px; }
  #top_menu { float: none; font-size: 12px; line-height: 1.9; }
  #sidebar { float: none; width: 100%; margin-left: 0; margin-top: 16px; }
  #main_body { padding: 12px; }
  .bk-title { font-size: 13px; }
}
