


/* 파일명: st003_search_engine.css */







/* 파일명: st003_search_engine.css */
/* [ST003] Windows Classic Dark High-Density Theme - Global Search Engine Modal Edition */




/* ==========================================================================
   1. 전역 모달 오버레이 (푸터 노출형 / 툴박스 위로 도킹)
   ========================================================================== */
.se_modal_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: calc(100vh - 30px); /* 툴박스 높이만큼 하단 제외 */
    background: rgba(0, 0, 0, 0.88);
    backdrop-filter: blur(3px);
    z-index: 9990; /* 툴박스(9999)보다 아래로 배치 */
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 6px;
}







.se_modal_window {
    width: 96vw;
    height: 98%;
    max-height: calc(100vh - 40px); /* 뷰포트 절대 초과 방지 */
    max-width: 1600px;
    background: #1e1e1e;
    border: 2px outset #555555;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.95);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    font-family: 'Gulim', 'Dotum', Tahoma, sans-serif;
    color: #e0e0e0;
    overflow: hidden; /* 모달 윈도우 자체의 넘침 방지 */
}

/* ==========================================================================
   2. 모달 윈도우 상단 타이틀바 (고정)
   ========================================================================== */
.se_modal_header {
    flex-shrink: 0; /* 높이 줄어듦 방지 */
    background: #000080;
    color: #ffffff;
    padding: 5px 10px;
    font-weight: bold;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    user-select: none;
    border-bottom: 1px solid #333333;
}

.se_modal_header span {
    display: flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.5px;
}

/* ==========================================================================
   3. 검색 제어 패널 (고정)
   ========================================================================== */
.se_wrapper {
    flex-shrink: 0; /* 높이 줄어듦 방지 */
    background: #252525;
    border-bottom: 2px solid #3a3a3a;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
}

/* ==========================================================================
   6. 검색 결과 출력 전용 독립 스크롤 컨테이너 (핵심 수선)
   ========================================================================== */
.se_result_container {
    flex: 1 1 0%; /* 남은 세로 공간만 정확히 차지 */
    min-height: 0; /* Flexbox 스크롤 붕괴 방지 필수 속성 */
    background: #141414;
    border: 2px inset #111111;
    margin: 8px 10px;
    padding: 8px;
    overflow-y: scroll !important; /* 스크롤바 상시 유지 */
    overflow-x: hidden !important;
    overscroll-behavior: contain; /* 뒷배경 스크롤 간섭 원천 차단 */
    -webkit-overflow-scrolling: touch; /* 모바일 부드러운 스크롤 */
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
}







/* 1단 : 검색창 및 메인 검색 버튼 */
.se_row_main {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
}

.se_input {
    flex: 1;
    background: #141414;
    border: 2px inset #111111;
    color: #ffffff;
    padding: 4px 8px;
    font-size: 12px;
    font-family: inherit;
    box-sizing: border-box;
    outline: none;
}

.se_input:focus {
    border-color: #66b0ff;
    background: #000000;
}

/* 2단 : 필터 체크박스 군 및 햄버거 메뉴 */
.se_row_filter {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    flex-wrap: wrap;
    gap: 6px;
}

.se_filter_group {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.se_label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    font-size: 11px;
    color: #e0e0e0;
    user-select: none;
}

.se_label input[type="checkbox"] {
    accent-color: #000080;
    cursor: pointer;
    margin: 0;
}

/* 딥 서치(Deep JSON) 고인물 필터 옵션 */
.se_label_deep {
    color: #f59e0b;
    font-weight: bold;
}

/* ==========================================================================
   4. 클래식 다크 3D 버튼 규격
   ========================================================================== */
.se_btn {
    background-color: #2b2b2b;
    border-top: 2px solid #555555;
    border-left: 2px solid #555555;
    border-right: 2px solid #111111;
    border-bottom: 2px solid #111111;
    padding: 3px 10px;
    font-size: 11px;
    color: #e0e0e0;
    cursor: pointer;
    font-family: inherit;
    box-sizing: border-box;
    white-space: nowrap;
}

.se_btn:hover {
    background-color: #333333;
    color: #ffffff;
}

.se_btn:active {
    border-top: 2px solid #111111;
    border-left: 2px solid #111111;
    border-right: 2px solid #555555;
    border-bottom: 2px solid #555555;
    padding: 4px 9px 2px 11px;
}

.se_btn_hamburger {
    background-color: #000080;
    color: #ffffff;
    font-weight: bold;
    border-color: #4444aa #111155 #111155 #4444aa;
}

/* ==========================================================================
   5. 검색 상태 및 통계 바
   ========================================================================== */
#st003SearchStatus {
    font-size: 11px;
    color: #10b981;
    padding: 2px 4px;
    border-top: 1px dashed #3a3a3a;
    margin-top: 2px;
}


/* 스크롤바 커스텀 */
.se_result_container::-webkit-scrollbar {
    width: 10px;
    background: #1e1e1e;
}
.se_result_container::-webkit-scrollbar-thumb {
    background: #3a3a3a;
    border: 1px solid #555555;
}




/* 결과 개별 카드 아이템 (다단 계층형) */
.se_result_item {
    background: #252525;
    border: 1px solid #3a3a3a;
    padding: 6px 8px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: background 0.15s;
    box-sizing: border-box;
}

.se_result_item:hover {
    background: #2c2c2c;
    border-color: #555555;
}

/* 계층별 시각 구분 (행성/위성은 들여쓰기 적용) */
.se_depth_root {
    border-left: 3px solid #f59e0b;
}

.se_depth_child {
    margin-left: 18px;
    border-left: 3px solid #66b0ff;
    background: #1f1f1f;
}

.se_tree_symbol {
    color: #66b0ff;
    font-weight: bold;
    user-select: none;
}

.se_item_main_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.se_item_left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

/* 부모(항성) 소속 경로 표시 바 */
.se_parent_path {
    font-size: 10px;
    color: #8bb4e7;
    background: #161616;
    padding: 2px 6px;
    border-left: 2px solid #555555;
    margin-left: 22px;
}

/* 검색 맥락 스니펫 박스 */
.se_snippet_box {
    font-size: 11px;
    color: #b5b5b5;
    background: #111111;
    border: 1px solid #2e2e2e;
    padding: 4px 6px;
    margin-left: 22px;
    line-height: 1.4;
    word-break: break-all;
    font-family: 'Consolas', 'Courier New', monospace;
}

.se_match_tag {
    color: #f59e0b;
    font-weight: bold;
    font-size: 10px;
    margin-right: 4px;
}

/* 🔍 검색어 하이라이트 스타일 (레트로 골드 옐로우) */
.se_highlight {
    background-color: #ffe600 !important;
    color: #000000 !important;
    font-weight: bold !important;
    padding: 0 2px;
    border-radius: 1px;
}











.se_item_badge {
    font-size: 10px;
    padding: 1px 5px;
    border: 1px solid #444;
    background: #1e1e1e;
    white-space: nowrap;
}

.se_badge_master { color: #f59e0b; border-color: #b45309; }
.se_badge_capsule { color: #66b0ff; border-color: #1d4ed8; }
.se_badge_satellite { color: #a78bfa; border-color: #6d28d9; }

.se_item_title {
    font-size: 12px;
    color: #ffffff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.se_item_right {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.se_item_date {
    font-size: 10px;
    color: #888888;
    margin-right: 4px;
}

/* ==========================================================================
   7. 모달 내부 2차 팝업 (일괄 작업 모달창)
   ========================================================================== */
#st003BatchModal .se_modal_window {
    width: 320px;
    height: auto;
    max-height: 80vh;
}

.se_modal_body {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: #1e1e1e;
}

.se_modal_action_btn {
    width: 100%;
    text-align: left;
    padding: 6px 10px;
}