.em-icon-picker {
    .em-flex {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      width: 100%;
      align-items: center;
      div {
        display: flex;
        align-items: center;
        flex-direction: row; 
      }
    }
  }
  
  .em-icon-picker-popover {
    &.is-expanded {
      .components-popover__content {
        overflow-y: scroll !important;
      }
    }
  
    .components-popover__content {

      width: 300px;
      height: 400px;
      border-radius: 10px;
      &::-webkit-scrollbar {
          width: 10px;
      }
      &::-webkit-scrollbar-track {
          box-shadow: inset 0 0 5px grey;
          border-radius: 10px;
      }
      &::-webkit-scrollbar-thumb {
          background: grey;
          border-radius: 10px;
          &:hover {
              background: rgb(75, 75, 75);
          }
      }
    }
  }

.em-icon-picker-root {
    .em-icon-picker-grid {
      padding: 10px 0px;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-gap: 5px;
  
      .em-icon {
        text-align: center;
        padding: 15px 0px;
        width: 100%;
        background: #eee;
        font-size: 20px;
        cursor: pointer;
        &.em-active {
          background: #000;
          color: #fff;
        }
  
        &:not(.em-active):hover {
          background: #e8e5e5;
        }
      }
    }
  }