/* Figma 600:31478 — Hotel Negotiation & RFP console */

.rfps-admin__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.rfps-admin__title {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  margin: 0;
}

.rfps-admin__create {
  font-weight: 500;
  color: var(--wa-color-brand-fill-loud);
  white-space: nowrap;
}

.rfps-admin__create:hover {
  text-decoration: underline;
}

/* KPI row */
.rfps-admin__kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

.rfps-admin__kpi {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  min-width: 0;
  background: var(--wa-color-surface-lowered);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 1rem;
}

.rfps-admin__kpi-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--wa-color-text-quiet);
  margin-bottom: 0.25rem;
}

.rfps-admin__kpi-value {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  line-height: 1.2;
}

.rfps-admin__kpi-sub {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
  margin-top: 0.25rem;
}

.rfps-admin__kpi-icon {
  font-size: 1.125rem;
  color: var(--wa-color-text-quiet);
  opacity: 0.6;
  margin-top: 0.125rem;
}

/* Cards */
.rfps-admin__card {
  background: var(--wa-color-surface-lowered);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 1rem;
  margin-bottom: 1rem;
}

.rfps-admin__table-wrap {
  overflow-x: auto;
}

/* Table */
.rfps-admin__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.rfps-admin__table thead th {
  text-align: left;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--wa-color-text-quiet);
  font-weight: 600;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--wa-color-surface-border);
  white-space: nowrap;
}

.rfps-admin__table tbody td {
  padding: 0.75rem;
  border-bottom: 1px solid var(--wa-color-surface-border);
  color: var(--wa-color-text-normal);
  vertical-align: middle;
}

.rfps-admin__table tbody tr:last-child td {
  border-bottom: none;
}

.rfps-admin__link {
  color: var(--wa-color-brand-fill-loud);
  text-decoration: none;
  font-weight: 500;
}

.rfps-admin__link:hover {
  text-decoration: underline;
}

.rfps-admin__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  white-space: nowrap;
}

/* Actions column sizes to content inside the scroll wrap (no clipping at 1024px) */
.rfps-admin__table thead th:last-child,
.rfps-admin__table tbody td:last-child {
  white-space: nowrap;
}

.rfps-admin__table tbody td:last-child a {
  white-space: nowrap;
}

.rfps-admin__actions a {
  color: var(--wa-color-brand-fill-loud);
  text-decoration: none;
  font-size: 0.8125rem;
}

.rfps-admin__actions a:hover {
  text-decoration: underline;
}

/* Status pills */
.rfps-admin__pill {
  display: inline-block;
  padding: 0.125rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
  white-space: nowrap;
}

.rfps-admin__pill--sent {
  background: var(--wa-color-warning-fill-quiet);
  color: var(--wa-color-warning-on-quiet);
}

.rfps-admin__pill--responses_received {
  background: var(--wa-color-brand-fill-quiet);
  color: var(--wa-color-brand-on-quiet);
}

.rfps-admin__pill--draft {
  background: var(--wa-color-neutral-fill-quiet);
  color: var(--wa-color-neutral-on-quiet);
}

.rfps-admin__pill--closed {
  background: var(--wa-color-success-fill-quiet);
  color: var(--wa-color-success-on-quiet);
}

.rfps-admin__pill--overdue {
  background: var(--wa-color-danger-fill-quiet);
  color: var(--wa-color-danger-on-quiet);
}

.rfps-admin__pill--neutral {
  background: var(--wa-color-neutral-fill-quiet);
  color: var(--wa-color-neutral-on-quiet);
  margin-left: 0.375rem;
}

/* Pagination */
.rfps-admin__pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

/* Comparison card */
/* HMS-1400 — card header: title on the left, the RFP picker on the right. */
.rfps-admin__comparison-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 0 0 0.25rem;
}

.rfps-admin__comparison-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  margin: 0;
}

.rfps-admin__comparison-picker {
  display: inline-flex;
  align-items: center;
}

.rfps-admin__comparison-picker wa-select {
  min-width: 14rem;
}

.rfps-admin__comparison-sub {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
  margin: 0 0 1rem;
}

/* Dialogs */
.rfps-admin__dialog-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0.25rem 0;
}

/* HMS-713 — Figma: divider rows (no outer box), compact badge left, bold one-line name, right-aligned one-line status. */
.rfps-admin__remind-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--wa-color-neutral-border-quiet);
  display: flex;
  flex-direction: column;
}

.rfps-admin__remind-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0;
  font-size: 0.875rem;
  /* native.css gives every li `margin-inline-start: 1.125em`, insetting the row
     past the summary banner/heading edge. */
  margin-inline-start: 0;
}

.rfps-admin__remind-row + .rfps-admin__remind-row {
  border-top: 1px solid var(--wa-color-neutral-border-quiet);
}

.rfps-admin__remind-hotel {
  font-weight: var(--wa-font-weight-bold, 700);
  font-size: 1rem;
  color: var(--wa-color-text-normal);
  /* the email is the row's identifier — never crushed by a long hotel name */
  flex-shrink: 0;
  max-width: 55%;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rfps-admin__remind-hotel-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--wa-color-text-quiet);
  font-size: 0.875rem;
}

.rfps-admin__remind-status {
  margin-left: auto;
  flex-shrink: 0;
  white-space: nowrap;
  color: var(--wa-color-text-quiet);
  font-size: 0.875rem;
}

/* HMS-1241 — each remind row is opt-out: a checked box up front, then a label
   carrying the recipient so the row keeps its flex alignment and truncation. */
.rfps-admin__remind-check {
  flex-shrink: 0;
  margin: 0;
}

.rfps-admin__remind-pick {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  /* fills the row so the email's 55% cap measures real space, not a shrunk box */
  flex: 1;
  min-width: 0;
  cursor: pointer;
}

.rfps-admin__remind-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  flex-shrink: 0;
  white-space: nowrap;
  padding: 0.25rem 0.5rem;
  border-radius: var(--wa-border-radius-s, 0.25rem);
  background: #FEF3CD;
  color: #8C4602;
  font-size: 0.75rem;
  line-height: 1;
}

.rfps-admin__remind-summary {
  background: var(--wa-color-warning-fill-quiet);
  border: 1px solid var(--wa-color-warning-border-quiet);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.rfps-admin__remind-summary strong {
  font-size: 0.9375rem;
  color: var(--wa-color-text-normal);
}

.rfps-admin__remind-summary span {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

/* Dialog typography per Figma: modal title 18px/#1B1D26, banner title 18px,
   deadline 16px, heading 16px. ::part(title) reaches into the wa-dialog
   shadow header — the class sits on the wa-dialog element itself. */
.rfps-admin__dialog::part(title) { font-size: 1.125rem; color: #1B1D26; }
.rfps-admin__remind-summary strong { font-size: 1.125rem; }
.rfps-admin__remind-summary span { font-size: 1rem; }
.rfps-admin__remind-heading { font-size: 1rem; font-weight: var(--wa-font-weight-normal, 400); margin: 0; }

.rfps-admin__note {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
  margin: 0;
}

.rfps-admin__dialog-footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

/* HMS-713 — Figma centers the remind dialog's Cancel/Send Reminder buttons;
   the counter-offer and accept-bid footers stay right-aligned. */
.rfps-admin__dialog[id^="remind-"] .rfps-admin__dialog-footer { justify-content: center; }

/* HMS-713 — remind dialog: wider panel so rows stay on one line, full-width
   message box, divider above the centered footer, Figma yellow Send button. */
.rfps-admin__dialog[id^="remind-"] { --width: min(40rem, calc(100vw - 2rem)); }
.rfps-admin__dialog[id^="remind-"]::part(header) {
  border-bottom: 1px solid var(--wa-color-neutral-border-quiet);
}
.rfps-admin__dialog[id^="remind-"] .rfps-admin__field-label { font-size: 1rem; }
.rfps-admin__dialog[id^="remind-"] .rfps-admin__dialog-footer {
  border-top: 1px solid var(--wa-color-neutral-border-quiet);
  padding-top: 1rem;
}

.rfps-admin__remind-message {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: 0.375rem;
  padding: 0.5rem 0.75rem;
  font: inherit;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--wa-color-text-normal);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  background: var(--wa-color-surface-raised);
  resize: vertical;
}

/* HMS-1391 — quiet note under the remind dialog's label: the mail already
   carries the status ask, so the note field starts empty. */
.rfps-admin__remind-hint {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
  margin: 0.25rem 0 0;
}

wa-button.rfps-admin__remind-send::part(base) {
  background: #FEF3CD;
  border: 1px solid #FAC22B;
  color: #8C4602;
}

wa-button.rfps-admin__remind-send::part(base):hover {
  background: #FDE7A3;
}

@media (max-width: 480px) {
  .rfps-admin__remind-row { flex-wrap: wrap; }
  .rfps-admin__remind-status { margin-left: 0; flex-basis: 100%; white-space: normal; }
}

/* Counter-offer dialog */
.rfps-admin__counter-to {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--wa-color-text-normal);
  margin: 0;
}

.rfps-admin__counter-rates {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.rfps-admin__counter-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.rfps-admin__counter-row label {
  font-size: 0.875rem;
  color: var(--wa-color-text-normal);
}

.rfps-admin__counter-input {
  width: 6.5rem;
  padding: 0.375rem 0.5rem;
  font-size: 0.875rem;
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  background: var(--wa-color-surface-raised);
  color: var(--wa-color-text-normal);
}

.rfps-admin__counter-terms {
  width: 100%;
  padding: 0.375rem 0.5rem;
  font-size: 0.875rem;
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  background: var(--wa-color-surface-raised);
  color: var(--wa-color-text-normal);
  resize: vertical;
  box-sizing: border-box;
}

/* Accept dialog */
.rfps-admin__accept-summary {
  background: var(--wa-color-success-fill-quiet);
  border: 1px solid var(--wa-color-success-border-quiet);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 1rem;
}

.rfps-admin__accept-heading {
  font-size: 0.875rem;
  color: var(--wa-color-text-normal);
  margin: 0 0 0.75rem;
}

.rfps-admin__accept-dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.375rem 1rem;
  margin: 0;
  font-size: 0.875rem;
}

.rfps-admin__accept-dl dt {
  color: var(--wa-color-text-quiet);
}

.rfps-admin__accept-dl dd {
  margin: 0;
  color: var(--wa-color-text-normal);
}

.rfps-admin__accept-next-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  margin: 0 0 0.375rem;
}

.rfps-admin__accept-next {
  margin: 0;
  padding-left: 1.25rem;
  font-size: 0.875rem;
  color: var(--wa-color-text-normal);
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

/* RFP detail page (Figma 600:31909) */
.rfp-detail__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.rfp-detail__title {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  margin: 0;
}

.rfp-detail__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.25rem;
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
}

.rfp-detail__meta-item {
  display: flex;
  gap: 0.375rem;
}

.rfp-detail__meta dt {
  color: var(--wa-color-text-quiet);
  font-weight: 500;
}

.rfp-detail__meta dt::after {
  content: ":";
}

.rfp-detail__meta dd {
  margin: 0;
  color: var(--wa-color-text-normal);
}

.rfp-detail__meta-item--secondary dd {
  color: var(--wa-color-text-quiet);
}

.rfp-detail__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

.rfp-detail__stat {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  background: var(--wa-color-surface-lowered);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 1rem;
}

.rfp-detail__stat-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--wa-color-text-quiet);
}

.rfp-detail__stat-value {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  line-height: 1.2;
}

.rfp-detail__stat-sub {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

.rfp-detail__section {
  background: var(--wa-color-surface-lowered);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 1rem;
  margin-bottom: 1rem;
}

.rfp-detail__section-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
  margin: 0 0 0.75rem;
}

.rfp-detail__requirements {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.5rem 1rem;
  margin: 0;
  font-size: 0.875rem;
}

.rfp-detail__requirements dt {
  color: var(--wa-color-text-quiet);
}

.rfp-detail__requirements dd {
  margin: 0;
  color: var(--wa-color-text-normal);
}

.rfp-detail__response-list {
  display: flex;
  flex-direction: column;
}

.rfp-detail__response-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--wa-color-surface-border);
  font-size: 0.875rem;
}

.rfp-detail__response-row:last-child {
  border-bottom: none;
}

.rfp-detail__response-hotel {
  color: var(--wa-color-text-normal);
  font-weight: 500;
}

.rfp-detail__response-right {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--wa-color-text-quiet);
  white-space: nowrap;
}

.rfp-detail__table-wrap {
  overflow-x: auto;
}

/* HMS-1241 — the per-invitation Remind button's inline form must not add
   block spacing inside the table cell. */
.rfp-detail__remind-form {
  margin: 0;
}

.rfp-detail__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
}

/* HMS-1261 — "Back to RFPs" is the only left-side control; every action
   after it bunches right at standard gap instead of space-between
   stranding Send Reminder mid-row. */
.rfp-detail__footer > :first-child {
  margin-right: auto;
}

.rfps-admin__dialog-banner {
  background: var(--wa-color-neutral-fill-quiet);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 0.75rem;
  font-size: 0.875rem;
  color: var(--wa-color-text-normal);
}

.rfps-admin__info-banner {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  background: var(--wa-color-brand-fill-quiet);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 0.75rem;
  font-size: 0.875rem;
  color: var(--wa-color-text-quiet);
}

/* HMS-1339 re-review — warning banners (the live rooms-over-attendance
   warning and the "outside the RFP requirements" list) were brand-blue
   info panels that read as helper text. They now wear the amber warning
   palette; purely informational banners keep the brand treatment.
   [hidden] must win over display:flex or the empty live banner would
   render permanently inside the dialog. */
.rfps-admin__info-banner--warning {
  background: var(--wa-color-warning-fill-quiet);
  color: var(--wa-color-warning-on-quiet);
  border: 1px solid var(--wa-color-warning-border-quiet);
}
.rfps-admin__info-banner--warning[hidden] { display: none; }

.rfps-admin__counter-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.rfps-admin__counter-table th,
.rfps-admin__counter-table td {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--wa-color-surface-border);
  text-align: left;
  color: var(--wa-color-text-normal);
}

.rfps-admin__counter-table input {
  width: 10rem;
  max-width: 100%;
  padding: 0.375rem 0.5rem;
  font-size: 0.875rem;
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m, 0.5rem);
  background: var(--wa-color-surface-raised);
  color: var(--wa-color-text-normal);
}

.rfps-admin__perpage {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

.rfps-admin__field-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--wa-color-text-normal);
}

/* Responsive: 480px — dialog footers wrap */
@media (max-width: 480px) {
  /* Counter-offer table must fit the dialog body: fixed layout wraps cell text
     and shrinks inputs instead of clipping the "Your Counter-Offer" column. */
  .rfps-admin__counter-table { table-layout: fixed; }
  .rfps-admin__counter-table th:first-child { width: 34%; }
  .rfps-admin__counter-table th:last-child { width: 32%; }
  .rfps-admin__counter-table th,
  .rfps-admin__counter-table td { padding: 0.5rem 0.375rem; }
  .rfps-admin__counter-table input { width: 100%; }

  .rfps-admin__dialog-footer {
    flex-wrap: wrap;
  }

  .rfps-admin__dialog-footer wa-button,
  .rfps-admin__dialog-footer a {
    min-width: 0;
  }

  .rfp-detail__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Responsive: 390px */
@media (max-width: 390px) {
  .rfps-admin__pagination {
    flex-direction: column;
    align-items: flex-start;
  }

  .rfp-detail__stats {
    grid-template-columns: 1fr;
  }

  .rfp-detail__requirements {
    grid-template-columns: 1fr;
    gap: 0.125rem 0;
  }

  .rfp-detail__requirements dd {
    margin-bottom: 0.5rem;
  }

  .rfp-detail__response-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.375rem;
  }
}

/* Responsive: <=1100px — keep ACTIONS column reachable without horizontal scroll;
   KPIs go 2x2 instead of an uneven 3+1 wrap. */
@media (max-width: 1100px) {
  .rfps-admin__kpi {
    flex: 1 1 40%;
  }

  /* Drop the lowest-value column (long raw emails) at narrow widths. */
  .rfps-admin__table th:nth-child(6),
  .rfps-admin__table td:nth-child(6) {
    display: none;
  }

  /* Stack row actions vertically so the last column stays narrow. */
  .rfps-admin__actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.375rem;
    white-space: normal;
  }
}

/* ==========================================================================
   RFP detail (show) + bid comparison (compare) — previously unstyled classes
   ========================================================================== */

/* 1. Actions block container. */
.rfp-detail__actions {
  margin: var(--wa-space-l) 0;
}

/* 2. Send-response form card. */
.rfp-detail__send-form {
  background: var(--wa-color-surface-raised);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m);
  padding: var(--wa-space-l);
}

/* 3. Form field + label. */
.rfp-detail__field {
  margin-block: var(--wa-space-m);
}
.rfp-detail__field label {
  display: block;
  font-weight: 600;
}

/* 4. Text inputs inside a field. */
.rfp-detail__field input[type="text"] {
  width: 100%;
  padding: 0.375rem 0.5rem;
  border: 1px solid var(--wa-color-surface-border);
  border-radius: 4px;
}

/* 5. Primary dark button (submit). */
.rfp-detail__submit {
  background: var(--wa-color-brand-fill-loud);
  color: var(--wa-color-brand-on-loud);
  border: none;
  border-radius: var(--wa-border-radius-m);
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  cursor: pointer;
}

/* 7. Quiet button (close). */
.rfp-detail__close {
  background: transparent;
  color: var(--wa-color-text-normal);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m);
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  cursor: pointer;
}

/* 8. Bid actions — HMS-1388 rework: a compact wrapping cluster. The
   HMS-1351 fixed-slot grid reserved a column per action, which left a
   dead gap before "Change hotel" and pushed the table past its wrap; a
   pinned Actions column then clipped the status badges. Flex-wrap packs
   the rendered buttons left and wraps them onto extra lines when the
   cell runs narrow, so no horizontal scroll is needed. The cluster lives
   on an inner div: display:flex on the td pulled it out of table-cell
   layout, and its collapsed border-bottom painted mid-cell on
   action-less rows. */
.rfp-detail__bid-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  align-items: center;
}
.rfp-detail__bid-actions > form {
  margin: 0;
}

/* 9/16. Status pills — shared base for detail, bid, and comparison statuses. */
.rfp-detail__status,
.rfp-detail__bid-status,
.bid-comparison__status {
  display: inline-block;
  padding: 0.125rem 0.625rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}

/* Neutral: draft / closed / superseded / withdrawn / no_bid. */
.rfp-detail__status--draft,
.rfp-detail__status--closed,
.rfp-detail__status--superseded,
.rfp-detail__bid-status--draft,
.rfp-detail__bid-status--closed,
.rfp-detail__bid-status--superseded,
.rfp-detail__bid-status--withdrawn,
.rfp-detail__bid-status--no_bid,
.bid-comparison__status--superseded {
  background: var(--wa-color-neutral-fill-quiet);
  color: var(--wa-color-neutral-on-quiet);
}

/* Brand: sent / open / responses_in / pending / submitted / countered_by_hotel. */
.rfp-detail__status--sent,
.rfp-detail__status--open,
.rfp-detail__status--responses_in,
.rfp-detail__status--pending,
.rfp-detail__status--submitted,
.rfp-detail__status--responses_received,
.rfp-detail__bid-status--sent,
.rfp-detail__bid-status--open,
.rfp-detail__bid-status--responses_in,
.rfp-detail__bid-status--pending,
.rfp-detail__bid-status--submitted,
.rfp-detail__bid-status--responses_received,
.rfp-detail__bid-status--countered_by_hotel,
.bid-comparison__status--pending,
.bid-comparison__status--submitted,
.bid-comparison__status--responses_received {
  background: var(--wa-color-brand-fill-quiet);
  color: var(--wa-color-brand-on-quiet);
}

/* Success: accepted / countered / responded. */
.rfp-detail__status--accepted,
.rfp-detail__status--countered,
.rfp-detail__status--responded,
.rfp-detail__bid-status--accepted,
.rfp-detail__bid-status--countered,
.rfp-detail__bid-status--counter_accepted,
.rfp-detail__bid-status--responded,
.bid-comparison__status--accepted,
.bid-comparison__status--countered,
.bid-comparison__status--counter_accepted {
  background: var(--wa-color-success-fill-quiet);
  color: var(--wa-color-success-on-quiet);
}

/* Danger: declined / expired / no_response. */
.rfp-detail__status--declined,
.rfp-detail__status--expired,
.rfp-detail__status--no_response,
.rfp-detail__bid-status--declined,
.rfp-detail__bid-status--counter_declined,
.rfp-detail__bid-status--expired,
.rfp-detail__bid-status--no_response,
.bid-comparison__status--declined,
.bid-comparison__status--counter_declined {
  background: var(--wa-color-danger-fill-quiet);
  color: var(--wa-color-danger-on-quiet);
}

/* Warning: under_review / counter_offered. */
.rfp-detail__status--under_review,
.rfp-detail__status--counter_offered,
.rfp-detail__bid-status--under_review,
.rfp-detail__bid-status--counter_offered,
.bid-comparison__status--under_review,
.bid-comparison__status--counter_offered {
  background: var(--wa-color-warning-fill-quiet);
  color: var(--wa-color-warning-on-quiet);
}

/* 10/15. Tables — shared styling for detail and comparison. */
.rfp-detail__table,
.bid-comparison__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.rfp-detail__table th,
.bid-comparison__table th {
  text-align: left;
  padding: 0.5rem 0.75rem;
  border-bottom: 2px solid var(--wa-color-surface-border);
  color: var(--wa-color-text-quiet);
  font-weight: 600;
}
.rfp-detail__table td,
.bid-comparison__table td {
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--wa-color-surface-border);
  vertical-align: top;
}
/* Comparison: emphasise the first (label) column. */
.bid-comparison__table td:first-child,
.bid-comparison__table th:first-child {
  font-weight: 600;
  color: var(--wa-color-text-quiet);
}

/* 11. Comparison page container. */
.bid-comparison {
  max-width: 72rem;
}

/* 12. Comparison header row. */
.bid-comparison__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wa-space-m);
  flex-wrap: wrap;
  margin-bottom: var(--wa-space-l);
}
.bid-comparison__header h1 {
  margin: 0;
}

/* 13. Back link. */
.bid-comparison__back {
  color: var(--wa-color-text-link);
  font-size: 0.875rem;
}

/* 14. Horizontally scrollable table wrapper. */
.bid-comparison__table-wrapper {
  overflow-x: auto;
}

/* 14b. Fixed layout: metric label column is sized, bid columns share the
   rest equally. HMS-1301 — the view sets a per-bid-count min-width inline
   (10rem + 14rem each), so columns keep a readable floor and the wrapper
   scrolls horizontally rather than squeezing. */
.bid-comparison__table {
  table-layout: fixed;
}
.bid-comparison__col-metric {
  width: 10rem;
}

/* HMS-1301 — the Metric label column stays pinned on the left while the
   overflow scrolls; the background matches .admin-shell__main (the table
   sits directly on it) so scrolled cells slide under invisibly — the same
   pattern .block-list__table uses for its pinned Actions column. */
.bid-comparison__table th:first-child,
.bid-comparison__table td:first-child {
  position: sticky;
  left: 0;
  background: var(--wa-color-surface-lowered);
  box-shadow: 1px 0 0 var(--wa-color-surface-border);
}

/* 17. Score row highlight. */
.bid-comparison__score-row td {
  background: var(--wa-color-surface-lowered);
}

/* 18. Action groups row. */
.bid-comparison__actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: var(--wa-space-l);
  margin-top: var(--wa-space-l);
}

/* 19. Recommended-hotel bar — the Figma bottom summary: label on the left,
   actions inline on the right. */
.bid-comparison__recommended {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wa-space-m);
  flex-wrap: wrap;
  margin-top: var(--wa-space-l);
  padding: var(--wa-space-m) var(--wa-space-l);
  background: var(--wa-color-surface-raised);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m);
}
.bid-comparison__recommended-label {
  margin: 0;
}
.bid-comparison__recommended-actions {
  display: flex;
  align-items: center;
  gap: var(--wa-space-s);
  flex-wrap: wrap;
}
.bid-comparison__recommended-actions form {
  display: contents;
}

/* 19b. Per-hotel action card. HMS-1388 — one consistent layout for every
   card: buttons stack at equal full width with a single gap rhythm, so
   cards with four actions look like cards with two. The status line and
   buttons ride in .bid-comparison__action-stack, pushed to the card's
   bottom edge, so a card carrying "Contract exists" / "Awaiting hotel
   reply" keeps its buttons level with its neighbours' (QA follow-up). */
.bid-comparison__action-group {
  background: var(--wa-color-surface-raised);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-m);
  padding: var(--wa-space-l);
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-s);
}
.bid-comparison__action-group h3 {
  margin: 0;
}
.bid-comparison__action-group form {
  display: contents;
}
.bid-comparison__action-stack {
  margin-top: auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--wa-space-s);
}
.bid-comparison__action-stack wa-button {
  width: 100%;
}
.bid-comparison__action-group .rfp-detail__awaiting-hint {
  flex-basis: auto;
  order: 0;
}

/* HMS-1388 rework — inside the recommended banner the "Awaiting hotel
   reply" hint joins the action line like the warning pills do; its
   default flex-basis: 100% used to shove the buttons onto a second line
   at the left edge while every other state kept them on the right. */
.bid-comparison__recommended-actions .rfp-detail__awaiting-hint {
  flex-basis: auto;
  order: 0;
}

/* 20. Empty state. */
.bid-comparison__empty {
  color: var(--wa-color-text-quiet);
  padding: var(--wa-space-xl) 0;
}

/* Empty state. */
.rfps-admin__empty {
  background: var(--wa-color-surface-raised);
  border: 1px solid var(--wa-color-surface-border);
  border-radius: var(--wa-border-radius-l);
  padding: var(--wa-space-2xl, 3rem) var(--wa-space-xl, 2rem);
  text-align: center;
  color: var(--wa-color-text-quiet);
}

.rfps-admin__empty a { color: var(--wa-color-text-link); }

/* HMS-1144 — unsent staged invitees with Retry. */
.rfp-detail__unsent-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wa-space-m);
}
.rfp-detail__unsent-note {
  margin: 0 0 var(--wa-space-s);
  color: var(--wa-color-text-quiet);
  font-size: 0.875rem;
}
.rfp-detail__retry-form {
  display: inline;
  margin: 0;
}
.rfp-detail__unsent-reason {
  font-size: 0.8125rem;
}
.rfp-detail__retry-hint {
  margin: 0;
  padding: 0 0 0.5rem;
  text-align: right;
  color: var(--wa-color-text-quiet);
  font-size: 0.8125rem;
}

/* HMS-1318 — "Awaiting hotel reply" explains why Accept is hidden while a
   counter-offer is pending. It is a hint, not a status: quiet text with a
   clock icon, shared by the RFP detail bids table, the index comparison
   panel, and the compare action groups. HMS-1321 — it rides its own line,
   full-width above or below the action buttons, instead of mixing into the
   button row: flex-basis 100% splits the flex cells' rows, and display flex
   makes the span a block-level box inside the action-group cards. */
.rfp-detail__awaiting-hint {
  display: flex;
  flex-basis: 100%;
  order: -1;
  align-items: center;
  gap: 0.25rem;
  color: var(--wa-color-text-quiet);
  font-size: 0.8125rem;
  white-space: nowrap;
}

/* HMS-1231 — negotiation history list on the RFP details bids block and both
   bid comparison matrices. */
.neg-history-wrap > summary {
  cursor: pointer;
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-s, 0.85em);
  font-weight: var(--wa-font-weight-semibold, 600);
  margin-bottom: 0.375rem;
}

.neg-history-wrap[open] > summary {
  margin-bottom: 0.5rem;
}

.neg-history {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.neg-history__entry {
  padding-left: 0.625rem;
  border-left: 3px solid var(--wa-color-surface-border);
}

.neg-history__entry--organizer {
  border-left-color: var(--wa-color-brand-fill-loud);
}

.neg-history__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: baseline;
  margin: 0;
}

.neg-history__author,
.neg-history__time,
.neg-history__rates {
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-s, 0.85em);
}

.neg-history__body {
  margin: 0.125rem 0 0;
}

.neg-history__rates {
  margin: 0.125rem 0 0;
}

.neg-history__rate {
  display: inline-block;
  margin-right: 0.75rem;
}

/* HMS-1320 — the counter-offer entry's merged total and its signed
   difference from the bid: the summary line under the per-room rates, so
   it reads slightly stronger than the quiet rate list. */
.neg-history__total {
  font-weight: var(--wa-font-weight-semibold, 600);
}

.rfp-detail__history-row > td {
  background: var(--wa-color-surface-lowered);
}

.bid-comparison__history {
  vertical-align: top;
}

/* HMS-1205 — resolved recipient emails next to the invitee/hotel name. */
.rfp-detail__response-email,
.rfp-detail__response-emails {
  color: var(--wa-color-text-quiet);
  font-weight: 400;
  font-size: 0.8125rem;
}

/* HMS-1285 — the same quiet secondary email stacked under the hotel name on
   the bids table and compare-bids surfaces. */
.rfp-detail__response-email--block {
  display: block;
}

/* HMS-1354 — the bidding hotel's address under the invitation email on the
   Bids table: the same quiet secondary treatment, on its own line. */
.rfp-detail__hotel-address {
  display: block;
  color: var(--wa-color-text-quiet);
  font-weight: 400;
  font-size: 0.8125rem;
}

/* HMS-1301 — a long email in a compare header or action card clips with an
   ellipsis instead of bleeding into the next column; the span's title
   attribute shows the full address on hover. */
.bid-comparison__table .rfp-detail__response-email--block,
.bid-comparison__action-group .rfp-detail__response-email--block {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* HMS-1290 — expandable long-text cells on the compare matrix and the index
   comparison panel: the summary shows a truncated clip; opening swaps it for
   the full text (line breaks kept via simple_format). */
.bid-comparison__more > summary {
  cursor: pointer;
}
.bid-comparison__more[open] .bid-comparison__clip {
  display: none;
}

/* HMS-1294 — the Bids table reads as one line per bid: a chevron column up
   front, the Hotel column wider than Concessions. HMS-1388 rework —
   table-layout: fixed gives every column a stable track under its header
   (QA's misaligned-values finding) and lets the table fit its wrap instead
   of scrolling horizontally. */
.rfp-detail__table--bids { table-layout: fixed; min-width: 50rem; }
.rfp-detail__col-expander { width: 2rem; }
.rfp-detail__col-hotel { width: 20%; }
.rfp-detail__col-concessions { width: 14%; }

.rfp-detail__bid-row--expandable { cursor: pointer; }
.rfp-detail__bid-row--expandable:hover td { background: var(--wa-color-neutral-fill-quiet); }

.rfp-detail__bid-expand {
  width: 1.5rem;
  height: 1.5rem;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--wa-color-text-quiet);
  cursor: pointer;
}
.rfp-detail__bid-expand[aria-expanded="true"] i { transform: rotate(90deg); }

.rfp-detail__bid-flags {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.375rem;
}
/* HMS-1388 rework — chips keep their one-line pill shape but the group
   wraps between chips when the Status column runs short; a chip wider
   than the track ellipsizes instead of overlapping the next column. */
.rfp-detail__bid-flags .rfp-detail__bid-status,
.rfp-detail__bid-flags .status-pill {
  flex: none;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* HMS-1297 — counter-offer messages and hotel replies keep their line
   breaks in the negotiation history (same pre-wrap rule the expandable
   longtext cells use). HMS-1301 — break-word, not anywhere: a string wider
   than the cell still splits so it stays inside, but ordinary words never
   break mid-word the way anywhere-wrap let squeezed columns cut them. */
.neg-history__body,
.neg-history__meta strong {
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

/* HMS-1299 — per-criterion points under the composite total on both
   comparison matrices; each criterion is its own block line so the text
   can never wrap mid-criterion (QA follow-up). */
.score-breakdown {
  display: block;
  margin-top: 0.25rem;
  font-size: var(--wa-font-size-s, 0.85em);
  font-weight: normal;
  color: var(--wa-color-text-quiet);
}

.score-breakdown__crit {
  display: block;
  white-space: nowrap;
}

.bid-comparison__score-note {
  display: block;
  font-size: var(--wa-font-size-xs, 0.75em);
  font-weight: normal;
  color: var(--wa-color-text-quiet);
}

/* HMS-1300 — requirement flags collapse to a count with an expandable
   one-per-line list on both comparison matrices. */
.req-flags > summary {
  cursor: pointer;
  font-size: var(--wa-font-size-s, 0.85em);
  font-weight: var(--wa-font-weight-semibold, 600);
  color: var(--wa-color-text-quiet);
}

.req-flags__list {
  margin: 0.375rem 0 0;
  padding-left: 1.25rem;
}

.req-flags__list li {
  margin-top: 0.25rem;
}

/* HMS-1340 — concessions compact to one line plus a "+N more" toggle that
   stays put: the first item ellipsizes, and the full bulleted list rides
   the expanded bid row (RFP details) or a wa-popover (comparison
   matrices), so a long list never stretches the cell. */
.concessions-cell {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
}

.concessions-cell__preview {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.concessions-cell__toggle {
  flex: none;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--wa-font-size-s, 0.85em);
  font-weight: var(--wa-font-weight-semibold, 600);
  color: var(--wa-color-text-link);
  white-space: nowrap;
  cursor: pointer;
}

.concessions-cell__toggle:hover {
  text-decoration: underline;
}

.concessions-cell__list {
  margin: 0;
  padding-left: 1.25rem;
}

.concessions-cell__list li + li {
  margin-top: 0.25rem;
}

/* The expanded bid row carries the full concessions list above the
   negotiation history, labeled like the history's own summary line. */
.rfp-detail__concessions {
  margin-bottom: 0.75rem;
}

.rfp-detail__concessions-title {
  margin: 0 0 0.375rem;
  font-size: var(--wa-font-size-s, 0.85em);
  font-weight: var(--wa-font-weight-semibold, 600);
  color: var(--wa-color-text-quiet);
}

/* HMS-1473 — RFP list search row. */
.rfps-admin__search {
  margin-bottom: 1rem;
}

.rfps-admin__search wa-input {
  max-width: 22rem;
}

/* WA native.css gives every <button> display:inline-flex, which beats the UA
   [hidden] rule. The button only exists so Enter submits the search form —
   same guard as .booking-mgmt__search. */
.rfps-admin__search button[hidden] {
  display: none;
}