/* work 페이지 공통 — 리셋 · 레이아웃 · 테마 컨테이너 · 라이트박스 · 모바일
   테마별 스킨은 groupware.css / vscode.css */

* { margin: 0; padding: 0; box-sizing: border-box; }
[hidden] { display: none !important; }
body {
    font-family: '맑은 고딕', 'Malgun Gothic', sans-serif;
    background: #f2f4f7;
    color: #333;
    height: 100vh;
    overflow: hidden;
}
.work-wrap {
    display: flex;
    height: 100vh;
}

/* =======================================================================
   좌측 : 채팅(그룹웨어 문서함 스타일 — 실제 동작은 표 본문 + 하단 등록창만)
   ======================================================================= */
.chat-pane {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    font-size: 12px;
    color: #333;
}


/* =======================================================================
   테마 스위처 (그룹웨어 nav / VS Code 타이틀바 공용) + 테마 뷰 컨테이너
   ======================================================================= */
.theme-switcher {
    font-size: 11px;
    padding: 3px 6px;
    border: 1px solid #d7dbe2;
    border-radius: 3px;
    background: #fff;
    color: #444;
    cursor: pointer;
}
.theme-view {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}


/* ---------- 이미지 라이트박스 ---------- */
.img-modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.82);
    z-index: 999;
    align-items: center;
    justify-content: center;
}
.img-modal.open { display: flex; }
.img-modal img {
    max-width: 90vw;
    max-height: 88vh;
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0,0,0,.4);
}
.img-modal-close {
    position: absolute;
    top: 18px; right: 24px;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,.15);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    cursor: pointer;
}
.img-modal-close:hover { background: rgba(255,255,255,.3); }


/* ---------- 모바일 ---------- */
@media (max-width: 900px) {
    .gw-side-left { display: none; }
    .vc-activitybar, .vc-explorer { display: none; }
}
@media (max-width: 768px) {
    body { overflow: auto; height: auto; }
    .work-wrap { flex-direction: column; height: auto; }
    .chat-pane {
        flex: 1 1 auto !important;
        max-width: 100% !important;
    }
    .gw-tabs { display: none; }
}