/**
 * ATF CMF Focus Menu — 前端辅助 CSS
 *
 * .com 主题原生已支持 .mega-layout-3-grid / .mega-color-column / .mega-color-image-* / .mega-color-text
 * 但缺失 tech 站为 CMF 专项新增的：.mega-color-text-group / .mega-color-text--layout3-last / .mega-color-text-group--layout3-last-slot
 * 这里补齐这几条规则，保证渲染视觉与 tech 站一致。
 */

/* 布局三：文案区分组容器（一列内可以竖着放多个 二级+三级 组） */
.mega-layout-3-grid .mega-color-text-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    width: 100%;
    min-width: 0;
}

/* 同一列内多个分组之间的间距（不含最后一列的 --layout3-last） */
.mega-layout-3-grid .mega-color-text:not(.mega-color-text--layout3-last) > .mega-color-text-group + .mega-color-text-group {
    margin-top: 20px;
}

/* 整列所有二级都无三级 → 文案区垂直居中（不含 --layout3-last） */
.mega-layout-3-grid .mega-color-text:not(.mega-color-text--layout3-last):not(:has(.mega-third-list)) {
    justify-content: center;
    padding-bottom: 12px;
}

/* 列内单个"无子菜单"二级项：在剩余空间内垂直居中（不含 --layout3-last 的 slot） */
.mega-layout-3-grid .mega-color-text-group--no-children {
    justify-content: center;
    flex: 1 1 auto;
    min-height: 0;
}

/* 最后一列专用容器：多个二级标题竖排，各分组间距可独立调节 */
.mega-layout-3-grid .mega-color-text--layout3-last {
    --layout3-last-group-gap-first: 60px;
    --layout3-last-group-gap-rest: 100px;
    padding-bottom: 12px;
}

.mega-layout-3-grid .mega-color-text--layout3-last > .mega-color-text-group:first-child {
    margin-top: var(--layout3-last-group-gap-first);
}

/* 3 个及以上分组时，第一个取消上边距 */
.mega-layout-3-grid .mega-color-text--layout3-last > .mega-color-text-group:first-child:nth-last-child(n+3) {
    margin-top: 0;
}

.mega-layout-3-grid .mega-color-text--layout3-last > .mega-color-text-group:not(:first-child) {
    margin-top: var(--layout3-last-group-gap-rest);
}

.mega-layout-3-grid .mega-color-text--layout3-last .mega-color-text-group--layout3-last-slot {
    flex: 0 0 auto;
    min-height: 0;
}

/* 布局 3 首列：三级菜单两列网格（当项目较多时）
 * .com 主题原生已定义在 .mega-color-text 下（非 group 层），这里加一份加了 group 层的选择器
 * 保证 group 包裹后仍能生效
 */
.mega-layout-3-grid .mega-color-column:first-child .mega-color-text .mega-color-text-group .mega-third-list:not(.mega-third-list-columns--single):not(.mega-third-list-columns--dual) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 0;
    row-gap: 12px;
    width: 100%;
    align-self: stretch;
}

/* 无四级三级链接：垂直排布 + 居中（.com 原生也有类似规则，这里保底一份） */
.mega-layout-3-grid .mega-color-text .mega-color-text-group .mega-third-list:not(.mega-third-list-columns) {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 100%;
}