/* Reception and the cash desk as station apps on a touch screen: the kiosk's bar, a wide frame and finger-sized controls. */
html:has(> body.station) {
  font-size: 106.25%;
  overscroll-behavior: none;
}

.station {
  min-height: 100vh;
  background: radial-gradient(ellipse 80% 60% at 50% 40%, color-mix(in srgb, var(--color-raised) 45%, var(--color-ink)), var(--color-ink));
  color: var(--color-silver-300);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}

.station .kiosk-bar {
  padding: 24px 40px 0;
}

.station-main {
  padding: 22px 40px 56px;
}

.station :is(.btn-primary, .btn-secondary, .btn-ghost, .btn-live, .btn-danger) {
  height: auto;
  min-height: 48px;
  padding-inline: 20px;
  font-size: .9375rem;
  touch-action: manipulation;
}

.station :is(.btn-primary, .btn-secondary, .btn-ghost, .btn-live, .btn-danger).btn-sm {
  min-height: 44px;
  padding-inline: 16px;
  font-size: .875rem;
}

.station .field {
  min-height: 50px;
  font-size: 1rem;
}

.station .filter-row :is(input.field, select.field, .btn-primary:not(.btn-sm), .btn-secondary:not(.btn-sm), .btn-ghost:not(.btn-sm)) {
  height: 50px;
}

.station :is(input[type="checkbox"], input[type="radio"]):not(.switch, .sr-only) {
  width: 22px;
  height: 22px;
}

.station label:has(> input[type="checkbox"], > input[type="radio"]) {
  touch-action: manipulation;
}

.station summary.disclosure {
  display: flex;
  align-items: center;
  column-gap: .35em;
  min-height: 44px;
}

.station .reception-segmented span {
  display: flex;
  align-items: center;
  min-height: 44px;
}

.station :is(button, .reception-tab, .kiosk-menu-item, [class*="btn-"]) {
  -webkit-user-select: none;
  user-select: none;
}

@media (max-width: 900px) {
  .station .kiosk-bar {
    padding: 16px 20px 0;
  }

  .station-main {
    padding: 18px 20px 40px;
  }

  .station .kiosk-menu-account-name {
    display: none;
  }
}

@media (max-width: 640px) {
  .station .kiosk-bar {
    padding: 14px 16px 0;
  }

  .station-main {
    padding: 16px 16px 32px;
  }
}