/* STATUS */
%avatarMask,
%headerBarStatusMask {
  rect {
    &[mask='url(#svg-mask-status-online)'],
    &[mask='url(#svg-mask-status-online-mobile)'] {
      fill: var(--online-color);
    }
    &[mask='url(#svg-mask-status-idle)']{
      fill: var(--idle-color);
    }
    &[mask='url(#svg-mask-status-dnd)'] {
      fill: var(--dnd-color);
    }
    &[mask='url(#svg-mask-status-streaming)'] {
      fill: var(--streaming-color);
    }
    &[mask='url(#svg-mask-status-offline)'] {
      fill: var(--offline-color);
    }
  }
}