/**
 * 风格7「折叠双栏 Mega Menu」—— entrava-child
 *
 * 依赖父主题已有机制（无需重复实现）：
 * - 桌面一级展开：.header .dropdown:hover > .dropdown-menu（父主题 style.css）
 * - 移动一级展开：父主题 JS 给 li.dropdown 注入 .m-dropdown 箭头，点击 slideToggle；
 *   .menu-mega 自带 dropdown-menu 类，直接受该机制控制
 * - 移动二级展开：父主题箭头点击切换 li 上的 .dropdown-open 类，本文件依此类显隐面板
 *
 * 选择器说明：父主题存在 `.header .wpcom-adv-menu>.dropdown.menu-item-style .dropdown{display:inline-block}`
 * （会把左列 li 变成行内块），故左列项等关键规则使用完整路径选择器提升优先级。
 */

/* ============ 变量 ============ */
.menu-item-style-6 {
    --mega-nav-width: 232px;
    --mega-panel-width: 600px;
}

/* 开启大图预览（一级项开关）：面板加宽，多出的宽度作为右侧通高大图导轨 */
.menu-item-style-6.mega-preview-on {
    --mega-panel-width: 780px;
    --mega-preview-width: 170px;
}

/* ============ 风格8「精简多栏」变量（容器收拢，不拉满视口） ============ */
.menu-item-style-7 {
    --variant-cols: 2;
    --variant-width: 560px;
}
.menu-item-style-7.variant-cols-3 {
    --variant-cols: 3;
    --variant-width: 780px;
}

/* ============ 下拉小三角定位 ============ */
/* 父主题 .header .nav>li>.dropdown-menu:after 的定位式为
   left: calc(12px - var(--dropdown-menu-left))，其前提是「容器比一级菜单项左缘错开 -28px」，
   于是三角实际落在菜单文字起点右侧 12px 处。
   本主题两种 mega 风格容器为 left:0（与菜单项左缘对齐），该公式在容器内的落点变成左侧 40px，
   同样能避开面板左上角圆角 —— 因此风格7 不再覆盖，直接沿用父主题计算值。
   注意：父主题 main.js 只对含 .menu-item-wrap 的原生风格写 --dropdown-menu-left，
   本主题两种风格无该类，变量恒为 -28px，故该公式结果稳定为 40px。 */

/* ============ 一级项「图标/图片」尺寸约束 ============ */
/* 后台一级菜单项的「图标/图片」字段若选了图片，父主题对其没有任何尺寸限制
   （仅有 .nav>li>a>img{max-width:none}），原图会直接撑破头部。
   这里按导航图标尺寸收敛为 24px，只作用于本子主题新增的两种 mega 风格。 */
.header .wpcom-adv-menu > .dropdown.menu-item-style-6 > a > img,
.header .wpcom-adv-menu > .dropdown.menu-item-style-7 > a > img {
    width: 24px;
    height: 24px;
    max-width: 24px;
    max-height: 24px;
    object-fit: contain;
    vertical-align: middle;
    margin-right: 4px;
    border-radius: 3px;
}

/* ============ 桌面端：双栏布局 ============ */
@media (min-width: 1025px) {
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 > .dropdown-menu.menu-mega {
        min-width: calc(var(--mega-nav-width) + var(--mega-panel-width) + 24px);
        max-width: calc(100vw - 40px);
        padding: 0;
        left: 0;
        overflow: visible;
    }

    /* 顶部小三角：不再覆盖 left，直接沿用父主题 .header .nav>li>.dropdown-menu:after
       的 calc(12px - var(--dropdown-menu-left))（本风格容器 left:0，实际落点为面板左侧 40px），
       实测三角不压面板左上角圆角、与一级菜单文字对齐。 */

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-inner {
        position: relative;
        display: flex;
        min-height: 320px;
        transition: min-height .25s ease;
    }

    /* ---- 左列 ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-nav {
        position: relative;
        z-index: 2;
        flex: 0 0 var(--mega-nav-width);
        width: var(--mega-nav-width);
        margin: 0;
        padding: 12px 0;
        list-style: none;
        background: #fafafa;
        border-right: 1px solid #f0f0f0;
        border-radius: var(--theme-border-radius-xl, 8px) 0 0 var(--theme-border-radius-xl, 8px);
    }

    /* 左列顶部目录标题（一级项 catalog_title，留空则不渲染） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-catalog-title {
        display: block;
        margin: 0 0 4px;
        padding: 12px 20px;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.4;
        color: var(--theme-black-color, #161616);
        border-bottom: 1px solid #ececec;
    }

    /* 覆盖父主题 .dropdown{display:inline-block}，恢复左列纵向排列；
       position:static 让右列面板的定位基准落到 .menu-mega-inner 而非 li 本身
       （li 带 dropdown 类，默认 position:relative，会把面板压成 li 的高度导致内部滚动） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-nav > .mega-nav-item {
        display: block;
        position: static;
        margin: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-link {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 20px;
        font-size: 14px;
        line-height: 1.45;
        color: #333;
        border-left: 3px solid transparent;
        transition: background-color .2s, color .2s, border-color .2s;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-link:hover,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.is-active > .mega-nav-link,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.dropdown-open > .mega-nav-link {
        background: #fff;
        border-left-color: var(--theme-color, #f60);
        color: var(--theme-color, #f60);
        font-weight: 600;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.is-current > .mega-nav-link {
        color: var(--theme-color, #f60);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 22px;
        height: 22px;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-icon img,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-icon svg {
        width: 100%;
        height: auto;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-title {
        flex: 1 1 auto;
    }

    /* ---- 右列面板（absolute 贴左列右侧，同位置堆叠，仅显示激活项） ----
       高度策略：不设 bottom/overflow，面板按内容自然增高（显示全部产品，不出现内部滚动条）；
       面板为绝对定位、不参与父级高度计算，故由 mega-menu.js 将 .menu-mega-inner 的
       min-height 同步为当前面板高度，使白色容器完整包住面板。 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel {
        position: absolute;
        top: 0;
        left: var(--mega-nav-width);
        width: var(--mega-panel-width);
        height: auto;
        margin: 0;
        padding: 28px 32px;
        list-style: none;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 14px 18px;
        align-content: start;
        background: #fff;
        border-radius: 0 var(--theme-border-radius-xl, 8px) var(--theme-border-radius-xl, 8px) 0;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(10px);
        transition: opacity .25s ease, transform .25s ease, visibility .25s;
    }

    /* 显示规则：hover 优先；未 hover 时显示 is-active（键盘/初始态） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.is-active > .mega-panel,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item:hover > .mega-panel,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.dropdown-open > .mega-panel {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(0);
    }

    /* 鼠标处于左列时，隐藏 is-active 的面板，只保留 hover 项的，避免重叠 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-nav:hover .mega-nav-item.is-active:not(:hover) > .mega-panel {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    /* ---- 面板内容 ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-head {
        grid-column: 1 / -1;
        margin: 0 0 6px;
        list-style: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-title {
        margin: 0 0 6px;
        font-size: 20px;
        font-weight: 600;
        color: var(--theme-black-color, #161616);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-desc {
        margin: 0;
        font-size: 13px;
        line-height: 1.6;
        color: #666;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-item {
        list-style: none;
        margin: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card {
        display: flex;
        align-items: center;
        gap: 10px;
        height: 100%;
        padding: 10px 12px;
        border-radius: var(--theme-border-radius-m, 4px);
        border: 1px solid transparent;
        transition: border-color .2s, box-shadow .2s, transform .2s;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card:hover {
        border-color: #eee;
        box-shadow: 0 4px 14px rgba(0, 0, 0, .06);
        transform: translateY(-2px);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-thumb {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 44px;
        height: 44px;
        border-radius: var(--theme-border-radius-m, 4px);
        background: #f5f5f5;
        overflow: hidden;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-thumb img,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-thumb svg {
        max-width: 70%;
        max-height: 70%;
        height: auto;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-name {
        flex: 1 1 auto;
        font-size: 14px;
        color: var(--theme-black-color, #161616);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card:hover .mega-card-name {
        color: var(--theme-color, #f60);
    }

    /* ---- CTA ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-foot {
        grid-column: 1 / -1;
        margin-top: 10px;
        list-style: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-more {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 14px;
        font-weight: 600;
        color: var(--theme-color, #f60);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-more:hover {
        color: var(--theme-hover, #e55c00);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-more .wpcom-icon {
        transition: transform .2s;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-more:hover .wpcom-icon {
        transform: translateX(3px);
    }

    /* ---- 大图预览：默认隐藏；一级项开启开关后显示为右侧通高导轨 ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-preview-item {
        display: none;
        list-style: none;
    }

    /* 开启态：面板右侧预留导轨空间，并保证最小高度使导轨有展示比例 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6.mega-preview-on .mega-panel {
        padding-right: calc(32px + var(--mega-preview-width) + 20px);
        min-height: 300px;
    }

    /* 导轨：绝对定位贴面板右侧，通高、圆角；上图（大图）+ 下文（产品名 + 引导箭头） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6.mega-preview-on .mega-panel-preview-item {
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 28px;
        right: 32px;
        bottom: 28px;
        width: var(--mega-preview-width);
        margin: 0;
        border-radius: var(--theme-border-radius-m, 4px);
        overflow: hidden;
        background: #f5f5f5;
        list-style: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-preview {
        flex: 1 1 auto;
        min-height: 0;
        width: 100%;
        background-repeat: no-repeat;
        background-position: center;
        /* contain：完整显示整张图不裁切（正方形/宽幅图会留浅色边，竖版产品图近乎满铺） */
        background-size: contain;
    }

    /* 导轨底部：产品名 + 引导箭头（名称由 JS 随悬停卡片联动更新） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-preview-caption {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 10px 12px;
        border-top: 1px solid rgba(0, 0, 0, .06);
        background: #fff;
        font-size: 13px;
        font-weight: 600;
        color: var(--theme-black-color, #161616);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-preview-name {
        flex: 1 1 auto;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-preview-arrow {
        flex: 0 0 auto;
        color: var(--theme-color, #f60);
    }

    /* ============ 风格8「精简多栏」：收拢容器 + 2/3 栏卡片 ============ */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 > .dropdown-menu.menu-variant {
        width: var(--variant-width);
        min-width: var(--variant-width);
        max-width: calc(100vw - 40px);
        padding: 0;
        left: 0;
        overflow: visible;
    }

    /* 顶部小三角：沿用父主题 .header .nav>li>.dropdown-menu:after 的白色三角；
       本风格容器 left:0，父主题公式落点为面板左侧 40px，
       实测「Resources」文字更宽，46px 视觉更居中，故单独微调。 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 > .dropdown-menu.menu-variant:after {
        left: 46px;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-inner {
        padding: 20px 24px;
    }

    /* ---- 卡片网格 ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-grid {
        display: grid;
        grid-template-columns: repeat(var(--variant-cols), minmax(0, 1fr));
        gap: 10px 14px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    /* 覆盖父主题 .dropdown{display:inline-block}，恢复网格块级排列 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-grid > .menu-variant-item {
        display: block;
        position: relative;
        margin: 0;
    }

    /* ---- 二级卡片 ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-link {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        height: 100%;
        padding: 12px 14px;
        border: 1px solid #f0f0f0;
        border-radius: var(--theme-border-radius-m, 4px);
        background: #fff;
        transition: border-color .2s, box-shadow .2s, transform .2s;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-link:hover,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-item.is-current .menu-variant-link {
        border-color: var(--theme-color, #f60);
        box-shadow: 0 4px 14px rgba(0, 0, 0, .06);
        transform: translateY(-2px);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 34px;
        height: 34px;
        border-radius: var(--theme-border-radius-m, 4px);
        background: hsla(var(--theme-color-hsl, 24, 100%, 50%), .08);
        color: var(--theme-color, #f60);
        font-size: 16px;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-icon img,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-icon svg {
        max-width: 60%;
        max-height: 60%;
        height: auto;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-text {
        flex: 1 1 auto;
        min-width: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-title {
        display: block;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.4;
        color: var(--theme-black-color, #161616);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-link:hover .menu-variant-title {
        color: var(--theme-color, #f60);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-desc {
        display: block;
        margin-top: 3px;
        font-size: 12px;
        line-height: 1.5;
        color: #888;
    }

    /* ---- 三级子列表（桌面常驻显示） ---- */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub {
        margin: 6px 0 0;
        padding: 0 0 0 44px; /* 与卡片标题对齐（图标宽 + gap） */
        list-style: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub-item {
        margin: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub-link {
        display: flex;
        flex-direction: column;
        gap: 1px;
        padding: 5px 8px;
        border-radius: var(--theme-border-radius-s, 2px);
        font-size: 13px;
        color: #555;
        transition: background-color .2s, color .2s;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub-link:hover {
        background: hsla(var(--theme-color-hsl, 24, 100%, 50%), .06);
        color: var(--theme-color, #f60);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub-desc {
        font-size: 11px;
        line-height: 1.4;
        color: #999;
    }
}

/* ============ 移动端（≤1024px）：降级为原生折叠列表 ============ */
@media (max-width: 1024px) {
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 > .dropdown-menu.menu-mega {
        min-width: 0;
        padding: 0;
        background: transparent;
        /* .menu-mega 自带 dropdown-menu 类：父主题抽屉规则已将其设为 position:relative;display:none，
           由一级 li 上的 .m-dropdown 箭头点击展开（父主题 JS 机制） */
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-inner {
        display: block;
        /* !important：桌面端 JS 会把面板高度写进内联 min-height，
           内联样式优先级高于样式表，移动端必须强制清零，否则列表下方留出大片空白 */
        min-height: 0 !important;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-nav {
        margin: 0;
        padding: 0;
        list-style: none;
        background: transparent;
        border: 0;
    }

    /* 移动端隐藏左列目录标题（标题信息在二级项文字上已体现，避免重复占位）
       必须用 !important：父主题合并样式里有
       .header .wpcom-adv-menu li{display:block!important;width:100%!important}
       会把本子主题所有 li 的 display 强制改回 block。 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-catalog-title {
        display: none !important;
    }

    /* 左列项：还原为原生菜单行样式 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .menu-mega-nav > .mega-nav-item {
        display: block;
        position: relative;
        margin: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-link {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 15px 20px;
        font-size: var(--header-font-size, 15px);
        line-height: 20px;
        color: var(--mobile-menu-color, #fff);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-link:hover,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.is-current > .mega-nav-link {
        color: var(--mobile-menu-active-color, #fff);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 18px;
        height: 18px;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-icon img,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-icon svg {
        width: 100%;
        height: auto;
    }

    /* 右列面板：静态堆叠，默认隐藏，.dropdown-open 时展开（父主题箭头点击切换） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel {
        position: relative;
        top: auto;
        bottom: auto;
        left: auto;
        width: auto;
        margin: 0;
        padding: 4px 0 10px 20px;
        list-style: none;
        display: none;
        grid-template-columns: repeat(2, 1fr);
        gap: 4px 10px;
        background: transparent;
        filter: var(--mobile-dropdown-menu-filter, brightness(1.05));
        opacity: 1;
        visibility: visible;
        transform: none;
        overflow: visible;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.dropdown-open > .mega-panel {
        display: grid;
    }

    /* 移动端不显示 is-active 默认面板（避免与手风琴展开态重叠） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.is-active > .mega-panel {
        display: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-item.dropdown-open.is-active > .mega-panel {
        display: grid;
    }

    /* 移动端隐藏面板标题行（面板标题 + 简介，标题信息在二级项上已体现）
       !important 原因同上；同时保留 grid-column 以防后续恢复显示时排版错乱。 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-head {
        display: none !important;
        grid-column: 1 / -1;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-title {
        margin: 0 0 2px;
        font-size: 13px;
        font-weight: 600;
        color: var(--mobile-menu-color, #fff);
        opacity: .85;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-desc {
        display: none; /* 移动端简介占空间，默认隐藏 */
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-item {
        list-style: none;
        margin: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 12px;
        font-size: 13px;
        color: var(--mobile-menu-color, #fff);
        border-radius: var(--theme-border-radius-m, 4px);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card:hover {
        background: hsla(var(--theme-color-hsl, 24, 100%, 50%), .04);
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-thumb {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 32px;
        height: 32px;
        border-radius: var(--theme-border-radius-m, 4px);
        background: rgba(255, 255, 255, .12);
        overflow: hidden;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-thumb img,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card-thumb svg {
        max-width: 70%;
        max-height: 70%;
        height: auto;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-foot {
        grid-column: 1 / -1;
        margin-top: 6px;
        list-style: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-more {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 10px 12px;
        font-size: 13px;
        font-weight: 600;
        color: var(--mobile-menu-active-color, #fff);
    }

    /* 移动端不展示大图预览（面板为静态堆叠，无导轨空间） */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel-preview-item {
        display: none !important;
    }

    /* ============ 风格8 移动端：单列堆叠 + 箭头手风琴 ============ */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 > .dropdown-menu.menu-variant {
        width: auto;
        min-width: 0;
        padding: 0;
        background: transparent;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-inner {
        padding: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-grid {
        display: block;
        gap: 0;
        /* 必须显式清零：桌面端的 padding:0 只写在 min-width 媒体查询内，
           移动端若不重置，会露出浏览器默认的 ul{padding-left:40px} 导致整列缩进 */
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-grid > .menu-variant-item {
        display: block;
        position: relative;
        margin: 0;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-link {
        display: flex;
        align-items: center;
        gap: 8px;
        height: auto;
        padding: 15px 20px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        color: var(--mobile-menu-color, #fff);
        font-size: var(--header-font-size, 15px);
        transform: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-link:hover,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-item.is-current .menu-variant-link {
        border: 0;
        box-shadow: none;
        color: var(--mobile-menu-active-color, #fff);
        transform: none;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-icon {
        width: 18px;
        height: 18px;
        background: transparent;
        color: inherit;
        font-size: 14px;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-title {
        font-size: inherit;
        font-weight: 400;
        color: inherit;
    }

    /* 移动端隐藏简介，保持列表紧凑 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-desc,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub-desc {
        display: none;
    }

    /* 三级子列表：默认隐藏，父主题箭头点击 .dropdown-open 后展开 */
    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub {
        display: none;
        margin: 0;
        /* 四级项相对二级项保留 20px 层级缩进（子项链接自身另有 12px 内边距） */
        padding: 0 0 8px 20px;
        list-style: none;
        filter: var(--mobile-dropdown-menu-filter, brightness(1.05));
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-item.dropdown-open > .menu-variant-sub {
        display: block;
    }

    .header .wpcom-adv-menu > .dropdown.menu-item-style-7 .menu-variant-sub-link {
        padding: 10px 12px;
        border-radius: 0;
        font-size: 13px;
        color: var(--mobile-menu-color, #fff);
    }
}

/* ============ 动效降级 ============ */
@media (prefers-reduced-motion: reduce) {
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-panel,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-card,
    .header .wpcom-adv-menu > .dropdown.menu-item-style-6 .mega-nav-link {
        transition: none;
    }
}