@import "~@dnnsoftware/dnn-react-common/styles/index";

.dnn-servers-grid-panel {
  .collapsible-component1 {
    display: table;
    width: 100%;
    border-bottom: 1px solid @alto;
    cursor: auto;
    > div {
      float: left;
      width: 100%;
      > div {
        float: left;
        width: 100%;
      }
    }
    &.true {
      border-top: 2px solid @curiousBlue;
      border-bottom: 2px solid @curiousBlue;
      margin-top: -1px;
    }
    .role-row-collapsible {
      background-color: @white;
      > div {
        padding: 25px;
      }
    }
    div.collapsible-header1 {
      color: @rollingStone;
      width: 100%;
      float: left;
      position: relative;
      padding: 15px 18px;
      box-sizing: border-box;
      cursor: auto;
      .ellipsis {
        -ms-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
      }
      .edit-icon {
        margin-left: 5px;
        float: right;
        cursor: pointer;
        svg {
          width: 18px;
          float: left;
          height: 18px;
        }
        &.false {
          svg {
            fill: @curiousBlue;
          }
          svg:hover {
            fill: @thunder;
          }
        }
      }
      .icon-flat {
        display: inline-block;
        width: 18px;
        height: 18px;
        vertical-align: middle;
        &.active {
          svg {
            fill: @thunder;
          }
        }
      }
    }
    .dnn-single-line-input-with-error {
      width: 100%;
    }
    .buttons-box {
      width: 100%;
      text-align: center;
      float: left;
      margin: 15px 0;
      .dnn-ui-common-button {
        margin: 5px;
      }
      .edit-icon {
        margin: 0px 10px 20px 10px;
        float: right;
        svg {
          width: 16px;
          float: left;
          height: 16px;
        }
      }
    }
  }
  .dnn-grid-cell {
    &.right {
      text-align: right;
    }
  }
}
