/* 담당 book — 보호자 화면 CSS. 클래스 접두어 .book- 만, 색·크기는 var(--토큰)·rem 만(base.css). kit/병렬작업계약.md */

/* 예약 메뉴 */
.book-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
.book-menu-card { display: flex; align-items: center; gap: var(--sp-4); height: 100%; padding: var(--sp-5); background: var(--surface); border: .0625rem solid var(--line); border-radius: var(--r-lg); transition: border-color var(--t-short) var(--ease), box-shadow var(--t-short) var(--ease); }
.book-menu-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.book-menu-card:focus-visible { box-shadow: var(--focus); }
.book-menu-txt { display: flex; flex-direction: column; gap: .25rem; flex: 1 1 auto; min-width: 0; }
.book-menu-txt strong { font-size: var(--fs-lg); font-weight: 800; }
.book-menu-txt > span { color: var(--ink-3); font-size: var(--fs-sm); }
.book-menu-txt b { color: var(--ink); font-weight: 800; }
.book-menu-go { color: var(--ink-3); flex: none; }
@media (max-width: 760px) { .book-menu { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); } .book-menu-card { padding: var(--sp-4); } }

.book-up { display: flex; flex-direction: column; }
.book-up a { display: flex; align-items: center; gap: var(--sp-3); padding: .75rem 0; border-bottom: .0625rem solid var(--line); min-height: var(--tap); }
.book-up li:last-child a { border-bottom: 0; }
.book-up a:hover .book-up-main strong { color: var(--accent-ink); text-decoration: underline; text-underline-offset: .1875rem; }
.book-up-date { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; border-radius: var(--r); background: var(--accent-soft); color: var(--accent-ink); flex: none; line-height: 1.15; }
.book-up-date b { font-size: var(--fs-lg); font-weight: 800; }
.book-up-date small { font-size: var(--fs-xs); font-weight: 700; }
.book-up-main { display: flex; flex-direction: column; gap: .125rem; flex: 1 1 auto; min-width: 0; }
.book-up-main strong { font-weight: 750; }
@media (max-width: 420px) { .book-up a { flex-wrap: wrap; } .book-up a .badge { margin-left: 4.25rem; } }

.book-howto { counter-reset: bh; display: flex; flex-direction: column; gap: var(--sp-3); }
.book-howto li { counter-increment: bh; display: grid; grid-template-columns: 1.75rem 1fr; column-gap: var(--sp-3); }
.book-howto li::before { content: counter(bh); grid-row: span 2; display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--surface-2); color: var(--ink-2); font-weight: 800; font-size: var(--fs-sm); }
.book-howto strong { font-weight: 750; }
.book-howto span { color: var(--ink-3); font-size: var(--fs-sm); }

.book-sub { display: block; margin-top: .125rem; font-size: var(--fs-sm); font-weight: 500; color: var(--ink-3); }

/* 신청 내역 */
.book-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 760px) { .book-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .book-stats .stat .v { font-size: 1.5rem; } }
.book-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }
.book-bar .seg { max-width: 100%; }
.book-sort { display: flex; align-items: center; gap: var(--sp-2); }
.book-sort .select { width: auto; min-width: 9.5rem; }
.book-table .table { min-width: 0; }
.book-cards { display: none; }
@media (max-width: 760px) {
  .book-table { display: none; }
  .book-cards { display: flex; flex-direction: column; gap: var(--sp-3); }
  .book-card { display: flex; flex-direction: column; gap: .375rem; padding: var(--sp-4); background: var(--surface); border: .0625rem solid var(--line); border-radius: var(--r); }
  .book-card:hover { border-color: var(--line-strong); }
  .book-card .small { display: inline-flex; align-items: center; gap: .3125rem; }
  .book-card-title { font-size: var(--fs-lg); font-weight: 800; }
}

/* 신청 상세 */
.book-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }
.book-head-when { font-size: var(--fs-h4); font-weight: 800; margin-top: .25rem; }
.book-kv dd { overflow-wrap: anywhere; }
.book-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
@media (max-width: 560px) { .book-checks { grid-template-columns: minmax(0, 1fr); } }
.book-check { display: flex; flex-direction: column; gap: .25rem; align-items: flex-start; }
.book-check-title { display: flex; align-items: center; gap: .5rem; font-size: var(--fs-md); font-weight: 800; margin-bottom: .25rem; }
.book-check-title .ic { color: var(--accent); }
.book-check .link { margin-top: auto; padding-top: var(--sp-2); }
.book-actions { display: flex; gap: var(--sp-3); flex-wrap: wrap; align-items: center; }
.book-actions form { display: contents; }
@media (max-width: 760px) {
  .book-actions { position: sticky; bottom: calc(var(--tabbar-h, 0rem) + .5rem); z-index: 5; padding: var(--sp-3); background: var(--glass); border: .0625rem solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-lg); }
  .book-actions .btn { flex: 1 1 auto; }
}

.book-flow { display: flex; flex-direction: column; }
.book-flow li { position: relative; display: flex; gap: var(--sp-3); padding-bottom: var(--sp-4); }
.book-flow li:last-child { padding-bottom: 0; }
.book-flow li:not(:last-child)::after { content: ""; position: absolute; left: .6875rem; top: 1.625rem; bottom: .25rem; width: .125rem; background: var(--line-strong); }
.book-flow li.is-done:not(:last-child)::after { background: var(--ink-2); }
.book-flow li > .ic { width: 1.375rem; height: 1.375rem; flex: none; color: var(--ink-3); }
.book-flow li.is-done > .ic { color: var(--ok); }
.book-flow li.is-now > .ic { color: var(--accent); }
.book-flow li.is-stop > .ic { color: var(--danger); }
.book-flow li > div { display: flex; flex-direction: column; gap: .125rem; min-width: 0; }
.book-flow strong { font-weight: 750; }
.book-flow li.is-todo strong { color: var(--ink-3); }
.book-flow span { color: var(--ink-3); font-size: var(--fs-sm); }

.book-links a { display: flex; align-items: center; gap: .625rem; min-height: var(--tap); padding: 0 .25rem; border-bottom: .0625rem solid var(--line); font-weight: 650; }
.book-links li:last-child a { border-bottom: 0; }
.book-links a .ic:first-child { color: var(--accent); }
.book-links a .ic:last-child { margin-left: auto; color: var(--ink-3); }
.book-links a:hover { color: var(--accent-ink); }

/* 신청 수정 */
.book-fs { display: flex; flex-direction: column; gap: var(--sp-5); min-width: 0; border: 0; padding: 0; margin: 0; }
.book-fs:disabled { opacity: .7; }
.book-switch-row .switch { align-items: flex-start; }
.book-switch-row .switch > span { display: flex; flex-direction: column; }
.book-tips { margin-top: var(--sp-3); padding-top: var(--sp-3); border-top: .0625rem solid var(--line); display: flex; flex-direction: column; gap: .375rem; }
.book-tips li { position: relative; padding-left: 1rem; font-size: var(--fs-sm); color: var(--ink-2); }
.book-tips li::before { content: ""; position: absolute; left: .25rem; top: .55rem; width: .3125rem; height: .3125rem; border-radius: 50%; background: var(--ink-3); }

/* 픽업 요청 */
.book-ro { display: flex; align-items: center; min-height: 3rem; padding: .588rem .824rem; border: .0938rem solid var(--line); border-radius: var(--r-sm); background: var(--surface-2); font-weight: 650; }
