/* ==========================================================================
   baoxian5200.com  ·  沃保新闻(portal)风格皮肤  v1.0
   --------------------------------------------------------------------------
   配色与版式参数全部取自 news.vobao.com 的实际样式表（非拍脑袋配色）：

     深灰导航/页脚   #303030   （vobao TopAndButtom.css .nav li a:hover）
     导航文字        #e0dfdf
     主蓝（栏目标题/链接） #0b79c8  （vobao news.css 出现 20 次）
     亮蓝（标题竖条/下划线） #38aae6 （vobao news.css 出现 25 次 / title.jpg 取色）
     强调橙（悬停/热点） #ff4a00   （vobao news.css 出现 18 次）
     正文 #333333  / 次要 #666666 / 弱化 #999999
     分割线 #dfdfdf / 页面底 #f2f2f2
     字体：微软雅黑 → 宋体 → Arial（vobao 同款中文栈）

   版面特征（对应 vobao 的观感）：扁平、无圆角、无阴影、高信息密度、
   栏目标题 =「左侧蓝色短竖条 + 蓝色加粗中文标题 + 右侧 45° 斜纹虚线」。

   注：整体已用 !important 提升优先级以覆盖主题默认样式，
       所有规则均可随时整段删除回滚，不影响主题文件与文章数据。
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. 基础变量与全局重置
   -------------------------------------------------------------------------- */
:root {
  --vb-dark:      #303030;
  --vb-dark-2:    #232323;
  --vb-nav-text:  #e0dfdf;
  --vb-blue:      #0b79c8;
  --vb-blue-l:    #38aae6;
  --vb-orange:    #ff4a00;
  --vb-ink:       #333333;
  --vb-ink-2:     #666666;
  --vb-ink-3:     #999999;
  --vb-line:      #dfdfdf;
  --vb-line-2:    #e8e9e9;
  --vb-bg:        #f2f2f2;
  --vb-cn-font:   "Microsoft YaHei", "微软雅黑", "PingFang SC",
                  "Hiragino Sans GB", "Heiti SC", SimSun, Arial, sans-serif;

  /* 覆盖主题自带的英文字体变量（Montserrat / Work Sans 在国内加载慢且非门户观感） */
  --headFont: var(--vb-cn-font);
  --bodyFont: var(--vb-cn-font);
}

body,
.mg-headwidget,
.mg-headwidget .navbar-wp,
h1, h2, h3, h4, h5, h6,
.site-title, .mg-sec-title h4 {
  font-family: var(--vb-cn-font) !important;
}

html, body { background: var(--vb-bg) !important; }

body {
  font-size: 14px !important;
  color: var(--vb-ink);
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

/* 门户风：全局拉平圆角，砍掉卡片阴影 */
.mg-posts-sec-post, .mg-posts-sec, .mg-post-thumb, .mg-blog-post-box,
.mg-blog-post, .mg-blog-post-3, .mg-blog-img, .mg-widget, .widget,
.mg-posts-modul-2, .mg-posts-modul-6, .card, .btn, .form-control,
input[type="text"], input[type="search"], input[type="email"], textarea, select {
  border-radius: 0 !important;
}
.mg-posts-sec-post, .mg-blog-post-box, .mg-blog-post-3, .mg-widget, .widget,
.mg-posts-sec-inner > div > .mg-posts-sec-post {
  box-shadow: none !important;
}

/* 关掉主题的入场动画（vobao 是静态门户；同时避免首屏元素闪现/不可见） */
.animated, .pulse, .fadeIn, .fadeInUp, .fadeInDown, .fadeInLeft, .fadeInRight,
.rotateInDownLeft, .rotateInDownRight, .zoomIn, .bounceIn {
  animation: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
}

/* 容器宽度对齐 vobao 的 1200px 栅格 */
.container, .container-lg, .container-xl { max-width: 1200px !important; }

/* --------------------------------------------------------------------------
   1. 顶部信息条 + 站头
   -------------------------------------------------------------------------- */
.mg-head-detail,
.mg-head-detail .mg-nav-widget-area-back {
  background: var(--vb-dark) !important;
}
.mg-head-detail,
.mg-head-detail a,
.mg-head-detail .mg-social a,
.mg-head-detail span,
.mg-head-detail i {
  color: var(--vb-nav-text) !important;
  font-size: 12px !important;
}
.mg-head-detail a:hover { color: #fff !important; }

/* 站头背景：主题是「内联样式」贴的 head-back.jpg 图片，
   必须用 !important 才能压过内联样式（vobao 站头是白底 + 深色导航条） */
.mg-nav-widget-area-back {
  background-image: none !important;
  background-color: #fff !important;
}
.mg-nav-widget-area-back .inner { background: #fff !important; padding: 18px 0 !important; }
.mg-nav-widget-area { padding-bottom: 0 !important; }

.site-title a, .site-branding-text .site-title a {
  color: var(--vb-blue) !important;
  font-weight: 700 !important;
  letter-spacing: -0.5px;
  text-shadow: none !important;
}
.site-description, .site-branding-text p {
  color: var(--vb-ink-3) !important;
  font-size: 12px !important;
  text-shadow: none !important;
}

/* 缩略图上的「相机」角标 —— vobao 列表图是干净的 */
.post-form { display: none !important; }

/* --------------------------------------------------------------------------
   2. 主导航：vobao 的深灰横条（49px）
   -------------------------------------------------------------------------- */
.mg-headwidget .navbar-wp,
.navbar-wp {
  background: var(--vb-dark) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: 49px !important;
}
.mg-headwidget .navbar-wp .navbar-nav > li > a,
.navbar-wp .navbar-nav > li > a {
  color: var(--vb-nav-text) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: 0.5px;
  line-height: 49px !important;
  padding: 0 18px !important;
  border-radius: 0 !important;
  border-right: 1px solid #454545;
  transition: background-color .15s ease, color .15s ease;
}
.mg-headwidget .navbar-wp .navbar-nav > li:first-child > a { border-left: 1px solid #454545; }
.mg-headwidget .navbar-wp .navbar-nav > li > a:hover,
.mg-headwidget .navbar-wp .navbar-nav > li.current-menu-item > a,
.mg-headwidget .navbar-wp .navbar-nav > .active > a {
  background: var(--vb-orange) !important;
  color: #fff !important;
}
/* 下拉菜单 */
.mg-headwidget .navbar-wp .dropdown-menu {
  background: var(--vb-dark-2) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.mg-headwidget .navbar-wp .dropdown-menu > li > a {
  color: var(--vb-nav-text) !important;
  font-size: 13px !important;
  border-bottom: 1px solid #3a3a3a;
}
.mg-headwidget .navbar-wp .dropdown-menu > li > a:hover {
  background: var(--vb-orange) !important;
  color: #fff !important;
}
/* 汉堡按钮（移动端） */
.navbar-toggle { background: var(--vb-blue) !important; border: 0 !important; }
.navbar-toggle .icon-bar { background: #fff !important; }

/* 搜索框 */
.mg-headwidget .navbar-wp .btn, .mg-search-form .btn,
.mg-headwidget form .btn, #searchsubmit {
  background: var(--vb-orange) !important;
  color: #fff !important;
  border: 0 !important;
}
.mg-headwidget input[type="search"], .mg-headwidget input[type="text"] {
  border: 1px solid var(--vb-line) !important;
  background: #fff !important;
}

/* --------------------------------------------------------------------------
   3. 头条滚动条（vobao 的前置新闻条）
   -------------------------------------------------------------------------- */
.mg-latest-news {
  background: #fff !important;
  border: 1px solid var(--vb-line) !important;
  border-top: 0 !important;
  height: 40px !important;
}
.mg-latest-news .bn_title,
.mg-latest-news .bn_title .title {
  background: var(--vb-blue) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 40px !important;
  height: 40px !important;
  padding: 0 16px !important;
}
.mg-latest-news .bn_title span { border-width: 41px 0 0 14px !important; }
.mg-latest-news .bn_title span { border-color: transparent transparent transparent var(--vb-blue) !important; }
.mg-latest-news .mg-latest-news-slider a {
  color: var(--vb-ink-2) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}
.mg-latest-news .mg-latest-news-slider a:hover { color: var(--vb-orange) !important; }
.mg-latest-news .mg-latest-news-slider a::before { color: var(--vb-blue-l) !important; }

/* --------------------------------------------------------------------------
   4. 栏目标题：左侧蓝竖条 + 蓝色标题 + 右侧 45° 斜纹虚线
      （还原 vobao news/title.jpg 的标题观感）
   -------------------------------------------------------------------------- */
.mg-sec-title {
  display: flex !important;
  align-items: center;
  gap: 12px;
  position: relative !important;
  border: 0 !important;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 16px !important;
  min-height: 30px;
}
.mg-sec-title::after {
  content: "" !important;
  flex: 1 1 auto;
  height: 7px;
  background-image: repeating-linear-gradient(45deg,
      transparent 0 5px, var(--vb-line-2) 5px 6px);
  background-repeat: repeat;
  opacity: .95;
}
.mg-sec-title h4 {
  position: relative !important;
  z-index: 1;
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 0 0 0 14px !important;
  min-height: 26px !important;
  background: transparent !important;
  color: var(--vb-blue) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 26px !important;
  text-transform: none !important;
  letter-spacing: 0.5px;
}
/* 左侧蓝色短竖条 —— 复用主题已有的 ::before 钩子 */
.mg-sec-title h4::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: 4px !important;
  bottom: auto !important;
  width: 4px !important;
  height: 18px !important;
  background: var(--vb-blue-l) !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
}
/* 「更多 / View All」按钮推到最右 */
.mg-sec-title > a {
  order: 9;
  flex: 0 0 auto;
  z-index: 1;
  color: var(--vb-orange) !important;
  font-size: 12px !important;
  text-decoration: none;
}
.mg-sec-title > a:hover { color: var(--vb-blue) !important; }

/* --------------------------------------------------------------------------
   5. 文章卡片：白底 + 细边框，扁平无阴影
   -------------------------------------------------------------------------- */
.mg-posts-sec-post,
.mg-posts-sec-inner > .mg-posts-sec-post,
.mg-posts-modul-6 .mg-posts-sec-inner {
  background: #fff;
}
.mg-posts-sec-post {
  border: 1px solid var(--vb-line) !important;
  padding: 14px !important;
  margin-bottom: 16px !important;
}
.mg-posts-sec-post:hover { border-color: var(--vb-blue-l) !important; }

/* 缩略图：vobao 用小尺寸、矩形、无圆角 */
.mg-post-thumb, .mg-blog-thumb, .mg-blog-img { border-radius: 0 !important; overflow: hidden; }
.mg-post-thumb.md { height: 168px !important; }
.mg-post-thumb .post-form { display: none !important; }
.mg-posts-sec-post .mg-post-thumb { border: 1px solid var(--vb-line-2); }

/* 背景图大字卡（You missed 那类）—— 加一层深色渐变保证白字可读 */
.mg-blog-post-3, .mg-blog-post, .mg-blog-post.lg.back-img {
  border-radius: 0 !important;
  box-shadow: none !important;
  position: relative;
  overflow: hidden;
}
.mg-blog-post-3::before, .mg-blog-post.lg::before, .mg-blog-post::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to bottom,
    rgba(0,0,0,.18) 0%, rgba(0,0,0,.48) 38%,
    rgba(0,0,0,.72) 72%, rgba(0,0,0,.88) 100%);
  pointer-events: none;
  z-index: 1;
}
.mg-blog-post-3 .mg-content, .mg-blog-post .bottom,
.mg-blog-post-3 .mg-sec-top-post, .mg-blog-post-3 .mg-blog-inner {
  position: relative; z-index: 2;
}

/* --------------------------------------------------------------------------
   6. 分类标签（vobao：小号、直角、蓝色/橙色）
   -------------------------------------------------------------------------- */
.mg-blog-category { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px !important; }
.mg-blog-category a,
.newsup-categories,
.newsup-categories.category-color-1,
.newsup-categories.category-color-2,
.newsup-categories.category-color-3,
.newsup-categories.category-color-4,
.newsup-categories.category-color-5 {
  display: inline-block;
  background: var(--vb-blue) !important;
  color: #fff !important;
  border-radius: 0 !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 1px;
  line-height: 18px !important;
  padding: 1px 8px !important;
  box-shadow: none !important;
}
/* 第二条及以后的标签用橙色，形成层次（对齐 vobao 的橙色强调） */
.mg-blog-category a:nth-child(n+2) { background: var(--vb-orange) !important; }
.mg-blog-category a:hover { background: var(--vb-orange) !important; color: #fff !important; }

/* --------------------------------------------------------------------------
   7. 标题与元信息
   -------------------------------------------------------------------------- */
.mg-blog-inner h4 a, .mg-posts-sec-post h4 a, .mg-posts-sec-post h3 a,
.mg-posts-sec-post h2 a, .mg-blog-post-3 h4 a, .mg-blog-inner h1.title a {
  color: #222 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  text-decoration: none;
}
.mg-blog-inner h4 a:hover, .mg-posts-sec-post h4 a:hover,
.mg-posts-sec-post h3 a:hover, .mg-posts-sec-post h2 a:hover,
.mg-blog-post-3 h4 a:hover { color: var(--vb-blue) !important; }

.mg-blog-meta, .mg-blog-meta a, .mg-blog-meta span,
.mg-blog-date, .mg-blog-author, .mg-blog-comments {
  color: var(--vb-ink-3) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}
.mg-blog-meta a:hover { color: var(--vb-orange) !important; }
.mg-blog-meta i { color: var(--vb-blue-l) !important; }

/* 正文摘要 */
.mg-content p, .mg-posts-sec-post p, .mg-blog-inner p {
  color: var(--vb-ink-2) !important;
  font-size: 13px !important;
  line-height: 1.75 !important;
}

/* 列表型条目（vobao 的密集列表） */
.mg-posts-sec-inner ul li, .mg-widget ul li {
  border-bottom: 1px dashed var(--vb-line-2) !important;
  padding: 8px 0 8px 14px !important;
  position: relative;
  line-height: 1.6 !important;
}
.mg-posts-sec-inner ul li::before, .mg-widget ul li::before {
  content: "" !important;
  position: absolute; left: 0; top: 15px;
  width: 5px; height: 5px;
  background: var(--vb-blue-l);
}
.mg-posts-sec-inner ul li a, .mg-widget ul li a {
  color: var(--vb-ink) !important;
  font-size: 13.5px !important;
}
.mg-posts-sec-inner ul li a:hover, .mg-widget ul li a:hover { color: var(--vb-blue) !important; }

/* --------------------------------------------------------------------------
   8. 侧边栏 / 小工具
   -------------------------------------------------------------------------- */
.mg-widget, .widget {
  background: #fff !important;
  border: 1px solid var(--vb-line) !important;
  box-shadow: none !important;
}
.mg-widget .mg-sec-title { margin: 0 0 12px !important; }
.mg-sidebar .mg-widget { padding: 14px 16px !important; }
.mg-widget .mg-sec-title h4 { font-size: 15px !important; }

/* 更多按钮 / 通用链接按钮 */
.btn, .mg-blog-btn, a.more-link, .mg-more-btn {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.mg-read-more, .btn-theme, .btn-primary {
  background: var(--vb-blue) !important;
  color: #fff !important;
  border: 0 !important;
}
.mg-read-more:hover, .btn-theme:hover, .btn-primary:hover { background: var(--vb-orange) !important; }

/* 分页 */
.pagination .page-numbers {
  border-radius: 0 !important;
  color: var(--vb-ink-2) !important;
  border: 1px solid var(--vb-line) !important;
}
.pagination .page-numbers.current,
.pagination .page-numbers:hover {
  background: var(--vb-blue) !important;
  color: #fff !important;
  border-color: var(--vb-blue) !important;
}

/* 侧栏标签页（最新 / 热门 / 趋势） */
.nav-tabs { border-bottom: 1px solid var(--vb-line) !important; }
.nav-tabs .nav-item { margin-bottom: 0 !important; }
.nav-tabs .nav-link, .nav-tabs > li > a {
  border-radius: 0 !important;
  border: 1px solid var(--vb-line) !important;
  color: var(--vb-ink-2) !important;
  font-size: 13px !important;
  background: #fafafa !important;
  margin-right: 2px !important;
}
.nav-tabs .nav-link.active, .nav-tabs > li.active > a,
.nav-tabs .nav-link:hover, .nav-tabs > li > a:hover {
  background: var(--vb-blue) !important;
  color: #fff !important;
  border-color: var(--vb-blue) !important;
}
.tab-content { border: 1px solid var(--vb-line) !important; border-top: 0 !important; padding: 12px !important; }

/* --------------------------------------------------------------------------
   9. 页脚：vobao 的深灰底
   -------------------------------------------------------------------------- */
.footer, .mg-footer-bottom-area, .mg-footer-copyright,
.mg-footer-bottom-area .container, .footer .container {
  background: var(--vb-dark) !important;
  color: var(--vb-nav-text) !important;
  border: 0 !important;
}
/* 页脚本身贴了一张背景图，去掉它才是 vobao 的纯深灰底 */
.footer, .footer.back-img { background-image: none !important; background-color: var(--vb-dark) !important; }
.footer .overlay { background: transparent !important; }

/* 页脚站名走的是 .site-title-footer（不是 .site-title），单独给字号 */
.site-title-footer, .site-title-footer a {
  color: #ffffff !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  margin: 0 0 4px !important;
  letter-spacing: 0;
}
.site-description-footer {
  color: #b9b9b9 !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}
.mg-footer-bottom-area { padding: 26px 0 !important; border-bottom: 1px solid #454545 !important; }
.mg-footer-bottom-area .mg-sec-title h4 { color: #fff !important; }
.mg-footer-bottom-area .mg-sec-title::after {
  background-image: repeating-linear-gradient(45deg, transparent 0 5px, #4a4a4a 5px 6px) !important;
}
.mg-footer-bottom-area a, .footer a, .mg-footer-copyright a { color: var(--vb-nav-text) !important; }
.mg-footer-bottom-area a:hover, .footer a:hover, .mg-footer-copyright a:hover { color: var(--vb-orange) !important; }
.mg-footer-copyright { font-size: 12px !important; padding: 14px 0 !important; }

/* 返回顶部 */
#back-to-top, .mg-back-to-top {
  background: var(--vb-blue) !important;
  border-radius: 0 !important;
}
#back-to-top:hover, .mg-back-to-top:hover { background: var(--vb-orange) !important; }

/* --------------------------------------------------------------------------
   10. 正文页（文章详情）
   -------------------------------------------------------------------------- */
.single .mg-blog-post-box, .single-post .mg-blog-post-box,
.mg-blog-post-box {
  background: #fff !important;
  border: 1px solid var(--vb-line) !important;
  box-shadow: none !important;
}
.entry-content h2, .entry-content h3 { color: var(--vb-blue) !important; }
.entry-content a { color: var(--vb-blue) !important; }
.entry-content a:hover { color: var(--vb-orange) !important; }
.entry-content blockquote {
  border-left: 4px solid var(--vb-blue-l) !important;
  background: #f9f9f9 !important;
  border-radius: 0 !important;
}
.entry-content img { border-radius: 0 !important; }
