/* =========================================================
   FIX.CSS — Sidebar divider + Mobile off-canvas 안정화
   (main.css는 건드리지 않고, 여기서만 덮어쓴다)
   ========================================================= */

/* 1) Sidebar 섹션 구분선(회색 라인) 복구 */
#sidebar > .inner > section {
  border-top: solid 2px rgba(210, 215, 217, 0.75);
  margin-top: 2rem;
  padding-top: 2rem;
}

/* 첫 섹션은 라인 제거 */
#sidebar > .inner > section:first-of-type {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}

/* 2) 로고 섹션: 가운데 정렬 + 선 제거 */
#sidebar-brand {
  padding: 1.8rem 1.5rem 1.1rem;
  text-align: center;
  border-top: none !important;
  border-bottom: none !important;
}

#sidebar-brand .sidebar-logo img {
  display: block;
  max-width: 140px;
  height: auto;
  margin: 0 auto;
}

/* 3) 메뉴 자체 위쪽 선은 제거(섹션 라인이 대신 구분해줌) */
#menu {
  border-top: none !important;
}

/* 메뉴 리스트 좌우 여백 */
#menu .links {
  padding: 0 1.5rem 1.5rem;
  margin: 0;
}

/* 링크 기본 */
#menu .links a {
  text-decoration: none;
}

/* 현재 페이지 강조 (aria-current="page") */
#menu a[aria-current="page"] {
  font-weight: 600;
}

/* 4) 모바일/태블릿에서 “메뉴가 페이지에 박히는 컬럼 현상” 방지
      - 사이드바를 오프캔버스(슬라이드 인)로 강제 */
@media screen and (max-width: 980px) {

  /* 사이드바를 화면 밖으로 빼두고(닫힘 상태) */
  #sidebar {
    position: fixed !important;
    top: 0 !important;
    right: -23em !important;
    width: 23em !important;
    height: 100% !important;
    overflow-y: auto !important;
    z-index: 10000 !important;
    background: #ffffff !important;
    transition: right 0.25s ease !important;
    -webkit-overflow-scrolling: touch;
  }

  /* main.js가 body.is-menu-visible 붙이면 열림 */
  body.is-menu-visible #sidebar {
    right: 0 !important;
  }

  /* (중요) “메뉴 강제 표시” 같은 건 하지 않는다.
     메뉴는 사이드바가 열릴 때만 보이는 게 정상. */
}