<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">

<head>
    <title>진료유형 정보</title>
    <link rel="stylesheet" th:href="@{/css/common.css}">
    <script th:src="@{/js/web/jquery.min.js}"></script>
    <style>
        .pop_wrap {
            max-width: 600px;
            margin: 0 auto;
        }

        .pop_wrap h3 {
            font-size: 16px;
            margin-bottom: 16px;
            padding-bottom: 10px;
            border-bottom: 2px solid #3985EA;
            color: #333;
        }

        .board_write {
            width: 100%;
            border-collapse: collapse;
        }

        .board_write th {
            background: #f8f9fb;
            padding: 10px 12px;
            text-align: left;
            font-size: 13px;
            font-weight: 600;
            color: #555;
            border: 1px solid #e9ecf0;
            white-space: nowrap;
        }

        .board_write td {
            padding: 8px 12px;
            border: 1px solid #e9ecf0;
        }

        .board_write input[type="text"],
        .board_write input[type="number"] {
            height: 30px;
            border: 1px solid #ddd;
            border-radius: 4px;
            padding: 0 8px;
            font-size: 13px;
        }

        .board_write select {
            height: 30px;
            border: 1px solid #ddd;
            border-radius: 4px;
            padding: 0 8px;
            font-size: 13px;
        }

        .w100p {
            width: 100%;
            box-sizing: border-box;
        }

        .w80 {
            width: 80px;
        }

        .w120 {
            width: 120px;
        }

        .ess {
            color: #ff0000;
        }

        .txt_info {
            font-size: 11px;
            color: #999;
        }

        .pop_btn_area {
            text-align: center;
            margin-top: 20px;
        }

        .btn_blue {
            padding: 8px 24px;
            background: #3985EA;
            color: #fff;
            border: none;
            border-radius: 5px;
            font-size: 14px;
            font-weight: 600;
            cursor: pointer;
        }

        .btn_blue:hover {
            background: #2c6fd1;
        }

        .btn_gray {
            padding: 8px 24px;
            background: #fff;
            color: #666;
            border: 1px solid #ddd;
            border-radius: 5px;
            font-size: 14px;
            cursor: pointer;
            margin-left: 6px;
        }

        .btn_gray:hover {
            background: #f5f5f5;
        }

        .btn_red {
            padding: 8px 24px;
            background: #ff4444;
            color: #fff;
            border: none;
            border-radius: 5px;
            font-size: 14px;
            font-weight: 600;
            cursor: pointer;
            margin-left: 6px;
        }

        .btn_red:hover {
            background: #cc0000;
        }
    </style>
</head>

<body style="padding: 20px;">
    <div class="pop_wrap">
        <h3 id="popTitle">진료유형(Depth 2) 등록</h3>
        <input type="hidden" id="pid" value="">
        <input type="hidden" id="diviDept" value="2">
        <input type="hidden" id="diviParent" value="">
        <input type="hidden" id="storePid" value="1">

        <table class="board_write">
            <colgroup>
                <col width="120px">
                <col width="*">
            </colgroup>
            <tbody>
                <tr id="parentNameRow" style="display:none;">
                    <th>상위 카테고리</th>
                    <td><span id="parentNameTxt"></span></td>
                </tr>
                <tr>
                    <th><span class="ess">*</span> 항목 명칭</th>
                    <td><input type="text" id="diviName" class="w100p" placeholder="예: 피부, 보톡스, 제모 등"></td>
                </tr>
                <tr>
                    <th>정렬 순서</th>
                    <td><input type="number" id="diviSort" class="w80" value="0"> <span class="txt_info">숫자가 낮을수록 먼저
                            표시됩니다.</span></td>
                </tr>
                <tr>
                    <th>색상 코드</th>
                    <td><input type="color" id="diviColor" value="#000000"></td>
                </tr>
            </tbody>
        </table>

        <div class="pop_btn_area">
            <button type="button" class="btn_blue" id="btn_save">저장</button>
            <button type="button" class="btn_red" id="btn_delete" style="display:none;">삭제</button>
            <button type="button" class="btn_gray" id="btn_close">닫기</button>
        </div>
    </div>

    <script th:src="@{/js/web/settings/medicalcategory/popup/medicalCategoryInfoPopDept2.js}"></script>
</body>

</html>