.root {
    fill: var(--uui-icon-btn);

    &:global(.-clickable) {
        &:hover, &:focus {
            fill: var(--uui-icon-btn-hover);
        }

        &:active {
            fill: var(--uui-icon-btn-active);
        }
    }

    &:global(.uui-disabled) {
        fill: var(--uui-icon-btn-disabled);

        &:global(.-clickable) {
            &:hover, &:focus {
                fill: var(--uui-icon-btn-disabled);
            }

            &:active {
                fill: var(--uui-icon-btn-disabled);
            }
        }
    }
}
