@import "dxHelpers/reset";
@import "dxHelpers/text";
@import "dxHelpers/button";

:host {
    --dx-c-image-and-label-text-color: var(--dx-g-text-label-color);
}

.container {
    display: flex;
    align-items: center;
}

img {
    border-radius: 9999px;
    margin-right: var(--dx-g-spacing-sm);
}

a img {
    transition: var(--dx-g-transition-filter-2x);
}

a span {
    transition: var(--dx-g-transition-hue-1x);
}

a:hover img {
    filter: brightness(90%);
}

a:hover span {
    color: var(--dx-g-button-heading-color-hover);
}

img.size-small {
    width: var(--dx-g-spacing-lg);
}

img.size-medium {
    width: 42px;
}

img.size-large {
    width: 52px;
}

.dx-text-label-1-dark {
    color: var(--dx-c-image-and-label-text-color);
    text-align: left;
}