/* Booking —— 圆形预约悬浮键（Figma 1887:1290，画布 52×52）。
   画布内：48 圆（含 1px 投影出血）+ 24 图标（top 6）+「预约」小字（top 26）。

   定位：可圆右缘距页右 16；圆下缘距 TabBar 上沿 62。
   为对齐设计稿总高 1050，底部还留了 22 的 Home Indicator 区（系统层）。

   为什么用绝对定位：它是浮层，不属于页面内容流。 */

.mzh-booking {
  position: absolute;
  right: calc(var(--booking-right) - var(--booking-disc-inset));
  /* 圆的下缘距 TabBar 上沿 = booking-gap；画布比圆高 2×disc-inset，
     故画布底边要再往下让 disc-inset，否则圆会偏高 2px。 */
  bottom: calc(var(--layout-home-indicator) + var(--tab-bar-height)
               + var(--booking-gap) - var(--booking-disc-inset));
  width: var(--booking-canvas);
  height: var(--booking-canvas);
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  z-index: var(--booking-z);
}

.mzh-booking__disc {
  position: absolute;
  left: var(--booking-disc-left);
  top: var(--booking-disc-top);
  width: var(--booking-disc);
  height: var(--booking-disc);
  display: block;
}

.mzh-booking__icon {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: var(--booking-icon-top);
  width: var(--booking-icon);
  height: var(--booking-icon);
  display: block;
}

.mzh-booking__label {
  position: absolute;
  left: 0;
  right: 0;
  top: var(--booking-label-top);
  text-align: center;
  font-size: var(--typography-small-font-size);
  line-height: var(--typography-small-line-height);
  color: var(--color-text-inverse);
  white-space: nowrap;
}
