.search-container {
    position: relative;
    width: 60vw;
}

.search-icon {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: url('/dist/img/clear-filter-icon.svg') no-repeat center center;
    background-size: cover;
    color: var(--micro-primary-color) !important;
}

.search-cancel {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: url( '/dist/img/iconmonstr-x-mark-thin.svg' ) no-repeat center center;
    background-size: cover;
    color: var(--micro-primary-color) !important;
}
.right-icon .search-input {
    padding-left: 10px;
}
.left-icon .search-icon,
.left-icon .search-cancel{
    left: 10px !important; 
}
.right-icon .search-icon,
.right-icon .search-cancel { 
    right: 10px !important; 
}