
/**
 * /src/css/icons.css
 * 
 */

/**
 * Colors
 * 
 */
:host .icon:not(img) {
    background-color: #000000;
}
:host .icon:not(img).icon-black {
    background-color: #000000;
}

/**
 * Properties
 * 
 */
:host .icon:not(img).original {
    background-color: transparent;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}
:host .icon:not(img):not(.original) {
    -webkit-mask-size: contain;
            mask-size: contain;
    -webkit-mask-position: center center;
            mask-position: center center;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
}

/**
 * Icons (general)
 * 
 */
:host .icon:not(img).icon-plus.original {
    background-image: var(--annex-search-icon-plus);
}
:host .icon:not(img).icon-plus:not(.original) {
    -webkit-mask-image: var(--annex-search-icon-plus);
    mask-image: var(--annex-search-icon-plus);
}
:host .icon:not(img).icon-plus-circle.original {
    background-image: var(--annex-search-icon-plus-circle);
}
:host .icon:not(img).icon-plus-circle:not(.original) {
    -webkit-mask-image: var(--annex-search-icon-plus-circle);
    mask-image: var(--annex-search-icon-plus-circle);
}
:host .icon:not(img).icon-spinner.original {
    background-image: var(--annex-search-icon-spinner);
}
:host .icon:not(img).icon-spinner:not(.original) {
    -webkit-mask-image: var(--annex-search-icon-spinner);
    mask-image: var(--annex-search-icon-spinner);
}
