/* ================================================================
   pc-sidebar-collapse.css — 사이드바 아이콘 접기 토글
   body.sb-collapsed 가 붙으면 사이드바가 56px로 축소.
   모바일(767px 이하)에서는 기존 동작 유지 (영향 없음).
   ================================================================ */

/* 접기 버튼 */
.sb-collapse-btn{
  position:absolute;right:-12px;bottom:72px;
  width:24px;height:24px;border-radius:50%;
  background:#fff;color:#475569;border:1px solid #CBD5E1;
  box-shadow:0 2px 6px rgba(15,23,42,.18);
  cursor:pointer;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  z-index:5;transition:all .15s ease;padding:0;line-height:1;
}
.sb-collapse-btn:hover{background:#F1F5F9;border-color:#94A3B8}
.sb-collapse-btn:active{transform:scale(.92)}

/* 접힘 상태 - 데스크톱 전용 */
@media (min-width:768px){
  body.sb-collapsed .sidebar{
    width:56px !important;min-width:56px !important;max-width:56px !important;
    transition:width .22s ease, min-width .22s ease, max-width .22s ease;
  }
  body:not(.sb-collapsed) .sidebar{
    transition:width .22s ease, min-width .22s ease, max-width .22s ease;
  }

  /* 접힘 시 로고 이니셜만, 날짜 숨김 */
  body.sb-collapsed .sb-logo{font-size:0;padding:14px 0 6px;text-align:center;justify-content:center}
  body.sb-collapsed .sb-logo::after{content:'팩';font-size:16px;font-weight:900;color:var(--pri)}
  body.sb-collapsed #sbDate{display:none}

  /* 홈 버튼: 아이콘만 */
  body.sb-collapsed .sb-home{
    font-size:0;padding:10px 0;margin:4px 6px;text-align:center;
  }
  body.sb-collapsed .sb-home::before{content:'🏠';font-size:18px}

  /* 그룹 타이틀: 이모지만 남기고 텍스트 숨김 */
  body.sb-collapsed .sb-group{
    font-size:0;padding:10px 0;text-align:center;justify-content:center;
    border-left:none !important;
  }
  body.sb-collapsed .sb-group > *:not(.sb-arrow){font-size:0}
  /* 이모지 렌더: 원본 content 의 첫 문자(이모지)가 그대로 보이도록 */
  body.sb-collapsed .sb-group{font-size:18px}
  body.sb-collapsed .sb-group .sb-arrow{display:none}

  /* 그룹 내 아이템 숨김 (접혔을 땐 그룹 아이콘만) */
  body.sb-collapsed .sb-group + div,
  body.sb-collapsed .sb-group ~ .sb-item,
  body.sb-collapsed div[data-sb-items]{display:none !important}

  /* 사용자/로그아웃: 아이콘만 */
  body.sb-collapsed .sb-user{padding:8px 0;justify-content:center}
  body.sb-collapsed .sb-user > div:nth-child(2){display:none}
  body.sb-collapsed .sb-logout{font-size:0;padding:8px 0;margin:0 6px;text-align:center}
  body.sb-collapsed .sb-logout::before{content:'↩';font-size:16px;color:#94A3B8}

  /* 상단 사용자 노티 배지 위치 조정 */
  body.sb-collapsed .sb-noti-badge{right:6px;top:6px}

  /* 접기 버튼 아이콘 전환 */
  body.sb-collapsed .sb-collapse-btn::before{content:'▶'}
  body:not(.sb-collapsed) .sb-collapse-btn::before{content:'◀'}

  /* 메인 영역 자동 확장 (사이드바 flex라 자동이지만 최소폭 조정) */
  body.sb-collapsed .main-area{min-width:0}
}

/* 모바일에서는 토글 버튼 숨김 (기존 모바일 햄버거 사용) */
@media (max-width:767px){
  .sb-collapse-btn{display:none}
}

/* 툴팁 — 접혔을 때 hover 시 그룹명 보이도록 */
body.sb-collapsed .sb-group{position:relative}
body.sb-collapsed .sb-group:hover::after{
  content:attr(data-tip);
  position:absolute;left:62px;top:50%;transform:translateY(-50%);
  background:#0F172A;color:#fff;padding:4px 10px;border-radius:6px;
  font-size:11px;font-weight:600;white-space:nowrap;
  box-shadow:0 4px 12px rgba(0,0,0,.2);z-index:100;
  pointer-events:none;
}