@import url(eapRecordBindLayer.css);

#line_list_preview {
    display: flex;
    flex-wrap: nowrap;        /* 줄바꿈 없이 한 줄 */
    align-items: center;      /* 수직 가운데 정렬 */
    gap: 8px;                 /* 요소 간 여백 */
}

#line_list_preview,
#line_list_preview_approval,
#line_list_preview.mt_5 {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
}

#eapApprDraftLayer_lineDetail {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 24px;
    background: var(--color-bg-subtler);
    border: 1px solid var(--color-border);
    border-radius: 6px;
    opacity: 1;
    margin: 20px;
    font-family: 'Pretendard', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 140%;             /* 1.4 → 약 19.6px */
    letter-spacing: -0.2px;
    text-align: right;
}


.approval_arrow_type-sequence {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 0px;
    padding: 0;
    mask: url("../../img/svg/ic_cmm_apprline_right_filled.svg") no-repeat center/contain;
    background-color: var(--color-icon-primary);
    font-size: 0; /* 혹시 텍스트 아이콘 있으면 숨김 */
}

.approval_arrow_type-parallel {
    display: inline-block;
    width: 10px;
    height: 16px;
    margin: 0px;
    padding: 0;
    mask: url("../../img/svg/ic_cmm_apprline_bar_filled.svg") no-repeat center/contain;
    background-color: var(--color-icon-primary);
    font-size: 0;
}

.approval_arrow_type-recv {
    display: inline-block;
    width: 20px;
    height: 16px;
    margin: 0px;
    padding: 0;
    mask-repeat: no-repeat;
    mask-size: 10px 12px;
    mask-position: center;
    mask-image: url("../../img/svg/ic_appr_send_gray.svg");
    background-color: var(--color-icon-primary);
    font-size: 0;
}


.font-bold {
    font-family: 'Pretendard', sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: -0.2px;
    color: var(--color-text);
}

.table_wrap table {
    width: 100%;
    border-collapse: collapse;
    background-color: var(--color-bg-default);
    font-family: 'Pretendard', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text);
    line-height: 1.4;
}

/* 헤더 스타일 */
.table_wrap table thead th {
    background-color: var(--color-bg-subtler);
    text-align: left;
    padding: 12px 16px;


    font-weight: 500;
    font-size: 14px;
}

/* 바디 셀 */
.table_wrap table tbody td {
    padding: 12px 16px;
}

/* 첫 번째 열 좌측 정렬 */
.table_wrap table th:first-child,
.table_wrap table td:first-child {
    text-align: left;
}

/* 선택적으로 마지막 행 border 제거 */
.table_wrap table tbody tr:last-child td {
    border-bottom: none;
}

.table_type1 table th {
    min-height: 36px;
    padding: 10px 10px 10px 10px;
    background-color: var(--color-bg-default);
    text-align: center;
    border : none;
}

.table_type1 table td {
    min-height: 36px;
    border : none;
}

.table_type1 {
  border : none ;
    margin-left:24px;
    margin-right:24px;
}

.table_wrap th[scope="row"] {
    font-family: 'Pretendard', sans-serif;
    font-weight: 400;         /* Medium */
    font-style: normal;
    font-size: 14px;
    line-height: 34px;
    letter-spacing: -0.2px;
}

.form_row {
    display: flex;
    align-items: flex-start; /* label과 textarea 상단 정렬 */
    gap: 8px; /* label과 textarea 간격 */
    margin-left:24px;
    margin-right:24px;
}

.form_row .form_label {
    min-width: 120px;         /* 원하는 라벨 고정 너비 */
    font-family: 'Pretendard', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 36px;
    letter-spacing: -0.2px;
    padding: 10px;
}

.form_row .textarea_wrap {
    width: 100%;
    margin-right: 20px;
}

.form_row .textarea_wrap textarea {
    width: 100%;
    min-height: 80px;
    resize: vertical;
    font-family: 'Pretendard', sans-serif;
    font-size: 14px;
    padding: 8px;
    line-height: 1.5;
    border: 1px solid var(--color-input-border);
    border-radius: 4px;
}

.checkbox_inline_list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px; /* li 간격 */
    list-style: none;
    padding: 0;
    margin: 0;
}

.checkbox_inline_list li {
    display: inline-flex;
    align-items: center; /* ← 핵심: 텍스트와 checkbox 수직 중앙 정렬 */
    gap: 6px;
}

/* 체크박스 커스텀 (전사 CSS 무시 버전) */
.checkbox_inline_list input[type="checkbox"] {
    all: unset;
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border: 1px solid var(--color-input-border);
    border-radius: 4px;
    background-color: var(--color-input-surface);
    cursor: pointer;
    position: relative;
    display: inline-block;
}

.checkbox_inline_list input[type="checkbox"]:checked {
    background-color: var(--color-input-border-primary);
    border-color: var(--color-input-border-primary);
}

.checkbox_inline_list input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid var(--color-border-inverse);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}





#eapApprDraftLayer_draftInfo .btn_area .btn {
    width: 80px;
    height: 40px;
    border-radius: 6px;
    padding: 0 26px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-family: 'Pretendard', sans-serif;
    font-size: 14px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    gap: 10px;
    opacity: 1;
}

/*.pop_container.address_book.type_approval .btn_area .btn {*/
/*    display: none ;*/
/*}*/

#eapApprDraftLayer_draftInfo #eapApprDraftLayer_draftBtn {
    background-color: var(--color-button-bg-primary-fill);
    color: var(--color-text-inverse);
}

#eapApprDraftLayer_draftInfo #eapApprDraftLayer_cancelBtn {
    background-color: var(--color-button-bg-secondary-fill);
    border: var(--color-button-border-secondary);
    color: var(--color-text);
}

.bindOptBtn {
    /*border: 1px solid #ccc;*/
}


#eapApprDraftLayer_chkAllOfcDocPublicType input[type="checkbox"] {
    all: unset;
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border: 1px solid var(--color-input-border);
    border-radius: 4px;
    background-color: var(--color-input-surface);
    cursor: pointer;
    position: relative;
    display: inline-block;
}

input[type="checkbox"]:checked {
    background-color: var(--color-input-border-primary);
    border-color: var(--color-input-border-primary);
}

input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid var(--color-border-inverse);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}



/**
 * @Author mhlee
 * @Date 25.10.16
 * 전자결재 기록물철 선택 LAYER작업
 */
/*//.search_list_wrap .search_area{*/
/*//    all: unset;*/
/*//    display: flex;*/
/*//    align-items: center;*/
/*//    border: 1px solid #E0E2E7;*/
/*//    border-radius: 10px;*/
/*//    height: 40px;*/
/*//    padding: 0 16px 0 12px;*/
/*//}*/

/*//.search_list_wrap .search_area .search_icon {*/
/*//    all: unset;*/
/*//    width: 24px;*/
/*//    height: 24px;*/
/*//    padding: 2px;*/
/*//}*/

/*//.search_list_wrap .search_area label {*/
/*//    all: unset;*/
/*//    font-family: Pretendard, sans-serif;*/
/*//    font-size: 1rem;*/
/*//    font-weight: normal;*/
/*//    width: 100%;*/
/*//}*/

/*//.search_list_wrap .search_area input {*/
/*//    all: unset;*/
/*//    line-height: 150%;*/
/*//    letter-spacing: -0.2px;*/
/*//    border: none;*/
/*//    width: 100%;*/
/*//    cursor: text;*/
/*//}*/
/*//*/
/*//.search_list_wrap .search_area .search_icon_box {*/
/*//    all: unset;*/
/*//    display: flex;*/
/*//    align-items: center;*/
/*//    cursor: pointer;*/
/*//}*/
/*//*/
/*//.search_list_wrap .search_list_area.alone .search_list_tree {*/
/*//    padding: 16px;*/
/*//    border: 1px solid #E0E2E7;*/
/*//    border-radius: 10px;*/
/*//    height: 393px;*/
/*//    max-height: 393px;*/
/*//    margin-top: 16px;*/
/*//}*/
/*//*/
/*//.subtab li a {*/
/*//    all: unset;*/
/*//    display: block;*/
/*//    height: 28px;*/
/*//    font-weight: 600;*/
/*//    font-family: Pretendard, sans-serif;*/
/*//    font-size: 14px;*/
/*//    width: 65px;*/
/*//    text-align: center;*/
/*//}*/


/*//.subtab li.tab_active a {*/
/*//    border-bottom : 2px solid;*/
/*//    color: #5C74D8;*/
/*//    border-color: #5C74D8;*/
/*//    font-weight: 600;*/
/*//    font-family: Pretendard, sans-serif;*/
/*//    font-size: 14px;*/
/*//    width: 65px;*/
/*//    text-align: center;*/
/*//}*/

/*//.search_list_wrap .search_list_area.alone.alone_type1 .search_list_tree {*/
/*//    height: 393px;*/
/*//    max-height: 393px;*/
/*//}*/
/*//*/
/*//.search_list_wrap .search_list_area.alone.alone_type2 .search_list_tree {*/
/*//    height: 449px;*/
/*//    max-height: 449px;*/
/*//}*/
/*//*/
/*//.search_list_wrap .search_list_area .search_list {*/
/*//    all: unset;*/
/*//}*/
/*//*/
/*//.search_list_wrap .search_area input[type=text] {*/
/*//    all: unset;*/
/*//}*/
/*//*/
/*//.recBindLayer {*/
/*//    padding: 0px 24px 16px 24px;*/
/*//}*/

.result_type1 .search_list_tree {
    height: 245px !important;
    max-height: 245px !important;
}

.table_type1.th_type1 table th:first-child {
    border-width: 0 1px 1px 0;
    font-weight: 500;
    font-family: Pretendard, sans-serif;
    font-size: 14px;
    letter-spacing: -0.2px;
}


#eapApprDraftLayer_recBindOptSelect{

    margin-left : 6px;

}


.scroll_wrap.custom_scroll {
    max-height: 60vh; /* 또는 height: 400px; */
    overflow-y: auto;
    overflow-x: hidden; /* 필요 시 auto */
    /*border: 1px solid #e0e0e0; !* 선택사항: 스크롤 영역 구분 *!*/
}



.checkbox-row {

    margin-bottom: 8px; /* 줄 간 간격 */
    font-family: Pretendard, sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #333;
}

table input[type=radio], table input[type=checkbox] {
    vertical-align: middle;
    padding: 0;
    margin: -2px 0 0 0;
}


input[type="checkbox"] {
    all: unset;
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border: 1px solid #B2B3B9;
    border-radius: 4px;
    background-color: #fff;
    cursor: pointer;
    position: relative;
    display: inline-block;
}

input[type="checkbox"]:checked {
    background-color: #5C74D8;
    border-color: #5C74D8;
}

input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}


input[type=text].input_txt_type4, input[type=password].input_txt_type4, input[type=number].input_txt_type4 {
    width: 250px;
}

input[type=text], input[type=password], input[type=number] {
    width: 100%;
    height: 36px;
    padding: 0 10px;
    border-style: solid;
    border-color: #cccccc;
    border-width: 1px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    line-height: 29px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

