/* HMS-347 — Rate Intelligence (Figma 600:23833). */

.rate-intel { padding-bottom: var(--wa-space-xl); }

.rate-intel__crumb {
  margin: 0 0 var(--wa-space-2xs);
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

.rate-intel__crumb .fa-chevron-right { font-size: 0.625rem; margin: 0 var(--wa-space-2xs); }
.rate-intel__crumb span { color: var(--wa-color-text-normal); font-weight: var(--wa-font-weight-semibold); }

.rate-intel__title { margin: 0 0 var(--wa-space-l); font-size: 1.5rem; color: var(--wa-color-text-normal); }

/* Alert banners — Figma: pink critical, yellow warning, icon + two-line text + right action. */
.rate-intel__banner {
  display: flex;
  align-items: center;
  gap: var(--wa-space-m);
  padding: var(--wa-space-m) var(--wa-space-l);
  border-radius: var(--wa-border-radius-m);
  margin-bottom: var(--wa-space-m);
}

.rate-intel__banner--critical { background: var(--wa-color-danger-fill-quiet); border: 1px solid var(--wa-color-danger-border-normal); }
.rate-intel__banner--critical > i { color: var(--wa-color-danger); }
.rate-intel__banner--warning { background: var(--wa-color-warning-fill-quiet); border: 1px solid var(--wa-color-warning-border-normal); }
.rate-intel__banner--warning > i { color: var(--wa-color-warning); }

.rate-intel__banner > i { font-size: 1.25rem; flex: none; }

.rate-intel__banner-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.rate-intel__banner-text strong { font-size: 0.875rem; color: var(--wa-color-text-normal); }
.rate-intel__banner-text span { font-size: 0.8125rem; color: var(--wa-color-text-quiet); }

.rate-intel__banner-btn { flex: none; }

/* Cards */
.rate-intel__card {
  background: var(--wa-color-surface-raised);
  border: 1px solid var(--wa-color-neutral-border-quiet);
  border-radius: var(--wa-border-radius-m);
  padding: var(--wa-space-l);
  margin-bottom: var(--wa-space-l);
}

.rate-intel__card-title { margin: 0 0 var(--wa-space-m); font-size: 1.0625rem; font-weight: var(--wa-font-weight-semibold); color: var(--wa-color-text-normal); }

/* Comparison table */
.rate-intel__table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.rate-intel__table th {
  text-align: left;
  font-size: 0.75rem;
  font-weight: var(--wa-font-weight-semibold);
  color: var(--wa-color-text-quiet);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: var(--wa-space-xs) var(--wa-space-s);
  border-bottom: 1px solid var(--wa-color-neutral-border-quiet);
}
.rate-intel__table th i { margin-right: var(--wa-space-2xs); }
.rate-intel__table td { padding: var(--wa-space-s); border-bottom: 1px solid var(--wa-color-neutral-border-quiet); color: var(--wa-color-text-normal); }
.rate-intel__table tbody tr:last-child td { border-bottom: none; }
.rate-intel__warn { color: var(--wa-color-warning); margin-left: var(--wa-space-2xs); }

.rate-intel__status { display: inline-flex; align-items: center; gap: var(--wa-space-2xs); font-size: 0.8125rem; font-weight: var(--wa-font-weight-semibold); }
.rate-intel__status--on-track { color: var(--wa-color-success); }
.rate-intel__status--warning { color: var(--wa-color-warning); }

.rate-intel__empty { margin: var(--wa-space-m) 0 0; font-size: 0.875rem; color: var(--wa-color-text-quiet); }

/* Table footer / pagination (mirrors reports-hub) */
.rate-intel__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--wa-space-m); margin-top: var(--wa-space-m); flex-wrap: wrap; }
.rate-intel__per-page { display: flex; align-items: center; gap: var(--wa-space-xs); font-size: 0.8125rem; color: var(--wa-color-text-quiet); }
.rate-intel__count { margin: 0; font-size: 0.8125rem; color: var(--wa-color-text-quiet); }
.rate-intel__pages a, .rate-intel__pages span { padding: 0 var(--wa-space-2xs); font-size: 0.8125rem; }

/* Trend chart card */
.rate-intel__chart-head { display: flex; align-items: center; justify-content: space-between; gap: var(--wa-space-m); flex-wrap: wrap; }
.rate-intel__selectors { display: flex; gap: var(--wa-space-s); }
.rate-intel__selectors wa-select { min-width: 11rem; }

.rate-intel__legend { display: flex; align-items: center; gap: var(--wa-space-m); margin: var(--wa-space-s) 0 var(--wa-space-m); font-size: 0.8125rem; color: var(--wa-color-text-quiet); flex-wrap: wrap; }
.rate-intel__key { display: inline-block; width: 0.75rem; height: 0.75rem; border-radius: 50%; margin-right: var(--wa-space-2xs); vertical-align: -1px; }
.rate-intel__key--rack { background: var(--ek-chart-blue-quiet); }
.rate-intel__key--contracted { background: var(--ek-chart-navy); }
.rate-intel__key--ota { background: var(--ek-chart-yellow); }
.rate-intel__key--prior { background: var(--ek-chart-blue-pale); }
.rate-intel__key--current { background: var(--ek-chart-navy); }

.rate-intel__chart { display: block; width: 100%; height: 18.75rem; }

/* Bottom two-up grid */
.rate-intel__bottom { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wa-space-l); align-items: start; }
/* min-width:0 lets grid items shrink below their min-content (charts) so the
   single-column track never overflows a narrow viewport. */
.rate-intel__bottom > .rate-intel__card { min-width: 0; }
@media (max-width: 1100px) { .rate-intel__bottom { grid-template-columns: minmax(0, 1fr); } }

/* Recommendation cards */
.rate-intel__rec { border: 1px solid var(--wa-color-neutral-border-quiet); border-radius: var(--wa-border-radius-m); padding: var(--wa-space-m); margin-bottom: var(--wa-space-m); }
.rate-intel__rec:last-child { margin-bottom: 0; }
.rate-intel__rec-hotel { margin: 0 0 var(--wa-space-xs); font-size: 0.9375rem; font-weight: var(--wa-font-weight-semibold); color: var(--wa-color-text-normal); }
.rate-intel__rec-line { margin: 0 0 var(--wa-space-2xs); font-size: 0.875rem; color: var(--wa-color-text-normal); }
.rate-intel__rec-line strong { color: var(--wa-color-text-quiet); font-weight: var(--wa-font-weight-semibold); }
.rate-intel__rec-actions { display: flex; gap: var(--wa-space-s); margin-top: var(--wa-space-s); }
.rate-intel__rec-status { margin: var(--wa-space-s) 0 0; font-size: 0.8125rem; color: var(--wa-color-text-quiet); }
.rate-intel__rec-status .fa-check { color: var(--wa-color-success); }
.rate-intel__rec-status .fa-xmark { color: var(--wa-color-danger); }

/* YoY deltas under the bar chart */
.rate-intel__deltas { list-style: none; margin: var(--wa-space-m) 0 0; padding: 0; font-size: 0.8125rem; color: var(--wa-color-text-quiet); display: flex; flex-direction: column; gap: var(--wa-space-2xs); }
.rate-intel__delta--up { color: var(--wa-color-success); font-weight: var(--wa-font-weight-semibold); }
.rate-intel__delta--down { color: var(--wa-color-danger); font-weight: var(--wa-font-weight-semibold); }

/* Dialogs (approve / deny / contract) */
.rate-intel-dialog__info {
  display: flex; gap: var(--wa-space-s); align-items: flex-start;
  background: var(--wa-color-brand-fill-quiet);
  border: 1px solid var(--wa-color-brand-border-normal);
  border-radius: var(--wa-border-radius-m);
  padding: var(--wa-space-m); margin-bottom: var(--wa-space-m);
  font-size: 0.875rem;
}
.rate-intel-dialog__info i { color: var(--wa-color-brand); margin-top: 2px; }

.rate-intel-dialog__rows { display: flex; flex-direction: column; margin-bottom: var(--wa-space-m); }
.rate-intel-dialog__row { display: flex; justify-content: space-between; gap: var(--wa-space-m); padding: var(--wa-space-xs) 0; font-size: 0.875rem; }
.rate-intel-dialog__row span { color: var(--wa-color-text-quiet); }
.rate-intel-dialog__row strong { color: var(--wa-color-text-normal); text-align: right; font-weight: var(--wa-font-weight-semibold); }

.rate-intel-dialog__panel {
  background: var(--wa-color-neutral-fill-quiet);
  border: 1px solid var(--wa-color-neutral-border-quiet);
  border-radius: var(--wa-border-radius-m);
  padding: var(--wa-space-m); margin-bottom: var(--wa-space-m);
}
.rate-intel-dialog__panel h4 { margin: 0 0 var(--wa-space-xs); font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.03em; color: var(--wa-color-text-quiet); }
.rate-intel-dialog__big { margin: 0 0 var(--wa-space-s); font-size: 1rem; font-weight: var(--wa-font-weight-semibold); color: var(--wa-color-text-normal); }

.rate-intel-dialog__footer { display: flex; justify-content: flex-end; gap: var(--wa-space-s); margin-top: var(--wa-space-m); }
.rate-intel-dialog__empty { font-size: 0.875rem; color: var(--wa-color-text-quiet); }

.rate-intel-dialog__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wa-space-l); margin-bottom: var(--wa-space-m); }
.rate-intel-dialog__grid h4, .rate-intel-dialog h4 { margin: 0 0 var(--wa-space-xs); font-size: 0.875rem; font-weight: var(--wa-font-weight-semibold); color: var(--wa-color-text-normal); }
@media (max-width: 700px) { .rate-intel-dialog__grid { grid-template-columns: 1fr; } }

.rate-intel-dialog__policy { margin: 0 0 var(--wa-space-m); padding-left: var(--wa-space-l); font-size: 0.875rem; color: var(--wa-color-text-normal); display: flex; flex-direction: column; gap: var(--wa-space-2xs); }
.rate-intel-dialog__actions { display: flex; gap: var(--wa-space-s); flex-wrap: wrap; }
.rate-intel-dialog__resolve { display: inline; }

/* Mobile */
@media (max-width: 640px) {
  .rate-intel__banner { align-items: flex-start; flex-wrap: wrap; }
  .rate-intel__chart-head { flex-direction: column; align-items: stretch; }
  .rate-intel__selectors { flex-direction: column; }
  .rate-intel__selectors wa-select { min-width: 0; }
  .rate-intel__chart { height: 14rem; }
}