.rent-search {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: var(--space-4);
  align-items: end;
  margin-block-end: var(--space-6);
}

.rent-search .button {
  min-height: 3.125rem;
}

.rent-page .toolbar__count {
  margin-block-end: var(--space-5);
}

.space-card {
  padding: 0;
  overflow: hidden;
}

.space-card > img {
  width: 100%;
  height: 11.25rem;
  object-fit: cover;
}

.space-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-6) var(--space-6);
}

.space-card h3 {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.space-card .button {
  margin-block-start: var(--space-2);
}

.card-grid + .note-list {
  margin-block: var(--space-5) var(--space-10);
}

.rent-calendar {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--space-8);
  align-items: start;
}

.rent-calendar__month,
.rent-calendar__slots {
  padding: var(--space-7) var(--space-8);
}

.rent-calendar__weekdays,
.rent-calendar__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--space-1);
}

.rent-calendar__weekdays {
  margin-block: var(--space-6) var(--space-2);
}

.rent-calendar__weekdays li {
  color: var(--color-text-faint);
  font-size: 0.8125rem;
  font-weight: 700;
  text-align: center;
}

.rent-calendar__weekdays .is-sun {
  color: var(--color-danger);
}

.rent-calendar__weekdays .is-sat {
  color: var(--color-weekend-sat);
}

.rent-day {
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  background: transparent;
  border: 1.5px solid transparent;
  border-radius: var(--radius-media);
  cursor: pointer;
  font-size: 0.90625rem;
  font-weight: 500;
}

.rent-day--blank {
  cursor: default;
}

.rent-day::after {
  width: 5px;
  height: 5px;
  border-radius: var(--radius-pill);
  background: transparent;
  content: "";
}

.rent-day--available::after {
  background: var(--color-accent);
}

.rent-day--unavailable::after {
  background: var(--color-border-strong);
}

.rent-day--available:hover {
  border-color: var(--color-accent);
}

.rent-day:disabled {
  color: var(--color-border-strong);
  cursor: not-allowed;
}

.rent-day--unavailable:disabled {
  color: var(--color-text-faint);
}

.rent-day.is-selected {
  color: var(--color-text-inverse);
  background: var(--color-accent-strong);
  border-color: var(--color-accent-strong);
  font-weight: 800;
}

.rent-day.is-selected::after {
  background: rgb(255 255 255 / 80%);
}

.rent-calendar__legend {
  display: flex;
  gap: var(--space-5);
  margin-block-start: var(--space-5);
  color: var(--color-text-muted);
  font-size: var(--font-caption);
}

.rent-calendar__legend li {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.rent-calendar__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: var(--radius-pill);
  background: var(--color-border-strong);
}

.rent-calendar__dot--on {
  background: var(--color-accent);
}

.rent-calendar__slots-title {
  font-size: 1.3125rem;
  font-weight: 800;
}

.rent-calendar__hint {
  margin-block: var(--space-1) var(--space-4);
  color: var(--color-text-faint);
  font-size: 0.8125rem;
}

.slot-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-block: var(--space-5);
}

.slot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background: var(--color-surface);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-control);
  transition: border-color var(--motion-fast), background-color var(--motion-fast);
}

.slot__label {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  cursor: pointer;
  font-size: 0.9375rem;
  font-weight: 700;
}

.slot__label input {
  width: 1.25rem;
  height: 1.25rem;
  margin: 0;
  accent-color: var(--color-accent);
}

.slot--selected {
  background: var(--color-accent-wash);
  border-color: var(--color-accent);
}

.slot--disabled {
  color: var(--color-text-faint);
  background: var(--color-surface-soft);
  border-color: var(--color-surface-soft);
}

.slot--disabled .slot__label {
  cursor: not-allowed;
}

.rent-calendar__actions {
  display: flex;
  gap: var(--space-3);
  margin-block-end: var(--space-4);
}

@media (max-width: 64rem) {
  .rent-search {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rent-calendar {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }
}

@media (max-width: 40rem) {
  .rent-search {
    grid-template-columns: minmax(0, 1fr);
  }

  .rent-calendar__month,
  .rent-calendar__slots {
    padding: var(--space-5);
  }

  .rent-calendar__actions {
    flex-direction: column;
  }
}

/* 스텝 · 약관 · 폼 */
.rent-flow {
  max-width: 56rem;
}

.term-card {
  margin: 0 0 var(--space-5);
  border-width: 1px;
}

.term-card legend {
  padding: 0;
  margin-block-end: var(--space-4);
}

.term-card legend .icon {
  color: var(--color-accent);
}

.term-card__body {
  max-height: 11rem;
  margin-block-end: var(--space-5);
  padding: var(--space-5);
  overflow-y: auto;
  color: var(--color-text-muted);
  background: var(--color-bg);
  border-radius: var(--radius-control);
  font-size: var(--font-small);
  line-height: 1.8;
}

.kv-list--summary {
  margin-block-end: var(--space-8);
  padding: var(--space-5) var(--space-6);
  background: var(--color-bg);
  border-radius: var(--radius-control);
}

.rent-form__fields {
  margin-block-end: var(--space-8);
}

.rent-form .heading-bar small {
  margin-inline-start: var(--space-2);
  color: var(--color-text-faint);
  font-size: var(--font-caption);
  font-weight: 600;
}

.dropzone {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 6rem;
  padding: var(--space-5);
  color: var(--color-text-faint);
  background: var(--color-surface);
  border: 1.5px dashed var(--color-border-strong);
  border-radius: var(--radius-control);
  cursor: pointer;
  font-size: var(--font-small);
}

.dropzone:hover,
.dropzone:focus-within {
  color: var(--color-accent-strong);
  border-color: var(--color-accent);
}

@media (max-width: 40rem) {
  .form-actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }
}

.rent-page [hidden] { display: none !important; }
.rent-page .rent-demo-notice { margin-block: var(--space-4); overflow-wrap: anywhere; }
.rent-page .rent-demo-notice:empty { display: none; }
.rent-page .rent-demo-basket { margin-block: var(--space-6); }
.rent-page .rent-demo-schedules { display: grid; gap: var(--space-3); margin-block: var(--space-4); }
.rent-page .rent-demo-schedules > li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-control); }
.rent-page .rent-demo-schedules strong { flex-basis: 100%; }
.rent-page .rent-demo-schedules span { overflow-wrap: anywhere; }
.rent-page [data-rent-held] > li { flex-wrap: nowrap; padding-block: var(--space-2); }
.rent-page [data-rent-held] .demo-check { flex: 1 1 auto; min-width: 0; }
.rent-page .rent-demo-basket .button--small { flex: 0 0 auto; min-width: 44px; min-height: 44px; }
.rent-page .rent-demo-simulation { margin-block: var(--space-6); }
.rent-page .rent-demo-simulation summary { min-height: 44px; cursor: pointer; font-weight: 700; }
.rent-page .rent-demo-simulation p { margin-block: var(--space-4); }
.rent-page .rent-demo-agreement { margin-block: var(--space-6); min-height: 44px; }
.rent-page .rent-calendar__hint { font-size: var(--font-small); }
.rent-page .slot__label { min-height: 44px; }
.rent-page .rent-calendar__month, .rent-page .rent-calendar__slots { min-width: 0; }
.rent-page .rent-flow { margin-inline: auto; }
.rent-page .month-nav__button { min-width: 44px; min-height: 44px; }
.rent-page .rent-day { min-height: 44px; }
@media (max-width: 40rem) {
  .rent-page .rent-calendar__month { padding: var(--space-2); }
  .rent-page .rent-calendar__grid, .rent-page .rent-calendar__weekdays { gap: 0; }
  .rent-page .rent-calendar__slots { padding: var(--space-4); }
  .rent-page .rent-demo-schedules > li { align-items: start; flex-direction: column; }
  .rent-page .rent-demo-schedules strong { flex-basis: auto; }
  .rent-page .rent-demo-basket .button { width: 100%; }
  /* 담은 일정 행은 좁은 화면에서도 글 옆에 삭제 버튼을 둔다(세로로 쌓으면 행마다 넓은 빨간 버튼이 생긴다). */
  .rent-page [data-rent-held] > li { flex-direction: row; align-items: center; }
  .rent-page [data-rent-held] .button { width: auto; }
}

/* 접수 페이지 */
.rent-apply-form { display: grid; gap: var(--space-6); }
.rent-apply-section { margin: 0; }
.rent-apply-errors { margin-block-end: var(--space-6); padding: var(--space-5) var(--space-6); color: var(--color-danger); background: var(--color-surface); border: 1.5px solid var(--color-danger); border-radius: var(--radius-control); }
.rent-apply-errors p { margin: 0 0 var(--space-2); font-weight: 700; }
.rent-apply-errors ul { margin: 0; padding-inline-start: 1.25rem; }
.rent-apply-lines td.is-num, .rent-apply-lines th.is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rent-apply-lines tfoot th, .rent-apply-lines tfoot td { font-weight: 800; }
@media (max-width: 64rem) { .rent-apply-lines tbody td.is-num { text-align: left; white-space: normal; } }
.rent-apply-hint { margin-block: var(--space-4) 0; color: var(--color-text-muted); font-size: var(--font-small); }
.rent-apply-section .rent-form__fields { margin-block-end: 0; }
.grid-2__full { grid-column: 1 / -1; }
.choice-group__items--column { flex-direction: column; align-items: stretch; }
.choice--disabled { color: var(--color-text-faint); cursor: not-allowed; }
.rent-apply-rate { color: var(--color-accent-strong); font-weight: 700; }
.rent-apply-note { color: var(--color-text-faint); font-size: var(--font-caption); }
.rent-apply-files { padding-block: var(--space-3); }
.field__hint--strong { color: var(--color-danger); font-weight: 700; }
.rent-page [data-discount-reason] { margin-block-start: var(--space-4); }

/* 달력: 오늘(테두리 링) · 선택한 날(채움) · 선택 불가(과거·신청 기간 밖) 구분 */
.rent-day.is-today { position: relative; border-color: var(--color-accent); font-weight: 800; }
.rent-day.is-today::before { position: absolute; top: 2px; left: 0; right: 0; color: var(--color-accent-strong); font-size: 0.5625rem; font-weight: 700; line-height: 1; text-align: center; content: "오늘"; }
.rent-day.is-today.is-selected { border-color: var(--color-accent-strong); box-shadow: 0 0 0 2px var(--color-surface), 0 0 0 4px var(--color-accent); }
.rent-day.is-today.is-selected::before { color: var(--color-text-inverse); }
.rent-day.rent-day--out, .rent-day.rent-day--out:disabled { color: var(--color-border-strong); background: transparent; border-color: transparent; cursor: not-allowed; text-decoration: line-through; }
.rent-day.rent-day--out::after { background: transparent; }
.rent-day-legend { display: inline-block; width: 0.875rem; height: 0.875rem; border: 1.5px solid var(--color-border-strong); border-radius: var(--radius-media); vertical-align: middle; }
.rent-day-legend--today { border-color: var(--color-accent); }
.rent-day-legend--selected { background: var(--color-accent-strong); border-color: var(--color-accent-strong); }
.rent-day-legend--out { border-color: transparent; background: var(--color-surface-soft); }

.rent-annual-usage { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--space-2); margin-bottom: var(--space-3); word-break: keep-all; overflow-wrap: anywhere; }
.rent-annual-usage--exceeded { border: 2px solid var(--color-accent-strong); }
.rent-annual-usage--exceeded > strong, .rent-annual-usage--exceeded p > strong { color: var(--color-accent-strong); }

.rent-annual-phrase { display: inline-block; }

/* 정기대관 달력: 다른 선정 시설로 이동하는 링크. 카드 끝 기간 패널의 아래 여백은 없앤다(2026-10-08). */
.rent-apply-section > .meta-panel:last-child { margin-block-end: 0; }
.regular-other-teams { margin-block-start: calc(-1 * var(--space-2)); }
.regular-other-teams__title { margin: 0 0 var(--space-3); color: var(--color-text-muted); font-size: var(--font-small); font-weight: 700; }
.regular-other-teams__list { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.regular-other-teams__link { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-4); min-height: 44px; padding: var(--space-3) var(--space-5); color: var(--color-text); border: 1px solid var(--color-border); border-radius: var(--radius-control); text-decoration: none; word-break: keep-all; }
.regular-other-teams__link:hover, .regular-other-teams__link:focus-visible { border-color: var(--color-accent); background: var(--color-accent-wash); }
.regular-other-teams__state { color: var(--color-accent-strong); font-weight: 700; white-space: nowrap; }

/* 정기대관 접수 유의사항: 헤더 설명문 대신 카드 위에 같은 폭으로 둔다(2026-10-08). */
.rent-guide { margin-block-end: var(--space-6); padding: var(--space-6) var(--space-7); background: var(--color-accent-wash); border: 1.5px solid var(--color-accent); border-radius: var(--radius-control); }
.rent-guide__title { margin: 0 0 var(--space-3); color: var(--color-accent-strong); font-size: 1rem; font-weight: 800; }
.rent-guide__list { display: grid; gap: var(--space-2); margin: 0; padding-inline-start: 1.125rem; list-style: disc; line-height: 1.6; word-break: keep-all; }
.rent-guide__list li::marker { color: var(--color-accent); }
@media (max-width: 40rem) {
  .rent-guide { padding: var(--space-5); }
}
/* 시간 지정 대관(D-87): 1시간 원자 시간표와 시작·종료 선택 */
.rent-hours { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: var(--space-2); margin: var(--space-3) 0; padding: 0; list-style: none; }
.rent-hours li { padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-control); font-size: var(--font-small); }
.rent-hours li.is-unavailable { color: var(--color-text-muted); background: var(--color-surface-muted, var(--color-surface)); text-decoration: line-through; }
.rent-range { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-block-end: var(--space-4); }
.rent-range .field__control { min-width: 8rem; }
.rent-range-notice { display: grid; gap: var(--space-1); margin-block: var(--space-4); padding: var(--space-3) var(--space-4); border: 1.5px solid var(--color-danger); border-radius: var(--radius-control); background: var(--color-danger-bg); font-size: var(--font-small); }
.rent-range-notice strong { color: var(--color-danger); font-weight: 700; }
/* 대관 달력 상단 정보: 시설명·요금은 내용 폭만 쓰고 남는 폭은 접수 기간에 준다(사이 빈 공간 제거). 접수 기간은 줄마다 끊는다. 태블릿 2열(접수 기간은 한 줄 전체), 모바일 1열. */
.meta-panel.rent-meta { grid-template-columns: auto auto minmax(0, 1fr); column-gap: var(--space-8); }
.rent-window__line { display: block; word-break: keep-all; font-variant-numeric: tabular-nums; }
.rent-window__line + .rent-window__line { margin-block-start: var(--space-1); }
@media (max-width: 64rem) {
  .meta-panel.rent-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .meta-panel.rent-meta > div:last-child { grid-column: 1 / -1; }
}
@media (max-width: 40rem) { .meta-panel.rent-meta { grid-template-columns: minmax(0, 1fr); } }
