/*
 * 站长定的新设计，覆盖旧版样式（2026-10-07 起）。
 *
 * 旧版的 CSS（src/assets/*.css）是原样复制、一个字不改的；和旧版有意不同的界面改动都写在这个文件里，
 * 在旧版主题（theme.css）之后加载（lib/assets.ts 的 siteStylesheets，单独一个样式文件；选择器不比旧版弱，后加载的生效）。
 * 只用旧版已有的设计令牌（--pd-*）；半透明叠加色、投影里的颜色照旧版的写法直接写（旧版令牌表开头约定不纳入令牌）。
 * 深色模式跟着 body.theme-pd-dark 的令牌自动换，这里没有要单独写深色的地方。
 *
 * 改动一：天气小图标从横幅右上角挪进首页欢迎卡，放在标题那一行的右边（components/home/MemberCards.tsx）。
 * 改动二：登录用户的头像（账户菜单）从菜单栏最右挪到横幅右上角，就是原来天气图标的位置（components/SiteHeader.tsx）。
 * 改动三：菜单栏去掉头像格子（components/NavBar.tsx）。不用另写样式：登录用户的菜单栏和游客的一样，
 *         版块按钮照旧 75px 一格，「更多」收纳照旧按菜单的实际宽度量，右端不留头像的空位。
 * 改动四（站长 2026-10-07 下午）：首页右栏两个按钮换颜色：游客「来网鱼冒个泡」卡的主按钮换成绿色，彩票卡的「查看彩票」换成彩票红。
 * 改动五（站长 2026-10-07 晚上）：官方角色 CleanIP（127，新版才有）的名字用绿色，别的 AI 照旧紫色
 *         （user-display.ts 的 nameClass 给它 pd-name--ai pd-name--cleanip 两个 class）。
 * 改动六（站长 2026-10-07 晚上）：菜单栏的字重：没选中的 400，选中（当前页）的 600（旧版没选中是 500 / 600）。
 *         同一天「站务」版块挪进菜单栏（后台版块管理勾「显示在菜单栏」，数据改动，不在这里）。
 *
 * （搬迁阶段和旧版逐像素对比时，前三处两边都拿掉、第四处两边都换成新颜色；那套对比工具已删，见 AGENTS.md 开头。）
 */

/* ===== 改动一：首页欢迎卡里的天气小图标 ===== */

/* 图标格子 40px（和原来横幅上一样大，触屏好点），比标题那一行（20px × 1.25）高：上下用负外边距抵掉，
   标题行不会变高，图标和标题上下居中；右边抵掉图标两侧的空白，图标右缘和卡片内容的右缘对齐。
   卡片是白底（深色模式是深底），图标换成次要文字色、去掉横幅上用的文字阴影 */
body.theme-pd .pd-promo--member .pd-promo-text > .pd-weather {
  align-self: start;
  width: var(--pd-navbar-tool-size);
  height: var(--pd-navbar-tool-size);
  margin: calc((var(--pd-fs-lg) * var(--pd-lh-tight) - var(--pd-navbar-tool-size)) / 2)
    calc((var(--pd-icon-lg) - var(--pd-navbar-tool-size)) / 2)
    calc((var(--pd-fs-lg) * var(--pd-lh-tight) - var(--pd-navbar-tool-size)) / 2) 0;
  color: var(--pd-color-text-secondary);
  font-size: var(--pd-icon-lg);
  text-shadow: none;
  border-radius: var(--pd-radius-sm);
}
body.theme-pd .pd-promo--member .pd-promo-text > .pd-weather:focus-visible {
  outline: var(--pd-tab-indicator) solid var(--pd-color-primary);
  outline-offset: calc(var(--pd-tab-indicator) * -1);
}
/* 悬浮 / 聚焦弹出的日期和天气：旧版是浮在图标左边的白字，卡片里会盖住标题、超出卡片被裁掉，
   改成图标正下方、右对齐的小提示框（样子同站内的时间提示 .pd-tooltip） */
body.theme-pd .pd-promo--member .pd-promo-text > .pd-weather .pd-weather-pop {
  top: 100%;
  right: 0;
  z-index: 1;
  margin: 0;
  padding: var(--pd-space-1) var(--pd-space-2);
  color: var(--pd-color-on-primary);
  font-size: var(--pd-fs-xs);
  background: var(--pd-color-tooltip-bg);
  border-radius: var(--pd-radius-sm);
  box-shadow: var(--pd-shadow-2);
  transform: translateY(calc(var(--pd-space-1) / -2));
}
body.theme-pd .pd-promo--member .pd-promo-text > .pd-weather:is(:hover, :focus) .pd-weather-pop {
  transform: none;
}
/* 卡片里地方够，手机上也显示日期（旧版横幅上窄屏只显示天气） */
body.theme-pd .pd-promo--member .pd-promo-text > .pd-weather .pd-weather-date {
  display: block;
}
/* 有天气时标题和天气排成一行：标题在第一行左边、天气在第一行右边，其余（提示语）从第二行起占满整行；
   没拿到天气时（图标隐藏）还是旧版的排法 */
body.theme-pd .pd-promo--member .pd-promo-text:has(> .pd-weather:not([hidden])) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: var(--pd-space-1);
}
body.theme-pd .pd-promo--member .pd-promo-text:has(> .pd-weather:not([hidden])) > h2 {
  grid-area: 1 / 1;
}
body.theme-pd .pd-promo--member .pd-promo-text:has(> .pd-weather:not([hidden])) > .pd-weather {
  grid-area: 1 / 2;
}
body.theme-pd .pd-promo--member .pd-promo-text:has(> .pd-weather:not([hidden])) > :not(h2, .pd-weather) {
  grid-column: 1 / -1;
}

/* ===== 改动二：横幅右上角的头像（账户菜单） ===== */

/* 位置、大小用旧版现成的：横幅右上角的工具区（.pd-banner-account-tools，原来放天气），头像格子 40px（--pd-navbar-tool-size）、
   里面 32px 的圆形头像（旧版 .pd-account-trigger 本来的样子）。
   横幅图有亮有暗：头像加一圈 2px 浅色描边和一层投影（投影同旧版横幅上天气图标的文字阴影），两种图上都看得清 */
body.theme-pd .pd-account-menu--banner .pd-account-trigger {
  transition: background-color 0.15s ease;
}
body.theme-pd .pd-account-menu--banner .pd-account-trigger img {
  box-shadow:
    0 0 0 var(--pd-tab-indicator) var(--pd-color-on-dark),
    0 1px 3px rgba(0, 0, 0, 0.45);
  transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}
/* 未读数贴在圆形头像的右上方（以头像图的边角为准，不是 40px 格子的边角）：在圆心到右上角 45° 的位置，
   不会伸出横幅，手机上头像贴近横幅顶边时也不会被切掉 */
body.theme-pd .pd-account-menu--banner .pd-account-unread-badge {
  top: calc((var(--pd-navbar-tool-size) - var(--pd-account-avatar-size)) / 2);
  right: calc((var(--pd-navbar-tool-size) - var(--pd-account-avatar-size)) / 2);
}
/* 悬浮 / 展开：衬一层半透明深色圆底（同旧版横幅上的图标按钮 .pd-banner-search:hover），头像轻微放大 / 展开时轻微缩小 */
body.theme-pd .pd-account-menu--banner .pd-account-trigger:hover,
body.theme-pd .pd-account-menu--banner .pd-account-trigger[aria-expanded="true"] {
  background: rgba(17, 24, 39, 0.35);
}
body.theme-pd .pd-account-menu--banner .pd-account-trigger:hover img {
  transform: scale(1.04);
}
body.theme-pd .pd-account-menu--banner .pd-account-trigger[aria-expanded="true"] img {
  transform: scale(0.96);
}
/* 手机（横幅矮、logo 小：顶边距 8px、高 32px）：头像和 logo 上下对齐、离右边和 logo 离左边一样远
   （旧版手机端右上角的图标也是这样和 logo 水平中线对齐）；电脑上照旧在原来天气图标的位置 */
@media (width < 640px) {
  .pd-topbar-responsive > .pd-banner .pd-banner-account-tools:has(> .pd-account-menu--banner) {
    top: calc(var(--pd-space-1) + (var(--pd-btn-h-sm) - var(--pd-navbar-tool-size)) / 2);
    right: calc(var(--pd-space-3) - (var(--pd-navbar-tool-size) - var(--pd-account-avatar-size)) / 2);
  }
}
@media (prefers-reduced-motion: reduce) {
  body.theme-pd .pd-account-menu--banner .pd-account-trigger,
  body.theme-pd .pd-account-menu--banner .pd-account-trigger img {
    transition: none;
    transform: none;
  }
}

/* ===== 改动四：首页右栏两个按钮换颜色 ===== */

/* 全站的实体按钮是同一套（旧版 main.css 的「W06」按钮，颜色由 --pd-w06-fill 定，悬停、按下、深色都跟着它走），
   这里只换两个按钮的主色，用的都是旧版已有的颜色令牌，写法照旧版的绿色 / 红色按钮（.btn-success / .btn-danger 那两行）。 */

/* 游客「来网鱼冒个泡」卡的主按钮（注册关着时是「登录」，开着时是「注册」；旁边描边的那个不动）：蓝卡片上的蓝按钮看不清，换成按钮里现成的绿色 */
body.theme-pd .pd-promo:not(.pd-promo--member) .pd-promo-btn:not(.pd-promo-btn--ghost) {
  --pd-w06-fill: var(--pd-w06-green);
  --pd-w06-glow-color: color-mix(in srgb, var(--pd-w06-fill) 40%, #fff);
}

/* 彩票卡的「查看彩票」：换成号码球的彩票红（深色模式下 --pd-lotto-red 自己会变浅一点） */
body.theme-pd .pd-sidebar-art-card--lottery .pd-sidebar-card-btn {
  --pd-w06-fill: var(--pd-lotto-red);
  --pd-w06-glow-color: color-mix(in srgb, var(--pd-w06-fill) 40%, #fff);
}

/* ===== 改动五：CleanIP 的名字用绿色 ===== */

/* 选择器和旧版 AI 紫色那两条（main.css 的 .pd-name--ai，浅色、深色各一条）一样强，后加载的生效；绿色用成功色令牌，深色模式自动换成亮一点的绿 */
body.theme-pd :is(a, span, h1, strong, b).pd-name--cleanip,
body.theme-pd-dark :is(a, span, h1, strong, b).pd-name--cleanip {
  /* biome-ignore lint/complexity/noImportantStyles: 旧版的 AI 紫色就是 !important，只有 !important 才压得过 */
  color: var(--pd-color-success) !important;
}

/* ===== 改动六：菜单栏的字重 ===== */

/* 旧版：横幅上的菜单（.pd-topbar-hasbg）没选中 500、选中 600，没有横幅时一律 600。改成没选中 400、选中 600，选中的一眼看得出来。
   选择器和旧版那几条一样强，后加载的生效；span、i 跟着链接走（旧版横幅上那条把 span、i 也单独写了 500） */
body.theme-pd .pd-navbar .pd-menu-link,
body.theme-pd .pd-topbar-hasbg .pd-navbar .pd-menu-link,
body.theme-pd .pd-topbar-hasbg .pd-navbar .pd-menu-link span,
body.theme-pd .pd-topbar-hasbg .pd-navbar .pd-menu-link i {
  font-weight: var(--pd-fw-regular);
}
body.theme-pd .pd-navbar .pd-menu-link.active,
body.theme-pd .pd-topbar-hasbg .pd-navbar .pd-menu-link.active,
body.theme-pd .pd-topbar-hasbg .pd-navbar .pd-menu-link.active span,
body.theme-pd .pd-topbar-hasbg .pd-navbar .pd-menu-link.active i {
  font-weight: var(--pd-fw-semibold);
}