/* ============================================================
   custom.css — 上海峰迪网站现代化覆盖样式
   注入位置:base/templates/header.htm,在 common.css 之后
   策略:不破坏 1002px 内联布局,只通过 CSS 覆盖视觉
   ============================================================ */

/* ===== 1. 全局字体现代化 ===== */
body,
body td,
body th,
body div,
body p,
body span,
body a,
body li,
body input,
body select,
body button,
body textarea {
  font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB",
               "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: #2c3e50 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ===== 2. 外围背景 — 填充宽屏空白 ===== */
html {
  background:
    radial-gradient(ellipse at top, #e8eef5 0%, #d9e3f0 50%, #cbd8e8 100%) fixed !important;
  min-height: 100vh;
}

/* 在 1002px 主容器两侧加装饰渐变带,消除空白尴尬 */
body::before,
body::after {
  content: "";
  position: fixed;
  top: 0;
  bottom: 0;
  width: calc((100vw - 1002px) / 2 - 20px);
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(26,58,110,0.08) 0%, transparent 60%),
    repeating-linear-gradient(
      45deg,
      transparent 0px,
      transparent 18px,
      rgba(26,58,110,0.025) 18px,
      rgba(26,58,110,0.025) 19px
    );
}
body::before { left: 0; }
body::after  { right: 0; transform: scaleX(-1); }

/* 小屏隐藏装饰 */
@media (max-width: 1100px) {
  body::before,
  body::after { display: none; }
}

/* ===== 3. 主容器 — 居中 + 阴影 ===== */
#contain {
  margin: 0 auto !important;
  background: #ffffff !important;
  box-shadow: 0 0 40px rgba(26, 58, 110, 0.12) !important;
  border-radius: 2px;
  position: relative;
}

/* ===== 4. 链接色 + 过渡 ===== */
a:link,
a:visited {
  color: #1a5fa3 !important;
  text-decoration: none !important;
  transition: color 0.18s ease !important;
}
a:hover,
a:active {
  color: #e63946 !important;
  text-decoration: none !important;
}

/* ===== 5. 头部 logo 区微调 ===== */
#top {
  background: #ffffff !important;
}

/* 头部 FD logo 文字与公司名字加粗 */
#top h1,
#top h2,
#top .sitename {
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
}

/* ===== 6. 主菜单 — 现代化 hover ===== */
[id^="pdv_"] td a:hover,
[id^="pdv_"] .menu a:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.15) !important;
}

/* ===== 7. 模块容器 — 微妙阴影/边框 ===== */
/* 只对主要内容区的"卡片型"模块加圆角阴影,不要全部加(会破坏布局) */
#content [id^="pdv_"] {
  border-radius: 3px;
}

/* ===== 8. 产品列表 / 新闻列表 — 卡片化 ===== */
ul[class*="newslist"] li,
ul[class*="productlist"] li,
ul.list li,
.list li,
.contentlist li {
  padding: 10px 14px !important;
  border-bottom: 1px solid #eaeef3 !important;
  transition: background-color 0.15s ease, padding-left 0.15s ease !important;
  list-style: none !important;
}

ul[class*="newslist"] li:hover,
ul[class*="productlist"] li:hover,
ul.list li:hover,
.list li:hover,
.contentlist li:hover {
  background-color: #f5f9ff !important;
  padding-left: 18px !important;
}

ul[class*="newslist"] li:last-child,
ul[class*="productlist"] li:last-child {
  border-bottom: none !important;
}

/* 列表项中的日期文本灰一点 */
ul[class*="newslist"] li .time,
ul[class*="productlist"] li .time,
.list li .time {
  color: #95a5b8 !important;
  font-size: 12px !important;
}

/* ===== 9. 表单元素现代化 ===== */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
textarea,
select {
  padding: 5px 10px !important;
  border: 1px solid #d0d7de !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  background-color: #fff !important;
  outline: none !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  box-sizing: border-box !important;
  min-height: 28px;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
  border-color: #1a5fa3 !important;
  box-shadow: 0 0 0 2px rgba(26, 95, 163, 0.12) !important;
}

input[type="submit"],
input[type="button"],
input[type="reset"],
button {
  padding: 6px 16px !important;
  background: linear-gradient(180deg, #2772c0 0%, #1a5fa3 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  font-size: 13px !important;
  transition: all 0.18s ease !important;
  min-height: 30px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
button:hover {
  background: linear-gradient(180deg, #1a5fa3 0%, #134a82 100%) !important;
  box-shadow: 0 2px 6px rgba(26,95,163,0.25);
  transform: translateY(-1px);
}

input[type="submit"]:active,
input[type="button"]:active,
button:active {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

/* ===== 10. 标题 — 略加视觉重量 ===== */
h1, h2, h3, h4 {
  color: #1a3a6e !important;
  letter-spacing: 0.3px;
}

/* 模块标题(常见 .more / .title / .coltitle 类) */
.coltitle,
.title,
.modtitle {
  font-weight: 600 !important;
  color: #1a3a6e !important;
}

/* ===== 11. 分页器现代化 ===== */
.page a,
.page span,
.pagination a,
.pagination span,
a.pagelink {
  display: inline-block;
  padding: 4px 10px !important;
  margin: 0 2px;
  border: 1px solid #d0d7de !important;
  border-radius: 3px !important;
  background: #fff !important;
  color: #1a5fa3 !important;
  font-size: 12px !important;
  transition: all 0.18s ease !important;
  text-decoration: none !important;
}

.page a:hover,
.pagination a:hover {
  background: #1a5fa3 !important;
  color: #fff !important;
  border-color: #1a5fa3 !important;
}

.page .current,
.page .now,
.pagination .current,
.pagination .now {
  background: #1a5fa3 !important;
  color: #fff !important;
  border-color: #1a5fa3 !important;
}

/* ===== 12. 表格 — 微调 ===== */
#contain table {
  border-collapse: collapse;
}

#contain table.data td,
#contain table.list td {
  padding: 8px 12px !important;
  border-bottom: 1px solid #eaeef3;
}

/* ===== 13. 图片 — 加边框 + hover 缩放 ===== */
#contain img.photo,
#contain a img:not(.icon):not(.logo):not(.banner) {
  border: 1px solid #e1e7ee;
  border-radius: 3px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

#contain a:hover img:not(.icon):not(.logo):not(.banner) {
  box-shadow: 0 4px 12px rgba(26,58,110,0.18);
}

/* ===== 14. 你现在的位置 — 面包屑 ===== */
.navpath,
.location,
.crumbs,
[class*="navpath"],
[class*="location"] {
  color: #7a8a9e !important;
  font-size: 12px !important;
}

.navpath a,
.location a,
.crumbs a,
[class*="navpath"] a,
[class*="location"] a {
  color: #1a5fa3 !important;
}

/* ===== 15. 底部信息栏 — 加深底色 ===== */
#bottom {
  background: linear-gradient(180deg, #1f4a85 0%, #163d6e 100%) !important;
  color: #c8d4e3 !important;
}

#bottom a:link,
#bottom a:visited {
  color: #ffffff !important;
}

#bottom a:hover {
  color: #ffd96b !important;
}

/* ===== 16. 滚动条美化(Webkit) ===== */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #f0f4f8;
}
::-webkit-scrollbar-thumb {
  background: #b8c5d6;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #8fa3bd;
}

/* ===== 17. 文本选中色 ===== */
::selection {
  background: #1a5fa3;
  color: #ffffff;
}

/* ===== 18. 平滑过渡(默认所有交互元素) ===== */
a, button, input, select, .pdv_class {
  -webkit-tap-highlight-color: transparent;
}

/* ===== 19. 容器内空白模块 — 隐藏空高度的 modPageContent ===== */
[id^="pdv_"]:empty {
  display: none !important;
}

/* ===== 20. 打印样式 ===== */
@media print {
  body::before, body::after { display: none; }
  #top, #bottom { display: none; }
  #contain { box-shadow: none !important; }
}