@use '../abstracts/functions' as fn;
@use '../base/globals' as gb;

i {
  &[class*="icon--"] {
    display: inline-block;
    background-size: cover !important;
  }
}

.icon {
  &--filter {
    width: fn.rem(14px);
    height: fn.rem(14px);
    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMTQnIGhlaWdodD0nMTQnIHZpZXdCb3g9JzAgMCAxNCAxNCcgZmlsbD0nbm9uZScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48cGF0aCBkPSdNMTIuNzkxNyA5LjEyNTc1SDUuNTg0NThNNS41ODQ1OCA5LjEyNTc1QzUuNTg0NTggOS40NjMwMiA1LjQ1MDAyIDkuNzg2NDcgNS4yMTE1NCAxMC4wMjVDNC45NzMwNSAxMC4yNjM0IDQuNjQ5NiAxMC4zOTc0IDQuMzEyMzMgMTAuMzk3NEMzLjk3NTA3IDEwLjM5NzQgMy42NTE2MSAxMC4yNjM0IDMuNDEzMTMgMTAuMDI1QzMuMTc0NjUgOS43ODY0NyAzLjA0MDY3IDkuNDYzMDIgMy4wNDA2NyA5LjEyNTc1TTUuNTg0NTggOS4xMjU3NUM1LjU4NDU4IDguNzg4NDggNS40NTAwMiA4LjQ2NTAzIDUuMjExNTQgOC4yMjY1NUM0Ljk3MzA1IDcuOTg4MDYgNC42NDk2IDcuODU0MDggNC4zMTIzMyA3Ljg1NDA4QzMuOTc1MDcgNy44NTQwOCAzLjY1MTYxIDcuOTg4MDYgMy40MTMxMyA4LjIyNjU1QzMuMTc0NjUgOC40NjUwMyAzLjA0MDY3IDguNzg4NDggMy4wNDA2NyA5LjEyNTc1TTMuMDQwNjcgOS4xMjU3NUgyTTEyLjc5MTcgNS4yNzE2N0gxMC45ODA0TTEwLjk4MDQgNS4yNzE2N0MxMC45ODA0IDUuNDM4NjYgMTAuOTQ2OSA1LjYwNDAzIDEwLjg4MyA1Ljc1ODMxQzEwLjgxOTEgNS45MTI2IDEwLjcyNTUgNi4wNTI3OSAxMC42MDc0IDYuMTcwODdDMTAuNDg5MyA2LjI4ODk2IDEwLjM0OTEgNi4zODI2MyAxMC4xOTQ4IDYuNDQ2NTNDMTAuMDQwNSA2LjUxMDQ0IDkuODc1MTYgNi41NDMzMyA5LjcwODE3IDYuNTQzMzNDOS4zNzA5IDYuNTQzMzMgOS4wNDc0NSA2LjQwOTM1IDguODA4OTYgNi4xNzA4N0M4LjU3MDQ4IDUuOTMyMzkgOC40MzY1IDUuNjA4OTMgOC40MzY1IDUuMjcxNjdNMTAuOTgwNCA1LjI3MTY3QzEwLjk4MDQgNS4xMDQ2NyAxMC45NDY5IDQuOTM5MzEgMTAuODgzIDQuNzg1MDJDMTAuODE5MSA0LjYzMDc0IDEwLjcyNTUgNC40OTA1NSAxMC42MDc0IDQuMzcyNDZDMTAuNDg5MyA0LjI1NDM4IDEwLjM0OTEgNC4xNjA3MSAxMC4xOTQ4IDQuMDk2OEMxMC4wNDA1IDQuMDMyODkgOS44NzUxNiA0IDkuNzA4MTcgNEM5LjM3MDkgNCA5LjA0NzQ1IDQuMTMzOTggOC44MDg5NiA0LjM3MjQ2QzguNTcwNDggNC42MTA5NSA4LjQzNjUgNC45MzQ0IDguNDM2NSA1LjI3MTY3TTguNDM2NSA1LjI3MTY3SDInIHN0cm9rZT0nIzg1ODU4NScgc3Ryb2tlLXdpZHRoPScwLjcnIHN0cm9rZS1taXRlcmxpbWl0PScxMCcgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyAvPjwvc3ZnPg==") center no-repeat;
  }

  &--title {
    width: fn.rem(9px);
    height: fn.rem(9px);
    margin-right: fn.rem(12px);
    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nOScgaGVpZ2h0PSc5JyB2aWV3Qm94PScwIDAgOSA5JyBmaWxsPSdub25lJyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnPjxwYXRoIGQ9J00wLjM5OTk5NCA0LjQwMDAySDEuMzk5OTlDMy4wNTY4NSA0LjQwMDAyIDQuMzk5OTkgMy4wNTY4OCA0LjM5OTk5IDEuNDAwMDJWMC40MDAwMjQnIHN0cm9rZT0nd2hpdGUnIHN0cm9rZS13aWR0aD0nMC44JyBzdHJva2UtbGluZWNhcD0ncm91bmQnIC8+PHBhdGggZD0nTTguMzk5OTkgNC40MDAwMkg3LjM5OTk5QzUuNzQzMTQgNC40MDAwMiA0LjM5OTk5IDUuNzQzMTcgNC4zOTk5OSA3LjQwMDAyVjguNDAwMDInIHN0cm9rZT0nd2hpdGUnIHN0cm9rZS1vcGFjaXR5PScwLjUnIHN0cm9rZS13aWR0aD0nMC44JyBzdHJva2UtbGluZWNhcD0ncm91bmQnIC8+PC9zdmc+") center no-repeat;
  }
}