.affiliate-field-border-type {
    width: 16px;
    display: block;
    height: 0;
    &.affiliate-field-border-type-solid {
        border-top: 3px solid #8D96A0;
    }
    &.affiliate-field-border-type-dotted {
        border-top: 3px dotted #8D96A0;
    }
    &.affiliate-field-border-type-dashed {
        border-top: 3px dashed #8D96A0;
    }
    &.affiliate-field-border-type-double {
        border-top: 6px double #8D96A0;
    }  
}

.active {
    .affiliate-field-border-type {
        &.affiliate-field-border-type-solid {
            border-top-color: #2184F9;
        }
        &.affiliate-field-border-type-dotted {
            border-top-color: #2184F9;
        }
        &.affiliate-field-border-type-dashed {
            border-top-color: #2184F9;
        }
        &.affiliate-field-border-type-double {
            border-top-color: #2184F9;
        }
    }
}

.affiliate-svg-fill {
    fill: #8D96A0;
}

.affiliate-svg-stroke {
    stroke: #8D96A0;
}
.active {
    .affiliate-svg-fill {
        fill: #2184F9;
    }
    .affiliate-svg-stroke {
        stroke: #2184F9;
    }
}

.affiliate-border-clear {
    font-size: 12px;
    color: #8D96A0;
    &:hover {
        color: #2184F9;
    }
}