* { box-sizing: border-box; }
body { margin: 0; font-family: 'Malgun Gothic', '맑은 고딕', sans-serif; font-size: 14px; color: #223; background: #f5f6f8; }
a { color: #1a56b0; text-decoration: none; }

/* 사이드바 — 배치 5 (2026-08-18) 리브랜딩: 밝은 배경 + 서송병원 로고 원본, 진초록 #00583c 포인트 */
.sidebar { position: fixed; top: 0; left: 0; bottom: 0; width: 170px; background: #f4f7f5; color: #2f3d36; padding-top: 10px;
  border-right: 1px solid #d9e2dc; overflow-y: auto; }
.sidebar .logo { padding: 4px 12px 2px; text-align: center; }
.sidebar .logo img { display: block; width: 100%; height: auto; }
.sidebar .logo .brand { display: block; margin-top: 4px; font-size: 12.5px; font-weight: bold; color: #00583c; letter-spacing: .5px; }
.workerbar { margin: 6px 12px 10px; padding: 7px 10px; background: #e6f0ea; color: #00583c; border-radius: 6px; font-size: 13px; cursor: pointer; text-align: center; font-weight: bold; }
.workerbar.unset { background: #fbe4e4; color: #a33; }
.workerbar:hover { filter: brightness(0.96); }
.navitem { display: block; padding: 8px 16px; color: #2f3d36; font-size: 14px; }
.navitem.on { background: #00583c; color: #fff; font-weight: bold; }
.navitem:hover:not(.disabled):not(.on) { background: #e3ede7; }
.navitem.disabled { color: #9aa8a0; cursor: default; }
/* 사이드바 그룹·하위항목 (2026-08-13 개편) — 배치 5: 섹션마다 위쪽 구분선 */
.navsec { padding: 10px 16px 3px; font-size: 11px; color: #00583c; font-weight: bold; letter-spacing: 1px;
  border-top: 1px solid #d9e2dc; margin-top: 5px; }
.navitem.navsub { padding: 5px 16px 5px 30px; font-size: 13px; color: #5b6b62; }
.navitem.navsub.on { background: #00583c; color: #fff; }
.navitem.navset { margin-top: 8px; border-top: 1px solid #d9e2dc; padding-top: 8px; }
.soon { font-size: 10px; background: #dfe8e2; color: #4c5e55; border-radius: 8px; padding: 1px 6px; margin-left: 4px; }

.content { margin-left: 170px; padding: 18px 22px; }
h1 { font-size: 20px; margin: 0 0 14px; }
h2 { font-size: 16px; margin: 18px 0 8px; }

.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }

/* 폼 공통 (기획안 6.2 확정: 필수·자동 채움·코드 정보 구분) */
.req { color: #c0392b; }
.auto-fill { background: #fff6dd !important; }
.auto-mark { font-size: 10px; background: #ffe9a8; color: #7a5b00; border-radius: 8px; padding: 1px 6px; margin-left: 4px; }
.sec-code { background: #eef4fb; }
.tabs .tab { cursor: pointer; }

/* 대시보드 카드 (M5) */
.cards { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.card { display: block; background: #fff; border: 1px solid #dfe5ec; border-radius: 8px; padding: 12px 16px; min-width: 170px; color: #223; }
.card:hover { border-color: #1a56b0; }
.card-title { font-size: 12px; color: #667; }
.card-value { font-size: 22px; font-weight: bold; margin: 4px 0 2px; }
.card-sub { font-size: 11px; }
.card.warn1 { border-color: #e6b96a; background: #fffaf1; }
.card.warn2 { border-color: #d98383; background: #fff5f5; }
.card.warn2 .card-value { color: #b03030; }
.toolbar .spacer { flex: 1; }
button, .btn { font-family: inherit; font-size: 13px; padding: 6px 12px; border: 1px solid #b6c2d2; border-radius: 5px; background: #fff; cursor: pointer; color: #223; }
button:hover, .btn:hover { background: #eef3fa; }
button.primary { background: #00583c; border-color: #00583c; color: #fff; }   /* 배치 21: 앱 진초록 통일 */
button.primary:hover { background: #00432e; }
button.danger { color: #b02a2a; border-color: #d6a0a0; }
input[type=text], input[type=number], input[type=date], select, textarea {
  font-family: inherit; font-size: 13px; padding: 6px 8px; border: 1px solid #b6c2d2; border-radius: 5px; background: #fff; }
input:focus, select:focus, textarea:focus { outline: 2px solid #9fc3ff; }

.filters { display: none; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; background: #fff; border: 1px solid #dbe2ea; border-radius: 6px; padding: 12px; margin-bottom: 10px; }
.filters.open { display: grid; }
.filters label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: #556; }

.tablewrap { background: #fff; border: 1px solid #dbe2ea; border-radius: 6px; overflow: auto; max-height: calc(100vh - 210px); }
table.grid { border-collapse: collapse; width: 100%; white-space: nowrap; }
table.grid th, table.grid td { border-bottom: 1px solid #e7ecf2; padding: 6px 9px; text-align: left; font-size: 13px; }
table.grid th { position: sticky; top: 0; background: #eef2f7; cursor: pointer; user-select: none; z-index: 1; border-bottom: 2px solid #c9d4e2; }
table.grid th .sortmark { color: #1a56b0; font-size: 11px; margin-left: 3px; }
table.grid tbody tr:hover { background: #f2f7ff; }
table.grid tbody tr { cursor: pointer; }
table.grid td.num { text-align: right; }
.inactive-row { color: #99a; background: #fafafa; }

.badge { display: inline-block; font-size: 11px; border-radius: 9px; padding: 1px 7px; background: #e8edf4; color: #445; }
.badge.red { background: #fbe3e3; color: #a22; }
.badge.orange { background: #fdeeda; color: #965b0a; }
.badge.blue { background: #e0ebfb; color: #1a56b0; }
.badge.green { background: #e2f3e5; color: #1d7a34; }
.badge.gray { background: #eee; color: #778; }
/* 재고현황 세로 구분선 (2026-08-11): 약국재고 | 판정 사이 — 행 구분선과 동일 굵기·색 */
table.grid th.vsep, table.grid td.vsep { border-left: 1px solid #e7ecf2; }

/* 2026-08-11 (비치 요청 2): 투여경로 태그용 노랑·분홍 + 예외 태그용 진주황 */
.badge.yellow { background: #fdf6cf; color: #7a6400; }
.badge.pink { background: #fce4ef; color: #b03a6b; }
.badge.orange2 { background: #ffdfc2; color: #a34e00; }
/* v37 대시보드 색상 체계: 재고 및 발주=하늘 · 조제 및 사용=연두 (입고 파랑/불출 초록 계열과 호응) */
.badge.sky { background: #dcefff; color: #1a5fa0; }
.badge.lime { background: #e6f7cf; color: #3d7a12; }

.modal-bg { position: fixed; inset: 0; background: rgba(20,30,45,.45); display: flex; align-items: center; justify-content: center; z-index: 100; }
.modal { background: #fff; border-radius: 8px; padding: 20px; min-width: 380px; max-width: 640px; max-height: 85vh; overflow: auto; box-shadow: 0 8px 30px rgba(0,0,0,.25); }
.modal h3 { margin: 0 0 14px; font-size: 16px; }
.modal .frow { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.modal .frow > span { font-size: 12px; color: #556; }
.modal .actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }

.tabs { display: flex; gap: 2px; border-bottom: 2px solid #c9d4e2; margin-bottom: 14px; }
.tab { padding: 8px 16px; cursor: pointer; border-radius: 6px 6px 0 0; background: #e6ebf2; font-size: 14px; }
.tab.on { background: #fff; font-weight: bold; border: 1px solid #c9d4e2; border-bottom: 2px solid #fff; margin-bottom: -2px; }
.panel { background: #fff; border: 1px solid #dbe2ea; border-radius: 0 6px 6px 6px; padding: 16px; }

.formgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px 16px; }
.formgrid label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: #556; }
.formgrid input, .formgrid select { width: 100%; }
.muted { color: #889; font-size: 12px; }
.count-info { font-size: 13px; color: #556; }
.checkline { display: flex; align-items: center; gap: 6px; font-size: 13px; }

.dropdown { position: relative; display: inline-block; }
.dropdown-menu { display: none; position: absolute; right: 0; top: 110%; background: #fff; border: 1px solid #b6c2d2; border-radius: 6px; padding: 10px; z-index: 50; max-height: 320px; overflow: auto; box-shadow: 0 4px 16px rgba(0,0,0,.15); min-width: 180px; }
.dropdown.open .dropdown-menu { display: block; }
.dropdown-menu label { display: flex; gap: 6px; align-items: center; font-size: 13px; padding: 3px 0; white-space: nowrap; }

.toast { position: fixed; bottom: 20px; right: 20px; background: #223; color: #fff; padding: 10px 18px; border-radius: 6px; z-index: 200; opacity: .95; }
.toast.err { background: #a22; }

.lockbar { background: #fdeeda; border: 1px solid #e8c48a; color: #7a4a06; border-radius: 6px; padding: 8px 14px; margin-bottom: 12px; font-size: 13px; }
.lockbar.ok{background:#e2f3e5;border-color:#9c9;color:#1d5a2d}
.lockbar.stale { background: #fbe3e3; border-color: #dda; color: #8a1f1f; }

/* ── 의약품 상세 §1 정돈 (2026-08-07 사용자 요청: 표 형태·선 없이·섹션 여백 구분·신약 등록과 동일한 결) ── */
.detail-form h2 { margin-top: 22px; }  /* 구분선 제거 (2026-08-11 추가 2) — 여백으로만 구분 */
.detail-form h2:first-child { margin-top: 4px; }
.detail-form .frow { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: #556; }
.detail-form .frow input, .detail-form .frow select { width: 100%; }
.detail-form table.grid.noline th, .detail-form table.grid.noline td { border-bottom: none; }
.detail-form table.grid.noline th { background: transparent; border-bottom: 1px solid #dbe2ea; cursor: default; }
.detail-form table.grid.noline tbody tr:hover { background: #f6f9fd; }
.detail-form table.grid.noline tbody tr { cursor: default; }
.tip { display: inline-block; width: 15px; height: 15px; line-height: 15px; text-align: center;
       border-radius: 50%; background: #dfe7f2; color: #456; font-size: 11px; font-style: normal;
       cursor: help; margin-left: 4px; vertical-align: middle; }
.suffixwrap { display: flex; align-items: center; gap: 5px; }
.suffixwrap input { flex: 1; min-width: 0; }
.suffixwrap .sfx { white-space: nowrap; color: #889; font-size: 12px; }

/* ── 데이터 입력 통합 화면 (개정 20, 2026-08-07) ── */
.tab-sep { width: 1px; background: #b6c2d2; margin: 4px 6px; }
.tab.danger { background: #f3e3e3; color: #8a2f2f; }
.tab.danger.on { background: #fff; border-color: #d5a5a5; color: #8a2f2f; font-weight: bold; }
.cal-mini { border-collapse: collapse; width: 100%; max-width: 560px; table-layout: fixed; }
.cal-mini th { font-size: 11px; color: #667; padding: 2px; font-weight: normal; }
.cal-mini td { border: 1px solid #eef1f5; height: 44px; vertical-align: top; padding: 2px 4px; font-size: 12px; cursor: pointer; }
.cal-mini td:hover { background: #f2f7ff; }
.cal-mini td.empty { cursor: default; background: #fafbfc; }
.cal-mini td.today { background: #fdf3dd; }   /* v36: 오늘 날짜 음영 (입고·불출 달력) */
.cal-dot-faint { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #c9d4e2; margin-left: 3px; vertical-align: middle; }
.cal-extra { font-size: 10px; color: #98a; }

/* ── 상세 보기 모드 표 형식 (개정 29 후속, 2026-08-11): 대시보드 표 양식·제목열|값열 나란히·한 화면 수납 ── */
.detail-view { max-width: 1100px; }
/* 구분선 없음 (2026-08-11 추가 2): 표 형태가 되면서 불필요 — 여백으로만 섹션 구분 */
.detail-view h2 { font-size: 14px; margin: 14px 0 3px; }
.detail-view h2:first-child { margin-top: 0; }
.detail-view table.grid th { position: static; }   /* 상세는 짧은 표 — 헤더 고정 불필요 */
.detail-view table.kv { border-collapse: collapse; width: 100%; table-layout: fixed; border-top: 1px solid #e7ecf2; }
.detail-view table.kv th, .detail-view table.kv td {
  border-bottom: 1px solid #e7ecf2; padding: 6px 9px; font-size: 13px; text-align: left;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.detail-view table.kv th { background: #eef2f7; color: #556; font-weight: normal; width: 96px; cursor: default; }
.detail-view table.kv td.wrap { white-space: normal; }   /* 배지 나열·링크 목록은 줄바꿈 허용 */
/* 보기 모드의 코드 정보·표준코드 표도 대시보드 표와 동일한 줄·헤더색으로 (noline 무력화) */
.detail-view table.grid.noline th, .detail-view table.grid.noline td { border-bottom: 1px solid #e7ecf2; }
.detail-view table.grid.noline th { background: #eef2f7; border-bottom: 2px solid #c9d4e2; }
.detail-view table.grid tbody tr { cursor: default; }
/* 행 높이 통일 (2026-08-11 요청 5): 표 안 버튼·입력을 압축해 kv 행(≈29.5px)에 맞춘다 */
.detail-view table button, .detail-form table button { padding: 2px 8px; font-size: 12px; }
/* h2 줄 안 버튼(관리코드 토글·이력·Excel)도 압축 — 본문·사이드 h2 높이 통일 → 표 시작 Y 정렬 (2026-08-11) */
.detail-view h2 button, .detail-form h2 button { padding: 2px 8px; font-size: 12px; }
/* 의약품 목록 표도 동일 — 행 끝 활성/비활성 버튼 때문에 행이 커지지 않게 (2026-08-11 추가 3) */
#tbl button { padding: 0 8px; font-size: 12px; height: 18px; }
.detail-form table input[type=text], .detail-form table input[type=number], .detail-form table input[type=date] {
  padding: 2px 8px; height: 24px; }

/* ── 등록·수정 폼 kv 양식 (2026-08-11 요청 4): 보기 모드 kv 표와 동일한 결 — 라벨열|입력열 ── */
table.kvf { border-collapse: collapse; width: 100%; max-width: 1100px; table-layout: fixed;
  border-top: 1px solid #e7ecf2; }
table.kvf th, table.kvf td { border-bottom: 1px solid #e7ecf2; padding: 4px 9px; font-size: 13px;
  text-align: left; }
table.kvf th { background: #eef2f7; color: #556; font-weight: normal; width: 96px; }
table.kvf td input[type=text], table.kvf td input[type=number], table.kvf td input[type=date],
table.kvf td select { width: 100%; height: 26px; padding: 2px 8px; }
table.kvf td .checkline { display: inline-flex; margin-right: 14px; }
table.kvf tr.oral-off { opacity: .55; }

/* ── 재고보정 통합 폼 정돈 (2026-08-10 요청 1): 라벨 위·입력 아래, 높이 통일 ── */
.mform .frow { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: #556; margin: 0; }
.mform .frow input, .mform .frow select { height: 28px; box-sizing: border-box; padding: 2px 8px; }   /* 글자 잘림 방지 (2026-08-11) */
.mform .mrow { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin: 6px 0; }
.mform button { height: 28px; }

/* ── 재고 실사 5단계 (2026-08-13 대개편 — docs/화면명세_실사.md) ── */
.st-steps { display: flex; gap: 6px; margin-bottom: 12px; flex-wrap: wrap; }
.st-step { flex: 1; min-width: 130px; padding: 7px 10px; font-size: 13px; cursor: pointer;
  background: #eef1f5; border: 1px solid #dbe2ea; border-radius: 6px; color: #667; }
.st-step b { display: inline-block; width: 18px; height: 18px; line-height: 18px; text-align: center;
  border-radius: 50%; background: #c9d4e2; color: #fff; font-size: 11px; margin-right: 4px; }
.st-step.done { background: #fff; color: #445; }
.st-step.done b { background: #7cb87c; }
.st-step.on { background: #1f2c3d; color: #fff; border-color: #1f2c3d; font-weight: bold; }
.st-step.on b { background: #9fc3ff; color: #1f2c3d; }
.st-panel { border-left: 4px solid #c99; }
.st-prep-row { padding: 5px 0; border-bottom: 1px solid #eef1f5; }

/* ── 대시보드 전면 개편 (2026-08-12): 한 화면·접힘 목록·3탭 — docs/화면명세_대시보드.md ── */
.dash2 { max-width: 1560px; }
.dash2 .d2-top { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 12px; margin-bottom: 12px; align-items: start; }
.dash2 .d2-top4 { grid-template-columns: 1.15fr 1fr 1fr 1fr; }   /* v36: 달력·공지·모니터링 2그룹 */
.dash2 .d2-top .panel { border-radius: 8px; padding: 12px 14px; }
.dash2 .d2-top h3 { margin: 0 0 8px; font-size: 14px; }
/* 배치 6: 섹션1 카드 = 세로 flex, 스크롤 영역이 남는 높이를 채움 (공지·모니터링은 JS가 달력 기본 높이로 고정) */
.dash2 .d2-top .panel { display: flex; flex-direction: column; min-height: 0; }
.dash2 .d2-top .panel > h3 { flex: 0 0 auto; }
.dash2 .d2-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; border: 1px solid #eef1f5; border-radius: 6px; }
.dash2 .d2-scroll table.grid td { padding: 4px 9px; font-size: 12px; }
.d2-cal td { height: 34px; position: relative; }
.d2-cal td.sel { outline: 2px solid #1a56b0; outline-offset: -2px; }   /* 배치 5: 열린 날짜 (재클릭 = 닫기) */
.d2-cal td.today { outline: 2px solid #e8913a; outline-offset: -2px; border-radius: 3px; }  /* v36: 오늘 = 주황 테두리 */
.d2-cal td.ev { background: #fdf3dd; }
.d2-cal td.ev:hover { background: #fae8bf; }
.d2-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-left: 3px; vertical-align: middle; }
.d2-dot.in { background: #5b8dd6; }
.d2-dot.use { background: #7cb87c; }
.d2-dot.sched { background: #d94040; }   /* v37: 직접 추가한 일정 — 빨간 점 */
.d2-upcoming { margin-top: 8px; font-size: 12px; border-top: 1px solid #eef1f5; padding-top: 6px; }
.d2-uprow { display: flex; gap: 6px; align-items: center; padding: 2px 0; cursor: pointer; }
.d2-uprow:hover { background: #f2f7ff; }
.d2-updt { color: #965b0a; min-width: 38px; }
.d2-uplabel { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d2-evbox { margin-top: 6px; background: #fdf6e3; border: 1px solid #e8d9a8; border-radius: 6px; padding: 6px 10px; font-size: 12px; }
.d2-status { margin-top: 8px; font-size: 12px; color: #889; border-top: 1px solid #eef1f5; padding-top: 6px; }
.d2-status.warn { color: #965b0a; font-weight: bold; }
.d2-tabbar { display: flex; gap: 2px; border-bottom: 2px solid #c9d4e2; }
.d2-tab { border: 1px solid transparent; border-bottom: none; background: #e6ebf2; border-radius: 6px 6px 0 0; padding: 7px 18px; font-size: 14px; }
.d2-tab.active { background: #fff; font-weight: bold; border-color: #c9d4e2; margin-bottom: -2px; padding-bottom: 9px; }
.d2-tabbody { background: #fff; border: 1px solid #dbe2ea; border-top: none; border-radius: 0 0 6px 6px; padding: 12px 14px; }
.d2-sechead { font-size: 13px; margin: 10px 0 6px; color: #445; }
.d2-sechead:first-child { margin-top: 0; }
.d2-cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.d2-foldgrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.d2-foldgrid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.d2-fold { border: 1px solid #dbe2ea; border-radius: 6px; background: #fafbfc; }
.d2-fold.warn { border-color: #e6b96a; background: #fffaf1; }
.d2-fold.danger { border-color: #d98383; background: #fff5f5; }
.d2-foldhead { display: flex; align-items: center; gap: 6px; padding: 6px 10px; cursor: pointer; font-size: 13px; user-select: none; }
.d2-foldhead:hover { filter: brightness(.97); }
.d2-foldtitle { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d2-foldsub { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d2-foldcnt { margin-left: auto; font-weight: bold; font-size: 13px; }
.d2-fold.warn .d2-foldcnt { color: #965b0a; }
.d2-fold.danger .d2-foldcnt { color: #b03030; }
.d2-foldarrow { font-size: 10px; color: #98a; }
.d2-fold.open .d2-foldarrow { transform: rotate(180deg); }
/* 2026-08-13 개편: 헤더는 그리드 칸에 고정, 내용은 그리드 아래 전폭 패널(d2-foldout)에 표시 */
.d2-foldgrid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.d2-fold.open .d2-foldhead { background: #e9f0fa; border-radius: 6px; }
.d2-foldout { margin: 6px 0 4px; }
/* 배치 6: 빠른 입력 (섹션1 아래 전폭 접힘 패널) */
.d2-quick { margin: 10px 0 4px; border: 1px solid #cfdcd4; border-radius: 8px; background: #f7faf8; }
.d2-quick .d2-foldhead { padding: 7px 12px; font-weight: bold; color: #00583c; }
.d2-quick.open .d2-foldhead { background: #e6f0ea; border-radius: 8px 8px 0 0; }
.d2-quickbody { display: grid; grid-template-columns: 1.3fr 1.4fr 1fr; gap: 10px; padding: 8px 10px 10px; }
.d2-quickcol { border: 1px solid #dfe7e2; border-radius: 6px; background: #fff; padding: 8px 10px; min-width: 0; }
.d2-quickcol h4 { margin: 0 0 6px; font-size: 13px; color: #00583c; display: flex; align-items: center; gap: 8px; }
.d2-quickcol .toolbar { margin-bottom: 6px; gap: 6px; }
.d2-quickcol table.grid td, .d2-quickcol table.grid th { padding: 3px 6px; font-size: 12px; }
.d2-quickcol input[type=number] { width: 70px; }
.d2-quickcol input[type=date] { width: 128px; }
.d2-foldpanel { border: 1px solid #c9d4e2; border-radius: 6px; background: #fff; margin-bottom: 6px; }
.d2-ptitle { font-size: 13px; font-weight: bold; padding: 6px 10px; background: #eef2f7;
  border-bottom: 1px solid #dbe2ea; border-radius: 6px 6px 0 0; }
.d2-ptitle .d2-pcnt { color: #667; font-weight: normal; margin-left: 4px; }
.d2-ptitle .d2-pclose { float: right; font-size: 12px; font-weight: normal; }
.d2-pbody { padding: 6px 10px 10px; }
.d2-legend { font-size: 11px; color: #889; margin-top: 4px; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.d2-legend-ev { display: inline-block; width: 14px; height: 12px; background: #fdf3dd; border: 1px solid #e8d9a8; border-radius: 3px; }
.d2-evdel { color: #b03030; font-size: 11px; margin-left: 4px; }
/* v36: 공지사항 카드 */
.d2-ntrow { display: flex; gap: 6px; align-items: flex-start; padding: 3px 0; border-bottom: 1px solid #f2f4f8; font-size: 12px; }
.d2-ntrow input { margin-top: 2px; }
.d2-ntrow .d2-ntc { flex: 1; white-space: normal; }
.d2-ntrow .d2-ntw { color: #98a; white-space: nowrap; }
.d2-tagbadge { cursor: pointer; }
.d2-tagbadge:hover { filter: brightness(.92); }
.dash2 table.kv th { background: #eef2f7; font-weight: normal; color: #556; position: static; cursor: default; }

/* 배치 19: 의약품 검색 드롭다운 (attachDrugPicker) */
.dp-list { position: absolute; display: none; z-index: 300; background: #fff; border: 1px solid #bbb;
  border-radius: 6px; box-shadow: 0 6px 18px rgba(0,0,0,.18); max-height: 320px; overflow-y: auto; font-size: 13px; }
.dp-item { padding: 6px 10px; cursor: pointer; white-space: nowrap; }
.dp-item:hover, .dp-item.on { background: #e8f2ec; }

/* 배치 19(개정): 옵션 순서 이동 — 원 없이 삼각형만 크게 */
.btn-round { border: none !important; background: none !important; box-shadow: none;
  padding: 0 4px !important; font-size: 15px; line-height: 1; color: #4a6a5a; cursor: pointer; }
.btn-round:hover { color: #00583c; }

/* 배치 21: 아이콘 버튼 (돋보기 등) — 테두리·배경 없이 아이콘만 */
.btn-icon { border: none !important; background: none !important; box-shadow: none;
  padding: 0 3px !important; color: #555; cursor: pointer; vertical-align: middle; }
.btn-icon:hover { color: #00583c; }

/* 배치 22: 상세·폼 섹션 가로 구분선 (얇은 선) + 사이드 세로 구분선 */
.detail-view h2, .detail-form h2 { border-top: 1px solid #e2e8ee; padding-top: 10px; }
.detail-view h2:first-child, .detail-form h2:first-child { border-top: none; padding-top: 0; }
.detail-aside { border-left: 1px solid #e2e8ee; padding-left: 24px; }
.detail-aside h2:first-child { border-top: none; }

/* 배치 24: 고위험·고주의 목록 — 태그 크기 버튼·크롬 없는 × ·표 컨트롤 압축(행 높이 일반 표와 통일) */
.btn-tag { font-size: 11px; border-radius: 9px; padding: 1px 8px !important; border: none;
  background: #5a6472; color: #fff; cursor: pointer; vertical-align: middle; line-height: 1.5; }
.btn-tag:hover { background: #404a58; }
.btn-x { border: none !important; background: none !important; box-shadow: none; cursor: pointer;
  color: #b02020; font-weight: bold; font-size: 13px; padding: 0 3px !important; vertical-align: middle; }
.btn-x:hover { color: #7c1414; }
#mg-body table.grid button { padding: 1px 8px; font-size: 12px; }
#mg-body table.grid button.btn-tag { font-size: 11px; }
#mg-body table.grid button.btn-x { padding: 0 3px; font-size: 13px; }
#mg-body table.grid input[type="number"] { height: 22px; font-size: 12px; }
#mg-body table.grid select { height: 24px; font-size: 12px; padding: 1px 4px; }   /* 배치 25: 인라인 분류 — 행 높이 유지 */

/* 배치 25: LASA 그룹 표 — 수정 모드에서만 조작 노출 · rowspan 그룹 셀 (병합 모양) */
#mg-body:not(.lasa-editing) .lasa-editonly { display: none; }
.lasa-grptable td.lasa-grpcell { vertical-align: middle; background: #f7f9fc; border-right: 1px solid #dfe6ee; }

/* 배치 27: 섹션 제목 = 패널 밖 (시인성 — 지시 6). 카드 그리드·대시보드 카드는 제목 안 유지 */
.sec-title { font-size: 15px; font-weight: bold; margin: 18px 0 6px; }
.sec-title:first-child { margin-top: 2px; }
.sec-title .muted, .sec-title .badge, .sec-title button, .sec-title label { font-weight: normal; }
.sec-title + .panel { border-radius: 6px; }

/* 배치 29 (지시 5): 표 안 컨트롤 전역 압축 — 버튼·입력 때문에 행이 높아지지 않게 통일 (hazard 분류 드롭다운 기준) */
table.grid button { padding: 2px 8px; font-size: 12px; line-height: 1.4; }
table.grid button.btn-x { padding: 0 3px; font-size: 13px; }
table.grid input:not([type="checkbox"]), table.grid select { height: 24px; font-size: 12px; padding: 1px 6px; box-sizing: border-box; }
table.grid td { padding-top: 4px; padding-bottom: 4px; }

/* 서송병원 공용 화면: 기존 업무 상태 색과 표 구조는 유지한다. */
@font-face {
  font-family: 'Pretendard Variable';
  src: url('/static/fonts/PretendardVariable.woff2') format('woff2');
  font-weight: 45 920;
  font-style: normal;
  font-display: swap;
}
:root {
  --brand: #00593D;
  --brand-dark: #00432E;
  --page: #F6F7F5;
  --ink: #2E3D36;
  --muted: #5F6F67;
  --mint: #E8F3EE;
  --line: #D9DEDC;
  --sidebar-width: 208px;
}
body {
  font-family: 'Pretendard Variable', Pretendard, 'Malgun Gothic', sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--page);
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}
[hidden] { display: none !important; }
body[data-admin="0"] .admin-only { display: none !important; }
a { color: var(--brand); }
button, input, select, textarea { font-family: inherit; }
button, .btn { border-color: var(--line); border-radius: 7px; color: var(--ink); font-weight: 550; }
button:hover, .btn:hover { background: var(--mint); }
button.primary { background: var(--brand); border-color: var(--brand); color: #fff; }
button.primary:hover { background: var(--brand-dark); border-color: var(--brand-dark); }
button:disabled { opacity: .55; cursor: wait; }
button.danger { color: #B02A2A; border-color: #D6A0A0; }
:is(button, a, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
input[type=text], input[type=number], input[type=date], input[type=password], select, textarea {
  border: 1px solid var(--line); border-radius: 7px; padding: 6px 8px; color: var(--ink); background: #fff; font-size: 13px;
}
input:focus, select:focus, textarea:focus { outline-color: var(--brand); }
.sidebar { width: var(--sidebar-width); background: #fff; border-color: var(--line); padding: 18px 10px; z-index: 20; }
.sidebar .logo { padding: 0 14px 14px; }
.sidebar .logo .brand { color: var(--brand-dark); letter-spacing: 0; font-size: 13px; margin-top: 7px; }
.workerbar { width: calc(100% - 16px); margin: 0 8px 12px; background: var(--mint); color: var(--brand-dark); }
.navitem { border-radius: 6px; padding: 8px 12px; margin-bottom: 2px; font-size: 14px; color: var(--ink); }
.navitem.navsub { padding-left: 26px; font-size: 13px; }
.navitem.on, .navitem.navsub.on { background: var(--mint); color: var(--brand-dark); box-shadow: inset 3px 0 var(--brand); }
.navitem:hover:not(.disabled):not(.on) { background: #F4F7F5; }
.navsec { margin-top: 12px; padding: 12px 12px 6px; border-color: var(--line); font-size: 11px; letter-spacing: 0; color: var(--muted); }
.app-header {
  margin-left: var(--sidebar-width); min-height: 64px; padding: 15px 26px;
  display: flex; gap: 18px; align-items: center; justify-content: space-between;
  background: #fff; border-top: 3px solid var(--brand); border-bottom: 1px solid var(--line);
}
.app-header-title { font-size: 14px; font-weight: 700; color: var(--brand-dark); }
.app-header-title > span { margin-left: 14px; font-size: 13px; font-weight: 450; color: var(--muted); }
.account-menu { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--muted); }
.account-menu button { padding: 4px 9px; font-size: 12px; }
.content { margin-left: var(--sidebar-width); padding: 24px 26px 36px; min-width: 0; }
h1 { font-size: 20px; color: var(--brand-dark); margin-bottom: 18px; letter-spacing: -.02em; }
h2, h3, .sec-title { color: var(--brand-dark); }
.muted, .count-info { color: var(--muted); }
.panel, .tablewrap, .d2-tabbody { border-color: var(--line); }
.panel { box-shadow: 0 1px 3px rgba(17,39,30,.035); }
.toolbar { gap: 8px 10px; }
.tabs { gap: 0; border-bottom-color: var(--line); }
.tab, .d2-tab { color: var(--muted); background: transparent; border-radius: 5px 5px 0 0; border: 0; border-bottom: 2px solid transparent; }
.tab.on, .d2-tab.active { color: var(--brand-dark); background: #fff; border: 0; border-bottom: 2px solid var(--brand); font-weight: 700; }
.tab:hover, .d2-tab:hover { background: var(--mint); }
.tab.danger { color: #9A6310; }
table.grid th { background: #F0F6F2; color: var(--muted); }
table.grid td { border-bottom-color: #E6ECE8; }
table.grid tbody tr:hover { background: #F1F7F3; }
table.grid th, table.grid td { line-height: 1.5; }
table.grid input:not([type="checkbox"]), table.grid select { height: 28px; }
.num, .card-value, .d2-foldcnt { font-variant-numeric: tabular-nums; }
.modal { width: min(640px, calc(100vw - 32px)); min-width: 0; border-radius: 12px; border: 1px solid var(--line); }
.modal-error { color: #A62F24; background: #FDEDEC; padding: 9px 12px; border-radius: 6px; font-size: 13px; }
.modal .actions { position: sticky; bottom: -20px; padding: 10px 0; background: #fff; }
.skip-link { position: fixed; left: 12px; top: -60px; z-index: 500; background: #fff; padding: 8px 14px; }
.skip-link:focus { top: 8px; }
.dash2 .d2-top > *, .d2-quickbody > * { min-width: 0; }
@media (max-width: 1380px) {
  .dash2 .d2-top4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .d2-foldgrid, .d2-foldgrid4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .d2-quickbody { grid-template-columns: 1fr; }
}
@media (max-width: 1050px) {
  :root { --sidebar-width: 176px; }
  .sidebar { padding-inline: 7px; }
  .content { padding: 18px 16px 30px; }
  .app-header { padding-inline: 16px; flex-wrap: wrap; gap: 6px; }
  .d2-foldgrid, .d2-foldgrid3, .d2-foldgrid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-aside { padding-left: 14px; }
}
@media (max-width: 700px) {
  .sidebar { position: relative; width: auto; max-height: 240px; border-bottom: 1px solid var(--line); }
  .sidebar .logo { max-width: 200px; margin: auto; }
  .app-header, .content { margin-left: 0; }
  .dash2 .d2-top4, .d2-cols2 { grid-template-columns: 1fr; }
  .app-header-title > span { margin-left: 8px; }
}
.web-login { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.login-wrap { width: min(600px, 100%); }
.login-card { display: grid; grid-template-columns: 218px 1fr; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 12px 36px -18px rgba(17,39,30,.25); }
.login-brand { padding: 36px 28px; background: linear-gradient(145deg, var(--brand), var(--brand-dark)); color: #fff; }
.login-eyebrow { margin: 0 0 32px; font-size: 10px; letter-spacing: .18em; font-weight: 700; }
.login-brand h1 { color: #fff; font-size: 23px; line-height: 1.4; }
.login-brand > p:last-child { margin-top: 26px; font-size: 13px; color: #D7E7DE; line-height: 1.7; }
.login-form-panel { padding: 30px; }
.login-logo { width: 146px; height: auto; display: block; margin: 0 0 22px; }
.login-form-panel h2 { margin: 0 0 20px; font-size: 18px; }
.login-form-panel label { display: block; margin: 14px 0 6px; font-size: 13px; font-weight: 600; }
.login-form-panel input { width: 100%; min-height: 40px; font-size: 15px; }
.login-form-panel button { width: 100%; min-height: 42px; margin-top: 24px; font-size: 14px; }
.login-help { text-align: center; font-size: 12px; color: var(--muted); margin-top: 16px; }
@media (max-width: 560px) {
  .login-card { grid-template-columns: 1fr; }
  .login-brand { padding: 24px; }
  .login-eyebrow { margin-bottom: 10px; }
  .login-brand h1 { font-size: 20px; margin-bottom: 0; }
  .login-brand > p:last-child { display: none; }
  .login-form-panel { padding: 24px; }
}