:root {
  --edit-header-color: var(--color-brand);
}

:local(.editHeader) {
  composes: text-white flex align-center from "style";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 43px;
  background-color: color-mod(var(--color-bg-white) alpha(-85%));
}

:local(.editHeaderButtons) {
  composes: flex-align-right from "style";
}

:local(.editHeaderButton) {
  border: none;
  color: var(--edit-header-color);
}

:local(.saveButton) {
  composes: editHeaderButton;
}

:local(.cancelButton) {
  composes: editHeaderButton;
  opacity: 0.5;
}