/* ============================================================
   左侧边栏菜单的图标悬停效果
   - 图标保持主题中性色，不随 menu 配置里的 theme 彩色渐变
   - 悬停 / 键盘聚焦时轻微放大，与开往（外链图标）一致
   结构由主题菜单生成：
     <a class="ui-collection__item card-hover --spotlight" style="--item-theme:…;--item-grad:…">
   ============================================================ */

/* 去掉主题给菜单项图标上的彩色渐变：强制使用当前文字色 */
.menu .ui-collection__leading svg [fill='currentColor'],
.menu .ui-collection__leading svg[fill='currentColor'],
.menu .ui-collection__leading img {
  fill: currentColor;
  stroke: currentColor;
}

/* 主题会在 hover 时把 --item-theme / --item-grad 应用到图标，
   这里把图标容器颜色钉回菜单文字色，避免悬停变彩色 */
.menu a.ui-collection__item:hover .ui-collection__leading,
.menu a.ui-collection__item.is-active .ui-collection__leading,
.menu a.ui-collection__item:focus-visible .ui-collection__leading {
  color: inherit;
}

/* 悬停缩放，和开往保持一致 */
.menu a.ui-collection__item .ui-collection__leading img,
.menu a.ui-collection__item .ui-collection__leading svg {
  transition: transform 0.2s ease;
}

.menu a.ui-collection__item:hover .ui-collection__leading img,
.menu a.ui-collection__item:hover .ui-collection__leading svg,
.menu a.ui-collection__item:focus-visible .ui-collection__leading img,
.menu a.ui-collection__item:focus-visible .ui-collection__leading svg {
  transform: scale(1.06);
}

/* 开往图标保持清晰可见（主题默认给了 0.5 透明度） */
.menu a[href^="https://www.travellings.cn"] .ui-collection__leading img {
  opacity: 1;
}

/* 开往官方方形 logo 是黑色，深色主题下反色成白色 */
:root[data-theme="dark"] .menu a[href^="https://www.travellings.cn"] .ui-collection__leading img {
  filter: invert(1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .menu a[href^="https://www.travellings.cn"] .ui-collection__leading img {
    filter: invert(1);
  }
}