@layer components {
  .app-list-toolbar {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: calc(var(--app-spacing) * 1);
  }

  .app-list-toolbar > * {
    margin: 0 !important;
    width: auto !important;
    --app-form-element-spacing-horizontal: 10px;
    --app-form-element-spacing-vertical: 6px;
    font-size: 13px !important;
    height: auto !important;
  }
  .app-list-toolbar > * > * {
    margin: 0 !important;
    width: auto !important;
    --app-form-element-spacing-horizontal: 10px;
    --app-form-element-spacing-vertical: 6px;
    font-size: 13px !important;
    height: auto !important;
  }
  .app-list-toolbar > * > * > * {
    margin: 0 !important;
    width: auto !important;
    --app-form-element-spacing-horizontal: 10px;
    --app-form-element-spacing-vertical: 6px;
    font-size: 13px !important;
    height: auto !important;
  }

  .app-list-toolbar > button {
    padding: 6px 10px;
  }

  .app-list-toolbar
    input:not(
      [type="checkbox"],
      .app-list-toolbar [type="radio"],
      .app-list-toolbar [type="range"],
      .app-list-toolbar [type="file"]
    ):is(
      [type="date"],
      [type="datetime-local"],
      [type="month"],
      [type="time"],
      [type="week"]
    ) {
    width: auto;
  }

  .app-list-toolbar > label > span {
    display: block;
    font-size: 11px !important;
  }

  .app-list-toolbar .app-grid-page-size select {
    min-width: 84px;
  }

  .app-list-toolbar .app-grid-page-size {
    margin-inline-start: auto !important;
  }

  @media (max-width: 768px) {
    .app-list-toolbar .app-grid-page-size {
      margin-inline-start: 0 !important;
    }
  }

  .app-list-toolbar
    .multi-select
    .multi-select-header
    .multi-select-header-placeholder {
    font-size: 13px;
  }

  .app-list-toolbar .multi-select .multi-select-header,
  .app-list-toolbar .multi-select .multi-select-option,
  .app-list-toolbar .multi-select .multi-select-all {
    min-height: unset;
    padding-left: 5px;
  }

  .app-list-toolbar .multi-select {
    width: 200px !important;
  }

  .app-list-toolbar span.multi-select-header-option {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    padding-left: 3px !important;
    font-size: 11px !important;
  }
}