/* =========================
   BibleData Layout (Grid)
   ========================= */

.bd-layout {
    position: relative;
    --bd-sidebar-width: 260px;
    --bd-sidebar-collapsed: 22px; /* ✅ 접혀도 남길 폭 */
    display: flex; /* ✅ 핵심 */
    align-items: flex-start; /* ✅ 같은 높이에서 시작 */
    width: 100%;
    position: relative;
}

/* 사이드바 폭(펼침 기본값) */
.bd-sidebar-col {
    position: relative;
    flex: 0 0 var(--bd-sidebar-width);
    width: var(--bd-sidebar-width);
    transition: flex-basis .2s ease, max-width .2s ease;
}

/* 본문은 나머지 전부 */
.bd-main-col {
    flex: 1 1 auto;
    min-width: 0; /* 테이블 overflow 방지 */
    padding-left: 12px;
}

/* 접힘 상태: 사이드바 폭 0 */
.bd-layout.bd-collapsed .bd-sidebar-col {
    flex-basis: var(--bd-sidebar-collapsed);
    max-width: var(--bd-sidebar-collapsed);
}

/* 접힘 상태에서는 "내용"만 숨김 */
.bd-layout.bd-collapsed .bd-sidebar {
    opacity: 0;
    pointer-events: none;
    width: 0;
    overflow: hidden;
}

/* g-0 쓰는 경우에도 본문 안쪽 여백은 필요하면 여기서 */
.bd-main-inner {
    padding: 0 12px; /* 원하면 0으로도 가능 */
}

/ /* ===== Toggle Button ===== */
.bd-sidebar-toggle {
    position: absolute;
    top: 12px;
    right: 0;
    width: var(--bd-sidebar-collapsed);
    height: 44px;
    border: 1px solid #dee2e6;
    border-right: 0;
    background: #fff;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 5;
}

.bd-sidebar-icon {
    font-size: 18px;
    line-height: 1;
}

/* 버튼 hover */
.bd-sidebar-toggle:hover {
    background: #f8f9fa;
}

/* =========================
   Sidebar styling helpers
   ========================= */

/* 성경별 펼침 영역 기본은 접힘을 원하니, 아래에서 .show를 기본 제거할 예정(뷰에서 처리) */
/* 아이콘 버튼(▾/▸)은 JS가 textContent로 관리 */

/* 링크가 길어질 때 줄바꿈/넘침 방지 */
.bd-sidebar-col a {
    word-break: keep-all;
}

/* 테이블이 폭 꽉 차게 */
.bd-main-col .table {
    width: 100%;
}

/* 모바일에서 사이드바 폭 줄이고 싶으면 */
@media (max-width: 768px) {
    .bd-sidebar-col {
        flex-basis: 220px;
        max-width: 220px;
    }

    #bd-sidebar-toggle {
        top: 10px;
    }
}
