text: /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
  @import "~@bentley/ui-core/lib/ui-core/index";
  
  $divider-color: $buic-background-toolbutton-stroke;
  $hovered-icon-color: $buic-foreground-primary-tone;
  
  .map-manager-layer-host {
    margin: 0 6px;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  
    .map-expandable-blocks-block {
      width: 100%;
      border: none;
    }
  }
  
  .map-manager-container {
    * {
      box-sizing: border-box;
    }
  
    map-manager-settings-container {
      display: flex;
      margin-top: 8px;
      width: 100%;
    }
  
    .map-manager-underlays, .map-manager-overlays  {
      display: flex;
      align-content: center;
      margin-top: 8px;
  
      .map-manager-attach-layer-button {
        background-color: transparent;
        margin-left: auto;
        width: 40px;
        border: none;
        color: $buic-foreground-body;
        margin-right: 2px;
  
        &:hover {
          color: $hovered-icon-color;
        }
        &:focus {
          box-shadow: $uicore-button-focus-boxshadow;
          outline: none;
        }
      }
    }
  
    .core-ls {
      position: absolute;
      top: 50%;
      left: 50%;
      padding: 4px, 0;
      transform: translate(-50%, -50%);
    }
  
    .map-manager-source-listbox-header {
      margin-bottom: 4px;
      display: flex;
      flex-direction: row;
      align-items: center;
      column-gap: 6px;
    }
  
    .map-manager-source-list-filter {
      padding-top: 3.3px;
      padding-bottom: 3.3px;
      width: calc(100% - 40px);
    }
  
    .map-manager-source-list {
      margin-top: 0;
    }
  
    .map-manager-overlays-label {
      display: block;
      margin-bottom: 4px;
    }
  
    .map-manager-underlays-label {
      display: block;
      margin-bottom: 4px;
    }
  
    .map-manager-no-layers-label {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      height: 2.5em;
      width: 100%;
      padding-left: 4px;
      padding-right: 4px;
      border-width: 0 0 1px 0;
      border-style: solid;
      border-color: $uicore-gray-a;
      background-color: $buic-background-1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: center;
      color: $buic-foreground-muted;
      font-style: italic;
    }
  
    .map-manager-item-divider {
      width: 100%;
      height: 2px;
      background: $divider-color;
      margin: 1em 0 1em 0;
    }
  
    .map-manager-header {
      display: flex;
      flex-direction: column;
      height: auto;
      width: 100%;
      align-items: center;
      margin-top: 8px;
  
      .map-manager-add-source-button {
        margin-left: 4px;
      }
  
      .map-manager-select {
        height: 2.0em;
        flex: auto;
        width: 100%;
        min-width: 100px;
      }
  
      .map-manager-add {
        height: 2.0em;
        flex: initial;
        width: fit-content;
        margin-left: 6px;
      }
  
      .core-split-button-label {
        line-height: inherit;
      }
  
      .core-split-button {
        height: 2em;
      }
  
      .core-split-button>.core-split-button-arrow>.core-split-button-arrow-icon {
        line-height: 16px;
      }
    }
  
    .map-manager-attachments {
      height: auto;
      max-height: 30%;
  
      &.is-dragging-map-over {
        background-color: $buic-background-5;
      }
    }
  }
  
  .map-manager-source-header {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2em;
    width: 100%;
    padding-left: 10px;
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: $uicore-gray-a;
  
    .map-manager-item-label {
      width: 465px;
      min-width: 3em;
    }
  
    .map-manager-item-visibility {
      width: 40px;
      margin-right: 20px;
    }
  
    .map-manager-item-transparency {
      max-width: 160px;
      width: 160px;
      display: flex;
      justify-content: center;
    }
  }
  
  .map-manager-source-item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 2.5em;
    width: 100%;
    padding-right: 4px;
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: $uicore-gray-a;
    background-color: $buic-background-1;
  
    .map-manager-item-label {
      flex: 1 1;
      text-overflow: ellipsis;
      /* Required for text-overflow to do anything */
      white-space: nowrap;
      overflow: hidden;
    }
  
    .map-manager-item-settings-button {
      background-color: $buic-background-1;
      color: $buic-foreground-body;
      border: none;
  
      &:hover {
        color: $hovered-icon-color;
      }
      &:focus {
        box-shadow: $uicore-button-focus-boxshadow;
        outline: none;
      }
      .core-context-menu-container {
        .core-context-menu-item {
          > .core-context-menu-icon {
            flex-shrink: 1;
            flex-grow: 0;
            width: 0;
          }
          .core-slider.core-slider-minMax {
            min-width: 100px;
          }
        }
      }
    }
  
    .map-manager-item-transparency {
      margin-right: 6px;
    }
  
    button.map-manager-item-visibility {
      border: none;
      margin: 0 2px;
      background-color: $buic-background-1;
      color: $buic-foreground-body;
  
      &:hover {
        color: $hovered-icon-color;
      }
      &:focus {
        outline: none;
        box-shadow: $uicore-button-focus-boxshadow;
      }
    }
  }
  
  .map-layer-settings {
    border: none;
    background-color: $buic-background-1;
    color: $buic-foreground-body;
    margin-left: 2px;
    &:hover {
      color: $hovered-icon-color;
    }
    &:focus {
      box-shadow: $uicore-button-focus-boxshadow;
      outline: none;
    }
  }
  
  .map-manager-item-sub-layer-button {
    border: none;
    background-color: $buic-background-1;
    color: $buic-foreground-body;
  
    &:hover {
      color: $hovered-icon-color;
    }
    &:focus {
      box-shadow: $uicore-button-focus-boxshadow;
      outline: none;
    }
  }
  
  .map-manager-item-sub-layer-container {
    position: relative;
  }
  
  .map-manager-sublayer-panel {
    width: 400px;
    height: 400px;
    color: $buic-foreground-body;
    font-size: $uicore-font-size;
    /*display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 4px;*/
    padding: 4px;
    display: block;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid $buic-background-panel-stroke;
    background: $buic-background-panel;
    color: $buic-text-color;
    cursor: default;
    @include uicore-z-index(dialog-popup);
  }
  
  .map-manager-sublayer-label {
    width: 100%;
    min-width: 100px;
    text-overflow: ellipsis;
    /* Required for text-overflow to do anything */
    white-space: nowrap;
    overflow: hidden;
  }
  
  .map-layer-settings-popup-panel {
    color: $buic-foreground-body;
    font-size: $uicore-font-size;
    display: grid;
    grid-row-gap: 4px;
    padding: 4px;
  
    &:hover {
      color: $buic-foreground-activehover;
      cursor: auto;
    }
  
    .core-context-menu-item {
      display: flex;
      cursor: default;
      align-items: center;
      position: relative;
  
      &:hover {
        background-color: $buic-row-hover;
      }
    }
  
    .map-manager-no-layers-label {
      display: block;
      justify-content: center;
      align-items: center;
      height: 100%;
      width: 100%;
      padding-left: 4px;
      padding-right: 4px;
      border-width: 1px;
      border-style: solid;
      border-color: $uicore-gray-a;
      border-radius: 3px;
      background-color: $buic-background-1;
      overflow: hidden;
      color: $buic-foreground-muted;
      font-style: italic;
    }
  }
  
  .map-manager-not-geo-located-text {
    width:90%;
    color: $buic-foreground-muted;
    font-style: italic;
    text-align: center;
  }
  
  .map-sources-popup-panel {
    padding: 4px;
    width: 400px;
  
    * {
      box-sizing: border-box;
    }
  
    .map-manager-source-listbox-header {
      display: flex;
      margin-left: 1px;
      column-gap: 4px;
      }
  
    ul.core-listbox {
      background-color: $buic-background-1;
    }
  
    .map-manager-sources {
      height: 250px;
      min-height: 60px;
  
      .map-source-list-entry {
        .map-source-list-entry-name {
          flex: 1 1 auto;
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden;
          margin-right: 4px;
        }
  
        .map-source-list-entry-attach {
          margin-right: 10px;
          display: none;
          width: auto;
        }
  
        &[aria-selected="true"] {
          .map-source-list-entry-attach {
            display: inline-block;
          }
        }
      }
    }
  }