/* ============================================
   JSpreadsheet CE v5 Custom Styles
   - Text left alignment
   - Auto word wrap
   - Full text display in editor mode

   Created: 2025-11-24
   ============================================ */

/* 1. Cell default style: left alignment + auto word wrap */
.jss_worksheet > tbody > tr > td {
    text-align: left !important;
    white-space: pre-wrap !important;
    word-break: break-word;
    overflow-wrap: break-word;
    vertical-align: top;  /* Top alignment for multi-line text */
    contain: layout paint;  /* Performance: isolate cell layout/paint from siblings */
}

/* 2. Editor mode: full text display */
.jss_worksheet .editor {
    white-space: pre-wrap !important;
    word-break: break-word;
    /* max-height: none !important; */  /* 🚀 PERF: 제거 - 동적 높이 계산 방지 */
    /* height: auto !important; */       /* 🚀 PERF: 제거 - Layout Thrashing 방지 */
    contain: layout;  /* 🚀 PERF: 에디터 레이아웃 격리 */
    min-height: 28px;  /* 최소 높이 보장 (행 높이와 일치) */
    transition: none !important;  /* 🚀 PERF: 스크롤 시 transition 애니메이션 제거 */
    will-change: transform, contents;  /* 🚀 PERF: GPU 레이어 분리 → 스크롤 성능 개선 */
}

/* 2-1. Editor cell: transition 비활성화 + 상대 위치 기준점 */
.jss_worksheet td.editor {
    transition: none !important;  /* 🚀 PERF: 에디터 셀 transition 제거 */
    position: relative;  /* 🚀 PERF v1.0.31: 에디터 input의 absolute 기준점 */
}

/* 2-2. 🚀 PERF v1.0.31: 에디터 input이 부모 셀 크기를 상속받음
 * - JS의 getBoundingClientRect() 결과로 설정되는 width/height를 CSS로 덮어씀
 * - 셀 크기가 이미 렌더링되어 있으므로 재측정/재설정 불필요
 * - Chrome에서 openEditor 시 불필요한 style 재계산 방지
 */
.jss_worksheet .editor > input,
.jss_worksheet .editor > textarea {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;  /* 🔧 v1.0.36: JS에서 명시적 높이 설정 후 정상 작동 */
    box-sizing: border-box !important;
    white-space: pre-wrap !important;
    /* 🔧 2026-06-12: 에디터 텍스트를 렌더된 셀(TD) 텍스트와 *픽셀 단위 정렬*.
     * 공식 jspreadsheet.css: 일반 셀 TD = padding 4px 인데, 편집 시 TD 는 .editor(padding 0)
     * 가 되고 textarea 는 padding 0/border 0 → 텍스트 시작이 4px→0px 로 어긋나고 가용 폭이
     * 넓어져 줄바꿈 지점이 달라지고 셀 경계를 넘는 현상(F2/더블클릭) 발생.
     * → textarea padding 을 *일반 셀과 동일한 4px* 로 고정 = 콘텐츠 박스 일치 → 줄바꿈 일치.
     * (.editor TD 는 padding 0 이라 inherit 불가 — 4px 명시. font/line-height 는 셀과 동일하게 상속.) */
    padding: 4px !important;
    border: 0 !important;
    margin: 0 !important;
    font: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-align: inherit !important;
}

/* 3. Row height settings
 * - height: 28px !important 제거 → rowResize 기능 복구 (v1.0.32)
 * - min-height만 유지하여 최소 높이 보장
 * - contain: layout style 유지 → 레이아웃 격리로 성능 최적화 (v1.0.33)
 *   (rowResize 차단 원인은 height !important였음, contain: layout과 무관)
 */
.jss_worksheet > tbody > tr {
    min-height: 28px;
    contain: layout style;  /* 레이아웃 격리 유지 → rowResize 시 성능 최적화 */
}

/* 4. Keep header center aligned + sticky header fix
 *
 * 문제: 스크롤 시 셀 내용이 헤더 위의 padding 영역에 표시됨
 * 해결: 높은 z-index + 불투명 배경으로 스크롤되는 셀을 가림
 */
.jss_worksheet > thead > tr > td {
    text-align: center !important;
    z-index: 10 !important;  /* 기본값 2 → 10으로 증가 (셀보다 높게) */
    background-color: #f3f3f3 !important;  /* 불투명 배경으로 셀 가림 */
}

/* 4-1. 헤더 행 전체에 배경 추가 (셀 사이 틈새 방지) */
.jss_worksheet > thead > tr {
    background-color: #f3f3f3;
}

/* 5. Overflow handling - let JSpreadsheet default (hidden) work with contain: paint */
/* .jss_overflow > tbody > tr > td { overflow: visible !important; } */
/* ↑ 제거: contain: paint와 충돌하여 성능 저하 유발 */

/* 6. Sticky header support + no extra scrollbar
 *
 * overflow: clip vs hidden:
 * - hidden: 스크롤 컨텍스트 생성 → position: sticky 차단
 * - clip: 스크롤 컨텍스트 없음 → position: sticky 정상 작동
 *
 * 3개 스크롤 문제 해결:
 * - overflow: clip은 스크롤바를 추가하지 않음
 * - 외부 컨테이너(.spreadsheet-container)가 스크롤 담당
 *
 * 브라우저 지원: Chrome 90+, Firefox 81+, Safari 16.6+, Edge 90+
 */
.jss_content {
    overflow: clip !important;
    max-height: none !important;
}