/* ============================================================
   魔转 · L2 布局重排：左侧栏 → 顶部横向导航
   依据实测结构：
     div.min-h-screen > aside.sidebar(fixed,w-64) + div.relative(lg:ml-64)
     aside.sidebar > .sidebar-header + nav.sidebar-nav > .sidebar-section > .sidebar-link
   仅在 lg+ 生效；移动端保留原版抽屉，避免破坏可用性
   ============================================================ */

@media (min-width:1024px){

  /* ---- 侧边栏容器 → 顶部条 ---- */
  aside.sidebar{
    position:sticky!important;top:0!important;left:0!important;bottom:auto!important;
    width:100%!important;height:auto!important;min-height:0!important;
    display:flex!important;flex-direction:row!important;align-items:stretch!important;
    gap:8px;padding:0 20px!important;
    border-right:0!important;border-bottom:1px solid var(--m3-line)!important;
    background:rgba(13,14,18,.82)!important;backdrop-filter:blur(14px);
    transform:none!important;z-index:50!important;overflow:visible!important;
  }
  /* 折叠态失效（顶栏没有折叠概念） */
  aside.sidebar.w-\[72px\]{width:100%!important}

  /* ---- 品牌区：变成左侧固定块 ---- */
  aside.sidebar .sidebar-header{
    display:flex!important;flex-direction:row!important;align-items:center!important;
    gap:10px;padding:0!important;margin-right:20px;border:0!important;flex:none;
    align-self:flex-start;height:56px;
  }
  aside.sidebar .sidebar-brand{
    display:flex!important;align-items:center;white-space:nowrap}
  /* 版本徽标暴露上游版本号 —— 隐藏 */
  aside.sidebar .sidebar-brand > :not(.sidebar-brand-title){display:none!important}
  aside.sidebar .sidebar-brand-title{font-size:15px!important;letter-spacing:.02em}
  aside.sidebar .sidebar-logo{
    height:28px!important;width:28px!important;border-radius:var(--m3-r)!important;box-shadow:none!important}

  /* ---- 菜单容器 → 横向 ---- */
  /* 管理员菜单项多达 20+，不收缩、自动换行成多行，避免文字被截断 */
  aside.sidebar nav.sidebar-nav{
    display:flex!important;flex-direction:row!important;align-items:center!important;
    flex-wrap:wrap!important;
    flex:1 1 auto!important;gap:0 2px;padding:0!important;margin:0!important;
    overflow:visible!important;min-width:0;
  }

  /* 分组容器摊平，让菜单项直接排进同一行 */
  aside.sidebar .sidebar-section{display:contents!important}
  /* 分组标题在横向导航里没有位置 */
  aside.sidebar .sidebar-section-title{display:none!important}

  /* ---- 菜单项 ---- */
  aside.sidebar .sidebar-link{
    flex:none!important;                     /* 关键：不收缩，否则标签被截成「总…」 */
    flex-direction:row!important;gap:6px!important;white-space:nowrap;
    height:56px;padding:0 10px!important;margin:0!important;
    border-radius:0!important;border-bottom:2px solid transparent;
    font-size:13px!important;color:#8B92A5!important;
    width:auto!important;max-width:none!important;overflow:visible!important;
  }
  aside.sidebar .sidebar-label,
  aside.sidebar .sidebar-label span{
    overflow:visible!important;text-overflow:clip!important;max-width:none!important}
  aside.sidebar .sidebar-link:hover{background:transparent!important;color:var(--m3-cyan)!important}
  /* 选中态：底部色条，取代原版整块圆角高亮 */
  aside.sidebar .sidebar-link-active{
    background:transparent!important;color:#fff!important;
    border-bottom-color:var(--m3-cyan)!important;
  }
  aside.sidebar .sidebar-link svg{height:15px!important;width:15px!important}
  aside.sidebar .sidebar-label{display:inline!important}

  /* ---- 子菜单 → 悬浮下拉 ---- */
  aside.sidebar nav.sidebar-nav > .sidebar-section > div[class*="ml-4"]{
    /* top:100% → 挂在整条导航栏下方（管理员两行时也不会错位） */
    position:absolute!important;top:100%!important;margin:0!important;padding:6px!important;
    min-width:190px;border-left:0!important;
    background:var(--m3-surface)!important;
    border:1px solid var(--m3-line)!important;border-radius:var(--m3-r)!important;
    box-shadow:0 24px 64px -16px #000;z-index:60;
  }
  aside.sidebar nav.sidebar-nav > .sidebar-section > div[class*="ml-4"] .sidebar-link{
    height:34px;border-bottom:0!important;border-radius:var(--m3-r)!important;width:100%!important}
  aside.sidebar nav.sidebar-nav > .sidebar-section > div[class*="ml-4"] .sidebar-link-active{
    background:rgba(79,209,255,.10)!important}

  /* ---- 内容区：取消为侧栏预留的左边距 ---- */
  aside.sidebar + div,
  div.min-h-screen > div.relative.transition-all{
    margin-left:0!important;
  }

  /* ---- 原顶栏（header.glass）：不再 sticky，避免双层吸顶 ---- */
  header.glass{
    position:static!important;background:transparent!important;
    border-bottom:1px solid var(--m3-line)!important;backdrop-filter:none!important;
  }
  header.glass > div.flex.h-16{height:52px!important}

  /* 内容区留白收紧（原版 p-8） */
  main{padding:20px 24px!important;max-width:1560px;margin:0 auto}
}

/* ---- 侧栏底部工具区（明暗切换 + 折叠）整体隐藏 ---- */
/* 站点固定深色，切换入口无意义；折叠在顶栏布局下也无意义 */
aside.sidebar > div.mt-auto{display:none!important}

/* ---- 移动端：抽屉保留，仅同步新配色 ---- */
@media (max-width:1023px){
  aside.sidebar{background:var(--m3-surface)!important;border-right:1px solid var(--m3-line)!important}
  aside.sidebar .sidebar-link-active{
    background:rgba(79,209,255,.10)!important;
    border-left:2px solid var(--m3-cyan);border-radius:var(--m3-r)!important}
}

/* ---- 通用组件形态重塑（不分屏幕） ---- */
.card{
  background:var(--m3-surface)!important;border:1px solid var(--m3-line)!important;
  border-radius:var(--m3-r)!important;box-shadow:none!important;
}
.card-glass,.glass{
  background:var(--m3-surface)!important;border:1px solid var(--m3-line)!important;
  backdrop-filter:blur(12px);box-shadow:none!important;
}
/* 统计卡：左侧色条 + 数值放大，替代原版圆角图标座构图 */
.grid > .card{position:relative;overflow:hidden}
.grid > .card::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--m3-cyan),var(--m3-violet));opacity:.85}
.card .h-12.w-12,.card .h-10.w-10{
  border-radius:var(--m3-r)!important;background:rgba(79,209,255,.08)!important}

/* 按钮：方正 + 去阴影 */
.btn{border-radius:var(--m3-r)!important;box-shadow:none!important;font-weight:600!important;
  letter-spacing:.01em}
.btn-primary{background-image:linear-gradient(135deg,var(--m3-cyan),var(--m3-violet))!important;
  color:#08131C!important;border:0!important}
.btn-secondary{background:transparent!important;border:1px solid var(--m3-line)!important;
  color:#C6CAD6!important}
.btn-secondary:hover{border-color:var(--m3-cyan)!important;color:var(--m3-cyan)!important}

/* Badge：胶囊 → 方角小标签 */
.badge{border-radius:2px!important;font-family:var(--m3-mono)!important;font-size:11px!important;
  text-transform:uppercase;letter-spacing:.04em;padding:2px 7px!important}

/* 表头 */
.table-header,thead.table-header{background:#12141A!important}

/* 登录页：居中窄卡 → 左品牌右表单 */
@media (min-width:900px){
  div.relative.flex.min-h-screen.items-center.justify-center > div.relative.z-10.w-full.max-w-md{
    max-width:920px!important;
    display:grid;
    grid-template-columns:1fr 400px;
    grid-template-rows:auto auto auto;
    align-items:start;gap:0 56px;
  }
  /* 左列：品牌区，与表单卡垂直居中对齐 */
  div.relative.z-10.w-full .mb-8.text-center{
    grid-column:1;grid-row:1;align-self:center;
    text-align:left!important;margin:0!important}
  div.relative.z-10.w-full .mb-8.text-center h1{font-size:40px!important;line-height:1.15}
  div.relative.z-10.w-full .mb-8.text-center > div:first-child{
    height:44px!important;width:44px!important;border-radius:var(--m3-r)!important;box-shadow:none!important}

  /* 右列：表单卡 */
  div.relative.z-10.w-full .card-glass{
    grid-column:2;grid-row:1;border-radius:var(--m3-r)!important}
  /* 「还没有账户？注册」跟在表单卡正下方，而不是漂到左列 */
  div.relative.z-10.w-full > .mt-6.text-center{
    grid-column:2;grid-row:2;margin-top:20px!important}
  /* 版权：整行居中收底 */
  div.relative.z-10.w-full > .mt-8.text-center{
    grid-column:1 / span 2;grid-row:3;margin-top:40px!important}
}
