@import "../../Input/style/index.scss";
@import "../../Form/style/common.scss";

.input-match-wrapper {
	white-space: nowrap;
	align-items: center;
	max-width: 200px;
	font-size: 14px;
	overflow: hidden;
	display: inline-flex;
  cursor: pointer;
  color: #3D3E52;
	.dropdown {
		max-width: 100%;
		width: unset;
    &:hover, &.open {
      background: #F1F1F7;
			.drop-down-icon {
				stroke: $primaryBlueColor;
			}
    }
	}
  .delete-icon {
    fill: #A4A4AE;
    width: 14px;
    height: 14px;
    margin-left: 5px;
    &:hover {
      fill: #6D6D75;
    }
  }
	.dropdown-value {
		display: flex;
		padding-left: 5px;
		align-items: center;
		cursor: pointer;
		overflow: hidden;
		.input-val {
			color: $primaryBlueColor;
			font-size: 14px;
			max-width: 100%;
			padding: 3px 5px;
			border-radius: 2px;
			overflow: hidden;
			text-overflow: ellipsis;
		}
    .drop-down-icon {
      flex-shrink: 0;
      fill: none;
      stroke: #979797;
      width: 10px;
      margin-right: 5px;
    }
	}
}
.input-match-overlay {
	padding: 15px;
	font-size: 12px;
	width: 310px;
	.textarea {
		padding: 4px;
		font-size: 12px;
		height: 90px;
		background: #fafafa;
	}
	.radio-label {
		display: inline-flex;
		align-items: center;
	}
	.oper {
	 display: flex;
	 justify-content: space-between;
	 .btn-link {
		 font-size: 12px;
		 padding: 0;
		}
	}
}
