/* =====================================================================
   사업장 선택 모달(.selectIds) — 랜딩(FrontMainView)·로그인(EgovLoginUsr) 공용
   두 화면의 CSS(armanager_landing.css / login_landing.css)에 같은 규칙이 복사돼 있던 것을 한 파일로 모았다.
   각 화면 CSS 다음에 불러온다.
   ===================================================================== */

/* ---------------------------------------------------------------------
   사업장 선택 모달(비밀번호 초기화) — 표 헤더·목록 열 어긋남 수정
   - armanager_main.css / loginNew.css 의 576px 이하 규칙이 thead·tbody·tr 을 각각 display:table 로 바꿔
     헤더와 각 행의 열 너비가 따로 계산되면서 어긋났다. 표 구조로 되돌리고 열 너비를 고정한다.
   - tbody 인라인 height:150px 때문에 행 수가 적으면 행이 늘어나 보이던 문제도 함께 해제.
   --------------------------------------------------------------------- */
.selectIds .modalInr {
    max-width: 640px;
    border: 1px solid #e2e7ee;
    border-radius: 6px;
}
/* 장식 걷기 — 흐림 배경·그림자·아래에서 올라오는 전환 없음 (armanager_main.css·loginNew.css 는 다른 화면과 공유라 여기서 덮는다) */
.myModal.selectIds {
    background-color: rgba(15, 23, 42, 0.55);
    backdrop-filter: none;
}
.myModal.selectIds .modalInr,
.myModal.selectIds.active .modalInr {
    box-shadow: none;
    transform: none;
    transition: none;
}
.selectIds .modalCont {
    padding: 26px 26px 24px;
}
.selectIds .ids-head {
    position: relative;
    margin-bottom: 16px;
    padding-right: 72px; /* 오른쪽 위 「닫기」 자리 */
}
/* 닫기(글자 버튼) — 사업장을 고르지 않고 비밀번호 초기화 창으로 돌아간다(ESC·바깥 클릭도 같음, password_reset.js) */
.selectIds .ids-head__close {
    position: absolute;
    top: -4px;
    right: 0;
    height: 32px;
    padding: 0 12px;
    border: 1px solid #c8d0dc;
    border-radius: 6px;
    background: #ffffff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    color: #2c3a4c;
    cursor: pointer;
}
.selectIds .ids-head__close:hover {
    background: #f4f6fa;
}
.selectIds .ids-head__close:focus-visible {
    outline: 2px solid #1f4fa8;
    outline-offset: 2px;
}
.selectIds .ids-head__title {
    display: block;
    margin-bottom: 6px;
    font-size: 20px;
    font-weight: 900;
    letter-spacing: -0.02em;
    color: #16202e;
}
/* 안내 문구 마크업은 두 화면 모두 주석 처리돼 지금은 쓰이지 않는다 — 되살리면 적용된다 */
.selectIds .ids-head__desc {
    display: block;
    font-size: 15px;
    line-height: 1.65;
    color: #3b4a5e;
}
#idsTable {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border: none;
    border-top: 2px solid #16202e;
    white-space: normal;
}
#idsTable thead {
    display: table-header-group;
    background: #f7f9fc;
}
#idsTable tbody {
    display: table-row-group;
    height: auto !important;
    max-height: none !important;
}
#idsTable tr {
    display: table-row;
    width: auto;
}
#idsTable th,
#idsTable td {
    display: table-cell;
    padding: 12px 10px;
    border-top: none;
    border-right: none;
    border-bottom: 1px solid #e2e7ee;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0;
    vertical-align: middle;
    word-break: keep-all;
    overflow-wrap: anywhere;
}
#idsTable th {
    font-weight: 700;
    white-space: nowrap;
    color: #16202e;
}
#idsTable td {
    color: #3b4a5e;
}
#idsTable tbody tr:hover {
    background: #f7f9fc;
}
/* 열 너비: 사업자번호 · 회사명(나머지) · 가입일자 · 선택 */
#idsTable th:nth-child(1),
#idsTable td:nth-child(1) { width: 132px; }
#idsTable th:nth-child(2),
#idsTable td:nth-child(2) { width: auto; min-width: 0; max-width: none; text-align: left; }
#idsTable th:nth-child(3),
#idsTable td:nth-child(3) { width: 108px; }
#idsTable th:nth-child(4),
#idsTable td:nth-child(4) { width: 104px; max-width: none; text-align: center; }
#idsTable .btn--black {
    display: inline-block;
    width: auto;
    max-width: none;
    min-width: 0;
    height: 34px;
    padding: 0 14px;
    border: 1px solid #1f4fa8;
    border-radius: 6px;
    background: #1f4fa8;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
}
#idsTable .btn--black:hover {
    border-color: #173f8a;
    background: #173f8a;
}
#idsTable .btn--black:active {
    transform: none; /* 누르는 순간 내려가지 않게 */
}
/* 모바일: 표 → 사업장별 카드 (회사명을 제목으로, 사업자번호·가입일자는 항목명과 함께, 선택 버튼은 전체 폭) */
@media (max-width: 576px) {
    .selectIds .modalInr {
        width: calc(100% - 24px);
    }
    .selectIds .modalCont {
        padding: 20px 14px 14px;
    }
    .selectIds .ids-head__title {
        font-size: 18px;
    }
    .selectIds .ids-head__desc {
        font-size: 14px;
    }
    #idsTable,
    #idsTable tbody {
        display: block;
        border-top: none;
    }
    #idsTable thead {
        display: none;
    }
    #idsTable tbody tr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 2px 14px;
        margin-bottom: 10px;
        padding: 14px 14px 12px;
        background: #ffffff;
        border: 1px solid #e2e7ee;
        border-radius: 6px;
    }
    #idsTable tbody tr:empty {
        display: none; /* password_reset.js 가 .empty() 로 비워 둔 템플릿 행 */
    }
    #idsTable tbody tr:hover {
        background: #ffffff;
    }
    #idsTable td {
        display: block;
        width: auto !important;
        min-width: 0;
        max-width: none; /* armanager_main.css·loginNew.css 의 .bizNo(100px)·.sbscrbDe(90px) 최대폭 해제 — 글자 겹침 방지 */
        padding: 0;
        border: none;
        font-size: 13.5px;
        text-align: left !important;
    }
    #idsTable td:nth-child(2) {
        order: -1;
        flex-basis: 100%;
        margin-bottom: 4px;
        font-size: 16px;
        font-weight: 700;
        color: #16202e;
    }
    #idsTable td:nth-child(1),
    #idsTable td:nth-child(3) {
        flex-basis: 100%;
        white-space: nowrap;
        line-height: 1.7;
    }
    #idsTable td:nth-child(1)::before {
        content: '사업자번호 ';
        color: #5d6b7e;
    }
    #idsTable td:nth-child(3)::before {
        content: '가입일자 ';
        color: #5d6b7e;
    }
    #idsTable td:nth-child(4) {
        flex-basis: 100%;
        margin-top: 10px;
    }
    #idsTable .btn--black {
        display: block;
        width: 100%;
        height: 42px;
        font-size: 15px;
    }
}
