/*-------------- admin-table -----------------*/
.admin-table-wrap{
	&__action{
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	  margin-bottom: 24px;

	  .btn{min-width: 124px;}
	}

	&__title{
	  @include font(normal, 600, rem(14px), 1.4, $color-dark-grey);
	  text-transform: uppercase;
	  margin-top: 4px;
	}

	&__col{
	  display: flex;
	  align-items: center;

    .btn{padding: 0 25px;}
    .btn + .btn{margin-left: 0;}
    .btn:not(:last-child){margin-right: 15px;}
	}

	.form-search{
	  margin-left: 32px;
	}

	& + .empty-block{margin-top: -23px;}
  }

  .admin-table{
    table-layout: fixed;
	width: 100%;
	@include font(normal, normal, rem(14px), 1.4, $color-dark-grey);
	background: #fff;
	box-shadow: 0 2px 4px 0 #dbe4f9;

	&_yellow{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-yellow;}
	&_blue{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-blue;}
	&_green{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-green;}
	&_red{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-red;}
	&_orange{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-light-red;}
	&_purple{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-purple;}

	&_yellow,
	&_blue,
	&_green,
	&_red,
	&_orange,
	&_purple{
	  margin-left: 5px;
	  width: calc(100% - 5px);
	}

    &__row_yellow{box-shadow: inset 4px 0px 0px 0px $color-yellow;}
    &__row_blue{box-shadow: inset 4px 0px 0px 0px $color-blue;}
    &__row_green{box-shadow: inset 4px 0px 0px 0px $color-green;}
    &__row_red{box-shadow: inset 4px 0px 0px 0px $color-red;}
    &__row_orange{box-shadow: inset 4px 0px 0px 0px $color-light-red;}
    &__row_purple{box-shadow: inset 4px 0px 0px 0px $color-purple;}

    &__head-icon{
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      position: relative;
      cursor: pointer;
      margin-left: 5px;

      .tooltip{
        display: none;

        &__content{
          white-space: normal;
          text-align: left;
        }

        &::after{
          left: auto;
          right: 8px;
        }
      }
    }

    &__head-icon.active .tooltip,
    &__head-icon:hover .tooltip{
      display: inline-block;
      width: 250px;
      max-width: none;
      margin: 8px 0 0 0;
      white-space: wrap;
      position: absolute;
      top: 100%;
      right: -8px;
      z-index: 10;
    }

	// &__head,
	// &__row{
	//  display: table-row;
	// }

	// &:hover{
	//  position: relative;
	//  z-index: 1;
	// }

	th,
	td{
	  width: 100%;
	}

	&__item{
	  // display: table-cell;
	  vertical-align: middle;
	  height: rem(38px);
	  padding: 2.7px 25px;
	  position: relative;
	  white-space: nowrap;

	  .progress{
		vertical-align: middle;
		margin-bottom: 2px;
	  }
	}

	& &__item_menu{
	  width: 100px;
	  padding-left: 0;
	  padding-right: 7px;
	  text-align: right;
	}

	&__name-wrap{
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  width: 100%;

	  .icon{
		width: 16px;
		height: 16px;
	  }
	}

	&__name-wrap &__name{width: calc(100% - 20px);}

	&__name{display: block;}

	&__name-accent{color: $color-green;}

	&__name,
	&__data-sample,
	&__text-cut{
	  // width: 510px;
	  width: 100%;
	  overflow: hidden;
	  text-overflow: ellipsis;
	  white-space: nowrap;
	}

   &__text-cut{display: inline-block;}

	&__name-edit{
	  // width: 510px;
	  margin-left: -4px;
    position: relative;

	  input[type="text"]{
		height: rem(30px);
		width: 100%;
		border: 1px dashed transparent ;
		outline: 0;
		margin: 0;
		padding: 0 4px;
		background: transparent;
		@include font(normal, normal, rem(14px), rem(28px), $color-dark-blue);
	  }

    input[type="text"]::placeholder{color: $color-light-grey;}
    input[type="text"]:hover{border-color: $color-light-grey;}
	  input[type="text"]:focus{border: 1px solid $color-light-grey;}

    .info-popup{
      white-space: normal;
      position: absolute;
      top: 100%;
      left: 11px;
      z-index: 10;
    }
	}

    &__name-edit.error{
      display: flex;
      align-items: center;

      input[type="text"]{
        width: calc(100% - 24px);
        border: 1px solid $color-red;
      }
    }

    &__name-info{
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    &__name-error{
      position: relative;
      margin-left: 6px;

      .ic-failure{
        display: block;
        width: 18px;
        height: 16px;
      }

      .tooltip{
        display: none;
        width: 250px;
        margin: 0 0 0 7px;
        white-space: normal;
        position: absolute;
        @include top-center;
        left: 100%;
        z-index: 2;

        &_left::after{
          @include top-center;
        }
      }
    }

    &__name-error_short .tooltip{width: 143px;}
    & &__name-error .tooltip{max-width: none;}
    &__name-error:hover .tooltip{display: inline-block;}

    &__name-ic{
      width: 16px;
      height: 16px;
    }

    &__name-ic{
      width: 16px;
      height: 16px;
    }

    &__name-ic > .icon{
      width: 100%;
      height: 100%;
      vertical-align: top;
    }

    &__name-ic{
      position: relative;

      .tooltip{
        display: none;
        width: 270px;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 8px;
        position: absolute;
        top: -5px;
        left: 100%;
        z-index: 2;
        white-space: normal;
      }
    }

    & &__name-ic .tooltip{max-width: none;}
    &__name-ic:hover .tooltip{display: inline-block;}
    &__name-info &__name{width: calc(100% - 40px);}
    & &__head-name{width: 400px;}

    &__switch-info{
      position: relative;

      .switch{
        width: 2.5rem;
        position: relative;

        &__on,
        &__off{
          display: none;
          width: 33px;
          padding: 4px;
          background: $color-dark-blue;
          @include font(normal, normal, rem(12px), 1.57, #fff);
          margin: 0 0 0 8px;
          position: relative;
          position: absolute;
          @include top-center;
          left: 100%;
        }

        &__on::after,
        &__off::after{
          content: '';
          display: inline-block;
          width: 0;
          height: 0;
          border-style: solid;
          border-width: 6px 5px 6px 0;
          border-color: transparent $color-dark-blue transparent transparent;
          position: absolute;
          @include top-center;
          right: 100%;
        }

        input[type="checkbox"]:checked + .switch__content .switch__on{
          display: none;
          color: #fff;
        }
      }
    }

    &__switch-info:hover{
      .switch{
        &__off,
        input[type="checkbox"]:checked + .switch__content .switch__on{
          display: block;
        }
      }
    }

	tr th.admin-table__item_check{width: 65px;}
  th.admin-table__item_menu{width: 60px;}
	tr th.admin-table__item_select{width: 245px;}
  tr th.admin-table__item-select-big{width: 330px;}
  tr th.admin-table__item_order{width: 126px;}
  tr th.admin-table__item_info{width: 70px;}
  tr th.admin-table__item-duration{width: 120px;}
	tr th.admin-table__item_name-edit,
	tr th.admin-table__item_data-sample{
	  width: 540px;
	}

  tr th.admin-table__item_usage{width: 185px;}
  tr th.admin-table__item_usage &__title{width: 150px;}

	&__name .tooltip,
	&__data-sample .tooltip{
	  display: none;
	  position: absolute;
	  bottom: calc(100% - 10px);
	  left: 20px;
	  z-index: 10;
	  white-space: normal;
	}

	&__data-sample .tooltip{
	  left: 0;
	}

	&__name:hover .tooltip,
	&__name .tooltip.active,
	&__data-sample:hover .tooltip,
	&__data-sample .tooltip.active{
	  display: table;
	}

	&__name:hover .tooltip__content,
	&__name .tooltip.active .tooltip__content,
	&__data-sample:hover .tooltip__content,
	&__data-sample .tooltip.active .tooltip__content{
	  display: table-cell;
	}

	&__head{
	  @include font(normal, 600, rem(14px), 1.43, $color-dark-blue);
	  // border-bottom: solid 1px rgba(161,173,205,0.5);
	  white-space: nowrap;

    .input-check{
      &__text{font-weight: 600;}
    }
	}

	&__head &__item{
	  padding: 14px 25px;
	  position: relative;
	  font-weight: 600;
	  border-bottom: 1px solid rgba(161,173,205,0.5);;
	}

	// &__head &__item::after{
	//  content: '';
	//  display: inline-block;
	//  width: 100%;
	//  height: 1px;
	//  background: rgba(161,173,205,0.5);
	//  position: absolute;
	//  bottom: 0;
	//  left: 0;
	// }

	&__head &__item .ic-help,
	&__head &__item .ic-info{
	  width: 16px;
	  height: 16px;
	  max-height: 16px;
	  vertical-align: middle;
    margin-top: -2px;
	}

    &__head-link{
      position: relative;
      margin-left: 8px;
      font-weight: normal;
    }

    &__head-link::before{
      content: '';
      display: inline-block;
      vertical-align: middle;
      width: 1px;
      height: 15px;
      background: #979797;
      margin-right: 8px;
    }

	&__option{
	  @include font(italic, normal, rem(12px), 1.43, $color-grey);
	  margin-left: 4px;
	}

	&__sort{
	  display: inline-block;
	  vertical-align: middle;
	  width: 7px;
	  height: 12px;
	  margin-right: 4px;
	  position: relative;
	}

	&__sort-up,
	&__sort-down{
	  display: inline-block;
	  width: 0;
	  height: 0;
	  position: absolute;
	  left: 0;
	}

	&__sort-up{
	  border-style: solid;
	  border-width: 0 3.5px 4px 3.5px;
	  border-color: transparent transparent $color-dark-blue transparent;
	  top: 0;
	}

	&__sort-down{
	  border-style: solid;
	  border-width: 4px 3.5px 0 3.5px;
	  border-color: $color-dark-blue transparent transparent transparent;
	  bottom: 2px;
	}

	&__sort_disable &__sort-up{border-color: transparent transparent $color-light-grey transparent;}
	&__sort_disable &__sort-down{border-color: $color-light-grey transparent transparent transparent;}

	&__sort_desk &__sort-up,
	&__sort_asc &__sort-down{
	  display: none;
	}

	&__row:nth-child(odd){
	  background: $color-sort-grey;
	}

	&__row{
    width: 100%;
	  position: relative;
	}

	&__row:hover,
	&__row:nth-child(odd):hover{
	  background: #e1e3e7;
	  // background: rgba(82, 87, 106, 0.1);
	  // box-shadow: 0 2px 5px 0 #dbe4f9;
	  // position: relative;
	  // z-index: 1;
	  // transform: scale(1,1);

	}
	&_white &__row:hover,
	&_white &__row:nth-child(2n+1):hover{
	  background: #f7f7f8;
	}

	//   /*To work on the others browsers*/
	//   &__hover:hover {
	//  outline: none;
	//  -webkit-box-shadow: inset 0 0 10px #337AB7;
	//  box-shadow: inset 0 0 10px #337AB7;
	//   }

	&__row.active{
	  z-index: 2;
	  outline: 1px solid $color-dark-purple;
	  //transform: scale(1);
	}

	&__row.active &__item:first-child::before{
	  content: '';
	  display: inline-block;
	  width: 5px;
	  height: calc(100% + 2px);
	  position: absolute;
	  top: -1px;
	  left: 0;
	  background: $color-dark-purple;
	}

  &__row.active &__error-icon .icon{
    max-width: 16px;
    max-height: 16px;
  }

  &__row.active &__item:first-child &__error-icon_left{left: 4px;}

  &__row_bold{
    font-weight: bold;
  }

	&__notice{
	  width: 22px;
	  height: 22px;
	  vertical-align: middle;
	  margin-right: -5px;
	}

	&__icon{
	  position: relative;
	  padding: 5px 0;
	}

  & &__icon .tooltip{max-width: none;}

	&__item > .icon,
	&__icon .icon{
	  display: inline-block;
	  vertical-align: middle;
	  width: 20px;
	  height: 20px;
	}

	&__item > .ic-shared,
	&__icon .ic-shared{
	  width: 19px;
	  height: 17px;
	}

	&__item > .ic-duplicate,
	&__icon .ic-duplicate{
	  width: 27px;
	  height: 27px;
	}

	&__item > .ic-data,
	&__icon .ic-data{
	  width: 20px;
	  height: 24px;
	}

	&__item > .ic-and,
	&__item > .ic-or,
	&__icon .ic-and,
	&__icon > .ic-or{
	  width: 25px;
	  height: 17px;
	}

    &__item > .ic-success,
    &__item > .ic-warning,
    &__item > .ic-timer,
    &__item > .ic-aborting,
    &__icon .ic-success,
    &__icon .ic-warning,
    &__icon .ic-timer,
    &__icon .ic-aborting{
      width: 18px;
      height: 18px;
    }

    &__item > .ic-run,
    &__icon .ic-run{
      width: 24px;
      height: 24px;
    }

  // &__item > .ic-failure,
  &__icon .ic-failure{
    width: 21px;
    height: 18px;
  }

	&__icon .ic-download{
	  width: 28px;
	  height: 28px;
	}

	&__icon .ic-robot{
	  width: 26px;
	  height: 25px;
	}

	&__icon .ic-plug{
	  width: 25px;
	  height: 15px;
	}

	&__icon-label{
	  display: inline-block;
	  vertical-align: middle;
	  margin-left: 12px;
	  position: relative;
	}

	&__icon-label .tooltip,
	&__icon .tooltip{
	  display: none;
	  position: absolute;
	  bottom: 100%;
	  left: -15px;
	  z-index: 10;
	  white-space: nowrap;
	}

  &__icon .tooltip{left: -10px;}

  &__icon .tooltip_left{
    left: 100%;
    bottom: auto;
    @include top-center;
    margin: 0 0 0 8px;
  }

	&__icon-label:hover .tooltip,
	&__icon-label .tooltip.active,
	&__icon:hover .tooltip,
	&__icon .tooltip.active{
	  display: table;
	}

	&__icon-label:hover .tooltip__content,
	&__icon-label .tooltip.active .tooltip__content,
	&__icon:hover .tooltip__content,
	&__icon .tooltip.active .tooltip__content{
	  display: table-cell;
	}

  &__icon .ic-info,
  &__icon .ic-info-failed,
  &__icon .ic-info-disabled,
  &__icon .ic-info-complete{
    width: 16px;
    height: 16px;
  }

  &__icon .ic-asterisk,
  &__icon .ic-asterisk.ic-grey{
    fill: $color-dark-purple;
  }

    &__error-icon{
      margin-left: 4px;
      position: absolute;
      top: 9px;
      right: 0;
      z-index: 10;

      .icon{
        max-width: 18px;
        max-height: 18px;
      }

      .tooltip{
        display: none;
        width: 250px;
        margin-left: 9px;
        position: absolute;
        font-size: rem(12px);
        line-height: 1.4;

        p{
          font-size: rem(12px);
          margin-bottom: 0;
        }

        &_left{
          margin-top: 0;
          margin-bottom: 0;
          top: -1px;
          left: 100%;
        }

        &_top{
          margin-left: 0;
          margin-right: 0;
          top: 100%;
          left: -3px;
        }
      }
    }

    &__error-icon_left{
      right: auto;
      left: 0;
      margin-left: 0;
    }

    &__error-icon:hover .tooltip,
    &__error-icon.active .tooltip{
      display: inline-block;
    }

    &__item &__error-icon .tooltip{
      max-width: 250px;
      white-space: normal;
      overflow: visible;
    }

	&__circle{
	  display: inline-block;
	  vertical-align: middle;
	  width: 7px;
	  height: 7px;
	  background: $color-dark-purple;
	  border-radius: 50%;
	  margin-right: 8px;
	}

	&__circle_green{background: $color-green;}
	&__circle_grey{background: $color-light-grey;}

  &__circle:last-child{margin-right: 0;}

	.tooltip{
	  max-width: 100%;
	}

  &_white &__row:nth-child(2n+1){background: transparent;}
  &_white &__row:not(:last-child) &__item{border-bottom: 1px solid rgba(161,173,205,.5);}
  //&_white &__row:not(:last-child):hover &__item{border-bottom: 1px solid transparent;}

	.input-check{
	  margin-top: 2px;
	}

	.input-check__label{
	  margin-bottom: 0;
	}

	&__item_center{text-align: center;}
	&__item_right{text-align: right;}

  &__item_center &__title-val{justify-content: center;}

	&__date,
	&__user{
	  width: 135px;
	}

	&__load{
	  text-align: right;
	  padding-right: 15px;
	}

	&__load .ic-hover{
	  width: 28px;
	  height: 28px;
	}

	&__icon .info-popup{
	  display: none;
	  white-space: normal;
	  text-align: left;
	  position: absolute;
	  top: 100%;
	  right: -18px;
	  z-index: 2;
	  margin-top: 5px;
	}

	&__icon:hover .info-popup, &__icon .info-popup.active{display: inline-block;}

	&_auto{
	  //table-layout: auto;

	  td,
	  th{
		width: auto;
	  }
	}

	&__more{position: relative;}
	&__more-link{
	  display: none;
	  vertical-align: middle;
	  @include font(normal, normal, rem(14px), 1, $color-blue);
    padding: 4px 20px 4px 6px;
	  background: #fff;
	  position: absolute;
	  @include top-center;
	  right: 0;
    cursor: pointer;

	  .icon{
      height: 14px;
		fill: $color-blue;
		position: absolute;
		@include top-center;
		right: -4px;
	  }
	}

	&__more-link:hover{text-decoration: none;}

	&__row:nth-child(2n+1) &__more-link{
	  background: rgba(242,243,245,.9);
	}

	&__row:hover &__more-link,
	&__row:nth-child(2n+1):hover &__more-link{
	  background: #e1e3e7;
	}

	&__row:hover &__more-link,
	&__row.active &__more-link{
	  display: inline-block;
	}

	.select_small{width: 206px;}
    .select_full{width: 100%;}

	&__link-arr{
    color: $color-blue;
    cursor: pointer;

	  .icon{
      width: 12px;
      height: 12px;
      fill: $color-blue;
      margin-left: 4px;
	  }
	}

  &__link-arr:hover{text-decoration: underline;}

	&__group{width: 45px;}

	.admin-table__ic-group{
	  display: block;
	  width: 45px;

	  .icon{
		width: 24px;
		height: 24px;
	  }
	}

	.admin-table__found{
	  display: inline-block;
	  width: 91px;
	  text-align: center;
	}

	& &__status{width: 110px;}
  & &__log{width: 140px;}
	& &__state{width: 110px;}
    & &__stateAll{width: 215px;text-align: left;}
    & &__mismatch{width: 50px;}
	& &__menu{width: 80px;}
	& &__load{width: 65px;}
	& &__source{width: 130px;}
	& &__datetime{width: 165px;}
	& &__date{width: 130px;}
  & &__time{width: 130px;}
  & &__modif{width: 180px;}
  & &__use{width: 120px;}
	& &__use{width: 120px;}
  & &__progress{width: 150px;}
  & &__info{width: 80px;}
  & &__type{width: 110px;}
  & &__switch{width: 110px;}
  & &__group{width: 100px;}

  & &__item_drag{
    width: 0;
    padding-left: 0;
    padding-right: 0;

    .ic-drag{
      //margin-left: 5px;
      position: relative;
      z-index: 2;
    }
  }

  &__row.inactive &__item{opacity: 0.5;}
  &__row.inactive &__item.active{opacity: 1;}

  &__check{
    display: flex;
    align-items: center;

    .admin-table__name-edit{
      width: calc(100% - 18px);
      margin-left: 4px;
      //text-overflow: ellipsis;
      //overflow: hidden;
    }
  }

    &__check_more .input-check__text{font-weight: 600;}

    &__edit{
      display: none;
      margin-left: 15px;
      cursor: pointer;

      .icon{
        width: 21px;
        height: 21px;
        fill: $color-dark-blue;
      }
    }

    &__row:hover &__edit{
      display: inline-flex;
      justify-content: center;
      align-items: center;
      vertical-align: middle;
    }

    &__desc{
      @include font(normal, normal, rem(14px), 1.43, $color-dark-blue);
      white-space: normal;
      padding-left: 22px;
      margin-top: 8px;

      p,
      ul{
        font-size: rem(14px);
        margin-bottom: 10px;
      }

      p:last-child,
      ul:last-child{
        margin-bottom: 0;
      }
    }

    &__desc-count{
      @include font(normal, normal, rem(14px), 1.43, $color-dark-grey);
      margin-left: 25px;
    }

    &__desc-count + .link-site{
      margin-left: 8px;
      padding-left: 8px;
      position: relative;
    }

    &__desc-count + .link-site::before{
      content: '';
      display: inline-block;
      width: 1px;
      height: 15px;
      background: $color-light-grey;
      position: absolute;
      @include top-center;
      left: 0;
    }

    & &__drag,
    & &__item_drag{
      width: 25px;
    }

    &__drag,
    &__item_drag{
      text-align: center;

      .icon{
        width: 12px;
        height: 12px;
        fill: $color-light-grey;
      }
    }

    &__drag + &__item,
    &__item_drag + &__item{
      padding-left: 3px;
    }

    &__row_drag{
      box-shadow: 0 -9px 21px 0 rgba(128, 152, 213, 0.15), -10px 9px 21px 0 rgba(128, 152, 213, 0.15);
    }

    &__row:not(:last-child) &__drag{border-bottom: 1px solid 1px solid rgba(161,173,205,.5);}

    &__placeholder{
      td{
        display: block;
        height: rem(38px);
        background: $color-soft-blue;
        border: 1px dashed $color-blue;
        border-radius: 1px;
      }
    }
  }

.typograhy-drag{
  .admin-table{
    box-shadow: none;
    background: transparent;
    border-top: 1px solid rgba(161,173,205,.5);

    &__row:last-child .admin-table__item,
    &__row:last-child .admin-table__drag{
      border-bottom: 1px solid rgba(161,173,205,.5);
    }

    &__row:nth-child(2n+1){background: transparent;}
  }

  .event-map-panel{
    &__list{
      border-top: 1px solid #acb2c3;
      border-bottom: 1px solid #acb2c3;
      width: 300px;
      background: #fff;
    }

    &__list_indent{
      height: auto;
      overflow: visible;
    }
  }
}

.typograhy-drag-white{
  background: #fff;
  padding: 30px 0;
}

  // @media screen and (-webkit-min-device-pixel-ratio:0) {
  //  .admin-table{
  //    tr:hover td:first-child {
  //    box-shadow: inset 0px 11px 8px -10px #337AB7,
  //      inset 0px -11px 8px -10px #337AB7,
  //      inset 11px 0px 8px -10px #337AB7;
  //    }

  //    tr:hover td {
  //    box-shadow: inset 0px 11px 8px -10px #337AB7,
  //      inset 0px -11px 8px -10px #337AB7;
  //    }

  //    tr:hover td:last-child {
  //    box-shadow: inset 0px 11px 8px -10px #337AB7,
  //      inset 0px -11px 8px -10px #337AB7,
  //      inset -11px 0px 8px -10px #337AB7;
  //    }
  //  }
  //   }

    .table-file-info{
    // width: 320px;
    display: flex;
    align-items: center;
    padding-right: 20px;

    &__name{
      // max-width: 240px;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    }

    .admin-table-filter{
    display: inline-block;
    vertical-align: middle;
    margin-left: 4px;
    position: relative;

    &__icon{
      display: inline-block;
      width: 13px;
      height: 14px;
    }

    &__popup{
      //display: none;
      max-width: 265px;
      padding: 20px 15px 20px;
      border-radius: 4px;
      background: #fff;
      box-shadow: -10px 9px 21px 0 rgba(128, 152, 213, 0.08);
      border: solid 1px rgba(172, 178, 195, 0.5);
      margin-top: -14px;
      text-align: left;
      position: absolute;
      top: calc(100% + 15px);
      right: -5px;
      z-index: 10;
    }

      /* ----------------------- */
      &__popup-flexible-width{
        //display: none;
        padding: 20px 15px 20px;
        border-radius: 4px;
        background: #fff;
        box-shadow: -10px 9px 21px 0 rgba(128, 152, 213, 0.08);
        border: solid 1px rgba(172, 178, 195, 0.5);
        /* margin-top: -14px; */
        text-align: left;
        /* position: absolute; */
        top: calc(100% + 15px);
        right: -5px;
        z-index: 10;
      }
      /* ----------------------- */


      &__popup.active{
      display: block;
    }

    &__top{
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-bottom: 10px;
      border-bottom: 1px solid $color-light-grey;
      margin-bottom: 12px;
    }

    &__top .input-check__label{margin-bottom: 0;}

    &__clear{
      font-size: rem(14px);
      font-weight: normal;
      color: $color-blue;
      cursor: pointer;
    }

    &__clear:hover{text-decoration: underline;}

    &__btn{
      margin-top: 10px;
    }

    &__params{
      max-height: 340px;
      overflow-y: auto;
      margin-left: -8px;
      margin-top: -8px;
      padding-left: 8px;
      padding-top: 8px;

      .input-check__label{margin-bottom: 14px;}
    }

    &_last{margin-right: -10px;}

    .simple-filter{
      margin: -15px;
      padding: 0;
    }

    &__sect:not(:last-child){
      border-bottom: 1px solid #acb2c3;
      margin-bottom: 12px;
    }
  }

  .simple-filter{
	min-width: 160px;
	max-height: 340px;
	overflow-y: auto;
	padding: 5px 0;

	&__sect{
	  position: relative;
	  padding: 7px 0;
	}

	&__sect:not(:last-child)::after{
	  content: '';
	  display: inline-block;
	  width: calc(100% - 32px);
	  height: 1px;
	  background: rgba(172, 178, 195, 0.5);
	  position: absolute;
	  bottom: 0;
	  left: 0;
	  right: 0;
	  margin: 0 auto;
	}

	&__item{
	  display: block;
	  height: rem(25px);
	  @include font(normal, normal, rem(14px), rem(25px), $color-dark-blue);
	  text-decoration: none;
	  padding: 0 16px;
    cursor: pointer;
	}

	&__item:not(:last-child){margin-bottom: 7px;}

	&__item:hover,
	&__item.active{
	  background: $color-sort-grey;
	  color: $color-dark-blue;
	  text-decoration: none;
	}
  }

  .admin-table-popup{
    display: none;
    width: auto;
    // max-width: 226px;
    border-radius: 4px;
    background: #fff;
    box-shadow: -10px 9px 21px 0 rgba(128, 152, 213, 0.08);
    border: solid 1px rgba(172, 178, 195, 0.5);
    padding: 5px 0;
    margin: -6px -19px 0 0;
    text-align: left;
    position: absolute;
    right: 100%;
    top: 100%;
    z-index: 10;

    &.active,
    &:hover{
      display: block;
    }

    &__item{
      display: flex;
      // justify-content: space-between;
      align-items: center;
      padding: 5px 15px;
      @include font(normal, normal, rem(14px), 1.57, $color-dark-blue);
      cursor: pointer;
    }

    &__item.disable{cursor: auto;}
    &__item.disable .icon{fill: $color-light-grey;}

    &__icon{
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      margin-right: 10px;

      .ic-aborting{
        width: 22px;
        height: 22px;
      }

      .ic-filter{
        width: 20px;
        height: 20px;
      }
    }

	&__text{
	  // width: calc(100% - 40px);
	  white-space: nowrap;
	}

	&__item:hover{
	  background: $color-sort-grey;
	  color: $color-dark-blue;
	  text-decoration: none;
	}

	&__top,
	&__bottom{
	  padding: 8px 0;
	}

	&__bottom{
	  border-top: 1px solid rgba(172, 178, 195, 0.5);
	}

	&__item.disable{color: $color-light-grey;}
	&__item.disable:hover{background: transparent; cursor: auto;}

    &_up{
      top: auto;
      bottom: 100%;
    }
  }

  .admin-table-action{
	display: inline-block;
	vertical-align: middle;
	width: 30px;
	position: relative;

	&__menu{
	  display: inline-block;
	  vertical-align: middle;
	  width: 30px;
	  height: 30px;
	}

	&__menu_inactive .icon{fill: $color-light-grey;}
  }

  .admin-table-content{
	position: relative;
  }

  .admin-table-info{
    //display: none;
    width: calc(100% + 4px);
    max-width: 820px;
    height: 100%;
    background: #fff;
    border-left: 1px solid rgba(161, 173, 205, 0.5);
    padding: 10px 30px 15px;
    position: absolute;
    top: 0;
    right: -2px;
    z-index: 10;

    //&.active{
    //  display: block;
    //}

	&__top{
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	  height: 39px;
	  padding-bottom: 8px;
	  border-bottom: 1px solid #dbe4f9;
	  margin-bottom: 10px;
	}

	&__head{
	  @include font(normal, 600, rem(14px), 1.43, $color-dark-blue);
	  text-transform: uppercase;
	}

	&__icons{
	  display: inline-flex;
	  align-items: center;
	}

	&__icons .ic-hover{
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  margin-left: 6px;
	}

	&__icons .icon:not(:last-child){
	  margin-right: 5px;
	}

	&__icons .ic-close{
	  width: 20px;
	  height: 20px;
	}

	&__ic{
	  display: inline-block;
	  vertical-align: middle;
	  margin-top: -8px;
	  margin-right: 12px;
	}

	&__content{
	  max-height: calc(100% - 49px);
	  overflow-y: auto;
	}

	&__main{display: flex;}

	&__col:not(:last-child){
	  margin-right: 15px;
	}

	// &__col{width: calc(27% - 15px);}

	&__col:first-child{
	  width: calc(45% - 15px);
	}

	&__col:last-child{
	  width: 55%;
	}

	&__col:last-child &__item{
	  display: block;
	  font-size: 0;
	}

	&__col:last-child &__title,
	&__col:last-child &__val{
	  display: inline-block;
	  width: auto;
	}

	&__item-wrap{
	  display: flex;
	  justify-content: space-between;
    flex-wrap: wrap;
	  padding-right: 30px;
    margin-bottom: 15px;
	}

  &__item-wrap &__item{margin-bottom: 5px;}

	&__item{
	  display: flex;
	  margin-bottom: 20px;
	}

	&__title{
	  width: 150px;
	  @include font(normal, 600, rem(14px), 1.43, $color-dark-grey);
	  margin-right: 10px;
	}

	&__val{
	  width: calc(100% - 156px);
	  @include font(normal, normal, rem(14px), 1.43, $color-dark-grey);
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;

    .icon{
		vertical-align: middle;
		margin-top: -2px;
	  }

	  .icon:first-child{margin-right: 8px;}
	}

	.file-count{
	  .icon,
	  &__val{
		margin-top: -3px;
	  }
	}

	.ic-close-history{
	  width: 12px;
	  height: 12px;
	}

	.ic-delete{
	  width: 25px;
	  height: 25px;
	}

	.ic-edit{
	  width: 25px;
	  height: 25px;
	}

	.icon{vertical-align: middle;}

	.ic-robot{
	  width: 26px;
	  height: 25px;
	}

	.ic-success{
	  width: 18px;
	  height: 18px;
	}

  .ic-failure{
    width: 22px;
    height: 18px;
  }

	.ic-plug{
	  width: 25px;
	  height: 15px;
	}

	&__circle{
	  display: inline-block;
	  vertical-align: middle;
	  width: 7px;
	  height: 7px;
	  background: $color-green;
	  border-radius: 50%;
	  margin-right: 8px;
	}

	&__circle_purple{background: $color-dark-purple;}

	&__sect{
	  border-top: 1px solid #dbe4f9;
	  padding-top: 15px;
	  margin-top: -5px;
	}

	&__sect &__head{
	  font-size: rem(13px);
	  margin-bottom: 14px;
	}

	&__main_table{
	  margin-top: -10px;
	  margin-bottom: 10px;
	}

	&__main_table &__title{
	  width: auto;
	  padding-right: 10px;
	}

	&__main_table &__col{
	  display: table;
	  margin-right: 0;
	}

	&__main_table &__col:first-child{width: 42%;}
	&__main_table &__col:last-child{width: 58%;}

	&__main_table &__item,
	&__main_table &__col:last-child &__item{
	  display: table-row;
	}

	&__main_table &__title,
	&__main_table &__val,
	&__main_table  &__col:last-child &__title,
	&__main_table  &__col:last-child &__val{
	  display: table-cell;
	  width: auto;
	}

	&__main_table &__title,
	&__main_table &__val{
	  padding: 10px 10px 10px 0;
	}

	&__main_table &__title{
	  padding-right: 10px;
	  white-space: nowrap;
	}

	&__main_table &__val,
	&__main_table  &__col:last-child &__val{
	  width: 100%;
	}

    &__line{
      display: flex;
      flex-wrap: wrap;
    }

    &__line &__title,
    &__line &__val{
      width: auto;
    }

    &__line &__item:not(:last-child){margin-right: 40px;}

    & + .admin-table .admin-table__more-link{display: none;}
  }

.admin-table-info-empty{
  text-align: center;
  &__img{margin-top: 72px;}
}

.job-list{
  .admin-table-popup{min-width: 172px;}
}

.job-details{
  .admin-table-info{
    &__title{
      width: auto;
      min-width: 52px;
    }

    &__val{width: calc(100% - 62px);}
  }
}

  .table-detail-wrap{
	&__title{
	  @include font(normal, 600, rem(14px), 1.4, $color-dark-blue);
	  margin-bottom: 10px;
	}
  }

  .table-detail{
	width: 100%;
	table-layout: fixed;
	margin-bottom: 20px;

	th,
	td{
	  width: 100%;
	}

	&__head{
	  background: $color-sort-grey;
	}

	&__item{
	  height: rem(33px);
	  vertical-align: middle;
	  @include font(normal, normal, rem(14px), 1.4, $color-dark-grey);
	  padding: 2px 20px;
	  border-bottom: 1px solid rgba(161, 173, 205, 0.5);
	}

	&__head &__item{
	  font-weight: 600;
	  color: $color-dark-blue;
	}
  }

  .add-info-table{
	margin-top: 12px;

	&__text{
	  font-size: rem(14px);

	  .icon{
		display: inline-block;
		vertical-align: middle;
		margin-left: 6px;
	  }
	}

	&__opt{
	  @include font(italic, normal, rem(12px), 1.4, $color-grey);
	  margin-left: 7px;
	}

	.ic-user-notice-full,
	.ic-user-notice-empty{
	  width: 26px;
	  height: 20px;
	  fill: $color-blue;
	}

	.ic-failure{
	  display: inline-block;
	  vertical-align: middle;
	  width: 24px;
	  height: 22px;
	  margin-right: 6px;
	}

	&__error{
	  @include font(normal, normal, rem(14px), 1.4, $color-dark-grey);
	  position: relative;
	  margin-left: 10px;
	}

	&__error::before{
	  content: '';
	  display: inline-block;
	  vertical-align: middle;
	  width: 1px;
	  height: 15px;
	  background: #979797;
	  margin-right: 7px;
	}

	&__error-accent{color: $color-red;}

	&__more{
	  margin-left: 10px;
	  position: relative;
	}

	.info-popup{
	  position: absolute;
	  bottom: calc(100% + 7px);
	  right: 2px;
	}

  &__more:hover .info-popup,
  .info-popup.active{
    display: inline-block;
  }

  &__more .info-popup{
    position: absolute;
    bottom: calc(100% + 7px);
    right: 2px;
  }

	&__notice-icon{
	  position: relative;

	  .info-popup{
		position: absolute;
		bottom: calc(100% + 5px);
		left: -5px;
	  }
	}
  }

  .map-categories{
	.admin-table{
	  .select-wrap .select{width: 100%;}

	  //    &__name-edit,
	  //    &__item .select-wrap{
	  //      width: 510px;
	  //    }
	}
  }

  .edit-categories{
	.admin-table{
	  th, td{width: 50%;}

	  &__name-edit,
	  &__data-sample{
		width: 100%;
	  }
	}
  }

  .file-mapping{
    .admin-table{
      td,
      th{
      width: auto;
      }

      tr th.admin-table__item{
        background: #fff;
        vertical-align: middle;
        position: sticky;
        top: 0;
        z-index: 9;
      }
    }

    .admin-table-content{
      height: calc(100vh - 290px);
      overflow-y: auto;
    }
  }

  .admin-table-detail-wrap{
	display: flex;
	justify-content: space-between;
	position: relative;
	padding-top: rem(41px);
	background: #fff;
	box-shadow: 0 2px 4px 0 #dbe4f9;

    &::before{
      content: '';
      display: block;
      width: 4px;
      height: 100%;
      background: #dbe4f9;
      border-radius: 2px 0 0 2px;
      position: absolute;
      top: 0;
      left: -4px;
    }

    &_yellow::before{background: $color-yellow;}
    &_blue::before{background: $color-blue;}
    &_green::before{background: $color-green;}
    &_red::before{background: $color-red;}
    &_orange::before{background: $color-light-red;}
    &_purple::before{background: $color-purple;}
    &_dark-purple::before{background: $color-dark-purple;}

	//&_yellow{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-yellow;}
	//&_blue{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-blue;}
	//&_green{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-green;}
	//&_red{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-red;}
	//&_orange{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-light-red;}
	//&_purple{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-purple;}
  //&_dark-purple{box-shadow: 0 2px 4px 0 #dbe4f9, -5px 0px 0px 0px $color-dark-purple;}

	&_yellow,
	&_blue,
	&_green,
	&_red,
	&_orange,
	&_purple,
  &_dark-purple{
	  margin-left: 5px;
	}

	&__table{
	  width: calc(100% - 406px);
	  height: 100%;
	  overflow-y: auto;
	  border-top: 1px solid rgba(161,173,205,.5);
	}

	.admin-table{
	  box-shadow: none;
	  position: static;

	  &__title{
		display: block;
		position: absolute;
		top: 11px;
	  }

	  &__head .admin-table__item{
		height: 0;
		padding-top: 0;
		padding-bottom: 0;
		border-bottom: 0;
		position: static;
	  }

	  &__item:first-child{padding-left: 30px;}
	  &__item:last-child{padding-right: 30px;}

	  &__row:nth-child(odd){background: #fff;}
	  &__row:nth-child(even){background: $color-sort-grey;}

	  &__row.active{
		background: #e1e3e7;
		outline: 0;
	  }

	  &__row.active .admin-table__item:first-child::before{
		display: none;
	  }

	  &__row:nth-child(odd):hover,
	  &__row:nth-child(even):hover{
		background: #e1e3e7;
	  }

	  &__item{height: rem(30px);}

	  &__item > .icon,
	  &__icon > .icon{
		width: 24px;
		height: 24px;
	  }

	  &__icon > .ic-failure{
		width: 19px;
		height: 16px;
	  }
	}
    &_small{
      padding-top: 0;
      background: transparent;
      box-shadow: none;
    }

    &_small &__table{
      border-top: 0;
      box-shadow: 0 2px 4px 0 #dbe4f9;
    }

    &_small.admin-table-detail-wrap_yellow{box-shadow: -5px 0px 0px 0px $color-yellow;}
    &_small.admin-table-detail-wrap_blue{box-shadow: -5px 0px 0px 0px $color-blue;}
    &_small.admin-table-detail-wrap_green{box-shadow: -5px 0px 0px 0px $color-green;}
    &_small.admin-table-detail-wrap_red{box-shadow: -5px 0px 0px 0px $color-red;}
    &_small.admin-table-detail-wrap_orange{box-shadow: -5px 0px 0px 0px $color-light-red;}
    &_small.admin-table-detail-wrap_purple{box-shadow: -5px 0px 0px 0px $color-purple;}
    &_small.admin-table-detail-wrap_dark-purple{box-shadow: -5px 0px 0px 0px $color-dark-purple;}
  }

  .admin-table-detail{
	width: 406px;
	position: relative;

	&__head{
	  height: rem(41px);
	  padding: 10px 13px;
	  @include font(normal, 600, rem(14px), 1.57, $color-dark-blue);
	  position: absolute;
	  bottom: 100%;
	  left: 0;
	}

	&__content{
	  height: 100%;
	  background: #fff;
	  padding: 12px;
	  border-top: 1px solid rgba(161,173,205,0.5);
	  border-left: 1px solid rgba(161,173,205,0.5);
	  overflow-y: auto;

    .modal-search-detail{
      padding-right: 18px;
    }
	}
  }

  .perm-wrap-key{
	.admin-table{
	  &__name{width: calc(100% - 50px);}
	  &__name-wrap .icon{margin-right: 40px};
	}
  }

  .filter-top{
	display: flex;
	align-items: center;
	margin-right: -12px;

	&__title{
	  @include font(normal, normal, rem(14px), 1.57, $color-dark-blue);
	  margin-right: 6px;
	}

	.select__head{background: #fff;}
  }

  .admin-table-text{
	@include font(normal, normal, rem(14px), 1.57, $color-dark-grey);
	margin: -2px 0 12px;
  }

.convert-field{
  display: flex;
  align-items: center;
  position: relative;
  height: 28px;
  padding: 4px 25px 4px 15px;
  border: 1px dashed transparent;
  transition: all 0.2s ease 0s;
  position: relative;

  &__label{
    @include font(normal, normal, rem(14px), 1.2, $color-grey);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .tabs-page_small{
    margin: 0 7px;

    .tabs-page__item{
      height: rem(20px);
      min-width: 88px;
      font-size: rem(12px);
      font-weight: normal;
      line-height: rem(18px);
      padding: 0 10px;
    }
  }

  &__close{
    display: none;
    height: 8px;
    width: 8px;
    position: absolute;
    @include top-center;
    right: 12px;

    .icon{
      vertical-align: top;
      width: 100%;
      height: 100%;
      fill: $color-dark-blue;
    }
  }

  &__edit{
    display: none;
    width: 16px;
    height: 16px;
    position: absolute;
    @include top-center;
    right: 12px;

    .icon{
      vertical-align: top;
      width: 16px;
      height: 16px;
    }
  }

  &:hover{border-color: $color-light-grey}

  &:hover &__close,
  &:hover &__edit,
  &.error &__close,
  &.error &__edit{
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  &.error{
    border: 1px solid $color-red;
    padding-right: 60px;
  }

  &__error{
    width: 19px;
    height: 16px;
    position: absolute;
    @include top-center;
    right: 34px;
    z-index: 10;

    .icon{vertical-align: top;}

    .tooltip{
      display: none;
      max-width: none;
      margin: 0 0 0 8px;
      position: absolute;
      @include top-center;
      left: 100%;
      z-index: 10;
    }
  }

  &__error:hover .tooltip{display: inline-block;}

  &:hover .convert-field-popup{display: inline-table;}
}

.convert-field-popup{
  display: none;
  max-width: 320px;
  background: #fff;
  margin: 0 0 8px 0;
  position: relative;
  @include font(normal, normal, rem(12px), 1.57, $color-dark-grey);
  border-radius: 4px;
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;

  &__content{
    display: inline-block;
    padding: 4px 8px;
    box-shadow: 0 -9px 21px 0 rgba(128, 152, 213, 0.15), -10px 9px 21px 0 rgba(128, 152, 213, 0.15);
  }

  &__accent{color: $color-red;}

  &::after{
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 9px 0 9px;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
}

  @media (max-width: 1899px) {
	.admin-table{
	  // &__name{width: 340px;}
	  tr th.admin-table__item_select{width: 215px;}
    tr th.admin-table__item-select-big{width: 300px;}
    tr th.admin-table__item_order{width: 106px;}
	  tr th.admin-table__item_name-edit{width: 30%}
	  tr th.admin-table__item_data-sample{width: 25%;}
    tr th.admin-table__item_usage{width: 200px;}
    tr th.admin-table__item_usage &__title{width: 190px;}

	  // .tooltip{width: 340px;}
	  &__item_menu{width: 30px;}
	  &__item,
	  &__head &__item{
		padding-left: 10px;
		padding-right: 10px;
	  }

	  &__item:first-child{padding-left: 25px;}
	  &__item:last-child{padding-right: 25px;}
	  &__row &__item:last-child.admin-table__item_menu{padding-right: 5px;}

    &__error-icon{margin-right: -9px;}

    & &__item_drag {
      padding-left: 0;
      padding-right: 0;
    }
	}

	// .map-categories{
	//  .admin-table{
	//    &__name-edit,
	//    &__item .select-wrap{
	//      width: 424px;
	//    }

	//    &__data-sample{
	//      width: 165px;
	//    }
	//  }
	// }
  }

  @media (max-width: 1440px) {
	.perm-wrap-key{
	  .admin-table{
      &__name{width: calc(100% - 20px);}
      &__name-wrap .icon{margin-right: 20px};
	  }
	}

    .admin-table{
      & &__log-day{width: 110px;}
    }
  }

  @media (max-width: 1366px) {
	.admin-table{
	  tr th.admin-table__item_check{width: 50px;}
	  tr th.admin-table__item_name-edit{width: 260px}
	  tr th.admin-table__item_data-sample{width: 195px;}

    & &__perm-40{width: 375px;}
    & &__perm-30{width: 262px;}
    & &__perm-20{width: 195px;}
    & &__item_menu{width: 60px;}
    & &__status{width: 80px;}
    & &__log{width: 110px;}
    & &__state{width: 80px;}
    & &__menu{width: 60px;}
    & &__load{width: 65px;}
    & &__source{width: 100px;}
    & &__date{width: 100px;}
    & &__time{width: 100px;}
    & &__modif{width: 150px;}
    & &__use{width: 90px;}
    & &__progress{width: 120px;}
    & &__info{width: 50px;}
    & &__type{width: 80px;}
    & &__switch{width: 80px;}
	}

	.perm-wrap-key{
	  .admin-table{
		&__name{width: calc(100% - 40px);}
		&__name-wrap .icon{margin-right: 40px};
	  }
	}
  }

  // @media (max-width: 1279px) {
  //  .perm-wrap-key{
  //    .admin-table{
  //      &__name{width: 100%;}
  //      &__name-wrap .icon{margin-right: 10px};
  //    }
  //  }
  // }

@media (max-width: 1366px) {
  .admin-table{
    &__item_center_xxl{text-align: center;}
  }
}

  @media (max-width: 1199px) {
	.admin-table{
	  // &__name{width: 240px;}
	  tr th.admin-table__item_name-edit{width: 240px}
	  tr th.admin-table__item_data-sample{width: 160px;}

    &__item_center_xl{text-align: center;}
	}

	//.table-file-info{
	//  width: 300px;
	//  // &__name{max-width: 220px;}
	//}

	// .map-categories{
	//  .admin-table{
	//    &__name-edit,
	//    &__item .select-wrap{
	//      width: 315px;
	//    }
	//  }
	// }

	.perm-wrap-key{
	  .admin-table{
		&__name{width: 100%;}
		&__name-wrap .icon{margin-right: 0};
	  }
	}

	.file-mapping .admin-table tr th.admin-table__item_select{
	  width: 280px;
	}

    .admin-table-info{max-width: 75%;}
  }

  @media (max-width: 991px) {
	.admin-table{
	  // &__name, &__data-sample, &__name-edit{width: 140px;}
	  tr th.admin-table__item_name-edit, tr th.admin-table__item_data-sample{width: 140px;}
	}

	// .map-categories{
	//  .admin-table{
	//    &__name-edit,
	//    &__item .select-wrap{
	//      width: 310px;
	//    }
	//  }
	// }

	.open-sidebar .file-mapping .admin-table tr th.admin-table__item_select,
	.open-sidebar .file-mapping .admin-table tr td:nth-child(4){
	  display: none!important;
	}

    .admin-table{
      & &__perm-40{width: 325px;}
    }
  }

  @media (max-width: 767px) {
	.admin-table-wrap{
	  &__action{
		flex-wrap: wrap;
	  }

	  .form-search{
		margin-left: 0;
		width: 100%;
		margin-bottom: 23px;
	  }
	}

	.admin-table{
	  &__item:first-child{
		padding-left: 15px;
	  }

	  td,
	  th{
		width: auto;
	  }

	  &,
	  &__head,
	  &__row,
	  thead,
	  tbody,
	  tr{
		display: block;
	  }

	  &__row{
		position: relative;
	  }

	  &__item,
	  td{
		display: flex;
		align-items: center;
		min-height: rem(38px);
	  }

	  &__head &__item:last-child{
		display: none;
	  }

	  &__item:last-child{
		padding: 0;
		position: absolute;
		@include top-center;
		right: 5px;
		z-index: 10;
	  }

	  tr th.admin-table__item_name-edit, tr th.admin-table__item_data-sample{width: 100%;}

	  &__name,
	  &__data-sample,
	  &__name-edit{
		width: calc(100% - 30px);
	  }

    & &__perm-40,
    & &__perm-30,
    & &__perm-20{
      width: 100%;
    }

    & &__head-name{width: 100%;}

	  &__name:hover .tooltip,
	  &__name .tooltip.active{
		display: none;
	  }

	  .file-mapping &__name-edit{width: 100%;}

    &__more{width: 100%;}

    & &__item_menu{width: auto;}
    &__name-info{width: calc(100% - 30px)}

    &__name-ic .tooltip{
      left: auto;
      right: 100%;
      margin-left: 4px;
      margin-right: 8px;
    }

    &__name-ic .tooltip_left::after{
      border-width: 6px 0 6px 5px;
      border-color: transparent transparent transparent $color-dark-blue;
      right: auto;
      left: 100%;
    }

    &_mob-table{display: table;}
    &_mob-table thead{display: table-header-group;}
    &_mob-table tbody{display: table-row-group;}

    &_mob-table &__row,
    &_mob-table &__head,
    &_mob-table tr{
      display: table-row;
    }

    &_mob-table td,
    &_mob-table th,
    &_mob-table &__item{
      display: table-cell;
    }
	}

	.admin-table-popup{
	  &.active,
	  &:hover{
		display: none;
	  }
	}

	.admin-table-info{
	  width: calc(100% + 4px);
	  border-left: 0;
	  z-index: 11;
    padding: 4px 15px 15px;

    &__top{height: 33px;}

	  &__name{
		display: block;
		width: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	  }

	  &__main{display: block;}

	  &__col:first-child,
	  &__col:last-child{
		width: 100%;
	  }

	  &__col:not(:last-child){
		margin-right: 0;
	  }
	}

	.edit-categories{
	  .admin-table{
		th, td{width: 100%;}
	  }
	}

	.admin-table-detail-wrap{
	  &__table{width: 40%;}

	  .admin-table{
		&__name{width: 100%;}
		&__head .admin-table__item{height: 0; min-height: 0;}
	  }
	}

	.admin-table-detail{width: 60%;}

	.admin-table-detail-wrap{
	  .admin-table{
		&{display: table;}
		// &__head,
		// &__row,
		// thead,
		// tbody,
		// tr{
		//  display: block;
		// }

		&__row{position: static;}
		&__head .admin-table__item:last-child{display: block;}

		&__item:last-child{
		  padding-right: 15px;
		  position: static;
		  transform: none;
		}

		// &__name,
		// &__data-sample,
		// &__name-edit{
		//  width: calc(100% - 30px);
		// }
	  }
	}
  }
