/* STEP4: 작업영역 확대형 자동 숨김 사이드바 + 아코디언 메뉴 */
:root{
  --nkt-sidebar-width:264px;
  --nkt-sidebar-mobile-width:min(86vw,340px);
  --nkt-sidebar-speed:.24s;
}

body.nkt-sidebar-ready{overflow-x:hidden}
body.nkt-sidebar-ready .appShell{display:block;min-height:100vh}
body.nkt-sidebar-ready .mainPanel{width:100%;min-width:0}

body.nkt-sidebar-ready .mainSidebar{
  width:var(--nkt-sidebar-width);
  min-height:100vh;
  height:100dvh;
  position:fixed;
  inset:0 auto 0 0;
  transform:translateX(calc(-100% - 14px));
  transition:transform var(--nkt-sidebar-speed) ease,box-shadow var(--nkt-sidebar-speed) ease;
  z-index:1002;
  overflow-y:auto;
  overscroll-behavior:contain;
  box-shadow:none;
}
body.nkt-sidebar-ready.nkt-sidebar-open .mainSidebar{
  transform:translateX(0);
  box-shadow:18px 0 46px rgba(3,20,37,.30);
}

.nkt-sidebar-edge{
  position:fixed;left:0;top:0;bottom:0;width:12px;z-index:999;
  background:transparent;
}
.nkt-sidebar-toggle{
  position:fixed;left:0;top:50%;transform:translateY(-50%);
  width:31px;height:70px;padding:0;border:1px solid #cbd8e2;border-left:0;
  border-radius:0 13px 13px 0;background:rgba(255,255,255,.96);color:#0b3151;
  display:grid;place-items:center;z-index:1004;font-size:17px;font-weight:900;
  box-shadow:5px 5px 20px rgba(8,36,60,.18);transition:left var(--nkt-sidebar-speed) ease,background .15s ease;
}
.nkt-sidebar-toggle:hover{background:#eef6fb}
body.nkt-sidebar-open .nkt-sidebar-toggle{left:var(--nkt-sidebar-width)}
.nkt-sidebar-backdrop{
  position:fixed;inset:0;background:rgba(3,17,31,.38);backdrop-filter:blur(1px);
  opacity:0;pointer-events:none;z-index:1001;transition:opacity var(--nkt-sidebar-speed) ease;
}
body.nkt-sidebar-open .nkt-sidebar-backdrop{opacity:1;pointer-events:auto}

/* 대분류를 누르면 소분류가 펼쳐지는 아코디언 */
body.nkt-sidebar-ready .appNav{gap:7px}
body.nkt-sidebar-ready .navGroup{display:block;min-width:0}
body.nkt-sidebar-ready .navGroupTitle{
  min-height:44px;margin:0;padding:0 13px;width:100%;
  display:flex;align-items:center;gap:9px;position:relative;
  border:1px solid transparent;border-radius:11px;color:#d5e1e9;
  background:transparent;font-size:12px;font-weight:900;letter-spacing:-.01em;
  cursor:pointer;user-select:none;transition:background .16s ease,color .16s ease,border-color .16s ease;
}
body.nkt-sidebar-ready .navGroupTitle::before{
  content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;
  background:#6f91aa;box-shadow:0 0 0 3px rgba(111,145,170,.12);
}
body.nkt-sidebar-ready .navGroupTitle::after{
  content:"›";margin-left:auto;color:#7899af;font-size:18px;line-height:1;
  transform:rotate(0deg);transition:transform .18s ease,color .18s ease;
}
body.nkt-sidebar-ready .navGroupTitle:hover,
body.nkt-sidebar-ready .navGroup.expanded>.navGroupTitle{
  color:#fff;background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.07)
}
body.nkt-sidebar-ready .navGroup.expanded>.navGroupTitle::after{transform:rotate(90deg);color:#fff}
body.nkt-sidebar-ready .navGroup.expanded>.navGroupTitle::before{background:#38b8bc;box-shadow:0 0 0 3px rgba(56,184,188,.15)}
body.nkt-sidebar-ready .navTree{
  max-height:0;opacity:0;overflow:hidden;pointer-events:none;
  padding-left:7px;margin-top:0;transition:max-height .24s ease,opacity .18s ease,margin-top .2s ease;
}
body.nkt-sidebar-ready .navGroup.expanded>.navTree{
  max-height:560px;opacity:1;pointer-events:auto;margin-top:4px
}
body.nkt-sidebar-ready .navTree::before{top:5px;bottom:5px}

/* 작업화면은 항상 전체 폭 사용 */
body.nkt-sidebar-ready .topbar,
body.nkt-sidebar-ready .dashboard,
body.nkt-sidebar-ready .generalWorkspace{transition:filter .2s ease}

@media (min-width:1100px){
  /* 마우스로 가장자리에 접근하면 보이되, 작업화면 크기는 줄이지 않음 */
  body.nkt-sidebar-open .nkt-sidebar-backdrop{background:rgba(3,17,31,.18)}
}

@media (max-width:720px){
  body.nkt-sidebar-ready .mainSidebar{
    width:var(--nkt-sidebar-mobile-width);height:100dvh;min-height:100dvh;
    padding:18px 15px 24px;position:fixed;display:flex;
  }
  body.nkt-sidebar-ready.nkt-sidebar-open .mainSidebar{transform:translateX(0)}
  body.nkt-sidebar-open .nkt-sidebar-toggle{left:var(--nkt-sidebar-mobile-width)}
  body.nkt-sidebar-ready .brand{display:flex;padding:4px 6px 18px;gap:12px}
  body.nkt-sidebar-ready .brand img{width:88px}
  body.nkt-sidebar-ready .appNav{
    display:flex;flex-direction:column;overflow:visible;padding:0 0 18px;gap:7px;
  }
  body.nkt-sidebar-ready .navGroup{display:block}
  body.nkt-sidebar-ready .navGroupTitle{display:flex;min-height:50px;font-size:14px;padding:0 14px}
  body.nkt-sidebar-ready .navTree{display:flex;flex-direction:column}
  body.nkt-sidebar-ready .appNav .navItem{
    width:100%;min-width:0;min-height:48px;padding:8px 10px;grid-template-columns:31px 1fr;flex:none
  }
  body.nkt-sidebar-ready .appNav .navItem small{display:block}
  body.nkt-sidebar-ready .sidebarFoot{display:block}
  .nkt-sidebar-toggle{top:112px;transform:none;height:58px;width:30px}
}

@media (prefers-reduced-motion:reduce){
  body.nkt-sidebar-ready .mainSidebar,.nkt-sidebar-toggle,.nkt-sidebar-backdrop,
  body.nkt-sidebar-ready .navTree,body.nkt-sidebar-ready .navGroupTitle::after{transition:none}
}