*{font-family:'Malgun Gothic','맑은 고딕',sans-serif;font-size:12px;box-sizing:border-box;}
body{background:#e8e8e8;margin:0;padding:0;min-width:1300px;}
/* ── 헤더 / 메뉴 ── */
#hd{background:#1a4a8a;position:sticky;top:0;z-index:1000;}
.menubar{display:flex;flex-wrap:nowrap;align-items:center;background:#2563a8;padding:0;min-height:36px;position:relative;z-index:200;overflow:visible;}
.menu-item{position:relative;flex-shrink:0;}
.menu-item>a{color:#cce0ff;padding:8px 14px;border-radius:3px;text-decoration:none;white-space:nowrap;font-weight:bold;display:flex;align-items:center;gap:4px;line-height:36px;}
.menu-item>a:hover,.menu-item>a.active{background:#4fdfd0;color:#000;}
.menu-item>a.has-sub::after{content:" ▾";font-size:9px;opacity:0.8;}
.submenu{display:none;position:absolute;top:100%;left:0;background:#1a3a6a;min-width:140px;border-radius:0 0 4px 4px;box-shadow:0 4px 12px rgba(0,0,0,0.35);z-index:1001;}
.menu-item:hover .submenu{display:block;}
.submenu a{display:block;color:#cce0ff;padding:8px 16px;text-decoration:none;white-space:nowrap;font-size:12px;border-bottom:1px solid rgba(255,255,255,0.07);}
.submenu a:last-child{border-bottom:none;}
.submenu a:hover,.submenu a.active{background:#4fdfd0;color:#000;}
.menubar-login{margin-left:auto;display:flex;align-items:center;gap:10px;color:#cce0ff;padding:0 14px;white-space:nowrap;}
.menubar-login a{color:#cce0ff;text-decoration:none;font-size:12px;font-weight:bold;display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:3px;}
.menubar-login a:hover{background:#4fdfd0;color:#000;}
.menubar-login .btn-logout{color:#ffaaaa!important;}
.menubar-login .btn-logout:hover{background:#cc3333!important;color:#fff!important;}

/* ══ 전체 레이아웃 ══ */
.page-wrap{display:flex;gap:12px;padding:12px 16px;height:calc(100vh - 36px);overflow:hidden;}

/* ══ 좌측 패널 (확장) ══ */
.left-panel{width:480px;flex-shrink:0;display:flex;flex-direction:column;gap:10px;overflow-y:auto;}

/* ══ 우측 패널 ══ */
.right-panel{flex:1;display:flex;flex-direction:column;gap:10px;overflow:hidden;min-width:0;}

/* ══ 패널 카드 ══ */
.panel-card{background:#fff;border:1px solid #d0d8e8;border-radius:6px;overflow:hidden;flex-shrink:0;}
.panel-card-hdr{background:#2563a8;color:#fff;padding:9px 16px;font-size:12px;font-weight:bold;display:flex;align-items:center;gap:6px;}
.panel-card-hdr i{font-size:13px;}
.panel-card-body{padding:16px;}

/* ══ 인라인 폼 ══ */
.form-row{display:flex;gap:10px;margin-bottom:11px;align-items:center;}
.form-row:last-child{margin-bottom:0;}
.form-row label{width:72px;flex-shrink:0;color:#555;font-size:11px;text-align:right;line-height:1.4;}
.form-row .req{color:#cc3333;margin-left:2px;}
.form-row input,.form-row select{flex:1;border:1px solid #c0cce0;border-radius:3px;padding:6px 9px;font-size:12px;}
.form-row input:focus,.form-row select:focus{outline:none;border-color:#2563a8;box-shadow:0 0 0 2px rgba(37,99,168,0.12);}
.form-row input[readonly]{background:#f5f5f5;color:#888;}
.form-hint{font-size:10px;color:#888;margin-left:4px;}
.form-btns{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #eee;}
.btn-pri{background:#2563a8;color:#fff;border:none;border-radius:4px;padding:7px 18px;cursor:pointer;font-size:12px;font-weight:bold;}
.btn-pri:hover{background:#1a4a8a;}
.btn-sec{background:#e0e0e0;color:#333;border:none;border-radius:4px;padding:7px 16px;cursor:pointer;font-size:12px;}
.btn-sec:hover{background:#ccc;}

/* ══ 권한 모델 안내 ══ */
.role-table{width:100%;border-collapse:collapse;font-size:11px;}
.role-table th{background:#2563a8;color:#fff;padding:6px 8px;text-align:center;font-weight:bold;white-space:nowrap;}
.role-table td{padding:6px 8px;border:1px solid #d0d8e8;vertical-align:top;line-height:1.5;}
.role-table tr:nth-child(even) td{background:#f8f9ff;}
.role-tag{display:inline-block;border-radius:10px;padding:1px 7px;font-size:10px;font-weight:bold;white-space:nowrap;margin:1px 1px 2px;}
.rt-9{background:#c00;color:#fff;} .rt-7{background:#0066cc;color:#fff;}
.rt-5{background:#2563a8;color:#fff;} .rt-4{background:#5a7a4a;color:#fff;}
.rt-4u{background:#fff;color:#5a7a4a;border:1px solid #5a7a4a;}

/* ══ 우측 툴바 ══ */
.um-toolbar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#fff;border-radius:6px;border:1px solid #d0d8e8;flex-wrap:wrap;flex-shrink:0;}
.um-toolbar select,.um-toolbar input[type=text]{border:1px solid #c0cce0;border-radius:3px;padding:4px 8px;font-size:12px;height:28px;}
.um-toolbar input[type=text]{width:160px;}
.um-toolbar .btn-search{background:#2563a8;color:#fff;border:none;border-radius:3px;padding:4px 12px;cursor:pointer;height:28px;font-size:12px;}
.um-toolbar .btn-search:hover{background:#1a4a8a;}

/* ══ 테이블 2분할 영역 ══ */
.um-tables-wrap{flex:1;display:flex;gap:10px;overflow:hidden;min-height:0;}
.um-table-section{display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid #d0d8e8;border-radius:6px;}
.um-table-section.sec-reg{flex:3;}   /* 등록사용자 - 더 넓게 */
.um-table-section.sec-unreg{flex:2;} /* 미등록파트너 - 조금 좁게 */
.um-section-hdr{background:#eef2fa;border-bottom:2px solid #2563a8;padding:7px 12px;font-size:11px;font-weight:bold;color:#1a4a8a;display:flex;align-items:center;gap:6px;flex-shrink:0;}
.um-section-hdr.unreg-hdr{border-bottom-color:#5a7a4a;color:#3d5c2e;}
.um-section-hdr span.cnt{margin-left:auto;font-size:11px;font-weight:normal;color:#666;}
.um-table-scroll{flex:1;overflow-y:auto;overflow-x:auto;}
.um-table{width:100%;border-collapse:collapse;}
.um-table thead th{background:#2563a8;color:#fff;padding:7px 6px;text-align:center;font-weight:bold;white-space:nowrap;border-right:1px solid rgba(255,255,255,0.15);position:sticky;top:0;z-index:1;font-size:11px;}
.um-table thead th:last-child{border-right:none;}
.um-table.unreg-tbl thead th{background:#5a7a4a;}
.um-table tbody tr{border-bottom:1px solid #eee;}
.um-table tbody tr:last-child{border-bottom:none;}
.um-table tbody tr:hover{background:#f5f8ff;}
.um-table tbody tr.row-selected{background:#e8f0ff!important;}
.um-table tbody td{padding:5px 8px;text-align:center;vertical-align:middle;border-right:1px solid #f0f0f0;font-size:11px;white-space:nowrap;}
.um-table tbody td:last-child{border-right:none;}
.um-table tbody td.td-name{text-align:left;font-weight:bold;}
.um-table tbody td.td-id{color:#2563a8;font-weight:bold;}
.um-empty{padding:24px;text-align:center;color:#aaa;font-size:11px;}

/* ══ 뱃지 ══ */
.lv-badge{display:inline-block;border-radius:10px;padding:1px 8px;font-size:11px;font-weight:bold;white-space:nowrap;}
.lv-9{background:#c00;color:#fff;}
.lv-7{background:#0066cc;color:#fff;}
.lv-5{background:#2563a8;color:#fff;}
.lv-4{background:#5a7a4a;color:#fff;}
.lv-4u{background:#fff;color:#5a7a4a;border:1px solid #5a7a4a;}
.act-on{color:#22863a;font-weight:bold;white-space:nowrap;}
.act-off{color:#aaa;white-space:nowrap;}

/* ══ 액션 버튼 ══ */
.btn-edit{background:none;border:1px solid #2563a8;color:#2563a8;border-radius:3px;padding:2px 6px;cursor:pointer;font-size:10px;}
.btn-edit:hover{background:#2563a8;color:#fff;}
.btn-pw{background:none;border:1px solid #888;color:#555;border-radius:3px;padding:2px 6px;cursor:pointer;font-size:10px;margin-left:2px;}
.btn-pw:hover{background:#555;color:#fff;}
.btn-del{background:none;border:1px solid #cc3333;color:#cc3333;border-radius:3px;padding:2px 6px;cursor:pointer;font-size:10px;margin-left:2px;}
.btn-del:hover{background:#cc3333;color:#fff;}
.btn-upgrade{background:none;border:1px solid #cc6600;color:#cc6600;border-radius:3px;padding:2px 6px;cursor:pointer;font-size:10px;margin-left:2px;}
.btn-upgrade:hover{background:#cc6600;color:#fff;}

/* ══ 모달 ══ */
.upgrade-hint{font-size:11px;color:#888;margin-top:4px;}
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:2000;align-items:center;justify-content:center;}
.modal-bg.show{display:flex;}
.modal{background:#fff;border-radius:8px;padding:0;width:420px;max-width:95vw;box-shadow:0 8px 32px rgba(0,0,0,0.3);overflow:hidden;}
.modal-hdr{background:#2563a8;color:#fff;padding:12px 16px;font-size:13px;font-weight:bold;display:flex;align-items:center;justify-content:space-between;}
.modal-hdr .btn-close{background:none;border:none;color:#fff;font-size:16px;cursor:pointer;padding:0 4px;line-height:1;}
.modal-hdr .btn-close:hover{color:#ffaaaa;}
.modal-body{padding:16px;}
.modal-btns{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;background:#f8f8f8;border-top:1px solid #eee;}

/* ══ 토스트 / 로딩 ══ */
#loader{display:none;position:fixed;inset:0;background:rgba(255,255,255,0.55);z-index:3000;align-items:center;justify-content:center;}
#loader.show{display:flex;}
#loader i{font-size:28px;color:#2563a8;animation:spin 0.8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
#toast{position:fixed;bottom:20px;right:20px;background:#222;color:#fff;padding:10px 18px;border-radius:6px;font-size:12px;z-index:4000;opacity:0;transition:opacity .3s;pointer-events:none;}
#toast.show{opacity:1;}
#toast.err{background:#cc3333;}

/* ══ 폼 모드 뱃지 ══ */
.form-mode-badge{margin-left:auto;font-size:10px;padding:2px 9px;border-radius:10px;font-weight:normal;}
.fmb-new{background:#22863a;color:#fff;}
.fmb-edit{background:#cc6600;color:#fff;}