:root {
    --app-font: "SUIT Variable","Noto Sans KR","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}


body, html {
    font-family: var(--app-font);
    font-size: 13px !important;
    font-weight: 500; /* 지나치게 얇은 가중치 방지 */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.dx-tab-text,
.section-title, .section-title2, .span,
.form-control,
.top-menu-select .dx-texteditor-input,
.menuLabel, .dx-item-content, .dx-texteditor-input, .dx-widget input,
.title-content, .dx-toolbar-before, .checkLabel, .pageGroups, .dx-widget, .label, .input,
.dx-theme-material-typography h3,
.icon,
.pdf-settings-popup2 .dx-texteditor-input,
.pdf-settings-popup2 .dx-widget input,
.pdf-settings-popup .dx-texteditor-input,
.pdf-settings-popup .dx-widget input {
    font-family: var(--app-font) !important;
}


.dx-tab-text {
    font-size: 13px !important;
    font-weight: bold;
}

.section-title, .section-title2, .span {
    font-size: 13px !important;
    font-weight: bold;
}

.form-control {
    font-size: 13px !important;
}

/*탑메뉴*/
.top-menu-select .dx-texteditor-input {
    font-size: 13px !important;
    font-weight: bold;
    text-align: center;
}

.menuLabel, .dx-item-content, .dx-texteditor-input, .dx-widget input {
    font-size: 14px;
    font-weight: bold;
}

.title-content, .dx-toolbar-before, .checkLabel, .pageGroups, .dx-widget, .label, .input {
    font-size: 12px !important;
}

.dx-theme-material-typography h3 {
    font-size: 15px !important;
    font-weight: bold;
}
/*icon*/
.dx-form-group-caption::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: "\f152";
    margin-right: 8px;
    font-size: 13px;
}

/*사원정보 form */
.custom-employee .dx-texteditor-input,
.custom-employee .dx-widget input {
    font-size: 12px !important;
    font-weight: normal !important;
}

.custom-popup .dx-widget input, .custom-popup .dx-texteditor-input {
    font-size: 13px !important;
    font-weight: normal !important;
}

.custom-popup-bottom .dx-widget input {
    font-size: 13px !important;
    font-weight: normal !important;
}

.icon {
    font-size: 12px !important;
}
/*메뉴 폰트사이즈 (memberRules만 적용되어 있음.)*/
.dx-theme-material-typography h3 {
    font-size: 13px;
}

/*검색*/
.dx-editor-cell .dx-texteditor .dx-texteditor-input {
    background: rgba(255, 255, 255, 0);
    font-size: 13px;
    height: 30px !important;
}
/*공장을 선택하세요*/
.dx-placeholder {
    font-size: 12px !important;
    font-weight: bold;
}

/*메뉴관리 하위메뉴 추가 / 수정*/
.custom-input-id, .custom-input, .custom-input-url {
    font-size: 13px !important;
    font-weight: normal !important;
}


/* 테이블 행의 기본 간격 조절 */
:root {
    --col-width-1: 50px;
    --col-width-2: 200px;
    --col-width-3: 150px;
}

/* 데이터 셀 중앙 정렬 */
.dx-datagrid .dx-header-row > td {
    text-align: center !important;
}

/* 테이블 행의 기본 간격 조절 */
.panel .dx-datagrid-header-panel th:nth-child(1),
.panel .dx-datagrid-content td:nth-child(1) {
    width: var(--col-width-1);
}
/* 테이블 행의 기본 간격 조절 */
.panel .dx-datagrid-header-panel th:nth-child(2),
.panel .dx-datagrid-content td:nth-child(2) {
    width: var(--col-width-2);
}
/* 테이블 행의 기본 간격 조절 */
.panel .dx-datagrid-header-panel th:nth-child(3),
.panel .dx-datagrid-content td:nth-child(3) {
    width: var(--col-width-3);
}

/*Split*/
.gutter {
    background-color: #FAFAFA;
}

    .gutter.gutter-horizontal {
        cursor: col-resize;
    }

    .gutter.gutter-vertical {
        cursor: row-resize;
    }

/*그리드 헤더*/
.dx-datagrid .dx-header-row .dx-datagrid-text-content {
    font-size: 12px;
    font-weight: normal;
}

/*테이블 헤더 색상*/
.dx-datagrid-headers {
    background-color: #e8f2fc !important;
    color: #000;
}

    /* 헤더 셀 hover 색상 */
    .dx-datagrid-headers .dx-header-row > td:hover .dx-datagrid-text-content,
    .dx-datagrid-headers .dx-header-row > td.dx-state-hover .dx-datagrid-text-content,
    .dx-datagrid-headers .dx-header-row > td.dx-state-active .dx-datagrid-text-content {
        color: #FF7043 !important;
    }

/* 데이터 셀 테두리 */
.dx-datagrid .dx-row > td {
    border: 1px solid #ebebeb;
}

/*테이블 행 간격*/
.dx-datagrid .dx-row > td {
    padding: 6px 5px;
    font-size: 12px;
    line-height: 15px;
}

/* 체크박스 중앙 정렬 */
.dx-checkbox-icon {
    margin: 0px;
}

/* 데이터가 있는 행만 hover 색상 적용 */
.dx-datagrid-rowsview .dx-data-row:hover > td {
    background-color: #FAD2CC !important;
}

.dx-datagrid-rowsview .dx-data-row:hover {
    cursor: pointer;
}

/* 빈 행(freespace)은 원래 배경 유지 */
.dx-datagrid-rowsview .dx-freespace-row:hover {
    background-color: inherit !important;
    cursor: default !important;
}


/* 헤더에는 hover 효과 제거 */
.dx-datagrid-headers .dx-header-row:hover,
.dx-datagrid .dx-header-row:hover {
    background-color: transparent !important;
    cursor: default !important;
}


/* 클릭된 행 강조 색상 */
.highlighted-row {
    background-color: #FAD2CC !important;
}


/* 홀수/짝수 스타일을 유지하면서 클릭된 행 강조 */
.dx-row.dx-row-alt.highlighted-row {
    background-color: #FAD2CC !important; /* 짝수 행 스타일 유지 */
}

.dx-row:not(.dx-row-alt).highlighted-row {
    background-color: #FAD2CC !important; /* 홀수 행 스타일 유지 */
}


/* 기존 DevExtreme 선택 스타일 제거 */
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) td {
    background-color: transparent !important;
    color: inherit !important;
}

/* 기존 DevExtreme 초점 스타일 제거 */
.dx-datagrid-rowsview .dx-state-focused td {
    background-color: transparent !important;
    outline: none !important;
}


/*input(popup-input도 포함)*/
.dx-texteditor-input {
    background-color: #fff;
}

/*popup - label*/
.dx-field-item-label-text {
    color: #000;
}

/*popup 저장 닫기 색상*/
.dx-button-mode-text.dx-button-default {
    color: #000;
}

.dx-datagrid-headers .dx-command-select {
    height: 35px;
}

.dx-datagrid .dx-datagrid-table .dx-header-row > td {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}


/*열 고정 폭*/
.dx-context-menu .dx-menu-item .dx-menu-item-content {
    padding: 2px 8px;
}

/*기본 input박스 밑줄 없앤거*/
.dx-texteditor::after {
    width: 0;
}
/*input박스 값 박스*/
.dx-texteditor-container {
    border: 1px solid gray;
    border-radius: 3px
}
/*input박스 배경색상 */
.dx-field-item-label-content {
    background-color: #E3EAFD;
}


/* dx-button의 기본 둥근 스타일 제거 */
.dx-button.dx-closebutton {
    border-radius: 0 !important; /* 둥근 모서리를 직각으로 */
    width: 30px !important; /* 버튼 너비 */
    height: 30px !important; /* 버튼 높이 */
    display: flex !important;
    justify-content: center;
    align-items: center;
}

/* 버튼 컨테이너 스타일 (간격 추가) */
.dx-toolbar-center {
    display: flex;
    justify-content: center; /* 버튼 중앙 정렬 */
    gap: 15px; /* 버튼 간 간격 */
    margin-top: 20px; /* 버튼과 위 요소 간격 */
}

/* 저장 버튼 스타일 */
.dx-toolbar-item .dx-button[aria-label="저장"] {
    background-color: #0056b3;
    color: white;
    border: none;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 버튼 그림자 추가 */
}

    .dx-toolbar-item .dx-button[aria-label="저장"]:hover {
        background-color: #0056b3; /* 저장 버튼 호버 시 색상 */
    }

/* 저장 버튼 스타일 */
.dx-toolbar-item .dx-button[aria-label="선택"] {
    background-color: #0056b3;
    color: white;
    border: none;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 버튼 그림자 추가 */
}

    .dx-toolbar-item .dx-button[aria-label="선택"]:hover {
        background-color: #0056b3; /* 저장 버튼 호버 시 색상 */
    }

/* 확인 버튼 스타일 */
.dx-toolbar-item .dx-button[aria-label="확인"] {
    background-color: #28a745;
    color: white;
    border: none;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

    .dx-toolbar-item .dx-button[aria-label="확인"]:hover {
        background-color: #218838; /* 확인 버튼 호버 시 색상 */
    }

/* 취소 버튼 스타일 */
.dx-toolbar-item .dx-button[aria-label="취소"] {
    background-color: #f8f9fa;
    color: #333;
    border: 1px solid #ccc;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 버튼 그림자 추가 */
}

    .dx-toolbar-item .dx-button[aria-label="취소"]:hover {
        background-color: #e2e6ea; /* 취소 버튼 호버 시 색상 */
    }

/*팝업창 저장, 닫기*/
.dx-button {
    height: 40px;
}

/*팝업 제목 높이 조절*/
.dx-popup-title.dx-toolbar .dx-toolbar-items-container {
    height: 35px;
}

/*pdf 팝업창*/
.pdf-settings-popup .dx-field-item-label-content {
    width: 135px !important;
    border-radius: 3px
}

/*pdf 팝업창*/
.pdf-settings-popup2 .dx-layout-manager .dx-field-item {
    padding-bottom: 0px;
}

/*pdf 팝업창*/
.pdf-settings-popup .dx-tagbox .dx-tag-container {
    padding-top: 0px;
    padding-bottom: 5px;
    gap: 10px;
}
/*pdf 팝업창*/
.pdf-settings-popup .dx-popup-content {
    padding: 10px;
}

/*pdf 팝업창*/
.dx-texteditor.dx-editor-filled {
    background-color: transparent !important;
}

.pdf-settings-popup2 .dx-texteditor-input,
.pdf-settings-popup2 .dx-widget input {
    font-size: 13px !important;
    font-weight: normal !important;
}

.pdf-settings-popup2 .dx-item-content {
    font-size: 13px !important;
}

.dx-layout-manager .dx-field-item {
    font-size: 13px !important;
}

.pdf-settings-popup2 .dx-list-item-content {
    padding: 3px 10px 5px !important;
    font-weight: normal !important;
}

.pdf-settings-popup .dx-texteditor-input,
.pdf-settings-popup .dx-widget input {
    font-size: 13px !important;
    font-weight: normal !important;
}

.pdf-settings-popup .dx-list-item-content {
    font-weight: normal !important;
}



.pdf-settings-popup2 .dx-texteditor.dx-editor-filled {
    background-color: none !important;
}

/*팝업창 제목*/
.dx-form-group-caption {
    font-size: 14px;
}

.dx-field-item-label-content {
    border-radius: 3px;
}
/*드롭다운 패딩*/
.dx-list-item-content {
    padding: 5px 15px 5px;
}

.dx-tagbox-popup-wrapper .dx-list-select-all {
    padding-bottom: 3px;
    margin-bottom: 4px;
    padding-top: 10px;
    font-size: 14px;
}


.dx-invalid.dx-texteditor.dx-show-invalid-badge .dx-texteditor-input-container::after {
    margin-top: -9px;
    margin-right: -8px;
    width: 18px;
    height: 18px;
    line-height: 20px;
    font-size: 13px;
}

.dx-datebox-date .dx-dropdowneditor-icon {
    font: 20px/24px DXIcons !important;
}


/*공장구분 셀렉트박스*/
.section-pltcode {
    height: 43px;
    width: 100%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    background-color: #c3e0ff;
    margin-bottom: 5px;
    gap: 10px;
    border-bottom: 1px solid #c3e0ff;
}

/*공장구분 셀렉트박스*/
.dx-texteditor-buttons-container {
    background-color : #f6f6f6;
}
/* 레이블 스타일 */
.section-pltcode-title {
    display: block;
    margin-bottom: 0px;
    white-space: nowrap;
    margin-left: 15px;
    font-weight: bold;
}

    .section-pltcode-title::before {
        font-family: "Font Awesome 5 Free" !important;
        font-weight: 900;
        content: "\f152";
        margin-right: 8px;
        font-size: 13px;
    }
/*공장 목록*/
#pltCodeSelectBox {
    width: 15% !important;
    height: 35px;
}
    /*공장 목록*/
    #pltCodeSelectBox .dx-texteditor-input {
        font-size: 13px !important;
    }
/*공장 목록 드롭다운*/
.custom-selectbox-item {
    font-size: 13px;
    line-height: 15px;
}

/*팝업창 제목*/
.title-custom .dx-button-text {
    font-size: 15px;
}

.title-custom-close .dx-icon {
    color: #000 !important;
}

/*라인 색상*/
.dx-datagrid .dx-row-alt > td {
    background-color: #ededed !important;
}