/* CUIAppBar - mirrors cui_app_bar.dart. Variants: title (centered title + trailing action icons) | serving (title + "N serv." label).
   Height = md padding x2 + max(icon-md, title line); hairline bottom border; back button min 48 wide. */
.cui-app-bar { box-sizing: border-box; width: 100%; background: var(--cui-color-surface-bg-default);
  box-shadow: inset 0 calc(-1 * var(--cui-border-hairline)) 0 var(--cui-color-border-subtle); padding: var(--cui-space-md);
  color: var(--cui-color-icon-default); }
.cui-app-bar__row { display: flex; align-items: center; height: max(var(--cui-size-icon-md), var(--cui-type-body-md-semi-line)); }
.cui-app-bar--serving .cui-app-bar__row { height: max(var(--cui-size-icon-md), var(--cui-type-body-md-semi-line), var(--cui-type-body-sm-line)); }
.cui-app-bar__back { appearance: none; background: none; border: 0; margin: 0; padding: 0; color: inherit; font: inherit; cursor: pointer;
  flex: none; min-width: 48px; height: 100%; display: flex; align-items: center; justify-content: center; }
.cui-app-bar__back[disabled] { cursor: default; }
.cui-app-bar__back:focus-visible, .cui-app-bar__back.is-focused { outline: var(--cui-border-thick) solid var(--cui-color-border-focus); border-radius: var(--cui-radius-sm); }
.cui-app-bar .cui-icon { width: var(--cui-size-icon-md); height: var(--cui-size-icon-md); font-size: var(--cui-size-icon-md); }
.cui-app-bar__title-wrap { flex: 1; min-width: 0; padding: 0 var(--cui-space-md); display: flex; justify-content: center; }
.cui-app-bar__title { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0;
  color: var(--cui-color-text-default); font-family: var(--cui-type-body-md-semi-family); font-size: var(--cui-type-body-md-semi-size);
  font-weight: var(--cui-type-body-md-semi-weight); letter-spacing: var(--cui-type-body-md-semi-spacing); line-height: var(--cui-type-body-md-semi-line); }
.cui-app-bar__actions { display: flex; align-items: center; gap: var(--cui-space-lg); flex: none; max-width: 60%; }
.cui-app-bar__action { display: inline-flex; flex: none; width: var(--cui-size-icon-lg); height: var(--cui-size-icon-lg); max-height: 100%; }
.cui-app-bar__action .cui-icon { width: var(--cui-size-icon-lg); height: var(--cui-size-icon-lg); font-size: var(--cui-size-icon-lg); }
.cui-app-bar__title-wrap--start { justify-content: flex-start; }
.cui-app-bar__title-wrap--end { justify-content: flex-end; }
.cui-app-bar__serving { flex: none; max-width: 40%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: var(--cui-color-text-default); font-family: var(--cui-type-body-sm-family); font-size: var(--cui-type-body-sm-size);
  font-weight: var(--cui-type-body-sm-weight); letter-spacing: var(--cui-type-body-sm-spacing); line-height: var(--cui-type-body-sm-line); }