/* ═══════════════════════════════════════════════
 *  급여제공모니터링 (benefit-monitoring)
 * ═══════════════════════════════════════════════ */

.bm-page {
	padding: 20px 24px;
	color: #0f172a;
	display: flex;
	flex-direction: column;
	height: 100vh;
	box-sizing: border-box;
}

/* ═══ Split Layout ═══ */
.bm-split {
	display: grid;
	grid-template-columns: 360px 1fr;
	gap: 16px;
	flex: 1;
	min-height: 0;
}

/* ─── 좌측 패널 ─── */
.bm-left {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.bm-left__head {
	padding: 14px 16px 10px;
	border-bottom: 1px solid #f1f5f9;
}
.bm-left__title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14.5px;
	font-weight: 700;
	color: #0f172a;
}
.bm-left__title i { color: #0891b2; font-size: 15px; }
.bm-count {
	margin-left: auto;
	padding: 2px 10px;
	background: #ecfeff;
	color: #0891b2;
	border-radius: 10px;
	font-size: 12px;
	font-weight: 800;
}

/* 검색 */
.bm-search {
	position: relative;
	margin: 10px 16px 10px;
}
/* 돋보기 아이콘만 — 직계 자식으로 한정. (× 버튼 안의 <i> 까지 absolute 로 밀려 삐뚤어지던 버그) */
.bm-search > i {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: #94a3b8;
	font-size: 13px;
	pointer-events: none;
}
.bm-search input {
	width: 100%;
	padding: 9px 36px 9px 36px;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	font-size: 14px;
	font-family: inherit;
	color: #0f172a;
	background: #fff;
	box-sizing: border-box;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.bm-search input:focus {
	outline: none;
	border-color: #0891b2;
	box-shadow: 0 0 0 3px rgba(8,145,178,0.12);
}
.bm-search__clear {
	position: absolute;
	right: 6px;
	top: 50%;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	border: none;
	background: #f1f5f9;
	color: #94a3b8;
	border-radius: 50%;
	cursor: pointer;
	display: none;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	padding: 0;
	line-height: 1;
}
.bm-search__clear i { position: static; transform: none; pointer-events: none; }
.bm-search__clear:hover { background: #e2e8f0; color: #475569; }

/* 필터 칩 */
.bm-filter-chips {
	display: flex;
	gap: 4px;
	padding: 0 16px 12px;
	flex-wrap: wrap;
}
.bm-chip {
	padding: 3px 8px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	font-size: 11.5px;
	font-weight: 600;
	color: #64748b;
	cursor: pointer;
	transition: all 0.15s;
	font-family: inherit;
	white-space: nowrap;
}
.bm-chip:hover {
	background: #ecfeff;
	border-color: #a5f3fc;
	color: #0891b2;
}
.bm-chip.active {
	background: linear-gradient(180deg, #0891b2, #0e7490);
	border-color: #0e7490;
	color: #fff;
	box-shadow: 0 2px 6px rgba(124,58,237,0.25);
}

/* 목록 */
.bm-list-wrap {
	flex: 1;
	overflow-y: auto;
	padding: 0 0 12px;
}
.bm-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 0 8px;
}
.bm-item {
	padding: 10px 12px;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.12s;
	border: 1px solid transparent;
}
.bm-item:hover {
	background: #f8fafc;
	border-color: #e2e8f0;
}
.bm-item.selected {
	background: #ecfeff;
	border-color: #a5f3fc;
}
.bm-item.selected .bm-item__name { color: #0e7490; }
.bm-item__row1 {
	display: flex;
	align-items: baseline;
	gap: 8px;
	min-width: 0;
}
.bm-item__name {
	font-size: 15px;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.3;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	flex-shrink: 0;
}
.bm-item__num {
	display: inline-block;
	padding: 2px 8px;
	background: transparent;
	color: rgba(15, 23, 42, 0.9);
	border: 1px solid #c7d2fe;
	border-radius: 4px;
	font-family: 'Consolas', 'Menlo', monospace;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.2px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bm-item.selected .bm-item__num {
	border-color: #6366f1;
}
.bm-item__row2 { margin-top: 4px; }
.bm-item__grade {
	display: inline-block;
	padding: 1px 7px;
	background: #fef3c7;
	color: #92400e;
	border-radius: 4px;
	font-weight: 700;
	font-size: 11.5px;
}

/* 로딩 / 에러 / 빈 상태 */
.bm-list__loading,
.bm-list__error,
.bm-list__empty {
	padding: 50px 20px;
	text-align: center;
	color: #94a3b8;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.bm-list__loading i,
.bm-list__error i,
.bm-list__empty i {
	display: block;
	font-size: 32px;
	margin-bottom: 10px;
	color: #cbd5e1;
}
.bm-list__loading p,
.bm-list__error p,
.bm-list__empty p {
	margin: 0 0 4px;
	font-size: 14px;
	color: #64748b;
	font-weight: 600;
}
.bm-list__error i { color: #f59e0b; }
.bm-list__error small { font-size: 12px; color: #94a3b8; }

/* ─── 우측 패널: 급여제공계획서 모니터링 ─── */
.bm-right {
	background: #f4f6fa;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	min-height: 0;
	overflow-y: auto;
}
.bm-doc {
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* 공통 카드 */
.bm-card {
	background: #fff;
	border: 1px solid #e6ebf2;
	border-radius: 14px;
	box-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 10px 28px -22px rgba(15,23,42,0.22);
	overflow: hidden;
}
.bm-card__head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 20px;
	border-bottom: 1px solid #eef2f7;
	font-size: 14px;
	font-weight: 700;
	color: #0f172a;
	letter-spacing: -0.2px;
}
.bm-card__head i {
	font-size: 12px;
	color: #0891b2;
	background: #ecfeff;
	border: 1px solid #cffafe;
	width: 26px;
	height: 26px;
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* ① 문서 헤더 카드 */
.bm-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding: 22px 26px;
	background: linear-gradient(120deg, #ffffff 52%, #f0fbfd 100%);
}
.bm-hero__left {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}
.bm-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 1.4px;
	color: #0891b2;
}
.bm-hero__eyebrow i { font-size: 11px; }
.bm-hero__title {
	margin: 0;
	font-size: 23px;
	font-weight: 800;
	letter-spacing: -0.4px;
	color: #0b1324;
	line-height: 1.25;
}
.bm-hero__meta {
	flex-shrink: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(160px, 1fr));
	gap: 1px;
	background: #e8edf4;
	border: 1px solid #e8edf4;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.bm-meta__item {
	background: #fff;
	padding: 11px 16px;
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.bm-meta__label {
	font-size: 11px;
	font-weight: 600;
	color: #8794a8;
	letter-spacing: 0.2px;
	white-space: nowrap;
}
.bm-meta__val {
	font-size: 13.5px;
	font-weight: 700;
	color: #0f172a;
}
/* 입력 가능한 헤더 항목(기호·평가일·작성자).
   읽기 항목(.bm-meta__val)과 글자 크기·굵기를 맞춰, 편집칸인 건 테두리로만 알린다. */
.bm-meta__inp {
	width: 100%;
	box-sizing: border-box;
	padding: 4px 8px;
	margin: -4px -8px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.4;
	transition: border-color .15s, background .15s, box-shadow .15s;
}
.bm-meta__inp::placeholder { color: #cbd5e1; font-weight: 500; }
.bm-meta__inp:hover  { border-color: #dbe3ee; background: #fff; }
.bm-meta__inp:focus {
	outline: none;
	border-color: #2563eb;
	background: #fff;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* ② 수급자 정보 카드 */
.bm-inf {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: #eef2f7;
}
.bm-inf__item {
	background: #fff;
	padding: 13px 20px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}
.bm-inf__label {
	font-size: 11.5px;
	font-weight: 600;
	color: #8794a8;
	letter-spacing: 0.2px;
}
.bm-inf__val {
	font-size: 14.5px;
	font-weight: 700;
	color: #0f172a;
	min-height: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ③ 목표달성 모니터링 표 */
.bm-gt-wrap { overflow-x: auto; }
.bm-gt {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
	color: #0f172a;
}
.bm-gt thead th {
	background: #f8fafc;
	padding: 9px 12px;
	font-size: 12.5px;
	font-weight: 700;
	color: #475569;
	text-align: center;
	white-space: nowrap;
	border-bottom: 1px solid #e6ebf2;
	border-right: 1px solid #eef2f7;
}
.bm-gt thead th:last-child { border-right: none; }
/* 컬럼 폭 — 합계 100% (미지정 컬럼에 잔여폭이 몰리는 것 방지) */
.bm-gt-goal  { width: 26%; }
.bm-gt-cause { width: 30%; }
.bm-gt-plan  { width: 34%; }
.bm-gt-chkth { width: 5%; min-width: 52px; }
.bm-gt tbody td {
	padding: 8px;
	vertical-align: top;
	border-bottom: 1px solid #eef2f7;
	border-right: 1px solid #f3f6fa;
}
.bm-gt tbody td:last-child { border-right: none; }
.bm-gt tbody tr:last-child td { border-bottom: none; }
.bm-gt tbody tr:hover td { background: #fbfdff; }
/* ─── 목표 행 추가 줄 ───
 * 표 맨 아래에 붙는 조작용 줄. .bm-noprint 라 인쇄 복제본에서 통째로 제거된다. */
.bm-gt-addrow td {
	background: #fbfdff;
	border-top: 1px dashed #d7e6ef;
	border-bottom: none !important;
	vertical-align: middle !important;
	padding: 10px 12px !important;
}
.bm-gt tbody tr.bm-gt-addrow:hover td { background: #f5fbff; }
/* 바로 위 목표 행의 실선과 추가 줄의 점선이 겹쳐 두 줄로 보이는 것 방지 */
.bm-gt tbody tr:has(+ .bm-gt-addrow) td { border-bottom: none; }
.bm-gt-addcell { border-right: 1px solid #f3f6fa; }
.bm-gt-addbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 8px 10px;
	border: 1px dashed #9fd4e4;
	border-radius: 9px;
	background: #fff;
	color: #0e7490;
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
	transition: all 0.13s;
}
.bm-gt-addbtn:hover {
	background: #ecfeff;
	border-color: #0891b2;
	border-style: solid;
	box-shadow: 0 2px 8px rgba(8,145,178,0.15);
}
.bm-gt-addbtn i { font-size: 11px; }
.bm-gt-addnote {
	font-size: 12.5px;
	font-weight: 600;
	color: #64748b;
	line-height: 1.6;
}
.bm-gt-addnote b { color: #0e7490; }
.bm-gt-addnote__hint {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-left: 10px;
	padding: 2px 9px;
	border-radius: 8px;
	background: #f1f5f9;
	color: #94a3b8;
	font-size: 11.5px;
	font-weight: 700;
}
.bm-gt-addnote__hint i { font-size: 10.5px; }

/* 새로 추가된 행 — 어디가 늘었는지 잠깐 비춰준다 */
@keyframes bmRowIn {
	from { background: #ecfeff; }
	to   { background: transparent; }
}
.bm-gt tbody tr.is-new td { animation: bmRowIn 0.9s ease-out; }

.bm-chkcell {
	text-align: center;
	vertical-align: middle !important;
}
.bm-chk {
	width: 18px;
	height: 18px;
	accent-color: #0891b2;
	cursor: pointer;
	vertical-align: middle;
}
.bm-ta {
	width: 100%;
	border: none;
	resize: none;
	font-family: inherit;
	font-size: 13.5px;
	line-height: 1.55;
	color: #0f172a;
	background: transparent;
	box-sizing: border-box;
	padding: 4px 6px;
	display: block;
	border-radius: 6px;
	transition: background 0.12s, box-shadow 0.12s;
}
.bm-ta:hover { background: #f8fafc; }
.bm-ta:focus {
	outline: none;
	background: #fbfeff;
	box-shadow: inset 0 0 0 2px rgba(8,145,178,0.3);
}

/* ④ 종합 의견 · 작성자 의견 */
.bm-op {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 1px;
	background: #eef2f7;
}
.bm-op__col {
	background: #fff;
	padding: 16px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
}
.bm-op__label {
	font-size: 12px;
	font-weight: 700;
	color: #64748b;
	letter-spacing: 0.3px;
}
.bm-op__labelrow {
	display: flex;
	align-items: center;
	gap: 10px;
}
.bm-op__labelrow .bm-btn--sm { margin-left: auto; }
.bm-op__ta {
	flex: 1;
	min-height: 260px;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	padding: 12px 14px;
	font-family: inherit;
	font-size: 13.5px;
	line-height: 1.65;
	color: #0f172a;
	background: #fbfcfe;
	resize: vertical;
	box-sizing: border-box;
	transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.bm-op__ta:focus {
	outline: none;
	border-color: #0891b2;
	background: #fff;
	box-shadow: 0 0 0 3px rgba(8,145,178,0.12);
}
.bm-op__checks {
	display: flex;
	flex-direction: column;
	gap: 7px;
}
.bm-opt {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 10px 13px;
	border: 1px solid #eef2f7;
	border-radius: 10px;
	background: #fff;
	cursor: pointer;
	font-size: 13.5px;
	font-weight: 600;
	color: #334155;
	transition: border-color 0.13s, background 0.13s, color 0.13s;
	user-select: none;
}
.bm-opt:hover {
	border-color: #bae6fd;
	background: #f8fdff;
}
.bm-opt:has(input:checked) {
	background: #ecfeff;
	border-color: #a5f3fc;
	color: #0e7490;
}
.bm-opt .bm-chk { flex-shrink: 0; }
.bm-opt--etc { cursor: default; }
.bm-opt__etclabel {
	display: flex;
	align-items: center;
	gap: 11px;
	cursor: pointer;
	flex-shrink: 0;
	font-weight: 600;
	user-select: none;
}
.bm-opt__etc-inp {
	flex: 1;
	min-width: 0;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 6px 10px;
	font-family: inherit;
	font-size: 13px;
	color: #0f172a;
	background: #fff;
	box-sizing: border-box;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.bm-opt__etc-inp:disabled {
	background: #f8fafc;
	color: #94a3b8;
	cursor: not-allowed;
}
.bm-opt__etc-inp:focus {
	outline: none;
	border-color: #0891b2;
	box-shadow: 0 0 0 3px rgba(8,145,178,0.12);
}

/* ─── 툴바 (상/하단) ─── */
.bm-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
}
.bm-toolbar--bottom { justify-content: flex-end; }
.bm-toolbar__btns {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}
.bm-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 16px;
	border-radius: 10px;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 700;
	cursor: pointer;
	border: 1px solid transparent;
	transition: all 0.15s;
}
.bm-btn--ghost { background: #fff; border-color: #dbe3ec; color: #475569; }
.bm-btn--ghost:hover { border-color: #94a3b8; color: #0f172a; }
.bm-btn--soft { background: #ecfeff; border-color: #a5f3fc; color: #0e7490; }
.bm-btn--soft:hover { background: #cffafe; }
.bm-btn--primary {
	background: linear-gradient(180deg, #0891b2, #0e7490);
	color: #fff;
	box-shadow: 0 2px 8px rgba(8,145,178,0.3);
}
.bm-btn--primary:hover { filter: brightness(1.07); }
.bm-btn--nhis {
	background: linear-gradient(180deg, #059669, #047857);
	color: #fff;
	box-shadow: 0 2px 8px rgba(5,150,105,0.3);
}
.bm-btn--nhis:hover { filter: brightness(1.07); }
.bm-btn--nhis:disabled { opacity: 0.5; cursor: not-allowed; filter: none; }

/* ─── 조회 범위 (현재 / 종결 / 전체) ─── */
.bm-scope {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
	padding: 0 16px 10px;
}
.bm-scope__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 32px;
	border: 1px solid #e2e8f0;
	background: #fff;
	border-radius: 9px;
	font-size: 12.5px;
	font-weight: 700;
	color: #64748b;
	cursor: pointer;
	transition: all 0.13s;
}
.bm-scope__btn:hover { border-color: #cbd5e1; color: #334155; }
.bm-scope__btn.active {
	background: linear-gradient(180deg, #0891b2, #0e7490);
	border-color: #0e7490;
	color: #fff;
	box-shadow: 0 2px 8px rgba(8,145,178,0.25);
}
.bm-scope__n {
	padding: 1px 6px;
	border-radius: 8px;
	background: #f1f5f9;
	color: #64748b;
	font-size: 11px;
	font-weight: 800;
}
.bm-scope__btn.active .bm-scope__n { background: rgba(255,255,255,0.22); color: #fff; }

/* 종결 수급자 — 목록 뱃지 + 상단 안내 */
.bm-item__end {
	margin-left: 6px;
	padding: 2px 8px;
	border-radius: 7px;
	background: #f1f5f9;
	color: #64748b;
	font-size: 11px;
	font-weight: 800;
}
.bm-item.is-ended .bm-item__name { color: #64748b; }
.bm-endnote {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 11px 15px;
	border: 1px solid #fde68a;
	border-radius: 11px;
	background: #fffbeb;
	font-size: 13px;
	font-weight: 600;
	color: #92400e;
	line-height: 1.5;
}
.bm-endnote[hidden] { display: none; }
.bm-endnote i { font-size: 15px; color: #d97706; flex: none; }

/* 불러오기 / 저장된 문서 5:5 행 */
.bm-toprow {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	align-items: start;
}
.bm-card__sub {
	margin-left: auto;
	font-size: 11.5px;
	font-weight: 600;
	color: #94a3b8;
}
.bm-dt__w-range { width: 175px; }
.bm-dt__badge--busy {
	background: #f1f5f9;
	color: #64748b;
}
.bm-dt__rsn {
	font-size: 12px;
	font-weight: 600;
	color: #64748b;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 150px;
}

/* 저장된 문서 카드 */
.bm-doccnt {
	padding: 2px 10px;
	background: #ecfeff;
	color: #0891b2;
	border-radius: 10px;
	font-size: 12px;
	font-weight: 800;
}
.bm-btn--sm {
	margin-left: auto;
	padding: 6px 12px;
	font-size: 12.5px;
	border-radius: 8px;
}
.bm-doclist {
	max-height: 230px;
	overflow-y: auto;
}
.bm-docs__empty {
	font-size: 12.5px;
	color: #94a3b8;
	font-weight: 600;
	padding: 22px 20px;
	text-align: center;
}
.bm-dt {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	color: #0f172a;
}
.bm-dt thead th {
	position: sticky;
	top: 0;
	z-index: 1;
	background: #f8fafc;
	padding: 8px 14px;
	font-size: 12px;
	font-weight: 700;
	color: #64748b;
	text-align: left;
	border-bottom: 1px solid #e6ebf2;
	white-space: nowrap;
}
.bm-dt__w-date { width: 100px; }
.bm-dt__w-upd  { width: 140px; }
.bm-dt__w-del  { width: 56px; text-align: center !important; }
.bm-dt tbody tr {
	cursor: pointer;
	transition: background 0.12s;
}
.bm-dt tbody tr:hover { background: #f8fdff; }
.bm-dt tbody tr.active { background: #ecfeff; }
.bm-dt tbody td {
	padding: 9px 14px;
	border-bottom: 1px solid #f1f5f9;
	vertical-align: middle;
}
.bm-dt tbody tr:last-child td { border-bottom: none; }
.bm-dt__date {
	font-family: 'Consolas', 'Menlo', monospace;
	font-size: 12px;
	font-weight: 600;
	color: #94a3b8;
	white-space: nowrap;
}
.bm-dt tr.active .bm-dt__date { color: #0891b2; }
.bm-dt__title {
	font-weight: 700;
	color: #334155;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 0;
}
.bm-dt tr.active .bm-dt__title { color: #0e7490; }
.bm-dt__badge {
	display: inline-block;
	margin-left: 8px;
	padding: 1px 8px;
	background: linear-gradient(180deg, #0891b2, #0e7490);
	color: #fff;
	border-radius: 9px;
	font-size: 10.5px;
	font-weight: 700;
	vertical-align: 1px;
}
/* '빈 문서' 행 — 저장일·마지막 수정이 없는 새 문서 자리 */
.bm-dt__blankrow td { background: #fcfdff; }
.bm-dt__blankrow:hover td { background: #f5fbff; }
.bm-dt__blankrow.active td { background: #ecfeff; }
/* 제목 셀은 기본이 max-width:0 축소라 두 글자도 '…' 로 잘린다 — 빈 문서 행만 해제 */
.bm-dt__blankrow .bm-dt__title { color: #0891b2; max-width: none; }
.bm-dt__blankico { margin-right: 7px; color: #94a3b8; }
.bm-dt__blankrow.active .bm-dt__blankico { color: #0891b2; }

/* 문서 미선택 안내 — 작성 화면 대신 자리를 지킨다 */
.bm-docstart {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 54px 24px;
	border: 1px dashed #cfe3ee;
	border-radius: 14px;
	background: #fbfeff;
	text-align: center;
}
.bm-docstart[hidden] { display: none; }   /* display:flex 가 UA 의 [hidden] 을 이기므로 명시 */
.bm-docstart i { font-size: 26px; color: #a5cede; }
.bm-docstart p {
	margin: 0;
	font-size: 15px;
	font-weight: 800;
	color: #0e7490;
}
.bm-docstart small {
	font-size: 12.5px;
	font-weight: 600;
	color: #94a3b8;
	line-height: 1.6;
	max-width: 520px;
}

/* 작성 화면 — 문서를 선택해야 열린다 */
.bm-docbody {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.bm-docbody[hidden] { display: none; }

.bm-dt__delcell { text-align: center; }
.bm-dt__del {
	width: 26px;
	height: 26px;
	border: 1px solid #e2e8f0;
	background: #fff;
	color: #94a3b8;
	border-radius: 8px;
	cursor: pointer;
	font-size: 11.5px;
	transition: all 0.13s;
}
.bm-dt__del:hover {
	background: #fee2e2;
	border-color: #fecaca;
	color: #dc2626;
}

/* ─── 저장 모달 ─── */
.bm-modal {
	position: fixed;
	inset: 0;
	z-index: 90;
	background: rgba(15,23,42,0.45);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.bm-modal__box {
	background: #fff;
	border-radius: 16px;
	width: 440px;
	max-width: 100%;
	box-shadow: 0 24px 60px -12px rgba(15,23,42,0.35);
	overflow: hidden;
}
.bm-modal__box--wide { width: 980px; max-width: 96vw; }
/* 공단 적용 — 모니터링 회차 표 (공단 "모니터링 상세" 표와 같은 컬럼) */
.bm-nhistbl-wrap { overflow-x: auto; margin-top: 10px; border: 1px solid #dbe3ec; border-radius: 10px; }
.bm-nhistbl { width: 100%; border-collapse: collapse; font-size: 12.5px; white-space: nowrap; }
.bm-nhistbl th {
	background: #f1f5f9;
	color: #475569;
	font-weight: 700;
	font-size: 12px;
	padding: 9px 10px;
	text-align: center;
	border-bottom: 1px solid #dbe3ec;
	line-height: 1.3;
}
.bm-nhistbl td { padding: 10px 10px; text-align: center; border-bottom: 1px solid #eef2f7; color: #334155; }
.bm-nhistbl tbody tr:last-child td { border-bottom: none; }
.bm-nhistbl__row { cursor: pointer; transition: background .12s; }
.bm-nhistbl__row:hover { background: #f8fafc; }
.bm-nhistbl__row:has(input:checked) { background: #ecfdf5; }
.bm-nhistbl__pick { width: 34px; }
.bm-nhistbl__nm { font-weight: 800; color: #0f172a; }
.bm-nhisslots {
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-height: 340px;
	overflow-y: auto;
	margin-top: 10px;
}
.bm-nhisslots__load, .bm-nhisslots__err {
	padding: 22px 10px;
	text-align: center;
	color: #64748b;
	font-size: 13px;
}
.bm-nhisslots__err { color: #b91c1c; }
.bm-nhisslot {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	border: 1px solid #dbe3ec;
	border-radius: 10px;
	cursor: pointer;
	transition: border-color .12s, background .12s;
}
.bm-nhisslot:hover { border-color: #94a3b8; background: #f8fafc; }
.bm-nhisslot:has(input:checked) { border-color: #059669; background: #ecfdf5; }
.bm-nhisslot__seq { font-weight: 800; color: #0f172a; font-size: 13.5px; min-width: 60px; }
.bm-nhisslot__period { flex: 1; color: #334155; font-size: 13px; }
.bm-nhisslot__done { font-size: 12px; font-weight: 700; color: #047857; }
.bm-nhisslot__todo { font-size: 12px; font-weight: 700; color: #b45309; }
.bm-nhisdbg summary { cursor: pointer; font-size: 12px; color: #64748b; margin-top: 6px; }
.bm-nhisdbg pre {
	font-size: 11px;
	line-height: 1.5;
	max-height: 240px;
	overflow: auto;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	padding: 8px 10px;
	margin: 6px 0 0;
	white-space: pre-wrap;
	word-break: break-all;
	color: #334155;
}
.bm-modal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 15px 20px;
	border-bottom: 1px solid #eef2f7;
	font-size: 15px;
	font-weight: 800;
	color: #0f172a;
}
.bm-modal__x {
	border: none;
	background: #f1f5f9;
	color: #64748b;
	width: 28px;
	height: 28px;
	border-radius: 8px;
	cursor: pointer;
}
.bm-modal__x:hover { background: #e2e8f0; color: #0f172a; }
.bm-modal__body {
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.bm-modal__label {
	font-size: 12px;
	font-weight: 700;
	color: #64748b;
}
.bm-modal__inp {
	border: 1px solid #cbd5e1;
	border-radius: 10px;
	padding: 10px 12px;
	font-family: inherit;
	font-size: 14px;
	color: #0f172a;
	box-sizing: border-box;
}
.bm-modal__inp:focus {
	outline: none;
	border-color: #0891b2;
	box-shadow: 0 0 0 3px rgba(8,145,178,0.12);
}
.bm-modal__hint {
	margin: 0;
	font-size: 12px;
	color: #b45309;
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: 8px;
	padding: 8px 10px;
	line-height: 1.5;
}
.bm-modal__foot {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	padding: 14px 20px;
	border-top: 1px solid #eef2f7;
	background: #fafcfe;
}

/* AI 작성 모달 */
.bm-ai__goal {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	padding: 11px 13px;
	background: #f8fafc;
	border: 1px solid #eef2f7;
	border-radius: 10px;
	margin-bottom: 4px;
}
.bm-ai__badge {
	flex-shrink: 0;
	padding: 2px 10px;
	border-radius: 9px;
	font-size: 11.5px;
	font-weight: 800;
	line-height: 1.6;
}
.bm-ai__badge--ok { background: #dcfce7; color: #15803d; }
.bm-ai__badge--no { background: #fee2e2; color: #dc2626; }
.bm-ai__goaltxt {
	font-size: 13px;
	font-weight: 600;
	color: #334155;
	line-height: 1.55;
}
.bm-ai__desc {
	margin: 2px 0 0;
	font-size: 12px;
	color: #64748b;
	line-height: 1.6;
}
.bm-ai__desc b { color: #0e7490; }

/* ─── 인쇄: 복제된 문서(#bmPrintHolder)만 출력 ─── */
#bmPrintHolder { display: none; }
.bm-print-text {
	font-size: 13.5px;
	line-height: 1.55;
	color: #0f172a;
	white-space: pre-wrap;
	word-break: break-word;
	padding: 4px 6px;
	min-height: 21px;
}
@media print {
	@page { margin: 12mm; }
	/* 안전망 — printDoc() 이 복제본에서 .bm-noprint 를 제거하지만,
	   브라우저 Ctrl+P / PDF 저장처럼 그 경로를 안 타는 인쇄도 있다. 조작용 버튼은 종이에 남으면 안 된다. */
	.bm-noprint { display: none !important; }
	body.bm-printing > *:not(#bmPrintHolder) { display: none !important; }
	#bmPrintHolder { display: block !important; }
	#bmPrintHolder .bm-doc { padding: 0; gap: 12px; }
	#bmPrintHolder .bm-docbody { gap: 12px; }
	#bmPrintHolder .bm-card {
		box-shadow: none;
		border-color: #cbd5e1;
	}
	#bmPrintHolder .bm-hero { background: #fff; }
	/* 헤더 입력칸은 종이에선 그냥 «글자» 여야 한다 — 빈 입력상자가 인쇄되면 미기입처럼 보인다 */
	#bmPrintHolder .bm-meta__inp {
		border: 0; background: transparent; box-shadow: none;
		padding: 0; margin: 0;
	}
	#bmPrintHolder .bm-gt tbody tr { break-inside: avoid; }
	#bmPrintHolder .bm-gt tbody tr:hover td { background: transparent; }
}

/* ═══════════════════════════════
 *  모바일(≤768px)
 *
 *  좌/우 배치는 layouts/split-mobile.css 가 맡는다
 *  — 폰에서는 목록이 전체화면, 수급자를 누르면 문서가 전체화면 시트로 올라온다.
 *  여기는 «시트 안쪽» 내용만 펀다(표·카드가 좁은 칸에 갇혀 글자가 세로로 쌓이던 것).
 * ═══════════════════════════════ */
@media (max-width: 768px) {

	/* 오른쪽 칸 안의 2~3단도 같이 펀다 — 좁은 칸에 갇혀 «공 단 데 이 터» 처럼 한 글자씩 세로로 쌓였다 */
	.bm-toprow { grid-template-columns: 1fr; }
	.bm-hero { flex-direction: column; align-items: stretch; gap: 14px; padding: 18px 16px; }
	.bm-hero__meta { grid-template-columns: 1fr 1fr; }
	.bm-inf { grid-template-columns: 1fr 1fr; }
	/* 값이 길면 «…» 로 잘렸다(적용기간 «2026-08-01 ~ 20…»). 폰에서는 접어서 다 보여준다. */
	.bm-inf__val { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.35; }
	.bm-doc { padding: 14px; }

	/* «종합 의견 | 작성자 의견» 도 위아래로 — 좌우로 두면 의견 칸이 150px 대로 눌려
	   문장이 두세 자씩 접히고, 라벨과 AI 버튼도 서로 밀어낸다. */
	.bm-op { grid-template-columns: 1fr; }
	.bm-op__col { padding: 14px 14px 16px; }
	.bm-op__ta { min-height: 200px; }

	/* 목표 표도 «카드» 로 — 종전엔 min-width:640px 짜리 가로 스크롤러였다.
	   360px 화면에서 «원인»·«향후계획» 칸은 옆으로 밀어야만 보였다(= 사실상 못 쓰는 칸).
	   목표 한 줄 = 카드 한 장, 칸 이름표는 렌더러의 data-l 로 붙인다. */
	.bm-gt-wrap { overflow-x: visible; }
	.bm-gt { display: block; min-width: 0; }
	.bm-gt thead { display: none; }
	.bm-gt tbody { display: block; }
	.bm-gt tbody tr {
		display: block;
		margin: 0 0 10px;
		padding: 10px 12px 12px;
		background: #fff;
		border: 1px solid #e3e9f1;
		border-radius: 12px;
	}
	.bm-gt tbody tr:hover td { background: transparent; }
	.bm-gt tbody td {
		display: block;
		padding: 8px 0 0;
		border: none;
	}
	.bm-gt tbody td::before {
		content: attr(data-l);
		display: block;
		margin-bottom: 4px;
		color: #64748b;
		font-size: 11.5px;
		font-weight: 800;
	}
	.bm-gt tbody td:not([data-l])::before { content: none; }
	/* 달성 · 미달성은 한 줄에 나란히 — 이름표를 체크 오른쪽에 둔다 */
	.bm-gt tbody td.bm-chkcell {
		display: inline-flex;
		flex-direction: row-reverse;
		align-items: center;
		gap: 7px;
		width: auto;
		margin: 4px 16px 0 0;
		padding: 0;
	}
	.bm-gt tbody td.bm-chkcell::before { margin: 0; font-size: 13px; color: #334155; }
	/* 표에서는 칸 테두리가 입력칸의 경계였다 — 카드에는 그 테두리가 없으니 입력칸에 직접 그린다.
	   높이도 줄인다(rows=4 그대로면 목표 한 장이 400px, 아홉 장이면 끝없는 스크롤). */
	.bm-gt .bm-ta {
		height: 78px;
		padding: 8px 10px;
		background: #f8fafc;
		box-shadow: inset 0 0 0 1px #e4eaf1;
	}
	.bm-gt td[data-l="목표"] .bm-ta { height: 58px; }
	.bm-gt .bm-ta:focus { background: #fbfeff; box-shadow: inset 0 0 0 2px rgba(8, 145, 178, .35); }
	/* «목표 행 추가» 줄은 카드가 아니라 그냥 단추 줄 */
	.bm-gt tbody tr.bm-gt-addrow {
		border: none;
		background: transparent;
		padding: 0;
		margin-bottom: 0;
	}
	.bm-gt-addrow td { padding: 0 !important; background: transparent !important; border-top: none; }
	.bm-gt-addrow .bm-gt-addnote { margin-top: 6px; }

	/* ── 모달은 화면 안에 가둔다 ─────────────────────────────
	   상자에 천장이 없어 내용이 길면 아래 단추(취소·적용·저장)가 화면 밖으로 밀려났다.
	   머리·발은 늘 보이게 두고 «본문» 만 스크롤시킨다. 위쪽은 검은 고정바 아래부터. */
	.bm-modal { padding: calc(var(--mobile-bar-h, 58px) + 10px) 12px 12px; }
	.bm-modal__box,
	.bm-modal__box--wide {
		display: flex;
		flex-direction: column;
		max-width: 100%;
		max-height: 100%;
	}
	.bm-modal__body { overflow-y: auto; -webkit-overflow-scrolling: touch; }
	.bm-nhisslots { max-height: none; overflow: visible; }   /* 이중 스크롤 방지 — 본문 하나만 구른다 */

	/* ── 목록은 «카드» 로 접는다 ──────────────────────────────────
	   표를 그대로 두면 폰 폭을 한참 넘어간다 — 실측(화면 360px):
	     공단 회차 목록 918px · 저장 문서 436px · 공단 계획서 436px.
	   가로로 밀어야 오른쪽 칸이 보이니 사실상 없는 칸이었고, 투어가 가리키는
	   «회차» 줄은 링이 화면 밖(l=33 → r=971)까지 그어져 누를 수조차 없었다.
	   ≤768px 에서는 한 줄 = 한 장의 카드. 칸 이름표는 렌더러가 심어 둔
	   data-l 로 붙이고(머리줄 thead 는 감춘다), 이름표가 없는 칸(제목·성명)은
	   값만 남겨 카드의 제목 줄로 쓴다. */
	.bm-dt,
	.bm-nhistbl { display: block; width: 100%; min-width: 0; white-space: normal; }
	.bm-dt thead,
	.bm-nhistbl thead { display: none; }
	.bm-dt tbody,
	.bm-nhistbl tbody { display: block; }

	.bm-dt tbody tr,
	.bm-nhistbl__row {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 1px 9px;
		margin: 0 0 8px;
		padding: 11px 13px;
		background: #fff;
		border: 1px solid #e3e9f1;
		border-radius: 12px;
	}
	.bm-dt tbody tr:last-child,
	.bm-nhistbl__row:last-child { margin-bottom: 0; }

	/* 값 줄 — 왼쪽에 이름표, 오른쪽에 값 */
	.bm-dt tbody td,
	.bm-nhistbl td {
		display: flex;
		order: 3;
		flex: 1 1 100%;
		justify-content: space-between;
		align-items: baseline;
		gap: 10px;
		padding: 2px 0;
		border: none;
		text-align: right;
		font-size: 12.5px;
	}
	.bm-dt tbody td::before,
	.bm-nhistbl td::before {
		content: attr(data-l);
		flex: 0 0 auto;
		color: #94a3b8;
		font-size: 11.5px;
		font-weight: 700;
		text-align: left;
	}
	.bm-dt tbody td:not([data-l])::before,
	.bm-nhistbl td:not([data-l])::before { content: none; }
	.bm-dt tbody td:empty { display: none; }

	/* 저장 문서 · 공단 계획서 — 제목(+뱃지) 이 첫 줄, 삭제 단추는 그 오른쪽
	   ⚠ 자리·정렬을 바꾸는 규칙은 반드시 «.bm-dt tbody td.xxx» 로 — 위 «.bm-dt tbody td»(클래스1+요소2)를
	     클래스 하나짜리 선택자로는 못 이긴다(제목이 셋째 줄에 오른쪽 정렬로 붙던 원인). */
	.bm-dt tbody td.bm-dt__title {
		display: block;           /* 값 하나뿐인 칸은 flex 를 풀어야 text-align 이 산다 */
		order: 1;
		flex: 1 1 auto;
		max-width: none;          /* 데스크탑의 «max-width:0» 축소 해제 — 두 글자도 «…» 로 잘렸다 */
		overflow: visible;
		white-space: normal;
		text-align: left;
		font-size: 14px;
		font-weight: 800;
		color: #0f172a;
		line-height: 1.35;
	}
	.bm-dt tbody td.bm-dt__delcell { display: block; order: 2; flex: 0 0 auto; padding: 0; }
	.bm-dt tbody td.bm-dt__rsn { white-space: normal; }
	.bm-dt tbody tr.active {
		border-color: #22b8cf;
		background: #f2feff;
		box-shadow: 0 0 0 2px rgba(34, 184, 207, .16);
	}
	/* 칸마다 칠하던 배경은 카드에서 얼룩이 된다 — 카드 자체 색만 남긴다 */
	.bm-dt__blankrow td,
	.bm-dt__blankrow:hover td,
	.bm-dt__blankrow.active td { background: transparent; }
	.bm-dt__blankrow { border-style: dashed; }
	.bm-doclist { overflow-x: hidden; max-height: 300px; padding: 2px; }

	/* 공단 회차 — 첫 줄은 [◉] [N회차] [성명] */
	.bm-nhistbl-wrap { overflow-x: visible; border: none; border-radius: 0; }
	.bm-nhistbl__row { padding-left: 13px; }
	.bm-nhistbl td.bm-nhistbl__pick { display: block; order: 0; flex: 0 0 auto; width: auto; padding: 0; }
	.bm-nhistbl__pick input { width: 18px; height: 18px; }
	.bm-nhistbl td.bm-nhistbl__no {
		display: block;
		order: 1;
		flex: 0 0 auto;
		padding: 2px 9px;
		border-radius: 999px;
		background: #eef2f7;
		color: #475569;
		font-size: 11.5px;
		font-weight: 800;
	}
	.bm-nhistbl__no::after { content: '회차'; margin-left: 1px; }
	.bm-nhistbl td.bm-nhistbl__nm {
		display: block;
		order: 2;
		flex: 1 1 auto;
		text-align: left;
		font-size: 15px;
		font-weight: 800;
	}
	.bm-nhistbl__row:has(input:checked) {
		border-color: #10b981;
		background: #ecfdf5;
		box-shadow: 0 0 0 2px rgba(16, 185, 129, .18);
	}
	.bm-nhistbl__row:has(input:checked) .bm-nhistbl__no { background: #10b981; color: #fff; }
}