/* 자원.css — 회의실 · 법인차량 이용현황 (style.css 를 안 키우려고 분리)
   날짜 × 자원 격자. **빈 칸이 곧 답이라** 「비어 있음」을 흐리게 적어 두고,
   잡힌 칸만 색이 서게 한다. 이름은 전부 `rs-` 로 시작한다. */

table.rs { width: 100%; border-collapse: collapse; font-size: 13px; }
table.rs th, table.rs td {
  border: 1px solid var(--line); padding: 5px 8px; vertical-align: top;
}
table.rs thead th {
  background: var(--bg); font-size: 12px; font-weight: 700; text-align: center;
  position: sticky; top: 0; z-index: 1;
}
.rs-note { display: block; font-size: 11px; font-weight: 500; color: var(--gray); }
.rs-dh { width: 88px; }

/* 날짜 칸 — 달력과 같은 규칙(일요일·공휴일은 빨강, 토요일은 파랑) */
.rs-d {
  width: 88px; text-align: left; font-weight: 700; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.rs-d.sun { color: var(--red); }
.rs-d.sat { color: #1d4ed8; }
.rs-dow { margin-left: 5px; font-size: 11.5px; font-weight: 500; color: var(--gray); }
.rs-hol { display: block; font-size: 11px; font-weight: 500; color: var(--red); }
tr.rs-off > td, tr.rs-off > th { background: #fafbfa; }
tr.rs-today > th, tr.rs-today > td { background: var(--green-l); }

/* 잡힌 칸 — 시각을 맨 위에 굵게(이 화면이 답할 질문이 「몇 시에 차 있나」다) */
.rs-b {
  display: block; width: 100%; text-align: left; margin: 0 0 4px;
  padding: 5px 7px; border: 1px solid #cfe0d4; border-left: 3px solid var(--green);
  border-radius: 5px; background: #f2f8f4; cursor: pointer; font: inherit; color: inherit;
}
.rs-b:last-child { margin-bottom: 0; }
.rs-b:hover { background: #e6f1ea; }
.rs-b.plain { cursor: default; }
.rs-b.plain:hover { background: #f2f8f4; }
/* 겹쳐 잡힌 것 — 회의실은 저장할 때 막지만 법인차량은 결재 문서가 정본이라 막을 자리가 없다.
   그러면 적어도 눈에 걸려야 한다. */
.rs-b.clash { border-color: #e6c9a8; border-left-color: var(--amber); background: var(--amber-l); }
.rs-b.clash:hover { background: #f8ecd2; }
.rs-t { display: block; font-weight: 700; font-size: 12px; font-variant-numeric: tabular-nums; }
.rs-n { display: block; }
.rs-w { display: block; font-size: 11.5px; color: var(--gray); }
.rs-free { color: #c3c8c3; font-size: 12px; }

@media screen and (max-width: 560px) {
  /* 좁은 화면에서는 줄이지 않고 가로로 민다(A4·넓은 표와 같은 규칙) —
     폭에 맞춰 줄이면 시각이 못 읽을 크기가 된다. */
  table.rs { min-width: 480px; }
  .rs-dh, .rs-d { width: 62px; }
  .rs-w { display: none; }
}