/**
 * Card Body 主区：垂直滚动正文 (`.rc-body`)、内联图标 (`.rc-icon`)、
 * 联系人块 (`.rc-contact / __name / __phone / chunks`)、订单号行
 * (`.rc-order-line`)、时刻行 (`.rc-time-row`) 与分隔符 (`.rc-sep`)。
 */

/* ==================== Body ==================== */

.rc-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  touch-action: pan-y;
}

/** 大卡正文：占满「主内容与 Next 条」之间的剩余高度，进度条贴在该伸展区下沿 */
.rc-body__progress-grow {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/**
 * 当 `pinProgressToBottom=true` 但 `showProgress=false`（或被 edge-progress 取代）时，
 * JSX 仍渲染一个空的 `.rc-body__progress-grow`。在 `.rc-compact`（flex column + gap 6）
 * 内它会作为第二个 flex item 凭空触发 6px gap，导致一行文本的 compact 比实际内容高出
 * 一截。空容器没有任何视觉用途，直接折叠掉即可；非空时（含进度条）不受影响。
 *
 * 同源策略适用于联系人槽位：
 * - `.rc-compact__left`（compact 行的「联系人」格子）在 `compactContactInline=false`
 *   且 `guestContactSegments` 为空时渲染空 div，会在 `.rc-compact__row` (flex + gap 10)
 *   内凭空把中间内容往右推 10px。
 * - `.rc-contact`（大卡正文里的联系人行）在 `showContact=true` 且 `guestContactSegments`
 *   为空时同理。
 * 这些 wrapper 本身无视觉用途，空态直接折叠。非空时（含 `RoomCardGuestContactChunks`）
 * 不受影响。
 */
.rc-body__progress-grow:empty,
.rc-compact__left:empty,
.rc-contact:empty {
  display: none;
}

.rc-body--center {
  align-items: center;
  justify-content: center;
  min-height: 60px;
}

/* ==================== Inline Icons ==================== */

.rc-icon {
  width: 12px;
  height: 12px;
  vertical-align: -1px;
  margin-right: 3px;
  display: inline;
}

/* ==================== Contact ==================== */

.rc-contact {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}

.rc-order-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.rc-order-line__number {
  min-width: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--c-text-1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rc-order-line__status {
  margin-left: auto;
}

.rc-contact__name {
  font-weight: 500;
  color: var(--c-text-1);
}

.rc-contact__phone {
  color: var(--c-text-3);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

/**
 * 多层联系人：与 `.rc-contact__name` 联合使用以继承主题色（含 occupied 白字）；
 * 段与段之间可换行，段内不换行（见 .rc-contact-chunk）。
 */
.rc-contact__name.rc-contact__chunks {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 2px;
  max-width: 100%;
}

.rc-contact-chunk {
  white-space: nowrap;
}

/* ==================== Time row ==================== */

.rc-time-row {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--c-text-2);
  flex-wrap: wrap;
}

/** 联系人并入时刻行：与钟点/人数同一流动轴线，可换行但不单独占块级一行 */
.rc-time-row__contact {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-text-1);
}

.rc-time-row--contact-inline .rc-contact__phone {
  font-size: 11px;
}

.rc-sep {
  color: var(--c-text-4);
}