/* p-book.css - Book page, art direction v2 (D2). Needs css/base.css only (site.css is no longer linked here).
 * Rule-only fields, rooms as a rule list with a pool marker, receipt-style quote. Radius 0, no shadows. */
.book-page { background: var(--bone); color: var(--ink); }
.bk { min-height: 100svh; padding-top: calc(var(--header-h) + 20px); padding-bottom: 12vh; }
.bk-head { row-gap: 8px; align-items: end; max-height: 180px; }
.bk-title { grid-column: 1 / -1; font-size: 56px; line-height: 64px; margin: 0; }
.bk-intro { grid-column: 1 / -1; padding: 0; }
.bk-intro .t-body { margin: 0; max-width: none; }
.bk-intro .t-body { color: var(--ink-2); }

.bk__grid { margin-top: 28px; align-items: start; }
.bk-left { grid-column: 1 / span 7; min-width: 0; }
.bk__fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.bk fieldset { border: 0; margin: 24px 0 0; padding: 0; min-width: 0; }
.bk legend { padding: 0; margin-bottom: 14px; color: var(--ink-2); }

/* rooms: a rule list. each row has a 16px square radio; selected = pool fill, "Selected" label, 2px ink rules above and below, pool price */
.bk-rooms { border-bottom: 1px solid var(--rule); }
.bk-room { position: relative; display: grid; grid-template-columns: 132px minmax(0, 1fr) auto; column-gap: 24px; align-items: center; margin: 0; padding: 20px 0 20px 48px; border-top: 1px solid var(--rule); cursor: pointer; transition: background-color .25s; }
.bk-room:hover:not(.is-off) { background: rgba(23, 17, 13, .035); }
.bk-room > img, .bk-room > .bk-room__body { transition: transform .3s var(--ease-out); }
.bk-room:hover:not(.is-off) > img, .bk-room:hover:not(.is-off) > .bk-room__body { transform: translateX(8px); }
.bk-room input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.bk-room__mark { position: absolute; left: 4px; top: 50%; width: 18px; height: 18px; margin-top: -9px; border: 2px solid var(--ink); border-radius: 50%; /* the only round shape on the site */ background: transparent; box-sizing: border-box; }
.bk-room__mark::after { content: ""; position: absolute; inset: 2px; border-radius: 50%; background: var(--ink); transform: scale(0); transition: transform .2s; }
.bk-room img { width: 132px; height: 92px; object-fit: cover; object-position: 30% 62%; }
.bk-room__rate { display: block; max-width: 19em; font: 400 13px/17px var(--font-sans); color: var(--ink-2); text-align: right; }
.bk-room__name { font-size: 26px; line-height: 30px; }
.bk-room__spec { margin-top: 8px; font-size: 15px; line-height: 1.45; color: var(--ink-2); max-width: 34em; text-wrap: pretty; }
.bk-room__price { text-align: right; display: grid; gap: 4px; justify-items: end; }
.bk-room__price .t-fig { font-size: 22px; line-height: 1.1; }
.bk-room__price .label { color: var(--ink-2); }
.bk-room__sel { display: none; color: var(--ink) !important; font-weight: 500; }
.bk-room:has(input:checked) { box-shadow: inset 0 2px 0 var(--ink), inset 0 -2px 0 var(--ink); border-top-color: transparent; }
.bk-room:has(input:checked) .bk-room__mark::after { transform: scale(1); }
.bk-room:has(input:checked) .bk-room__sel { display: block; }
.bk-room:has(input:focus-visible) { outline: 2px solid var(--pool); outline-offset: -2px; }
.bk-room.is-off { cursor: not-allowed; }
.bk-room.is-off img, .bk-room.is-off .bk-room__body, .bk-room.is-off .bk-room__price { opacity: .45; }
.bk-room.is-off input { cursor: not-allowed; }
.bk-room__why { grid-column: 2 / -1; margin: 10px 0 0; font: 500 15px/1.4 var(--font-sans); color: #8A3A1C; }

/* quote: the pool surface (data-theme="pool" supplies ground + chalk text) */
.bk-quote { grid-column: 8 / span 5; position: sticky; top: calc(var(--header-h) + 24px); padding: 36px; min-width: 0; }
.bk-quote h2 { padding-bottom: 14px; border-bottom: 1px solid rgba(243, 238, 228, .25); color: var(--chalk); }
.bk-quote dl { display: grid; grid-template-columns: 1fr auto; font-size: 16px; margin: 0; }
.bk-quote dd.t-fig { font-size: 16px; }
.bk-quote dt, .bk-quote dd { margin: 0; padding: 13px 0; border-bottom: 1px solid rgba(243, 238, 228, .25); }
.bk-quote dd { text-align: right; font-size: 16px; }
.bk-quote .bk-total { margin-top: 18px; align-items: end; }
.bk-quote .bk-total dt, .bk-quote .bk-total dd { border-bottom: 0; padding: 0 0 18px; }
.bk-quote .bk-total dt { color: var(--chalk-2); padding-bottom: 14px; }
.bk-quote .bk-total dd { font-size: clamp(40px, 4vw, 56px); line-height: 1; }
.bk-quote .bk-rate { display: block; margin: -6px 0 0; font-size: 13px; line-height: 17px; letter-spacing: 0; text-transform: none; }
.bk-cur { font-size: .36em; letter-spacing: .06em; margin-right: .1em; vertical-align: .55em; }
.bk-quote > p:not(.bk-err):not(.bk-note) { margin: 0; }
.bk-quote .bk-err { margin-top: 16px; min-height: 1.4em; color: #F4B9A0; font-size: 15px; }
.bk-quote .bk-go { margin-top: 12px; --btn-bg: var(--chalk); --btn-fg: var(--pool); }
.bk-quote .bk-go:hover { box-shadow: inset 0 0 0 1px var(--chalk); }
.bk-quote .bk-go:focus-visible { outline-color: var(--chalk); }
.bk-quote .note { color: var(--chalk-2); }
.bk-quote .bk-note { display: block; margin-top: 18px; }
.bk-done { margin-top: 24px; padding-top: 16px; border-top: 1px solid rgba(243, 238, 228, .25); display: grid; gap: 6px; }
.bk-done strong { font-weight: 500; color: var(--chalk); font-size: 20px; line-height: 26px; }
.bk-done .note { display: block; margin-top: 6px; text-transform: none; letter-spacing: 0; font: 400 16px/1.45 var(--font-sans); color: var(--chalk-2); }

@media (max-width: 1100px) {
  .bk-quote { padding: 28px; }
  .bk-room { grid-template-columns: 104px minmax(0, 1fr) auto; column-gap: 18px; }
  .bk-room img { width: 104px; height: 76px; }
}
@media (max-width: 800px) {
  .bk { padding-top: calc(var(--header-h) + 32px); }
  .bk-title, .bk-intro, .bk-left, .bk-quote { grid-column: 1 / -1; }
  .bk__grid { margin-top: 40px; row-gap: 40px; }
  .bk__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bk__fields .field:last-child { grid-column: 1 / -1; }
  .bk fieldset { margin-top: 40px; }
  .bk-quote { position: static; padding: 28px 24px; }
  .bk-room { grid-template-columns: 84px minmax(0, 1fr); padding-left: 24px; }
  .bk-room img { width: 84px; height: 68px; }
  .bk-room__price { grid-column: 2; justify-items: start; text-align: left; }
  .bk-room__why { grid-column: 1 / -1; }
  .bk-quote .bk-total dd { font-size: 48px; }
}

/* R3 orchestrator cleanup: the Book title matches the other page titles (88 px at 1440), one line */
.bk-title { font-size: 56px; line-height: 64px; white-space: nowrap; } /* r5: 56 px, head block <= 180 px */
@media (max-width: 800px) { .bk-title { font-size: 44px; line-height: 52px; } .bk-head { max-height: none; } }

/* R4 book: quote scope line, action hint, sample-stay summary */
.bk-quote .bk-scope { margin: 12px 0 4px; font-size: 15px; line-height: 22px; color: var(--chalk-2); }
.bk-quote .bk-next { display: block; margin-top: 10px; font-size: 13px; line-height: 18px; letter-spacing: 0; text-transform: none; }
.bk-done__t { margin: 0; font: 500 22px/28px var(--font-sans); color: var(--chalk); }
.bk-done__l { display: grid; grid-template-columns: auto 1fr; column-gap: 20px; margin: 6px 0 0; font-size: 16px; }
.bk-done__l dt, .bk-done__l dd { padding: 8px 0; border-bottom: 1px solid rgba(243, 238, 228, .25); }
.bk-done__l dd { text-align: right; }
.bk-room__rate { grid-column: auto; }

/* r5: quote panel compacted so the whole quote, action and demo note fit at 1440x810 */
@media (min-width: 801px) {
  .bk-quote { padding: 24px 32px; }
  .bk-quote h2 { padding-bottom: 10px; }
  .bk-quote dt, .bk-quote dd { padding: 9px 0; }
  .bk-quote .bk-total { margin-top: 10px; }
  .bk-quote .bk-total dt, .bk-quote .bk-total dd { padding-bottom: 8px; }
  .bk-quote .bk-err { margin-top: 6px; min-height: 0; }
  .bk-quote .bk-err:empty { display: none; }
  .bk-quote .bk-note { margin-top: 12px; }
}