/* =========================================================
   beautify.css —— 网址导航模板 全站美化样式表
   说明:本文件只做样式覆盖(UI 美化),不修改任何页面结构
   与业务逻辑。加载顺序在所有主题样式之后,优先级更高。
   ========================================================= */

/* ---------- 1. 全局基调 ---------- */
:root {
  --m-primary: #2563eb;        /* 主色:科技蓝 */
  --m-primary-deep: #1d4ed8;
  --m-accent: #06b6d4;         /* 辅色:青 */
  --m-success: #10b981;        /* 点缀绿 */
  --m-gradient: linear-gradient(135deg, #2563eb 0%, #06b6d4 100%);
  --m-gradient-soft: linear-gradient(135deg, rgba(37, 99, 235, .08), rgba(6, 182, 212, .08));
  --m-bg: #f4f7fb;
  --m-card: #ffffff;
  --m-text: #1f2937;
  --m-text-sub: #6b7280;
  --m-border: #e8edf4;
  --m-shadow: 0 6px 24px rgba(30, 64, 175, .08);
  --m-shadow-hover: 0 12px 32px rgba(30, 64, 175, .16);
  --m-radius: 14px;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--m-bg);
  color: var(--m-text);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
}

::selection {
  background: rgba(37, 99, 235, .2);
}

/* ---------- 2. 顶部导航 ---------- */
.navbar-main {
  background: rgba(255, 255, 255, .92) !important;
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid rgba(37, 99, 235, .08);
  box-shadow: 0 4px 20px rgba(30, 64, 175, .06) !important;
}

.navbar-main .navbar-nav .nav-link {
  color: #334155 !important;
  font-weight: 500;
  border-radius: 999px;
  padding: .5rem 1.1rem;
  transition: all .25s ease;
}

.navbar-main .navbar-nav .nav-link:hover {
  color: var(--m-primary) !important;
  background: var(--m-gradient-soft);
}

.navbar-main .nav-item.in_on .nav-link {
  color: #fff !important;
  background: var(--m-gradient);
  box-shadow: 0 6px 16px rgba(37, 99, 235, .35);
}

.navbar-main .dropdown-menu {
  border: none;
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(30, 64, 175, .14);
  padding: .4rem;
}

.navbar-main .dropdown-menu .dropdown-item {
  border-radius: 8px;
  padding: .45rem .9rem;
  transition: all .2s ease;
}

.navbar-main .dropdown-menu .dropdown-item:hover {
  background: var(--m-gradient-soft);
  color: var(--m-primary);
}

.navbar-main .top_search {
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--m-border);
  background: #fff;
  box-shadow: 0 2px 8px rgba(30, 64, 175, .05);
}

.navbar-main .top_search .custom-select,
.navbar-main .top_search .form-control {
  border: none;
  outline: none;
  box-shadow: none;
}

.navbar-main .top_search .btn {
  background: var(--m-gradient) !important;
  border: none;
  color: #fff;
  border-radius: 999px !important;
  padding: .375rem 1.2rem;
}

/* ---------- 3. 搜索横幅 Banner ---------- */
#banner-bear {
  background-image: radial-gradient(circle at 12% 20%, rgba(6, 182, 212, .9) 0%, rgba(37, 99, 235, .95) 60%, rgba(30, 58, 138, .98) 100%) !important;
  background-size: 220% 220%;
  border-radius: 0 0 28px 28px;
  box-shadow: 0 18px 40px -18px rgba(37, 99, 235, .5);
}

#banner-bear .typing {
  font-weight: 600;
  letter-spacing: 2px;
  text-shadow: 0 4px 20px rgba(0, 0, 0, .18);
}

.primary-menus .left-cont input {
  border-radius: 12px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
}

.primary-menus .left-cont button {
  background: var(--m-gradient) !important;
  border: none !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, .45);
  font-weight: 600;
}

.primary-menus ul li.current {
  background: #fff;
  color: var(--m-primary);
  border-radius: 8px 8px 0 0;
}

.primary-menus ul li:hover {
  background: rgba(255, 255, 255, .92);
  color: var(--m-primary);
}

/* ---------- 4. 数据统计条 / 卡片容器 ---------- */
.wz_tj {
  background: rgba(255, 255, 255, .97) !important;
  border: 1px solid var(--m-border);
  border-radius: var(--m-radius) !important;
  box-shadow: var(--m-shadow) !important;
  margin-top: -22px;
  position: relative;
  z-index: 2;
}

.wz_tj b {
  color: var(--m-primary);
  font-size: 16px;
  margin: 0 1px;
  background: var(--m-gradient-soft);
  padding: 1px 8px;
  border-radius: 8px;
  font-weight: 700;
}

/* 统一“输入网址”表单风格 */
.count-pay-money .form-control {
  border: 1px solid var(--m-border) !important;
  border-radius: 999px !important;
  box-shadow: 0 2px 10px rgba(30, 64, 175, .06) !important;
  padding-left: 18px;
  min-width: 240px;
}

.count-pay-money .form-control:focus {
  border-color: var(--m-primary) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12) !important;
}

.count-pay-money .jkjr {
  border-radius: 999px !important;
}

.seopingjia-seo-newt1 {
  background: #fff !important;
  border-radius: var(--m-radius) !important;
  box-shadow: var(--m-shadow) !important;
  border: 1px solid var(--m-border) !important;
  overflow: hidden;
}

.seopingjia-seo-newt1 td {
  border-color: var(--m-border) !important;
  font-weight: 500;
  transition: all .25s ease;
}

.seopingjia-seo-newt1 td:hover {
  background: var(--m-gradient-soft);
}

.seopingjia-seo-newt1 td a:hover {
  color: var(--m-primary);
}

/* ---------- 5. 楼层标题 ---------- */
.in_title_div .in_title {
  position: relative;
  padding-left: 14px;
  font-weight: 700;
}

.in_title_div .in_title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 20px;
  border-radius: 3px;
  background: var(--m-gradient);
}

.in_title_div .in_title strong {
  color: #111827;
}

.in_title_div .in_text {
  color: var(--m-text-sub);
}

.btn_gg,
.btn_gg1 {
  background: linear-gradient(135deg, #f59e0b, #ef4444) !important;
  border-radius: 999px !important;
  padding: 4px 14px !important;
  font-weight: 500;
}

/* ---------- 6. 站点卡片 ---------- */
.wz_box {
  background: var(--m-card) !important;
  border: 1px solid var(--m-border) !important;
  border-radius: var(--m-radius) !important;
  box-shadow: var(--m-shadow) !important;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  overflow: hidden;
  position: relative;
}

/* 卡片顶部渐变细线,增加设计层次 */
.wz_box::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--m-gradient);
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left;
  transition: opacity .35s ease, transform .35s ease;
}

.wz_box:hover {
  transform: translateY(-4px);
  border-color: rgba(37, 99, 235, .35) !important;
  box-shadow: var(--m-shadow-hover) !important;
}

.wz_box:hover::before {
  opacity: 1;
  transform: scaleX(1);
}

.wz_box .wz_a h3 {
  font-weight: 600;
  color: #111827;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wz_box .wz_a:hover h3 {
  color: var(--m-primary);
}

.wz_box .icon-triangle-right img {
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
  transition: transform .25s ease;
}

.wz_box:hover .icon-triangle-right img {
  transform: scale(1.12);
}

.zhida {
  border-radius: 999px !important;
}

.zhida a {
  color: var(--m-primary) !important;
}

/* ---------- 7. 快审推荐卡(图文卡) ---------- */
.wz_box .fangpic {
  border-radius: 10px;
  overflow: hidden;
}

.wz_box .fangpic img {
  transition: transform .5s ease;
}

.wz_box:hover .fangpic img {
  transform: scale(1.06);
}

.wz_box .wz_title {
  font-weight: 600;
  color: #111827;
}

.wz_box .wz_title:hover {
  color: var(--m-primary);
}

/* ---------- 8. VIP 置顶站点 ---------- */
.vip-box .vip_li {
  background: linear-gradient(180deg, #ffffff, #f3f7ff) !important;
  border: 1px solid #e3ecfb !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 14px rgba(55, 99, 170, .08) !important;
  transition: all .3s ease;
}

.vip-box .vip_li:hover {
  border-color: var(--m-primary) !important;
  transform: translateY(-2px);
}

.vip-box .vip_li:hover .zhida {
  background: var(--m-gradient) !important;
}

.vip-box .vip_li .vip-a {
  font-weight: 500;
  color: #334155;
}

.vip-box .vip_li:hover .vip-a {
  color: var(--m-primary);
}

/* ---------- 9. 楼层侧边导航 ---------- */
.floor-nav {
  border-radius: 12px !important;
  border: 1px solid var(--m-border) !important;
  box-shadow: var(--m-shadow) !important;
}

.floor-nav .scroll-nav {
  border-radius: 8px;
  transition: all .25s ease;
}

.floor-nav .scroll-nav.active {
  background: var(--m-gradient) !important;
  color: #fff !important;
}

.floor-nav .scroll-nav:not(.active):hover {
  background: var(--m-gradient-soft);
  color: var(--m-primary);
}

/* ---------- 10. 友情链接 ---------- */
.link_div {
  background: #fff;
  border: 1px solid var(--m-border);
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow);
  padding: 18px 22px !important;
}

.link_div a {
  color: var(--m-text-sub);
  border: 1px solid var(--m-border);
  border-radius: 999px;
  padding: 2px 14px;
  margin: 4px 6px 4px 0;
  display: inline-block;
  line-height: 26px;
  transition: all .25s ease;
}

.link_div a:hover {
  color: #fff;
  background: var(--m-gradient);
  border-color: transparent;
}

/* ---------- 11. 页脚 ---------- */
.footer_div1 {
  background: linear-gradient(180deg, #eef3fb, #e3ecf8) !important;
  border-top: 1px solid var(--m-border);
  border-bottom: 1px solid var(--m-border);
}

.footer_div1 .tj_text1 {
  color: var(--m-primary) !important;
  font-weight: 700;
}

#footer {
  background: linear-gradient(135deg, #111a33 0%, #1b2a4a 55%, #0f172a 100%) !important;
  border-top: 1px solid rgba(96, 165, 250, .15);
}

#footer .footer_a,
#footer .footer_b {
  color: #a8b6cc;
}

#footer .footer_a a {
  color: #94a3b8 !important;
}

#footer .footer_a a:hover {
  color: #fff !important;
}

/* ---------- 12. 通用按钮与链接 ---------- */
.btn-primary,
.btn-info {
  background: var(--m-gradient) !important;
  border: none !important;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .3) !important;
  transition: all .25s ease;
}

.btn-primary:hover,
.btn-info:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(37, 99, 235, .4) !important;
}

a {
  transition: color .2s ease;
}

/* ---------- 13. 返回顶部 ---------- */
#scrollTopButton {
  background: var(--m-gradient) !important;
  color: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(37, 99, 235, .4);
}

/* ---------- 14. 移动端适配 ---------- */
@media (max-width: 991.98px) {
  .navbar-main {
    background: rgba(255, 255, 255, .98) !important;
  }

  .navbar-main .navbar-collapse {
    background: #fff;
    border-radius: 0 0 16px 16px;
    padding: .6rem 1rem;
  }

  #banner-bear {
    border-radius: 0;
  }
}

/* ---------- 15. 文章/详情页内容卡片 ---------- */
.wz_box_pa {
  background: #fff !important;
  border: 1px solid var(--m-border) !important;
  border-radius: var(--m-radius) !important;
  box-shadow: var(--m-shadow) !important;
}

.wz_box_pa h1 {
  color: #111827;
}

/* ---------- 16. 会员中心头部(独立皮肤) ---------- */
.am-topbar {
  background: var(--m-gradient) !important;
}

/* ---------- 17. 通用卡片(member 之外列表) ---------- */
.card {
  border: 1px solid var(--m-border) !important;
  border-radius: var(--m-radius) !important;
  box-shadow: var(--m-shadow) !important;
}

/* ---------- 18. 滚动条美化 ---------- */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #93c5fd, #67e8f9);
  border-radius: 4px;
}

::-webkit-scrollbar-track {
  background: transparent;
}
