/* ================================
 * MapViewer - Realtime Event Table
 * ================================ */

/* 카드 컨테이너 */
.mv-event-card {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--phoenix-body-bg);
    border: 1px solid var(--phoenix-border-color);
    border-radius: 0.5rem;
    overflow: hidden;
}

/* 카드 헤더 */
.mv-event-card-header {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.0rem 1rem;
    background: var(--phoenix-body-bg);
    border-bottom: 1px solid var(--phoenix-border-color);
}

/* 테이블 래퍼: 여기에서 스크롤 발생 */
.mv-event-table-wrap {
    flex: 1;
    min-height: 0;
    overflow: auto;
    /* 스크롤 영역 안쪽 여백(원하면 조절) */
    padding: 0;
}

/* 테이블 기본 */
.mv-event-table {
    margin: 0;
    width: 100%;
    table-layout: fixed; /* 너가 준 th width가 잘 먹게 */
}

    /* 셀 정렬/줄바꿈 제어 */
    .mv-event-table th,
    .mv-event-table td {
        vertical-align: middle;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* 헤더 sticky (스크롤 시 상단 고정) */
    .mv-event-table thead th {
        position: sticky;
        top: 0;
        z-index: 2;
        /* Bootstrap table-light 톤 유지 + 스크롤 시 비침 방지 */
        background: var(--phoenix-table-bg, #f8f9fa);
        border-bottom: 1px solid var(--phoenix-border-color);
    }

    /* (선택) hover 가독성 */
    .mv-event-table tbody tr:hover > * {
        background-color: rgba(0, 0, 0, 0.03);
    }

    /* (선택) 첫 컬럼(일시)이 너무 길면 줄바꿈 대신 ellipsis 유지 */
    .mv-event-table td:first-child {
        font-variant-numeric: tabular-nums;
    }

/* (선택) 모바일은 고려 안 한다고 했지만, 너무 좁아질 때 최소폭 확보 */
.mv-event-table {
    min-width: 1100px; /* 필요 시 조절 */
}


.mv-context-menu {
    position: fixed;
    z-index: 3000;
    min-width: 160px;
    background: #1f2933;
    border-radius: 8px;
    padding: 6px 0;
    display: none;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
}

.mv-menu-item {
    padding: 8px 14px;
    font-size: 13px;
    color: #e5e7eb;
    cursor: pointer;
}

    .mv-menu-item:hover {
        background: rgba(255,255,255,0.1);
    }

    .mv-menu-item[data-disabled="true"] {
        color: #9ca3af; /* 회색 */
        cursor: not-allowed;
        opacity: 0.45;
        pointer-events: none; /* ⭐ 클릭 자체 차단 */
    }

        .mv-menu-item[data-disabled="true"]:hover {
            background: transparent; /* hover 제거 */
        }

/* MapViewer Split Layout */
.mv-split-host {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.mv-split-top,
.mv-split-bottom {
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.mv-bottom-hidden {
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden;
}

/* Split.js creates: .gutter.gutter-vertical */
.gutter.gutter-vertical {
    flex: 0 0 auto;
    height: 8px; /* gutterSize와 동일 권장 */
    cursor: row-resize;
    background: var(--phoenix-gray-300);
    border-top: 1px solid var(--phoenix-border-color);
    border-bottom: 1px solid var(--phoenix-border-color);
}

    .gutter.gutter-vertical:hover {
        background: var(--phoenix-gray-400);
    }