/* Extracted from v2.5 inline style block #6. v3.0-alpha split packaging. */
/* =========================================================
   导航优化：桌面端可折叠侧边栏，避免遮挡表格
   只改布局与交互，不改数据库、RLS、保存、统计逻辑
   ========================================================= */
:root{
  --sidebar-open-width:300px;
  --sidebar-collapsed-width:76px;
  --sidebar-gap:24px;
}

/* 导航顶部增加折叠按钮 */
.sidebar-nav{
  transition:width .18s ease, padding .18s ease, box-shadow .18s ease!important;
}

.nav-collapse-btn{
  width:100%!important;
  min-height:42px!important;
  margin:0 0 14px 0!important;
  border-radius:14px!important;
  background:rgba(37,99,235,.18)!important;
  color:#e0f2fe!important;
  border:1px solid rgba(147,197,253,.22)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  font-weight:900!important;
  box-shadow:none!important;
}

.nav-collapse-btn:hover{
  background:rgba(37,99,235,.32)!important;
  transform:none!important;
}

.nav-collapse-icon{
  font-size:18px;
  line-height:1;
}

.nav-collapse-text{
  white-space:nowrap;
}

/* 桌面端：固定导航 + 可折叠 */
@media (min-width:901px){
  body.nav-collapsed .sidebar-nav{
    width:var(--sidebar-collapsed-width)!important;
    padding:14px 10px!important;
  }

  body.nav-collapsed .main-content-flex{
    margin-left:calc(var(--sidebar-collapsed-width) + var(--sidebar-gap))!important;
    width:calc(100vw - var(--sidebar-collapsed-width) - var(--sidebar-gap) - 48px)!important;
  }

  body:not(.nav-collapsed) .sidebar-nav{
    width:var(--sidebar-open-width)!important;
  }

  body:not(.nav-collapsed) .main-content-flex{
    margin-left:calc(var(--sidebar-open-width) + var(--sidebar-gap))!important;
    width:calc(100vw - var(--sidebar-open-width) - var(--sidebar-gap) - 48px)!important;
  }

  body.nav-collapsed .nav-title{
    justify-content:center!important;
    padding:12px 8px!important;
    font-size:0!important;
    margin-bottom:12px!important;
  }

  body.nav-collapsed .nav-title span{
    font-size:22px!important;
  }

  body.nav-collapsed .nav-page-link{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    padding:0!important;
    margin:10px auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:0!important;
    border-radius:16px!important;
    position:relative!important;
  }

  body.nav-collapsed .nav-page-link::first-letter{
    font-size:0!important;
  }

  body.nav-collapsed .nav-page-link .nav-icon-only{
    font-size:22px!important;
    line-height:1!important;
  }

  body.nav-collapsed .nav-page-link::after{
    content:attr(data-label);
    position:absolute;
    left:64px;
    top:50%;
    transform:translateY(-50%);
    background:#0f172a;
    color:#fff;
    border:1px solid rgba(255,255,255,.12);
    border-radius:10px;
    padding:8px 10px;
    white-space:nowrap;
    font-size:13px;
    opacity:0;
    pointer-events:none;
    box-shadow:0 12px 28px rgba(15,23,42,.24);
    transition:opacity .12s ease;
    z-index:9999;
  }

  body.nav-collapsed .nav-page-link:hover::after{
    opacity:1;
  }

  body.nav-collapsed .nav-collapse-text{
    display:none!important;
  }

  body.nav-collapsed .nav-collapse-btn{
    width:52px!important;
    height:42px!important;
    min-width:52px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
  }

  body.nav-collapsed .nav-collapse-icon{
    transform:rotate(180deg);
  }
}

/* 小屏端：不使用折叠侧栏，保持顶部横向导航 */
@media (max-width:900px){
  .nav-collapse-btn{
    display:none!important;
  }
  body.nav-collapsed .nav-page-link{
    font-size:15px!important;
  }
}

/* 低缩放/超宽场景下，折叠后表格更舒服 */
@media (min-width:2200px){
  body.nav-collapsed .main-content-flex{
    width:calc(100vw - var(--sidebar-collapsed-width) - var(--sidebar-gap) - 64px)!important;
  }
}

/* 让表格区域不要被固定导航视觉遮挡 */
@media (min-width:901px){
  .sidebar-nav{
    backdrop-filter:blur(10px);
  }
}