@import './NotificationDot.less';

.np-avatar-view {
  .np-avatar-view-content {
    color: var(--color-interactive-primary);
  }

  &-interactive {
    cursor: pointer;
    .np-circle {
      background-color: var(--color-background-neutral);
    }
  }

  &-non-interactive {
    .np-circle {
      background-color: transparent;
    }
    .np-avatar-view-content {
      // dismiss broken shadow on Flag component (DS-6309)
      // https://github.com/transferwise/web-art/blob/main/src/flags/Flag.css#L2
      .wds-flag {
        box-shadow: none;
      }
    }
  }
}
