/* =====================================================================
   site-nav.css — 站点顶栏（UI 在 Shadow DOM 里，见 site-nav.js）的落地部分。

   管两件事：
   1) 给顶栏让位。顶栏是 fixed 吸顶的（和 iLovePDF 一样整条横贯页面），
      所以正文要空出 60px —— 用 padding-top 而不是 margin-top：
      margin-top 会把 body 整个推下去，滚动时顶栏底下先露出一条空隙。
   2) 把工具页最基础的那层观感 —— 字体、底色、正文色、链接色、控件圆角 ——
      统一到站点的设计语言上（设计令牌见 styles.css / pdf.css）。

   这张表在各工具页自己的 <style> 之后加载（注入点就在 </head> 前面），
   所以同优先级下这条赢。颜色一律写成 var(--token, 默认值)：
   自带一套 token 的页面保留自己的配色。
   ===================================================================== */

html { box-sizing: border-box; }
body { box-sizing: border-box; }

/* ---------- 1. 顶栏与让位 ---------- */
[data-site-nav] {
  position: fixed; left: 0; right: 0; top: 0;
  z-index: 2147483646;
  display: block;
}
body { padding-top: 60px !important; }

/* ---------- 2. 基础观感 ---------- */
/* 只写 background-color，不写 background 简写：
   有些工具页把底色写成「两层径向渐变 + var(--bg)」，用简写会连渐变一起抹掉。
   写成 background-color 则只覆盖那个纯色层，渐变照旧。 */
body {
  color: var(--text, #242424);
  font-family: var(--sans, -apple-system, BlinkMacSystemFont, "PingFang SC",
               "Noto Sans SC", "Hiragino Sans GB", "Microsoft YaHei",
               "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--text, #242424);
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.3;
}

a { color: var(--accent, #e5322d); }
a:hover { color: var(--accent-hover, #c62a26); }

/* 选中态统一成主色的淡版，跟导航的选中行是一套 */
::selection { background: var(--accent-soft, #fdeceb); }

hr { border: 0; border-top: 1px solid var(--border, #e8e9eb); }

/* ---------- 控件 ---------- */
/* 只统一「圆角、边框色、字体」这三样 —— 不改内边距和尺寸。
   137 个工具里不少把按钮排成紧凑的工具条，动内边距会把它们挤散。 */
button, input, select, textarea {
  font-family: inherit;
  color: inherit;
}
button { border-radius: var(--radius-sm, 8px); }

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select, textarea {
  border-radius: var(--radius-sm, 8px);
  border-color: var(--border-strong, #d4d6d9);
}
select { background-color: var(--bg-elevated, #fff); color: var(--text, #242424); }

::placeholder { color: var(--text-faint, #b3b3b3); }

/* 键盘焦点统一成主色圈。鼠标点不出现，不干扰点击态。 */
:focus-visible { outline: 2px solid var(--accent, #e5322d); outline-offset: 1px; }

/* ---------- 文本块 ---------- */
pre, code, kbd, samp { font-family: var(--mono, ui-monospace, SFMono-Regular,
  "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); }
pre { border-radius: var(--radius-sm, 8px); }
code { border-radius: 5px; }

table { border-collapse: collapse; }
th, td { border-color: var(--border, #e8e9eb); }
th { font-weight: 600; }

summary { cursor: pointer; }

/* ---------- 滚动条 ---------- */
/* 正文区用细滚动条，免得粗灰条把版式压得很难看 */
* { scrollbar-width: thin; scrollbar-color: var(--border-strong, #d4d6d9) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--border-strong, #d4d6d9);
  border: 3px solid transparent; border-radius: 99px;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: var(--text-faint, #b3b3b3); background-clip: content-box; }

/* ---------- 打印 ---------- */
@media print {
  body { padding-top: 0 !important; }
  [data-site-nav] { display: none !important; }
}
