@charset "utf-8";
/** ver 260407.1 [안정화] 테이블 리사이즈 및 말줄임(Truncation) 통합 스타일
 * ==============================================================================
 * [주요 레이아웃 및 패치 사항]
 * 1. 코어 레이아웃 고정: table-layout: fixed 기반의 단단한 그리드 및 드래그 핸들(.col-resizer) UI 지원
 * 2. 기본 1줄 말줄임: max-width: 0 을 활용하여 데이터가 길어져도 테이블 레이아웃이 절대 깨지지 않도록 방어
 * 3. 선택적 2줄 말줄임: :has() 선택자를 활용해, <div class="cell-content">가 삽입된 특정 셀에서만 안전하게 2줄 확장 허용 (기존 DOM 충돌 방지)
 * 4. 2줄 행 높이 최적화: 2줄 텍스트의 줄간격을 극단적으로 줄여 1줄 행의 높이와 최대한 비슷하게 맞춤 (신규 패치)
 * 5. th header 상단여백 조정
 * ==============================================================================
 */

/* =================================================================
   1. 테이블 기본 및 리사이즈 코어 스타일
================================================================= */

/* 테이블 레이아웃 고정 */
.table-resizable-active {
    table-layout: fixed !important;
    width: 100%;
}

.table-resizable-active th {
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 15px !important; /* ★ 패치: 6~11px짜리 col-resizer가 말줄임표(...)를 가리지 않도록 여백 확보 */

    padding-top: 8px !important;     /* 1. 상단 여백 조절 */
    padding-bottom: 8px !important;  /* 2. 하단 여백 조절 */
    vertical-align: middle !important; /* 텍스트 세로 중앙 정렬 유지 */
}

.table-resizable-active .col-resizer {
    position: absolute;
    top: 0;
    right: 0;
    width: 6px; 
    height: 100%;
    cursor: col-resize; 
    user-select: none;
    z-index: 100;
    touch-action: none;
    background-color: transparent; 
}

.table-resizable-active .col-resizer:hover,
.table-resizable-active .col-resizer.resizing {
    border-right: 5px solid #000;
    /* border-right: 2px solid #0088cc; */
    opacity: 1;
}

.table-resizing {
    user-select: none;
    cursor: col-resize;
}

/* =================================================================
   [주요 변경/추가 부분 1] 기본 데이터 셀 (무조건 1줄 말줄임)
================================================================= */

/* 헤더(th): 한 줄 유지 */
.table-resizable-active th {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-sizing: border-box !important;
    max-width: 0; 
}

/* 본문(td) 및 푸터(tfoot) 모두 기본적으로 1줄 처리됩니다. */
.table-resizable-active td,
.table-resizable-active tfoot th,
.table-resizable-active tfoot td {
    vertical-align: middle !important;
    padding: 4px 10px !important;
    max-width: 0 !important; 
    
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* =================================================================
   [주요 변경/추가 부분 2] 수동 지정 방식 (직접 div 넣은 곳만 2줄)
================================================================= */

/* HTML에 수동으로 <div class="cell-content">를 넣은 셀에 대한 예외 처리 (넘침 허용) */
.table-resizable-active td:has(.cell-content),
.table-resizable-active tfoot th:has(.cell-content),
.table-resizable-active tfoot td:has(.cell-content) {
    white-space: normal !important;
    overflow: visible !important;
    vertical-align: middle !important; 
}

/* 수동 추가된 내부 래퍼(.cell-content)에 2줄 말줄임 강제 적용 */
.table-resizable-active td .cell-content,
.table-resizable-active tfoot th .cell-content,
.table-resizable-active tfoot td .cell-content {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-pack: center !important; 
    
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    word-break: break-all !important;
    
    width: 100% !important;
    height: auto !important; 
    /* ★ 핵심 수정: 2줄이 1줄 높이와 비슷해지도록 바싹 붙임 */
    line-height: 1.1 !important;  /* 기존 1.5 -> 1.1로 간격 축소 */
    max-height: 2.2em !important; /* 기존 3em -> 2.2em으로 최대 높이 제한 (1.1 * 2줄) */
    
    /* font-size: 0.95em !important; */ /* 필요하다면 주석 해제하여 폰트 크기를 약간 줄일 수있음 */
    
    margin: 0 !important;
    padding: 0 !important;
}