/* ============================================================================
   guohan 主题（client/web 实时站）— 国电焊接信息网视觉
   作用域：.theme-guohan（app.vue 按站点 themeKey 挂载）
   视觉令牌与静态模板包 assets/guohan.css 一致：深色导航 #2a2a2a、红条 #C71F04
   通栏 + 内容宽度四档：≥1440→1440 / 1200~1439→1200 / 1000~1199→1000 / <1000 流式
   ========================================================================== */

:root { --gh-red: #C71F04; }

/* ---------- 头部：白底 80px logo 条（通栏白，内容壳居中） ---------- */
.theme-guohan > header {
  background: #fff;
  box-shadow: none;
  border-bottom: 1px solid #eee;
  height: 80px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center;
}
.theme-guohan > header > div:first-child {
  max-width: var(--gh-shell, 1440px);
  margin: 0 auto;
  width: 100%;
  padding: 0 20px;
}
.theme-guohan > header img { max-height: 64px; width: auto; }

/* ---------- 导航：深色通栏，链接白字/悬停白底红字，两级下拉 ---------- */
.theme-guohan > header nav {
  background: #2a2a2a;
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
}
@media (min-width: 768px) {
  .theme-guohan > header { display: block !important; }
  .theme-guohan > header > div:first-child { display: flex; align-items: center; height: 80px; }
  .theme-guohan > header nav {
    max-width: var(--gh-shell, 1440px);
    margin: 0 auto !important;
    display: flex !important;
    flex-wrap: wrap;
    gap: 0 !important;
  }
}
.theme-guohan > header nav a {
  color: #fff !important;
  padding: 12px 30px !important;
  font-size: 16px !important;
  display: block;
  position: relative;
}
.theme-guohan > header nav a:hover,
.theme-guohan > header nav a.router-link-exact-active {
  background: #fff !important;
  color: #C40000 !important;
}
/* 两级下拉（悬停展开，superfish 视觉等效） */
.theme-guohan nav a .nav-dropdown {
  display: none;
  position: absolute;
  left: 0; top: 100%;
  z-index: 99;
  min-width: 168px;
  background: #2a2a2a;
  box-shadow: 0 3px 8px rgba(0,0,0,.25);
}
.theme-guohan nav a:hover .nav-dropdown { display: block; }
.theme-guohan nav a .nav-dropdown .nav-dropdown-item {
  display: block;
  color: #fff !important;
  padding: 9px 20px !important;
  font-size: 14px !important;
  background: #2a2a2a !important;
  border-top: 1px solid #3a3a3a;
}
.theme-guohan nav a .nav-dropdown .nav-dropdown-item:hover {
  background: #ac0305 !important;
  color: #fff !important;
}

/* ---------- 内容壳与栏目标题红条 ---------- */
.theme-guohan main { width: 100%; }
.theme-guohan main > div { max-width: var(--gh-shell, 1440px); margin: 0 auto; padding: 12px 20px 0; }
.theme-guohan h1, .theme-guohan h2, .theme-guohan h3 {
  border-bottom: solid var(--gh-red) 2px;
  background: linear-gradient(#ffffff, #e8e8e8);
  padding: 8px 0 8px 15px;
}
.theme-guohan section h1, .theme-guohan section h2 { border: none; background: none; padding: 0; }

/* ---------- 新闻列表 fp-row / 图文缩进 / 表格 / 查询表单（与静态包一致） ---------- */
.theme-guohan .fp-row { padding: 8px 4px; border-bottom: 1px dotted #DDD; line-height: 1.7; }
.theme-guohan .fp-row a { color: #1a1a1a; font-size: 14px; }
.theme-guohan .fp-row a:hover { color: var(--gh-red); }
.theme-guohan .fp-row .fp-date { float: right; color: #999; font-size: 12px; }
.theme-guohan p { line-height: 1.9; }
.theme-guohan table { width: 100%; border-collapse: collapse; margin: 8px 0 16px; }
.theme-guohan th, .theme-guohan td { border: 1px solid #D5D5D5; padding: 6px 8px; font-size: 13px; text-align: left; }
.theme-guohan th { background: #F3F3F3; font-weight: 700; }
.theme-guohan form input[type=text],
.theme-guohan form input:not([type]) {
  padding: 8px 10px; border: 1px solid #CCC; border-radius: 3px; font-size: 14px; width: 320px; max-width: 100%;
}
.theme-guohan form button {
  background: var(--gh-red) !important; border: none; color: #fff; padding: 12px 26px !important;
  border-radius: 3px; font-weight: 600; cursor: pointer;
}
.theme-guohan form button:hover { background: #a51a04; }

/* ---------- 页脚：深色通栏，贴底 ---------- */
.theme-guohan > footer {
  background: #2B2B2B !important;
  color: #A6A5A3 !important;
  width: 100%;
  flex-shrink: 0;
  margin-top: 0 !important;
}
.theme-guohan > footer .max-w-5xl { max-width: var(--gh-shell, 1440px); }

/* ---------- Sticky footer ---------- */
.theme-guohan { min-height: 100vh; display: flex; flex-direction: column; }
.theme-guohan > main { flex: 1 0 auto; }

/* ---------- 宽度四档 ---------- */
@media (max-width: 1439px) { .theme-guohan { --gh-shell: 1200px; } }
@media (max-width: 1199px) { .theme-guohan { --gh-shell: 1000px; } }
@media (max-width: 999px)  { .theme-guohan { --gh-shell: 100%; } }
@media (max-width: 768px) {
  .theme-guohan > header nav a { padding: 12px 10px !important; font-size: 14px !important; }
  .theme-guohan main > div { padding: 12px 16px 0; }
  .theme-guohan form input[type=text], .theme-guohan form input:not([type]) { width: 100%; }
  .theme-guohan form button { width: 100%; margin-top: 10px; }
}

/* p2 cursor: 可点击元素悬停小手 */
.theme-guohan a, .theme-guohan .fp-row, .theme-guohan [onclick],
.theme-guohan button, .theme-guohan [role="button"] { cursor: pointer; }
