@import '../../../styles/variables';

.linkUrl {
    font-size: $font-size-mini;
    display: block;
    font-family: $font-family-base;

    // TODO: truncate long urls with ellipsis
}

.remove {
    margin: 0;
    padding: 0;
    appearance: none;
    border: 0;
    background: none;
    font-family: $font-family-button;
    font-size: $font-size-h4;
    color: $brand-grey-light;
    line-height: $line-height;
    cursor: pointer;
    margin-left: $spacer / 2;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    top: $spacer / 4;
    right: 0;
    transition: .2s ease-out;

    &:hover,
    &:focus {
        opacity: .7;
    }
}

.details {
    font-size: $font-size-mini;
    font-size: .85rem;
    color: #6e7e93;

    span {
        padding-right: .5rem;
    }
}