/**
 * 左右分离菜单布局（Flex 行布局）
 * 展开状态：sidebar 150px，子菜单 fixed left:150px width:150px
 * 收起状态：sidebar 50px， 子菜单 fixed left:50px  width:50px（只显示图标）
 * 两种状态逻辑一致，仅 CSS 数值不同
 */

/* ===== Flex 行布局 ===== */
html, body {
    height: 100%;
    /*overflow: hidden;*/
}

.wrapper {
    display: flex !important;
    flex-direction: row;
    height: 100%;
}

/* 侧边栏：脱离 AdminLTE 的 fixed 定位，作为 flex 左列 */
/* transform: none 覆盖 fastadmin.css 的 translate(0,0)——即使是恒等变换，
   transform 也会让 .main-sidebar 成为 position:fixed 子元素的包含块，
   导致 .treeview-menu { position:fixed } 相对 50px 侧边栏定位并被 overflow 裁剪 */
.main-sidebar {
    position: relative !important;
    top: auto !important;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    flex-shrink: 0;
    z-index: 1031;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important;
}

/* 右侧列：header + content 纵向堆叠 */
.main-right {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    transition: padding-left 0.3s ease-in-out;
}

/* header 在右侧列内相对定位 */
.main-header {
    position: relative !important;
    width: 100%;
    flex-shrink: 0;
    z-index: 1030;
}

/* 内容区撑满右侧列剩余空间 */
.content-wrapper {
    flex: 1 !important;
    overflow: hidden;
}

.main-footer {
    flex-shrink: 0;
}

/* 覆盖 AdminLTE 基于 margin-left 的内容区偏移（flex 布局不需要） */
.content-wrapper,
.main-footer {
    margin-left: 0 !important;
}

/* 覆盖 .fixed 布局给 content-wrapper 的顶部 padding */
.fixed .content-wrapper,
.fixed .right-side {
    padding-top: 0 !important;
}

/* ===== Logo 移至侧边栏顶部 ===== */

/* 基础样式：与原 .main-header .logo 保持一致（高度/字体/对齐） */
.main-sidebar .logo {
    display: block;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 20px;
    font-weight: 300;
    overflow: hidden;
    padding: 0 15px;
    color: #fff;
    white-space: nowrap;
    flex-shrink: 0;
    text-decoration: none;
}

/* 展开状态（150px）：显示完整名称，隐藏缩写 */
body:not(.sidebar-collapse) .main-sidebar .logo .logo-mini { display: none; }
body:not(.sidebar-collapse) .main-sidebar .logo .logo-lg   { display: block; }

/* 收起状态（50px）：显示缩写，隐藏完整名称 */
body.sidebar-collapse .main-sidebar .logo .logo-lg   { display: none; }
body.sidebar-collapse .main-sidebar .logo .logo-mini {
    display: block;
    font-size: 18px;
    overflow: hidden;
    /*margin-left: -15px;*/
    /*margin-right: -15px;*/
}

/* Navbar 不再为 Logo 预留 margin-left：
   fastadmin.css 默认 230px，sidebar-mini-collapse 为 50px，均覆盖为 0 */
.main-header .navbar {
    margin-left: 0 !important;
}

/* ===== 侧边栏宽度 ===== */

/* 展开：150px（覆盖 AdminLTE 默认 230px） */
.main-sidebar,
.main-sidebar .slimScrollDiv,
.main-sidebar .sidebar {
    width: 100px !important;
    padding-top: 0 !important;
}

/* 收起：AdminLTE 自带 width:50px !important，此处无需重复声明 */

/* ===== 子菜单定位：展开状态 ===== */
body:not(.sidebar-collapse) .sidebar-menu > li > .treeview-menu {
    position: fixed !important;
    left: 100px;
    top: 0 !important;
    width: 150px;
    height: 100vh !important;
    z-index: 1031;
}

body:not(.sidebar-collapse) .sidebar-menu > li > .treeview-menu.menu-open {
    overflow-y: auto;
}

/* ===== 子菜单定位：收起状态（与展开逻辑一致，仅数值不同）===== */
body.sidebar-collapse .sidebar-menu > li > .treeview-menu {
    position: fixed !important;
    left: 50px !important;
    top: 0 !important;
    width: 50px !important;
    height: 100vh !important;
    padding-left: 0 !important;
    z-index: 1031 !important;
}

body.sidebar-collapse .sidebar-menu > li > .treeview-menu.menu-open {
    overflow-y: auto;
}

/* 收起状态：子菜单只显示图标，隐藏文字和 pull-right */
/* flex 居中保证图标在 50px 宽度内准确水平+垂直居中，无需依赖 text-align+overflow */
body.sidebar-collapse .sidebar-menu > li > .treeview-menu > li > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 42px !important;
    padding: 0 !important;
}

body.sidebar-collapse .sidebar-menu > li > .treeview-menu > li > a > i {
    display: inline-block !important;
    font-size: 16px !important;
    width: auto !important;
    line-height: 1 !important;
}

body.sidebar-collapse .sidebar-menu > li > .treeview-menu > li > a > span,
body.sidebar-collapse .sidebar-menu > li > .treeview-menu > li > a > .pull-right-container {
    display: none !important;
}

/* 禁用 AdminLTE 收起状态的 hover 悬停展开行为（改为 click 展开） */
body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
    display: none !important;
}
body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) {
    display: none !important;
}
body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a {
    width: 50px !important;
}

/* ===== submenu-open：整个右侧列随子菜单平移 ===== */

/* 展开状态：子菜单 150px，右侧列偏移 150px */
body.submenu-open:not(.sidebar-collapse) .main-right {
    padding-left: 150px;
}

/* 收起状态：子菜单 50px，右侧列偏移 50px */
body.submenu-open.sidebar-collapse .main-right {
    padding-left: 50px !important;
}

/* 主菜单相对定位 */
.sidebar-menu {
    position: relative;
}

.main-sidebar .slimScrollDiv {
    position: relative;
}

/* 隐藏一级菜单箭头 */
.sidebar-menu > li > a > .pull-right-container {
    display: none !important;
}

/* 收起状态：覆盖 fastadmin.css 的 display:none!important（特指度 0,4,1），
   对 .menu-open 子菜单强制显示（特指度 0,5,1 > 0,4,1，且晚于 fastadmin 加载） */
.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu.menu-open {
    display: block !important;
}

/* 收起状态：覆盖 fastadmin.css 的 margin-left:50px!important（特指度 0,3,0），
   flex 布局不需要 margin-left 偏移，此规则同特指度但在后面加载 */
.sidebar-mini.sidebar-collapse .content-wrapper,
.sidebar-mini.sidebar-collapse .right-side,
.sidebar-mini.sidebar-collapse .main-footer {
    margin-left: 0 !important;
}

/* ===== 一级菜单：黑底白字 ===== */
.main-sidebar,
.main-sidebar .sidebar {
    background-color: #000 !important;
}

.sidebar-menu > li > a {
    color: #fff !important;
}

.sidebar-menu > li > a > i,
.sidebar-menu > li > a > span {
    color: #fff !important;
}

.sidebar-menu > li.active > a,
.sidebar-menu > li > a:hover {
    color: #fff !important;
    background-color: #fecc01 !important;
}

.sidebar-menu > li.active > a > i,
.sidebar-menu > li.active > a > span {
    color: #fff !important;
}

/* ===== 二级菜单顶部父级标题 ===== */
.sidebar-menu > li > .treeview-menu > li.treeview-menu-header {
    height: 50px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    background-color: #fff !important;
    /*border-bottom: 1px solid #e0e0e0;*/
    pointer-events: none;
    cursor: default;
    position: sticky;
    top: 0;
    z-index: 1;
    flex-shrink: 0;
}

.sidebar-menu > li > .treeview-menu > li.treeview-menu-header > span {
    color: #333 !important;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

/* 收起状态：隐藏标题 */
body.sidebar-collapse .sidebar-menu > li > .treeview-menu > li.treeview-menu-header > span {
    display: none !important;
}

/* ===== 二级菜单：白底黑字 ===== */
.skin-black-blue .sidebar-menu > li > .treeview-menu,
.skin-black .sidebar-menu > li > .treeview-menu {
    background-color: #fff !important;
}

.skin-black-blue .sidebar-menu > li > .treeview-menu > li > a,
.skin-black .sidebar-menu > li > .treeview-menu > li > a {
    color: #333 !important;
}

.skin-black-blue .sidebar-menu > li > .treeview-menu > li > a > i,
.skin-black-blue .sidebar-menu > li > .treeview-menu > li > a > span,
.skin-black .sidebar-menu > li > .treeview-menu > li > a > i,
.skin-black .sidebar-menu > li > .treeview-menu > li > a > span {
    color: #333 !important;
}

.skin-black-blue .sidebar-menu > li > .treeview-menu > li.active > a,
.skin-black .sidebar-menu > li > .treeview-menu > li.active > a {
    color: #fecc01 !important;
    background-color: #f7e8af91 !important;
}

.skin-black-blue .sidebar-menu > li > .treeview-menu > li > a:hover,
.skin-black .sidebar-menu > li > .treeview-menu > li > a:hover {
    color: #fecc01 !important;
    background-color: #f7e8af91 !important;
}

.skin-black-blue .sidebar-menu > li > .treeview-menu > li.active > a > i,
.skin-black-blue .sidebar-menu > li > .treeview-menu > li.active > a > span,
.skin-black-blue .sidebar-menu > li > .treeview-menu > li > a:hover > i,
.skin-black-blue .sidebar-menu > li > .treeview-menu > li > a:hover > span,
.skin-black .sidebar-menu > li > .treeview-menu > li.active > a > i,
.skin-black .sidebar-menu > li > .treeview-menu > li.active > a > span,
.skin-black .sidebar-menu > li > .treeview-menu > li > a:hover > i,
.skin-black .sidebar-menu > li > .treeview-menu > li > a:hover > span {
    color: #fecc01 !important;
}

/* ===== 顶部导航标签激活样式（与一级菜单激活保持一致） ===== */
.nav-tabs.nav-addtabs > li.active > a,
.nav-tabs.nav-addtabs > li.active > a:hover,
.nav-tabs.nav-addtabs > li.active > a:focus {
    color: #fff !important;
    background-color: #fecc01 !important;
    border-color: #fecc01 !important;
}

/* 响应式：小屏恢复正常流布局 */
@media (max-width: 767px) {
    html, body {
        height: auto;
        overflow: auto;
    }

    .wrapper {
        display: block !important;
        height: auto;
    }

    .main-sidebar {
        position: fixed !important;
        top: 0;
        height: 100% !important;
        overflow-y: auto;
    }

    .main-right {
        display: block;
        height: auto;
        overflow: visible;
    }

    .content-wrapper {
        flex: none !important;
        overflow: auto;
    }

    body.submenu-open .main-right {
        padding-left: 0 !important;
    }

    body.sidebar-collapse .sidebar-menu > li > .treeview-menu,
    body:not(.sidebar-collapse) .sidebar-menu > li > .treeview-menu {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: auto !important;
        height: auto !important;
    }
}
