.#{$theme-name} {
  .esriBookmarks {
    font-size: $font-size-base;
    width: $bookmarks-width;
    position: relative;
  }
  .esriBookmarkTable {
    border-spacing: 0;
    border-collapse: collapse;
  }
  .esriBookmarkLabel {
    position: relative;
    float: left;
    overflow: hidden;
    line-height: $line-height-base;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: left;
    vertical-align: middle;
    cursor: pointer;
    margin-left: $bookmarks-label-margin-left;
  }
  .esriBookmarkItem {
    padding: $padding-base-vertical $padding-base-horizontal;
    width: 100%;
    &,
    > * {
      line-height: $line-height-base;
    }
    @include pie-clearfix;
    &:before {
      float: left;
      @include dijit-icons;
      content: "";
      color: inherit;
      line-height: $line-height-base;
      margin-right: $padding-small-horizontal;
    }
  }
  .esriAddBookmark {
    color: $bookmarks-btn-add-color;
    &:before {
      content: "\e620";
    }
  }
  .esriBookmarkHighlight {
    background-color: $bookmarks-item-active-bg;
  }
  .esriBookmarkEditImage,
  .esriBookmarkRemoveImage {
    float: right;
    width: $bookmarks-btn-icon-width;
    cursor: pointer;
    @include dijit-icons;
    line-height: $line-height-base;
    text-align: center;
    &:hover,
    &:active {
      @include transition(all .25s ease);
      @include opacity(.75);
    }
  }
  .esriBookmarkEditImage {
    &:before {
      content: "\e61b";
    }
  }
  .esriBookmarkRemoveImage {
    &:before {
      content: "\e600";
    }
  }
  .esriBookmarkEditBox {
    position: fixed;
    font-size: $font-size-base;
    height: $line-height-computed + $padding-base-vertical * 2;
    width: $bookmarks-input-width;
    z-index: 999;
    padding: 0;
    margin: 0 $padding-base-horizontal;
    border: 0;
    border-bottom: 1px solid $bookmarks-input-border;
    background: $input-bg;
    &:focus {
      outline: none;
    }
  }
  // DND mode
  .esriBookmarks {
    .dojoDndItem {
      padding: 0;
      .esriBookmarkItem {
        &:before {
          content: "\e601";
        }
      }
    }
    .dojoDndItemAnchor,
    .dojoDndItemSelected {
      &,
      &:hover,
      &:focus,
      &.dojoDndItemOver {
        background-color: transparent;
      }
    }
  }
  .esriBookmarkList {
    .esriBookmarkItem {
      &:before {
        color: $bookmarks-drag-icon-color;
      }
    }
    .esriBookmarkHighlight {
      &:before {
        color: $bookmarks-drag-icon-active-color;
      }
    }
  }
  .dojoDndAvatarItem {
    display: none;
  }
  &.dojoDndMove {
    .esriBookmarkList {
      .esriBookmarkHighlight {
        background-color: transparent;
        &:before {
          color: $bookmarks-drag-icon-color;
        }
      }
      .dojoDndItemAnchor,
      .dojoDndItemSelected {
        &,
        &:hover,
        &:focus,
        &.dojoDndItemOver {
          background-color: transparent;
          .esriBookmarkItem {
            background-color: $bookmarks-dnd-anchor-active-hover-bg;
            &:before {
              color: $bookmarks-drag-icon-active-color;
            }
          }
        }
        .esriBookmarkHighlight {
          &:before {
            color: $bookmarks-drag-icon-active-color;
          }
        }
      }
    }
    .esriAddBookmark {
      background-color: transparent;
    }
  }
}

