/**
 * 导航菜单对齐修复
 * 
 * 只修复菜单对齐问题，不改变头部的宽度和布局
 * 
 * @package Hui
 * @since 1.4.2
 * @updated 1.5.0 - 简化修复，移除不必要的样式
 * @updated 1.5.1 - 确保头部背景色在所有页面正确显示
 * @updated 1.5.2 - 修复发布页面头部导航没有贴合浏览器边缘的问题
 */

/* ============================================================================
 * 全局布局重置
 * 确保所有页面的头部导航贴合浏览器边缘
 * ============================================================================ */

html {
    margin: 0 !important;
    padding: 0 !important;
}

body {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    /* padding-bottom 由移动端底部导航控制，不强制重置 */
}

/* 确保页面容器没有额外的 margin/padding */
#page.xun-page {
    margin: 0 !important;
    padding: 0 !important;
}

/* 确保头部导航贴合浏览器边缘 */
header#masthead.xun-header {
    margin: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
}

/* ============================================================================
 * 确保头部背景色正确显示
 * 修复发布页面等特殊页面头部背景色问题
 * ============================================================================ */

header#masthead.xun-header {
    background: var(--color-bg-container, #fff) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* 深色模式 */
@media (prefers-color-scheme: dark) {
    :root:not(.light) header#masthead.xun-header {
        background: var(--color-bg-container, #1f1f1f) !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    }
}

.dark header#masthead.xun-header {
    background: var(--color-bg-container, #1f1f1f) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* 透明头部模式（滚动后） */
header#masthead.xun-header.xun-header--transparent.is-scrolled {
    background: var(--color-bg-container, #fff) !important;
}

@media (prefers-color-scheme: dark) {
    :root:not(.light) header#masthead.xun-header.xun-header--transparent.is-scrolled {
        background: var(--color-bg-container, #1f1f1f) !important;
    }
}

.dark header#masthead.xun-header.xun-header--transparent.is-scrolled {
    background: var(--color-bg-container, #1f1f1f) !important;
}

/* 透明头部模式（未滚动） */
header#masthead.xun-header.xun-header--transparent:not(.is-scrolled) {
    background: transparent !important;
    box-shadow: none !important;
}

/* ============================================================================
 * 左对齐模式
 * [Logo] [Nav] -------------------- [Actions]
 * ============================================================================ */

@media (min-width: 768px) {
    html body.xun-header-menu-align-left header#masthead.xun-header > .xun-header-inner {
        justify-content: flex-start !important;
    }
    
    html body.xun-header-menu-align-left header#masthead.xun-header > .xun-header-inner > .xun-logo {
        order: 0 !important;
    }
    
    html body.xun-header-menu-align-left header#masthead.xun-header > .xun-header-inner > .xun-nav {
        order: 1 !important;
        margin-left: 32px !important;
        margin-right: 0 !important;
    }
    
    html body.xun-header-menu-align-left header#masthead.xun-header > .xun-header-inner > .xun-header-actions {
        order: 2 !important;
        margin-left: auto !important;
        margin-right: 0 !important;
    }
}

/* ============================================================================
 * 居中模式
 * [Logo] -------- [Nav] -------- [Actions]
 * ============================================================================ */

@media (min-width: 768px) {
    html body.xun-header-menu-align-center header#masthead.xun-header > .xun-header-inner {
        justify-content: space-between !important;
        position: relative !important;
    }
    
    html body.xun-header-menu-align-center header#masthead.xun-header > .xun-header-inner > .xun-logo {
        order: 0 !important;
    }
    
    html body.xun-header-menu-align-center header#masthead.xun-header > .xun-header-inner > .xun-nav {
        order: 1 !important;
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        margin: 0 !important;
    }
    
    html body.xun-header-menu-align-center header#masthead.xun-header > .xun-header-inner > .xun-header-actions {
        order: 2 !important;
        margin-left: auto !important;
        margin-right: 0 !important;
    }
}

/* ============================================================================
 * 右对齐模式
 * [Logo] -------------------- [Actions] [Nav]
 * ============================================================================ */

@media (min-width: 768px) {
    html body.xun-header-menu-align-right header#masthead.xun-header > .xun-header-inner {
        justify-content: flex-start !important;
    }
    
    html body.xun-header-menu-align-right header#masthead.xun-header > .xun-header-inner > .xun-logo {
        order: 0 !important;
    }
    
    html body.xun-header-menu-align-right header#masthead.xun-header > .xun-header-inner > .xun-header-actions {
        order: 1 !important;
        margin-left: auto !important;
        margin-right: 0 !important;
    }
    
    html body.xun-header-menu-align-right header#masthead.xun-header > .xun-header-inner > .xun-nav {
        order: 2 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}