/* ============================================================
   河南省保密协会 · 适老模式 / 无障碍样式
   ------------------------------------------------------------
   作用域：仅在用户开启“适老模式”后生效
     html.elderly                总开关
     html.elderly-fs-1/2/3       字号档位（标准 / 大 / 特大）
     html.elderly.hc             高对比度
     html.elderly.cursor-big      大鼠标指针
   适配依据：工信部《互联网网站适老化通用设计规范》
     - 正文≥18px、行距≥1.3倍、段落间距≥1.5倍
     - 可点击元素最小触控区≥44px
     - 文字/背景对比度≥4.5:1（高对比度模式≥7:1）
     - 禁用闪烁/动画/自动播放，避免精确操作
   ============================================================ */

/* ---------- 档位基础字号（供 calc 复用） ---------- */
html.elderly { --elderly-base: 21px; }
html.elderly-fs-1 { --elderly-base: 18px; }   /* 标准：≥18px 下限 */
html.elderly-fs-2 { --elderly-base: 21px; }   /* 大：约 1.3× 原 16px */
html.elderly-fs-3 { --elderly-base: 24px; }   /* 特大：约 1.5× 原 16px */

/* ============================================================
   一、字号 / 行距放大（覆盖主题目录式 px 字号）
   ============================================================ */
html.elderly body {
  font-size: var(--elderly-base) !important;
  line-height: 2 !important;
  letter-spacing: .02em !important;
}
html.elderly p,
html.elderly li,
html.elderly td,
html.elderly th,
html.elderly blockquote,
html.elderly label,
html.elderly input,
html.elderly select,
html.elderly textarea,
html.elderly .prose,
html.elderly .prose p,
html.elderly .prose li,
html.elderly .prose td,
html.elderly .prose th,
html.elderly .prose blockquote,
html.elderly .news-list .tt,
html.elderly .news-list .date,
html.elderly .info-card-body,
html.elderly .cert-tool-desc,
html.elderly .breadcrumb,
html.elderly .topbar,
html.elderly .tb-left,
html.elderly .tb-right,
html.elderly .footer-bottom,
html.elderly .footer-cols {
  font-size: var(--elderly-base) !important;
  line-height: 2 !important;
}

/* 标题层级（在基础字号上按比例放大，保留层级） */
html.elderly h1 { font-size: calc(var(--elderly-base) * 1.5) !important; line-height: 1.4 !important; }
html.elderly h2 { font-size: calc(var(--elderly-base) * 1.33) !important; line-height: 1.4 !important; }
html.elderly h3 { font-size: calc(var(--elderly-base) * 1.2) !important; line-height: 1.4 !important; }
html.elderly h4 { font-size: calc(var(--elderly-base) * 1.1) !important; line-height: 1.4 !important; }
html.elderly h5,
html.elderly h6 { font-size: var(--elderly-base) !important; line-height: 1.4 !important; }

/* 段落间距≥1.5倍字体 */
html.elderly p { margin: 0 0 1.5em !important; }
html.elderly .prose p { margin: 0 0 1.5em !important; }

/* ============================================================
   二、可点击元素：放大触控区（≥44px）+ 清晰可辨
   ============================================================ */
html.elderly .btn,
html.elderly .more,
html.elderly button,
html.elderly input[type="submit"],
html.elderly input[type="button"],
html.elderly .nav-toggle,
html.elderly .mcq-tab,
html.elderly .info-index-btn,
html.elderly .pagination a,
html.elderly .pagination span {
  min-height: 48px !important;
  padding: 12px 20px !important;
  font-size: var(--elderly-base) !important;
  line-height: 1.4 !important;
  border-radius: 8px !important;
}

/* 导航菜单项：整块可点、清晰分隔 */
html.elderly .menu-item > a,
html.elderly .nav-list a,
html.elderly .sub-menu a,
html.elderly .footer-bottom-links a,
html.elderly .tb-right a {
  display: flex !important;
  align-items: center;
  min-height: 44px !important;
  padding: 10px 16px !important;
  font-size: calc(var(--elderly-base) * 1.05) !important;
}
html.elderly .sub-menu { padding: 6px 0 !important; }
html.elderly .news-list a { padding: 16px !important; gap: 12px !important; }
html.elderly .news-list .tt { font-weight: 600 !important; }

/* 表单控件放大 */
html.elderly input[type="text"],
html.elderly input[type="search"],
html.elderly input[type="email"],
html.elderly input[type="tel"],
html.elderly input[type="password"],
html.elderly select,
html.elderly textarea {
  min-height: 48px !important;
  padding: 12px 14px !important;
  font-size: var(--elderly-base) !important;
}

/* 正文链接加下划线，便于辨识（导航/按钮除外） */
html.elderly .prose a,
html.elderly .footer-bottom-links a,
html.elderly .tb-right a,
html.elderly .breadcrumb a {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* ============================================================
   三、键盘焦点指示（清晰可见）
   ============================================================ */
html.elderly a:focus-visible,
html.elderly button:focus-visible,
html.elderly input:focus-visible,
html.elderly select:focus-visible,
html.elderly textarea:focus-visible,
html.elderly [tabindex]:focus-visible {
  outline: 3px solid #c8161d !important;
  outline-offset: 3px !important;
}

/* ============================================================
   四、禁用动画 / 平滑滚动 / 自动播放（避免干扰与眩晕）
   ============================================================ */
html.elderly *,
html.elderly *::before,
html.elderly *::after {
  animation-duration: .001s !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001s !important;
  scroll-behavior: auto !important;
}

/* ============================================================
   五、高对比度模式（黑底 + 白字 + 黄强调，对比度极高）
   ============================================================ */
html.elderly.hc body,
html.elderly.hc .site-header,
html.elderly.hc .topbar,
html.elderly.hc .mainnav,
html.elderly.hc .page-banner,
html.elderly.hc .breadcrumb,
html.elderly.hc .page-wrap,
html.elderly.hc .prose,
html.elderly.hc .info-card,
html.elderly.hc .news-list,
html.elderly.hc .footer-cols,
html.elderly.hc .site-footer,
html.elderly.hc .cert-tool-section,
html.elderly.hc .mcq-tab,
html.elderly.hc .container {
  background: #000000 !important;
  color: #ffffff !important;
  border-color: #ffeb3b !important;
  box-shadow: none !important;
}
html.elderly.hc h1,
html.elderly.hc h2,
html.elderly.hc h3,
html.elderly.hc h4,
html.elderly.hc h5,
html.elderly.hc h6 { color: #ffffff !important; }
html.elderly.hc a { color: #ffeb3b !important; text-decoration: underline !important; }
html.elderly.hc .site-header,
html.elderly.hc .topbar,
html.elderly.hc .mainnav,
html.elderly.hc .site-footer {
  border-top: 2px solid #ffeb3b !important;
  border-bottom: 2px solid #ffeb3b !important;
}
html.elderly.hc .btn,
html.elderly.hc .more,
html.elderly.hc button,
html.elderly.hc input,
html.elderly.hc select,
html.elderly.hc textarea {
  background: #000000 !important;
  color: #ffeb3b !important;
  border: 2px solid #ffeb3b !important;
}
/* 高对比度下焦点用黄色 */
html.elderly.hc a:focus-visible,
html.elderly.hc button:focus-visible,
html.elderly.hc input:focus-visible,
html.elderly.hc select:focus-visible,
html.elderly.hc textarea:focus-visible {
  outline-color: #ffeb3b !important;
}

/* ============================================================
   六、大鼠标指针（内嵌 SVG，无需额外资源）
   ============================================================ */
html.elderly.cursor-big,
html.elderly.cursor-big * {
  cursor: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='40'%20height='40'%3E%3Cpolygon%20points='5,3%205,30%2013,22%2019,33%2025,31%2019,21%2029,21'%20fill='%23ffeb3b'%20stroke='%23000'%20stroke-width='2'/%3E%3C/svg%3E") 5 3, auto !important;
}

/* ============================================================
   七、适老工具条本体（始终可见，独立于适老开关）
   ============================================================ */
.elderly-toolbar {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2147483000;
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
}
.elderly-fab {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #0e4da4;
  color: #ffffff;
  border: 3px solid #ffffff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .35);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.1;
  padding: 0;
}
.elderly-fab:hover { background: #0a3573; }
.elderly-fab.is-active { background: #c8161d; border-color: #ffe08a; }
.elderly-fab svg { width: 24px; height: 24px; display: block; }
.elderly-fab__txt { margin-top: 2px; }

.elderly-panel {
  position: absolute;
  right: 0;
  bottom: 78px;
  width: 320px;
  max-width: calc(100vw - 36px);
  max-height: 78vh;
  overflow: auto;
  background: #ffffff;
  color: #1f2d3d;
  border: 2px solid #0e4da4;
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .3);
}
.elderly-panel[hidden] { display: none; }
.elderly-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #0e4da4;
  color: #ffffff;
  padding: 12px 14px;
  font-size: 17px;
  font-weight: 700;
  border-radius: 10px 10px 0 0;
}
.elderly-close {
  background: transparent;
  border: none;
  color: #ffffff;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  width: 36px;
  height: 36px;
  padding: 0;
}
.elderly-panel__body { padding: 12px 14px; }
.elderly-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid #e3e8ef;
}
.elderly-label { font-size: 16px; font-weight: 600; }
.elderly-seg { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.elderly-seg button,
.elderly-toggle,
.elderly-reset {
  min-height: 44px;
  padding: 8px 12px;
  font-size: 16px;
  border-radius: 8px;
  border: 2px solid #0e4da4;
  background: #ffffff;
  color: #0e4da4;
  cursor: pointer;
  font-weight: 600;
}
.elderly-seg button[aria-pressed="true"],
.elderly-toggle[aria-pressed="true"],
.elderly-seg button.is-active {
  background: #0e4da4;
  color: #ffffff;
}
.elderly-reset {
  width: 100%;
  margin-top: 14px;
  border-color: #c8161d;
  color: #c8161d;
}
.elderly-reset:hover { background: #c8161d; color: #ffffff; }
.elderly-hint { font-size: 14px; color: #5b6b7e; padding: 10px 0 0; line-height: 1.6; }
.elderly-toolbar button:focus-visible { outline: 3px solid #c8161d; outline-offset: 2px; }

/* 高对比度下工具条同步为黑黄配色（保持清晰） */
html.elderly.hc .elderly-fab { background: #000000; border-color: #ffeb3b; color: #ffeb3b; }
html.elderly.hc .elderly-panel { background: #000000; color: #ffffff; border-color: #ffeb3b; }
html.elderly.hc .elderly-panel__head { background: #000000; color: #ffeb3b; border-bottom: 2px solid #ffeb3b; }
html.elderly.hc .elderly-close { color: #ffeb3b; }
html.elderly.hc .elderly-group { border-color: #ffeb3b; }
html.elderly.hc .elderly-label { color: #ffffff; }
html.elderly.hc .elderly-seg button,
html.elderly.hc .elderly-toggle,
html.elderly.hc .elderly-reset { background: #000000; color: #ffeb3b; border-color: #ffeb3b; }
html.elderly.hc .elderly-seg button[aria-pressed="true"],
html.elderly.hc .elderly-toggle[aria-pressed="true"],
html.elderly.hc .elderly-seg button.is-active { background: #ffeb3b; color: #000000; }
html.elderly.hc .elderly-hint { color: #ffeb3b; }

/* 小屏适配：工具条不溢出 */
@media (max-width: 480px) {
  .elderly-panel { width: calc(100vw - 24px); right: 0; }
  .elderly-toolbar { right: 12px; bottom: 12px; }
}