@mixin tangential-components-sign_in_panel($theme) {

  $background : map-get($theme, background);
  $foreground : map-get($theme, foreground);
  $appBar: map-get($theme, app-bar);

  tanj-sign-in-panel {
    background-color : mat-color($background, card);
    color            : mat-color($appBar, text);
  }

  tanj-sign-in, tanj-sign-up, tanj-password-reset {

    .tanj-drop-shadow {
      border-radius : inherit;
      box-shadow    : 0 2em 4em 0 rgba(0, 0, 0, 0.19);

      font-size     : 16px;
      min-width     : 22em;
      max-height    : 30em;
      min-height    : 25em;

    }

    .tanj-sign-in-panel-body {
      padding-top : 0;
    }

    .tanj-sign-in-panel-header {
      color            : mat-color($appBar, text);
      background : mat-color($appBar, background);
      padding    : .75em 2em 1.5em 1em;
      a, a:visited, a:hover, a:active {
        color            : mat-color($appBar, link);
      }
    }

    .tanj-header-text {
      display       : inline-block;
      font-size     : 150%;
      font-weight   : bold;
      margin-bottom : .25em;
    }

    .tanj-sub-header-text {

    }

    .tanj-sign-in-panel-content {
      padding : 1em 2em 1em 2em;
    }

    .tanj-sign-in-panel-lede-text {
      font-size   : 125%;
      font-weight : bold;
      margin      : .25em 0 1em 0;
    }

    .tanj-forgot-password-link {
      margin-bottom : 1.0em;
      font-size     : smaller;
    }

    .tanj-sign-in-panel-field {
      max-height : 3.5em;
    }

    .tanj-remember-me {
      margin-top : .5em;
    }
    .actionFailed {
      color   : red;
      padding : .75em 0 0 0;
      margin  : 0;
    }
  }
}


