@mixin bookmarks() {
  $bookmarks-height--loading: 150px !default;
  $bookmark-thumbnail-size: 64px !default;
  $bookmark-thumbnail-min-size: 16px !default;
  $bookmark-edit-thumbnail-size: 128px !default;

  .geoscene-bookmarks {
    display: flex;
    background-color: transparent;

    .geoscene-widget__content--empty {
      background-color: $background-color--offset;
    }

    calcite-flow-item[loading] {
      min-height: $bookmarks-height--loading;
    }
  }

  .geoscene-bookmarks__loader {
    margin-inline-end: 0;
  }

  .geoscene-bookmarks__filter-no-results {
    @include layerListFilterNoResults();
  }

  .geoscene-bookmarks__bookmark-image-container {
    display: flex;
    position: relative;
    margin: 0;
    margin-inline-start: $cap-spacing--half;
    min-width: $bookmark-thumbnail-min-size;
    min-height: $bookmark-thumbnail-min-size;

    .geoscene-bookmarks__image {
      max-width: $bookmark-thumbnail-size;
      overflow: hidden;
    }
  }

  .geoscene-bookmarks--drag-enabled .geoscene-bookmarks__bookmark-image-container {
    margin-inline-start: 0;
  }

  .geoscene-bookmarks__no-bookmarks-heading {
    margin: 0;
    margin-block-start: $cap-spacing;
    font-size: 16px;
    font-weight: 400;
  }

  .geoscene-bookmarks__authoring {
    display: flex;
    flex-direction: column;
  }

  .geoscene-bookmarks__authoring-image-container {
    display: flex;
    align-items: middle;
    justify-content: center;
    margin-block-end: $cap-spacing;
    margin-inline-end: $side-spacing;
    background-image: url("../base/images/transparent-bg.png");
    width: $bookmark-edit-thumbnail-size;
    height: $bookmark-edit-thumbnail-size;
    text-align: center;

    .geoscene-bookmarks__image {
      max-width: $bookmark-edit-thumbnail-size;
      max-height: $bookmark-edit-thumbnail-size;
    }
  }

  .geoscene-bookmarks__form {
    display: flex;
    height: 100%;
  }

  .geoscene-bookmarks__form-content {
    padding-block: $cap-spacing;
    padding-inline: $side-spacing;
  }

  .geoscene-bookmarks__authoring-refresh-thumbnail-button {
    margin-block-end: $cap-spacing;
  }

  .geoscene-bookmarks__bookmark-content-label {
    color: var(--calcite-color-text-1);
    font-size: var(--calcite-font-size--2);
  }

  .geoscene-bookmarks__bookmark-content calcite-table {
    margin-inline-start: -0.25rem;
  }

  .geoscene-bookmarks__bookmark-content calcite-table,
  .geoscene-bookmarks__bookmark-content calcite-table-row {
    --calcite-color-border-3: transparent;
    --calcite-color-text-1: var(--calcite-color-text-3);
    --calcite-internal-table-row-background: transparent;

    pointer-events: none;
  }
}

@if $include_Bookmarks == true {
  @include bookmarks();
}