@import "./fonts/Satoshi.css";
@import "./tokens.css";
@import "./accordion.css";
@import "./app-layout.css";
@import "./badge.css";
@import "./button.css";
@import "./checkbox.css";
@import "./confirm-dialog.css";
@import "./date-time-pickers.css";
@import "./dialogs-overlays.css";
@import "./grid.css";
@import "./menu-bar.css";
@import "./message-input.css";
@import "./message-list.css";
@import "./notifications.css";
@import "./progress-bar.css";
@import "./radio-button.css";
@import "./select.css";
@import "./side-nav.css";
@import "./tabs.css";
@import "./text-input.css";
@import "./typography.css";

html {
  background: var(--bg);
  background-attachment: fixed;
  height: 100vh;
  /* background: url(bg.png), hsl(var(--base-h) var(--base-s) var(--base-l));
  background-blend-mode: overlay;
  background-size: cover;
  overflow: hidden; */
}

:focus-visible {
  outline-color: var(--vaadin-focus-ring-color);
  outline-width: var(--vaadin-focus-ring-width);
}

/* TODO seems like a bug in Flow */
vaadin-connection-indicator:not([offline]) {
  pointer-events: none;
}

.v-status-message {
  box-sizing: border-box;
}

/* TODO this is mainly intended for field labels */
:not(vaadin-button, vaadin-menu-bar-button, vaadin-select-value-button)::part(label) {
  color: inherit;
}

vaadin-item::part(content),
vaadin-menu-bar-item::part(content),
vaadin-context-menu-item::part(content),
vaadin-select-item::part(content),
vaadin-combo-box-item::part(content),
vaadin-multi-select-combo-box-item::part(content) {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 550;
}

vaadin-select.minimal {
  --vaadin-input-field-border-width: 0px;
  --vaadin-input-field-background: transparent;
}

vaadin-avatar::part(abbr) {
  font-weight: 650;
}

vaadin-icon.small {
  width: var(--lumo-icon-size-s);
  height: var(--lumo-icon-size-s);
}

vaadin-grid:not([theme~=no-border]),
vaadin-rich-text-editor:not([theme~=no-border]) {
  border-radius: var(--lumo-border-radius-m);
  overflow: hidden;
  border-color: var(--lumo-contrast-10pct);
}

vaadin-context-menu {
  display: contents;
}

hr {
  margin: 0;
}

:is(vaadin-menu-bar-overlay, vaadin-context-menu-overlay, vaadin-select-overlay) hr {
  margin: var(--lumo-space-s) var(--lumo-space-xs);
}