/* ============================================================================
   ui-apply.css — 梦一城 · 外观收编层（让改造"看得见"）
   ----------------------------------------------------------------------------
   背景：上一轮只发了 .ui-* 组件类，页面里一个都没用到 ⇒ 视觉零变化。
   本层反过来做：**直接作用于页面已有的元素**，把提示词库里的几何与动效口径套上去。

   安全边界（严格遵守，否则会毁页面）：
     ✅ 只允许改：圆角 / 阴影 / 过渡 / 字重 / 聚焦环 / 滚动条 / 选中色 / hover 抬升
     ❌ 绝不碰  ：背景色 / 文字色 / 内外边距 / 宽高 / display / position / 布局
     —— 上面那批属性不改变盒子尺寸，所以"变了样子但不会错位"。

   特异性：页面自己的类选择器比元素选择器高，所以关键属性用 !important 兜底；
           但只对清单里的"安全属性"用，颜色类一律不抢。

   只给 A 档站加载；gi / pet / petshop 用 SAFE 档，不加载本文件。
   ========================================================================== */

/* ── ① 按钮：圆角 10px + 字重 600 + 悬浮抬升 + 按下回弹 ───────────────── */
button,
input[type="submit"], input[type="button"], input[type="reset"],
.btn, .button, [role="button"] {
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition:
    transform 150ms var(--ui-e-out, cubic-bezier(.2, .8, .2, 1)),
    box-shadow 250ms var(--ui-e-out2, cubic-bezier(.2, .8, .2, 1)),
    filter 150ms ease,
    background-color 150ms ease !important;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) {
  button:hover, .btn:hover, .button:hover, [role="button"]:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .14) !important;
  }
}
button:active:not(:disabled):not([disabled]),
.btn:active:not(:disabled):not([disabled]),
[role="button"]:active {
  transform: scale(.97) !important;
  filter: brightness(.94) !important;
  box-shadow: none !important;
}
button:disabled, button[disabled], .btn:disabled {
  opacity: .5;
  transform: none !important;
  box-shadow: none !important;
}

/* ── ② 输入框：圆角 8px + 聚焦主色环（最直观的一处变化）───────────────── */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"])
     :not([type="button"]):not([type="reset"]):not([type="range"]):not([type="color"]):not([type="file"]),
textarea, select {
  border-radius: 8px !important;
  transition: border-color 200ms ease, box-shadow 200ms ease !important;
}
input:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: var(--ui-primary, #165DFF) !important;
  box-shadow: 0 0 0 3px var(--ui-primary-ring, rgba(22, 93, 255, .14)) !important;
}

/* ── ③ 卡片：圆角 14 + 大厂阴影 + 悬浮抬升 4px ─────────────────────────── */
div[class*="card"], section[class*="card"], li[class*="card"],
div[class*="panel"], section[class*="panel"] {
  border-radius: 14px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .06) !important;
  transition:
    transform 250ms var(--ui-e-out2, cubic-bezier(.2, .8, .2, 1)),
    box-shadow 250ms var(--ui-e-out2, cubic-bezier(.2, .8, .2, 1)) !important;
}
@media (hover: hover) {
  div[class*="card"]:hover, section[class*="card"]:hover, li[class*="card"]:hover,
  div[class*="panel"]:hover, section[class*="panel"]:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .10) !important;
  }
}

/* ── ④ 表格：表头加粗、行悬浮高亮 ─────────────────────────────────────── */
table th { font-weight: 600 !important; }
table td, table th { transition: background-color 150ms ease; }
@media (hover: hover) {
  table tbody tr:hover > td {
    background-color: var(--ui-primary-light, #E8F3FF) !important;
  }
}

/* ── ⑤ 链接：悬浮转主色 ───────────────────────────────────────────────── */
a { transition: color 150ms ease, opacity 150ms ease; }
@media (hover: hover) {
  a:hover { color: var(--ui-primary, #165DFF); }
}

/* ── ⑥ 选中文字 + 滚动条（整站质感，一眼能看出来）────────────────────── */
::selection {
  background: var(--ui-primary, #165DFF) !important;
  color: #fff !important;
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(29, 33, 41, .18) !important;
  border-radius: 999px !important;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: var(--ui-primary, #165DFF) !important; }

/* ── ⑦ 键盘焦点环统一（无障碍净增益）────────────────────────────────── */
button:focus-visible, a:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--ui-primary, #165DFF) !important;
  outline-offset: 2px !important;
}

/* ── ⑧ 尊重系统"减少动效" ─────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  button:hover, .btn:hover, [role="button"]:hover,
  div[class*="card"]:hover, section[class*="card"]:hover,
  div[class*="panel"]:hover {
    transform: none !important;
  }
  button:active, .btn:active { transform: none !important; }
}
