/* The room content has a constrained inner grid, but its pale-blue surface spans the viewport. */
.nr-entry-body:has(> .nr-room-detail.nr-room-figma-ready) {
  width: 100%;
  background: var(--nr-ice);
}

/* Replacing the six manually maintained Gutenberg rows with a shortcode adds a wrapper. */
.nr-entry-body .nr-room-figma-sidebar > .wp-block-shortcode:has(.nr-room-specs),
.nr-entry-body .nr-room-figma-sidebar > .nr-room-specs {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin: 0 !important;
}
.nr-entry-body .nr-room-figma-sidebar .nr-room-specs {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  background: var(--nr-pale);
}
.nr-entry-body .nr-room-figma-sidebar .nr-room-specs > .nr-room-spec-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-width: 0;
  padding: 16px 0;
  border-bottom: 1px solid rgba(4,20,66,.18);
}
.nr-entry-body .nr-room-figma-sidebar .nr-room-specs > .nr-room-spec-row:last-child { border-bottom: 0; }
.nr-entry-body .nr-room-figma-sidebar .nr-room-spec-label {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.nr-entry-body .nr-room-figma-sidebar .nr-room-spec-label p,
.nr-entry-body .nr-room-figma-sidebar .nr-room-spec-row > p.nr-room-spec-value {
  margin: 0 !important;
}
.nr-entry-body .nr-room-figma-sidebar .nr-room-spec-label figure.wp-block-image {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin: 0 !important;
}
.nr-entry-body .nr-room-figma-sidebar .nr-room-spec-label figure.wp-block-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media (max-width: 540px) {
  .nr-entry-body .nr-room-figma-sidebar .nr-room-specs > .nr-room-spec-row { gap: 10px; }
  .nr-entry-body .nr-room-figma-sidebar .nr-room-spec-label { gap: 8px; }
}

/* Native Hotel Booking controls must stretch within the Figma two-column form.
   Upstream form-group widths otherwise squeeze the date labels into 60px cards. */
.nr-entry-body .nr-room-booking-box .hb-search-results-form-container {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch;
  width: 100% !important;
  min-width: 0;
}
.nr-entry-body .nr-room-booking-box .hb-search-results-form-container > .hb-booking-room-form-group {
  box-sizing: border-box;
  display: block !important;
  float: none !important;
  grid-column: 1 / -1;
  justify-self: stretch;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
}
.nr-entry-body .nr-room-booking-box .hb-search-results-form-container > .hb-booking-room-form-group:nth-child(-n+4) {
  grid-column: span 1;
}
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group label {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 0 7px;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  font-size: 12px;
  line-height: 1.4;
}
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-field,
.nr-entry-body .nr-room-booking-box .hb-form-field-input,
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group input:not([type="hidden"]),
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group select {
  box-sizing: border-box;
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group input:not([type="hidden"]) {
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
  font-size: 14px;
  padding-inline: 0;
}
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group:has(> button.hb_button),
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group:has(button.hb_button) {
  grid-column: 1 / -1;
  width: 100% !important;
}
.nr-entry-body .nr-room-booking-box .hb-booking-room-form-group button.hb_button {
  width: 100% !important;
  max-width: none !important;
}
.nr-entry-body .nr-room-booking-box .hb_view_price { width: 100%; min-width: 0; }
.nr-entry-body .nr-room-booking-box .hb_view_price .nr-room-price-details-error {
  margin: 10px 0 0;
  color: var(--nr-ink);
  font: 400 13px/1.5 var(--nr-body);
}
.nr-entry-body .nr-room-booking-box .hb-booking-room-details {
  max-width: 100%;
  overflow-wrap: normal;
  word-break: normal;
}
@media (max-width: 420px) {
  .nr-entry-body .nr-room-booking-box { padding: 20px; }
  .nr-entry-body .nr-room-booking-box .hb-search-results-form-container { gap: 9px !important; }
  .nr-entry-body .nr-room-booking-box .hb-search-results-form-container > .hb-booking-room-form-group { padding: 10px 8px; }
  .nr-entry-body .nr-room-booking-box .hb-booking-room-form-group label { font-size: 10px; }
  .nr-entry-body .nr-room-booking-box .hb-booking-room-form-group input:not([type="hidden"]) { font-size: 12px; }
}

/* The dynamic amenity shortcode replaces exactly one Gutenberg group, preserving the Figma grid. */
.nr-entry-body .nr-room-figma-intro > .wp-block-shortcode:has(.nr-room-amenities-grid) {
  box-sizing: border-box;
  width: min(100%, 620px) !important;
  max-width: 620px !important;
  margin: 0 !important;
}
.nr-entry-body .nr-room-figma-intro .nr-room-amenities-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
}
.nr-entry-body .nr-room-figma-intro .nr-room-amenities-grid > .nr-room-amenity {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 50px;
  padding: 8px 12px;
  margin: 0 !important;
  background: var(--nr-pale);
  border-radius: 5px;
}
.nr-entry-body .nr-room-figma-intro .nr-room-amenity > figure.wp-block-image {
  flex: 0 0 25px;
  width: 25px;
  height: 25px;
  margin: 0 !important;
}
.nr-entry-body .nr-room-figma-intro .nr-room-amenity > figure.wp-block-image img {
  display: block;
  width: 25px;
  height: 25px;
  object-fit: contain;
}
.nr-entry-body .nr-room-figma-intro .nr-room-amenity > p {
  margin: 0 !important;
  color: var(--nr-ink);
  font: 400 15px/1.4 var(--nr-body);
}
@media (max-width: 480px) {
  .nr-entry-body .nr-room-figma-intro .nr-room-amenities-grid { grid-template-columns: 1fr; }
}