/* ============================================================================
 *  reset.css —— 必须在所有页面 CSS 之前引入
 * ----------------------------------------------------------------------------
 *  这个文件分三块，作用完全不同，改动前请看清楚：
 *
 *  【第一块】antd base 等价层  ← 关乎「和老页面一模一样」
 *      老项目全局引入了 ant-design-vue/dist/antd.css，它自带一套 reset。
 *      20 个页面 CSS 是在这套 reset 之上写的，尤其依赖 box-sizing: border-box
 *      和 body 的 14px / line-height 1.5。
 *      新项目删掉了 antd（整包 CSS 只为了两个组件），所以必须在这里把它的
 *      base 层原样复刻回来，否则全站版式会偏。
 *      ⚠️ 不要动这一块，除非你在做像素级比对并且知道自己在改什么。
 *
 *  【第二块】SEO 语义标签归零  ← 关乎「加 h1 不改变视觉」
 *      老页面用 <p class="tit"> 当标题，搜索引擎读不到层级。
 *      新页面改成 <h2 class="tit">，靠这一块让 h1~h6 的默认表现等同于 <p>，
 *      从而换标签后渲染结果逐像素不变。
 *
 *  【第三块】工具类
 * ========================================================================== */


/* ┌──────────────────────────────────────────────────────────────────────────┐
 * │ 第一块：antd base 等价层（复刻 ant-design-vue 1.7.8 的 reset）            │
 * └──────────────────────────────────────────────────────────────────────────┘ */

html,
body {
  width: 100%;
  height: 100%;
}

*,
*::before,
*::after {
  box-sizing: border-box;          /* ← 页面 CSS 严重依赖这一条，删了必崩 */
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

article, aside, dialog, figcaption, figure,
footer, header, hgroup, main, nav, section {
  display: block;
}

body {
  margin: 0;
  color: rgba(0, 0, 0, 0.65);
  font-size: 14px;
  font-variant: tabular-nums;
  line-height: 1.5;
  background-color: #fff;
  font-feature-settings: 'tnum';
  /* 注意：font-family 故意不写。
     老项目由 all.css 的 body 规则接管为 '微软雅黑','Arial'，
     这里写了反而会打乱层叠顺序。 */
}

[tabindex='-1']:focus { outline: none !important; }

hr { box-sizing: content-box; height: 0; overflow: visible; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0.5em;
  color: rgba(0, 0, 0, 0.85);
  font-weight: 500;
}

p { margin-top: 0; margin-bottom: 1em; }

address { margin-bottom: 1em; font-style: normal; line-height: inherit; }

input[type='text'], input[type='password'], input[type='number'], textarea {
  -webkit-appearance: none;
}

ol, ul, dl { margin-top: 0; margin-bottom: 1em; }
ol ol, ul ul, ol ul, ul ol { margin-bottom: 0; }

dt { font-weight: 500; }
dd { margin-bottom: 0.5em; margin-left: 0; }
blockquote { margin: 0 0 1em; }
dfn { font-style: italic; }
b, strong { font-weight: bolder; }
small { font-size: 80%; }

sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }

/* antd 原本这里还有 a { color:#1890ff } / a:hover { color:#40a9ff } /
 * a:active { color:#096dd9 } 三条。这里【故意不复刻颜色】，原因见第三块的说明。 */
a {
  text-decoration: none;
  background-color: transparent;
  outline: none;
  cursor: pointer;
  transition: color 0.3s;
}
a:active, a:hover { text-decoration: none; outline: 0; }
a[disabled] { color: rgba(0, 0, 0, 0.25); cursor: not-allowed; pointer-events: none; }

pre, code, kbd, samp {
  font-size: 1em;
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
}
pre { margin-top: 0; margin-bottom: 1em; overflow: auto; }

figure { margin: 0 0 1em; }

img { vertical-align: middle; border-style: none; }

svg:not(:root) { overflow: hidden; }

a, area, button, [role='button'], input:not([type='range']),
label, select, summary, textarea {
  touch-action: manipulation;
}

table { border-collapse: collapse; }
caption {
  padding-top: 0.75em; padding-bottom: 0.3em;
  color: rgba(0, 0, 0, 0.45); text-align: left; caption-side: bottom;
}
th { text-align: inherit; }

input, button, select, optgroup, textarea {
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
}
button, input  { overflow: visible; }
button, select { text-transform: none; }
button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
button::-moz-focus-inner, [type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner, [type='submit']::-moz-focus-inner {
  padding: 0; border-style: none;
}
input[type='radio'], input[type='checkbox'] { box-sizing: border-box; padding: 0; }
textarea { overflow: auto; resize: vertical; }

fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
legend {
  display: block; width: 100%; max-width: 100%;
  margin-bottom: 0.5em; padding: 0;
  color: inherit; font-size: 1.5em; line-height: inherit; white-space: normal;
}

progress { vertical-align: baseline; }
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button { height: auto; }
[type='search'] { outline-offset: -2px; -webkit-appearance: none; }
[type='search']::-webkit-search-cancel-button,
[type='search']::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; }

output   { display: inline-block; }
summary  { display: list-item; }
template { display: none; }
[hidden] { display: none !important; }
mark     { padding: 0.2em; background-color: #feffe6; }

::-moz-selection { color: #fff; background: #1890ff; }
::selection      { color: #fff; background: #1890ff; }

.clearfix { zoom: 1; }
.clearfix::before, .clearfix::after { display: table; content: ''; }
.clearfix::after { clear: both; }


/* ┌──────────────────────────────────────────────────────────────────────────┐
 * │ 第二块：SEO 语义标签归零                                                  │
 * │                                                                          │
 * │ 老页面：<p class="ptonetop_tit">盈科拼团</p>      ← 搜索引擎看不出这是标题 │
 * │ 新页面：<h1 class="ptonetop_tit">盈科拼团</h1>    ← 有语义，且渲染不变     │
 * │                                                                          │
 * │ 原理：浏览器给 h1~h6 的默认 font-size（h1 是 2em、h2 是 1.5em…）和上面    │
 * │ antd 层给的 font-weight:500 / color / margin-bottom:.5em，会让换标签后    │
 * │ 版式变化。这里把它们全部归零到「和 <p> 一样」，页面 CSS 里 .ptonetop_tit  │
 * │ 自己的 font-size / font-weight / margin 声明继续生效并覆盖。              │
 * │                                                                          │
 * │ 所以：换标签是零风险操作，前提是这一块在页面 CSS 之前加载。               │
 * └──────────────────────────────────────────────────────────────────────────┘ */

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;      /* 抹掉浏览器默认的 2em / 1.5em / 1.17em … */
  font-weight: inherit;    /* 抹掉浏览器的 bold 和 antd 的 500 */
  color: inherit;          /* 抹掉 antd 的 rgba(0,0,0,.85) */
  line-height: inherit;
  margin-top: 0;
  margin-bottom: 1em;      /* 对齐 antd 下 <p> 的 margin-bottom，不是 .5em */
}


/* ┌──────────────────────────────────────────────────────────────────────────┐
 * │ 第三块：router-link → <a> 兼容层  ← 关乎「和老页面一模一样」               │
 * │                                                                          │
 * │ 老项目大量使用 <router-link tag="li" to="/x">文字</router-link>，          │
 * │ 它渲染出来是纯 <li>文字</li>，没有 <a> 标签 —— 所以文字颜色继承父级。      │
 * │                                                                          │
 * │ 问题：没有 <a href> 意味着搜索引擎爬不到站内链接，整站内链为零。           │
 * │ 所以新项目必须换成 <li><a href="/x">文字</a></li>。                        │
 * │                                                                          │
 * │ 但这样一来，上面 antd 层的 a { color:#1890ff } 会把导航文字全变成蓝色。    │
 * │ 下面这条让 <a> 继承父级颜色，视觉回到和老页面完全一致。                    │
 * │                                                                          │
 * │ 安全性：全站所有 <a> 都有自己的 class 并显式设置了颜色                     │
 * │ （.bottom_text2 / .weishangcheng / .input_right>a …），                    │
 * │ 没有任何一处依赖 antd 的默认链接蓝，所以这条规则不会误伤。                 │
 * │                                                                          │
 * │ ⚠️ 只写不带伪类的 a，是刻意的，不要「补全」成 a:hover / a:active。         │
 * │                                                                          │
 * │ 原因是一个特异度陷阱：                                                    │
 * │   a:hover 的特异度是 (0,1,1)，会压过单类选择器 (0,1,0)。                   │
 * │   老项目里页面 CSS 是 scoped 的，vue-loader 编译成                        │
 * │       .weishangcheng[data-v-xxx]  →  特异度 (0,2,0)                       │
 * │   反而压得住 antd 的 a:hover，所以老页面链接 hover 时保持自己的颜色。      │
 * │   新项目去掉 scoped 后页面 CSS 只有 (0,1,0)，如果这里写了 a:hover，        │
 * │   带 class 的链接一 hover 就会掉色 —— 和老页面不一致。                    │
 * │                                                                          │
 * │   所以这里只留特异度 (0,0,1) 的裸 a，让任何页面 class 都能覆盖它，         │
 * │   并且不提供任何 hover 颜色规则。                                          │
 * │                                                                          │
 * │ 这是「去掉 scoped 导致特异度整体下移」的典型后果，                         │
 * │ 改这一块之前请先想清楚层叠关系。                                           │
 * └──────────────────────────────────────────────────────────────────────────┘ */

a {
  color: inherit;
}


/* ┌──────────────────────────────────────────────────────────────────────────┐
 * │ 第四块：工具类                                                            │
 * └──────────────────────────────────────────────────────────────────────────┘ */

/* 视觉上隐藏但搜索引擎和屏幕阅读器能读到。
 *
 * ⚠️ 使用边界：只能放「图片里确实存在的文字」的转写，等同于 alt 的作用。
 *    绝对不能放页面上不存在的关键词 —— 那是作弊，会被降权。
 *    用途举例：首屏 banner 是 CSS 背景图时，把图中的标题文字用它补出来。
 */
.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Tab 内容用它隐藏，而不是像老项目那样用 v-if 不渲染。
 * 区别：v-if 的内容不在 HTML 源码里，搜索引擎抓不到；
 *       这个只是视觉隐藏，内容在源码里，能被索引。 */
[data-tab-panel][hidden] { display: none !important; }

/* 键盘可访问性：老项目很多可点元素是 <a> 不带 href 或 <div>，
 * 没有焦点样式。补一个不影响鼠标用户的焦点圈。 */
:focus-visible {
  outline: 2px solid #db2d43;
  outline-offset: 2px;
}
