/* Room cards and details dialog. Font ownership remains in detail-finish.css. */
#rooms-section {
  --room-muted: #426A96;
  --room-border: #D3DAE8;
  font-synthesis: none;
}

/* Preserve icon ligatures and original 16px room names / 24px prices. */
#rooms-section .text-\[12px\]:not(.material-symbols-outlined),
#rooms-section .text-\[13px\]:not(.material-symbols-outlined) {
  font-size: 14px;
  line-height: 1.5;
}

#rooms-section .text-\[11px\]:not(.material-symbols-outlined) {
  font-size: 13px;
  line-height: 1.5;
}

#rooms-section .text-\[10px\]:not(.material-symbols-outlined) {
  font-size: 12px;
  line-height: 1.5;
}

#rooms-section .col-span-3 > .grid {
  line-height: 1.7;
}

#rooms-section .col-span-3.leading-relaxed {
  line-height: 1.75;
}

#rooms-section .text-\[\#426A96\] {
  color: var(--room-muted);
}

#rooms-section.border-\[\#D3DAE8\],
#rooms-section .border-\[\#D3DAE8\] {
  border-color: var(--room-border);
}

#rooms-section .text-right {
  font-variant-numeric: tabular-nums;
}

.room-details-link {
  min-height: 36px;
  color: #28649B;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.room-details-link:hover { color: #092B49; }
.room-details-link:focus-visible,
.room-card-photo:focus-visible,
.room-details-dialog button:focus-visible { outline: 2px solid #28649B; outline-offset: 3px; }
.room-details-dialog {
  width: min(640px, calc(100vw - 48px));
  max-height: calc(100dvh - 64px);
  margin: auto;
  padding: 24px;
  overflow: auto;
  border: 1px solid #D3DAE8;
  background: #fff;
  color: #092B49;
  font: inherit;
  line-height: 1.7;
}
.room-details-dialog::backdrop { background: rgb(9 43 73 / 45%); }
.room-details-header { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.room-details-header h2 { font-size: 20px; font-weight: 600; }
.room-details-header button { flex-shrink: 0; width: 36px; height: 36px; font-size: 26px; line-height: 1; }
.room-details-facts { margin: 12px 0 20px; color: #426A96; }
.room-details-dialog h3 { margin-bottom: 8px; font-weight: 600; }
.room-details-reception { white-space: pre-wrap; overflow-wrap: anywhere; color: #426A96; }
.room-details-footer { margin-top: 24px; text-align: right; }
.room-details-footer button { padding: 8px 16px; border: 1px solid #426A96; color: #28649B; }
.room-details-gallery { margin: 16px 0; }
.room-details-gallery[hidden], .room-details-gallery [hidden] { display: none; }
.room-details-image-stage { min-height: 180px; display: grid; place-items: center; background: #F5F7FA; }
.room-details-image-stage img { display: block; width: 100%; max-height: 48dvh; object-fit: contain; }
.room-details-image-stage p { padding: 20px; color: #426A96; }
.room-details-gallery figcaption { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-variant-numeric: tabular-nums; }
.room-details-gallery button { min-height: 44px; padding: 6px 12px; color: #28649B; }
.room-details-gallery button:disabled { opacity: .45; cursor: default; }


#detail-cabins { display:grid; gap:0; margin-top:4px; }
.room-card { display:grid; grid-template-columns:148px minmax(0,1fr) 250px; align-items:center; gap:20px; min-height:122px; padding:12px 0; border:0; border-bottom:1px solid #e5eaf0; background:#fff; }
.room-card:last-child { border-bottom:0; }
.room-card-photo { position:relative; overflow:hidden; width:148px; height:96px; padding:0; border:0; border-radius:3px; background:#f2f5f8; cursor:zoom-in; }
.room-card-photo:disabled { cursor:default; }
.room-card-photo > img { display:block; width:100%; height:100%; object-fit:cover; }
.room-card-info { min-width:0; padding:0; }
.room-card-info h3 { font-size:16px; line-height:24px; }
.room-card-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:480px; gap:2px 16px; margin-top:4px; font-size:14px; line-height:22px; color:#536274; overflow-wrap:anywhere; }
.room-card-info .room-details-link { font-size:13px; min-height:24px; margin-top:2px; text-decoration:none; }
.room-card-info .room-details-link:hover { text-decoration:underline; }
.room-card-booking { display:grid; grid-template-columns:1fr 112px; gap:6px 14px; align-items:center; text-align:right; font-variant-numeric:tabular-nums; }
.room-card-booking [data-detail-slot="cabin-price"] { font-size:24px; line-height:30px; white-space:nowrap; }
.room-card-booking [data-detail-slot="cabin-availability"] { grid-column:1 / -1; grid-row:2; font-size:12px; text-align:right; }
.room-card-booking [data-choose-cabin] { grid-column:2; grid-row:1; width:112px; min-height:40px; padding:8px; border-radius:3px; font-size:14px; }
.room-card-price-unit { font-size:13px; font-weight:400; color:#536274; margin-left:2px; }
@media(max-width:1100px){.room-card{grid-template-columns:128px minmax(0,1fr) 200px;gap:16px}.room-card-photo{width:128px;height:92px}.room-card-booking{grid-template-columns:1fr 96px;gap:6px 8px}.room-card-booking [data-choose-cabin]{width:96px}}