如何css样式angular2的NG2-完成器插件输入框和下拉颜色？

Question

我使用的是angular2/4的Ng2-Completer插件，组件的样式有问题。我想把背景下拉菜单改成“红色”，把输入框改成蓝色。

下面是我的清单：https://plnkr.co/edit/sVnfpBiEb5jBdtul4ls9?p=preview

我尝试包含以下CSS，但它似乎不会影响任何东西：

    .completer-row {
        display: inherit;
        background:blue;
    }

    .completer-selected-row {
        background-color: lightblue;
        color: yellow;
    }

    .completer-row p {
        position: relative;
        top: 50%;
        transform: translateY(50%);
    }

    .completer-dropdown-holder {
        position: absolute;
        background: red;
    }

    .customid {
    background:blue;
    }

我的组件：

    import { Component } from '@angular/core';
    import { CompleterService, CompleterData } from 'ng2-completer';
    import {Observable} from 'rxjs/Observable';
    import 'rxjs/Rx';

    @Component({
      selector: 'my-app',
  styleUrls: [
    './app.component.css'
  ],
      template: `<h1>Search color</h1>
                <ng2-completer id="customid" [(ngModel)]="searchStr" [datasource]="searchData" [minSearchLength]="0" [clearSelected]="true" (selected)="onSelected($event)"></ng2-completer>
                <p>Selected: {{selectedColor}}</p>
                `
    })
    export class AppComponent { 
      protected searchStr: string;
      protected dataService: CompleterData;
      protected selectedColor: string;
      protected searchData = ['red', 'green', 'blue', 'cyan', 'magenta', 'yellow', 'black'];

      protected onSelected(item: CompleterItem) {
        this.selectedColor = item? item.title: "";
      }
    }