/* ============================================================================
   KP-SCROLLBAR —— 全站细滚动条（M-162）
   ----------------------------------------------------------------------------
   背景：本项目**没有全局 Layout**（322 个页面写 Layout = null，各自是完整
   HTML 文档），所以任何"全站生效"的样式都必须逐页引入。江哥反馈"表格滚动条
   和窗体滚动条太粗"—— 根因是只有改造过的 141 页引用了 kp-element-compact.css
   吃到细滚动条，其余 200+ 页仍是浏览器默认的 15px 左右。

   本文件由脚本注入到所有含 <head> 的 .cshtml（放在 </head> 之前，靠层叠顺序
   压过页面里其它 css）。口径改这里，一处生效全站。

   宽度口径（比改造期用的 8px 再收一档）：
     - 常规 6px：窗体 / div 滚动容器
     - 表格 6px：el-table 滚动区，与常规一致，避免表格内外粗细不一
     - 触屏 10px：太细手指拖不动
   hover / active 只加深颜色、**不改变宽度**，避免滚动时出现布局跳动。

   ⚠️ 不要在本文件里放任何布局 / 版式规则 —— 它会被注入到全部页面，
      一条无关规则就可能影响 352 个页面。版式请放 kp-element-compact.css。
   ========================================================================== */

/* ---------- 1. Chrome / Edge / Safari（WebKit 内核）---------- */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

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

::-webkit-scrollbar-thumb {
    background: rgba(144, 147, 153, 0.35);
    border-radius: 3px;
    /* 用透明边框 + content-box 裁剪，视觉上再细一圈，但保留 6px 的拖动热区 */
    border: 1px solid transparent;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(144, 147, 153, 0.6);
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:active {
    background: rgba(144, 147, 153, 0.8);
    background-clip: content-box;
}

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

/* ---------- 2. Element UI 表格滚动区 ----------
   el-table 的 .el-table__body-wrapper 是 overflow:auto 的滚动容器，
   走的是上面的全局规则；这里只额外保证它不会出现"横向 + 纵向"双滚动条时
   交界处的白块。 */
.el-table__body-wrapper::-webkit-scrollbar-corner,
.el-table__footer-wrapper::-webkit-scrollbar-corner {
    background: transparent;
}

/* ---------- 3. Firefox ----------
   Firefox 不认 ::-webkit-scrollbar，走标准属性。 */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(144, 147, 153, 0.45) transparent;
}

/* ---------- 4. 触屏放宽：太细拖不动 ---------- */
@media (pointer: coarse) {
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    ::-webkit-scrollbar-thumb {
        border-radius: 5px;
    }
}