/**
 * 咸鱼单机 品牌交互色 — 与 Electron 客户端 (src/src/styles/global.css) 保持一致
 *
 * 色值规范（改动请两端同步）：
 *   主色      #f58907
 *   渐变      linear-gradient(135deg, #f58907 0%, #e67d00 100%)
 *   橙色阴影  rgba(245, 137, 7, .35)
 *   hover 底  #f5f5f5（浅色）/ #2f2f2f（深色）
 *
 * 加载顺序在 app.css / dark.css 之后，靠顺序覆盖，避免 !important。
 */

:root {
    --xy-primary: #f58907;
    --xy-primary-gradient: linear-gradient(135deg, #f58907 0%, #e67d00 100%);
    --xy-primary-shadow: rgba(245, 137, 7, .35);
    --xy-bg-hover: #f5f5f5;
    --xy-bg-hover-dark: #2f2f2f;
}

/* ========== 顶部导航（桌面端 .nav-list 顶级菜单） ========== */

/* 顶级菜单项改为胶囊形态：行高 40px + 上下 20px 外边距，仍占满 80px 导航条 */
.navbar .nav-list>.menu-item>a {
    line-height: 40px;
    margin: 20px 0;
    padding: 0 10px;
    border-radius: 10px;
    -webkit-transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
    -o-transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

/* hover 态：浅灰底（对应客户端 --bg-hover） */
.navbar .nav-list>.menu-item>a:hover {
    background-color: var(--xy-bg-hover);
    color: #333;
}

/* 当前页：橙色渐变胶囊 + 白字 + 橙色阴影（对应客户端 .nav-item.active） */
.navbar .nav-list>.menu-item.current-menu-item>a,
.navbar .nav-list>.menu-item.current-menu-ancestor>a,
.navbar .nav-list>.menu-item.current-menu-parent>a,
.navbar .nav-list>.menu-item.current_page_item>a,
.navbar .nav-list>.menu-item.current_page_parent>a {
    background: var(--xy-primary-gradient);
    color: #fff;
    -webkit-box-shadow: 0 2px 8px var(--xy-primary-shadow);
    box-shadow: 0 2px 8px var(--xy-primary-shadow);
}

.navbar .nav-list>.menu-item.current-menu-item>a:hover,
.navbar .nav-list>.menu-item.current-menu-ancestor>a:hover,
.navbar .nav-list>.menu-item.current-menu-parent>a:hover,
.navbar .nav-list>.menu-item.current_page_item>a:hover,
.navbar .nav-list>.menu-item.current_page_parent>a:hover {
    color: #fff;
}

/* 当前页胶囊内的下拉箭头也转为白色 */
.navbar .nav-list>.menu-item.current-menu-item.menu-item-has-children>a:after,
.navbar .nav-list>.menu-item.current-menu-ancestor.menu-item-has-children>a:after,
.navbar .nav-list>.menu-item.current-menu-parent.menu-item-has-children>a:after {
    color: rgba(255, 255, 255, .8);
}

/* 透明头部模式（navbar-transition）：浅灰底不适用，改用半透明白 */
.navbar-transition .navbar .nav-list>.menu-item>a:hover {
    background-color: rgba(255, 255, 255, .15);
    color: #fff;
}

/* 下拉子菜单项 hover：文字变橙 */
.navbar .sub-menu .menu-item>a:hover {
    color: var(--xy-primary);
}

/* ========== 顶部导航（暗黑模式） ========== */

.dark-open .navbar .nav-list>.menu-item>a:hover {
    background-color: var(--xy-bg-hover-dark);
    color: hsl(0deg 0% 100% / 90%);
}

.dark-open .navbar .nav-list>.menu-item.current-menu-item>a,
.dark-open .navbar .nav-list>.menu-item.current-menu-ancestor>a,
.dark-open .navbar .nav-list>.menu-item.current-menu-parent>a,
.dark-open .navbar .nav-list>.menu-item.current_page_item>a,
.dark-open .navbar .nav-list>.menu-item.current_page_parent>a {
    background: var(--xy-primary-gradient);
    color: #fff;
}

.dark-open .navbar .sub-menu .menu-item>a:hover {
    color: var(--xy-primary);
}

/* ========== 移动端菜单（slicknav） ========== */

.slicknav_menu .slicknav_nav li.current-menu-item a,
.dark-open .slicknav_menu .slicknav_nav li.current-menu-item a {
    color: var(--xy-primary);
}

/* ========== 导航菜单自定义 SVG 图标 ==========
 * 用法：后台「外观→菜单」给菜单项加 CSS 类 xy-icon-steam / xy-icon-switch，
 * 并清空该菜单项原来的 Font Awesome 图标。
 * 新增图标：SVG 放 assets/images/nav/，照抄 background-image + mask 两条规则即可。
 *
 * 平时用 background-image 显示 SVG 原本的品牌色；
 * 选中的橙色胶囊内（白字）切换为 mask + currentColor 的白色剪影，保证可读性。
 */

.navbar .nav-list>.menu-item.xy-icon-steam>a::before,
.navbar .nav-list>.menu-item.xy-icon-switch>a::before,
.navbar .nav-list>.menu-item.xy-icon-dow>a::before,
.slicknav_nav li.xy-icon-steam>a::before,
.slicknav_nav li.xy-icon-switch>a::before,
.slicknav_nav li.xy-icon-dow>a::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 6px;
    vertical-align: -2px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.navbar .nav-list>.menu-item.xy-icon-steam>a::before,
.slicknav_nav li.xy-icon-steam>a::before {
    background-image: url(../images/nav/steam.svg);
}

.navbar .nav-list>.menu-item.xy-icon-switch>a::before,
.slicknav_nav li.xy-icon-switch>a::before {
    background-image: url(../images/nav/nintendo.svg);
    /* 视觉补偿：Steam 是实心圆盘、Switch 是两根细条，同尺寸下 Switch 显小，放大 2px 找平 */
    width: 18px;
    height: 18px;
    vertical-align: -3px;
}

.navbar .nav-list>.menu-item.xy-icon-dow>a::before,
.slicknav_nav li.xy-icon-dow>a::before {
    background-image: url(../images/nav/dow.svg);
}

/* 当前页橙色胶囊内：改为白色剪影（background-image 换成纯色 + mask 取形状） */
.navbar .nav-list>.menu-item.xy-icon-steam.current-menu-item>a::before,
.navbar .nav-list>.menu-item.xy-icon-steam.current-menu-ancestor>a::before,
.navbar .nav-list>.menu-item.xy-icon-steam.current-menu-parent>a::before,
.navbar .nav-list>.menu-item.xy-icon-steam.current_page_item>a::before,
.navbar .nav-list>.menu-item.xy-icon-steam.current_page_parent>a::before {
    background-image: none;
    background-color: currentColor;
    -webkit-mask-image: url(../images/nav/steam.svg);
    mask-image: url(../images/nav/steam.svg);
}

.navbar .nav-list>.menu-item.xy-icon-switch.current-menu-item>a::before,
.navbar .nav-list>.menu-item.xy-icon-switch.current-menu-ancestor>a::before,
.navbar .nav-list>.menu-item.xy-icon-switch.current-menu-parent>a::before,
.navbar .nav-list>.menu-item.xy-icon-switch.current_page_item>a::before,
.navbar .nav-list>.menu-item.xy-icon-switch.current_page_parent>a::before {
    background-image: none;
    background-color: currentColor;
    -webkit-mask-image: url(../images/nav/nintendo.svg);
    mask-image: url(../images/nav/nintendo.svg);
}

.navbar .nav-list>.menu-item.xy-icon-dow.current-menu-item>a::before,
.navbar .nav-list>.menu-item.xy-icon-dow.current-menu-ancestor>a::before,
.navbar .nav-list>.menu-item.xy-icon-dow.current-menu-parent>a::before,
.navbar .nav-list>.menu-item.xy-icon-dow.current_page_item>a::before,
.navbar .nav-list>.menu-item.xy-icon-dow.current_page_parent>a::before {
    background-image: none;
    background-color: currentColor;
    -webkit-mask-image: url(../images/nav/dow.svg);
    mask-image: url(../images/nav/dow.svg);
}

/* ========== 文章/游戏卡片标题 hover 变橙（对应客户端 GameCard） ========== */

.posts-wrapper .post-grid .entry-title a,
.posts-wrapper .post-list .entry-title a,
.related-posts .post-grid .entry-title a,
.related-posts .post-list .entry-title a,
.ripro_v2-widget-post .post-list .entry-title a {
    -webkit-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease;
}

/* 悬停整张卡片即变色，与客户端行为一致 */
.posts-wrapper .post-grid:hover .entry-title a,
.posts-wrapper .post-list:hover .entry-title a,
.related-posts .post-grid:hover .entry-title a,
.related-posts .post-list:hover .entry-title a,
.ripro_v2-widget-post .post-list:hover .entry-title a,
.dark-open .posts-wrapper .post-grid:hover .entry-title a,
.dark-open .posts-wrapper .post-list:hover .entry-title a {
    color: var(--xy-primary);
}

/* CMS 布局中标题叠在封面图上的白字卡片保持白色，不参与变橙 */
.post-cms .cms_grid_box:hover .entry-title a {
    color: #fff;
}
