@mixin rds-api-snippets-theme($theme) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, primary);
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  rds-api-snippets-dialog {
    // Give the active tab the same styles as a focused tab
    .mat-tab-group {
      &.mat-primary {
        @include _rds-api-snippets-active-tab($primary);
      }
      &.mat-accent {
        @include _rds-api-snippets-active-tab($accent);
      }
    }

    .rds-snippets-link-button {
      @include _rds-api-snippets-outline-button($foreground);
    }
  }

  rds-code-snippet {
    .rds-code-snippet-container,
    .rds-code-snippet-copy-button {
      background-color: mat-color($background, background);
      color: mat-color($foreground, base);
    }

    .rds-code-snippet-copy-button {
      @include _rds-api-snippets-outline-button($foreground);
    }

    .rds-snippet-secondary-color {
      color: mat-color($foreground, secondary-text);
    }
  }

  rds-versioned-code-snippets {
    .mat-action-list {
      .mat-list-item.active {
        background-color: mat-color($background, app-bar, 0.8);
        border-right-color: mat-color($primary);
      }
      .mat-list-item:focus,
      .mat-list-item:hover {
        background-color: mat-color($background, app-bar, 0.6);
      }
    }
  }
}

@mixin _rds-api-snippets-active-tab($color) {
  .mat-tab-label-active {
    opacity: 1;
    background-color: mat-color($color, lighter, 0.3);
  }
}

@mixin _rds-api-snippets-outline-button($foreground) {
  border-color: mat-color($foreground, divider);
  transition: border-color 300ms cubic-bezier(0, 0, 0.2, 1);
  &:hover {
    border-color: mat-color($foreground, secondary-text);
  }
}

@mixin rds-app-footer-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);
  $drawer-background-color: mat-color($background, dialog);
  $drawer-background-color-zero: mat-color($background, dialog, 0);
  rds-app-footer {
    footer {
      background: linear-gradient(to right, $drawer-background-color, $drawer-background-color-zero);
    }
    a,
    button {
      color: mat-color($foreground, text);
    }
  }
}

@mixin rds-app-toolbar-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);
  $drawer-background-color: mat-color($background, dialog);
  rds-app-toolbar {
    .mat-toolbar {
      background-color: $drawer-background-color;
      color: mat-color($foreground, text);
    }
  }
}

@mixin rds-catalog-header-theme($theme) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);

  rds-catalog-header.mat-primary {
    @include _rds-catalog-header-palette($primary);
  }
  rds-catalog-header.mat-accent {
    @include _rds-catalog-header-palette($accent);
  }
}

@mixin _rds-catalog-header-palette($themePalette) {
  $headerStartColor: mat-color($themePalette, default);
  $headerEndColor: mat-color($themePalette, default, 0);
  background-image: linear-gradient(to right, #{$headerStartColor} 0%, #{$headerEndColor} 100%);
}

@mixin rds-chips-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  $slider-off: mat-color($foreground, slider-off);
  $disabled-button: mat-color($background, disabled-button);

  .mat-chip.rds-chip,
  .rds-chip {
    background-color: $disabled-button;
    border-color: $slider-off;
    color: mat-color($foreground, text);
  }
}

@mixin rds-data-dictionary-table-theme($theme) {
  $is-dark-theme: map-get($theme, is-dark);
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);
  $ghostBackground: if($is-dark-theme, map_get($mat-grey, 800), map_get($mat-grey, 100));

  rds-data-dictionary-table {
    .mat-table {
      &:not(.ghost) tbody tr:hover,
      &.ghost td.mat-cell::after,
      &.ghost .selection-cell.mat-header-cell::after,
      // header cell being resized
+      th.mat-header-cell.resizing, {
        background-color: $ghostBackground;
      }
      th.mat-header-cell {
        background-color: mat-color($background, background);

        &.resizing {
          border-color: mat-color($foreground, text);
        }
        &.resizing .drag-handle,
        &:hover .drag-handle {
          background-color: mat-color($foreground, text);
        }
      }
    }
  }
}

@mixin rds-data-product-banner-theme($theme) {
  $background: map-get($theme, background);
  rds-data-product-banner {
    header {
      background-color: mat-color($primary, default);
      color: mat-color($primary, default-contrast);
      p a {
        color: mat-color($primary, default-contrast);
      }
    }
  }
}

@mixin rds-data-product-selection-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  $app-bar: mat-color($background, app-bar, 0.8);
  $secondary-text: mat-color($foreground, secondary-text);
  $is-dark-theme: map-get($theme, is-dark);

  rds-data-product-selection {
    .data-products-heading,
    .item-id,
    .rds-dp-description,
    .rds-dp-title {
      color: $secondary-text;
    }
    .documentation-divider::after {
      background-color: mat-color($foreground, divider);
    }
    .mat-divider {
      border-top-color: $app-bar;
    }
    .mat-list .mat-list-item.active,
    .selected-catalog-section {
      background: $app-bar;
    }

    .selected-catalog-section p a {
      color: mat-color($foreground, text);
    }

    .mat-radio-button + .documentation-container .expand-button {
      .mat-icon {
        color: mat-color($foreground, icon);
      }
      &:focus .mat-icon {
        background-color: mat-color($background, hover);
      }
      &:hover {
        background-color: mat-color($background, hover);
      }
    }
  }
}

@mixin rds-button-gradient($palette) {
  /** Old browsers */
  background: mat-color($palette, default);
  color: mat-contrast($palette, 300);
  /* FF3.6-15 */
  background: -moz-linear-gradient(-45deg, mat-color($palette, default), mat-color($palette, 200, 0.87));
  /* Chrome10-25, Safari5.1.6 */
  background: -webkit-linear-gradient(-45deg, mat-color($palette, default), mat-color($palette, 200, 0.87) 100%);
  /* W3C, IE10, FF16, Chrome26, Opera12, Safari7 */
  background-image: linear-gradient(135deg, mat-color($palette, default), mat-color($palette, 200, 0.87) 100%);
  /* IE6-9 fallback on horizontal gradient */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=mat-color($palette, default), endColorstr=mat-color($palette, 200, .87), GradientType=1);
}


@mixin rds-dimension-selection-theme($theme) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);
  $background: map-get($theme, background);

  rds-dimension-selection {
    .rds-selection-info-icon::after {
      background: mat-color($background, background);
    }
    mtna-extended-fab .mat-raised-button:not([disabled]) {
      &.mat-primary {
        @include rds-button-gradient($primary);
      }
      &.mat-accent {
        @include rds-button-gradient($accent);
      }
    }
  }

  /* Styles for the select's virtual scroll */
  $itemSize: 48px;

  .rds-dimension-virtual-scroll-panel.mat-select-panel {
    /* Since the virtual scroll panel is now the scroll container, */
    /* we have to stop the scroll behavior on mat-select-panel */
    max-height: none;
    overflow: hidden;
    max-width: unset;
    cdk-virtual-scroll-viewport {
      height: $itemSize * 7;
      min-width: 400px;
      &.no-results {
        height: 0px;
      }
    }
  }
}

@mixin rds-filter-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  $text: mat-color($foreground, text);
  $secondary-text: mat-color($foreground, secondary-text);
  $disabled-text: mat-color($foreground, disabled-text);

  rds-filter {
    .rds-clear-selected-codes,
    .bracket-effect::before,
    .bracket-effect::after {
      color: $text;
    }
  }
  rds-filter-select {
    .filter-select-container {
      .no-variable {
        color: $disabled-text;
      }
      .rds-variable-button {
        color: map-get($foreground, secondary-text);
      }
    }
    .rds-selection-info-icon::after {
      background: mat-color($background, background);
    }
  }

  rds-filter-dialog {
    .rds-filter-dialog-subtitle,
    .mat-dialog-content .codes-selected {
      color: $secondary-text;
    }
  }
}

@mixin rds-measure-select-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  rds-measure-select {
    .rds-measure-select-container {
      .rds-selection-info-icon::after {
        background: mat-color($background, background);
      }
    }
  }
}

@mixin rds-bundle-selection-list-theme($theme) {
  $foreground: map-get($theme, foreground);
  $secondary-text: mat-color($foreground, secondary-text);

  rds-bundle-selection-list {
    p.mat-line {
      color: $secondary-text;
    }
  }
}

@mixin rds-format-selection-list-theme($theme) {
  $foreground: map-get($theme, foreground);
  $background: map-get($theme, background);
  $secondary-text: mat-color($foreground, secondary-text);
  $icon: mat-color($foreground, icon);

  rds-format-selection-list {
    p.mat-line {
      color: $secondary-text;
    }
    .rds-format-count::after {
      color: $icon;
      border-color: $icon;
      background-color: mat-color($background, card);
    }
  }
}

@mixin rds-packaging-theme($theme, $success) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);
  rds-packaging-option {
    .popover-button {
      &::after {
        background-color: mat-color($background, background);
      }
      &.disabled {
        color: mat-color($foreground, disabled-text);
      }
    }
  }
  rds-packaging-option.mat-primary {
    @include _rds-packaging-option-palette($primary);
  }
  rds-packaging-option.mat-accent {
    @include _rds-packaging-option-palette($accent);
  }
  rds-packaging-option.selected {
    border-color: mat-color($success, default);
    header {
      color: mat-color($success, default-contrast);
      background-color: mat-color($success, default);
      .rds-selected-icon {
        color: mat-color($success, default-contrast);
      }
    }
  }
  rds-packaging-processes.mat-primary {
    @include _rds-packaging-processes-palette($primary);
  }
  rds-packaging-processes.mat-accent {
    @include _rds-packaging-processes-palette($accent);
  }
  rds-packaging-processes {
    .mat-progress-spinner.success {
      circle {
        stroke: mat-color($success, default);
      }
    }
  }
}

@mixin _rds-packaging-option-palette($themeColor) {
  border-color: mat-color($themeColor, default);
  header {
    color: mat-color($themeColor, default-contrast);
    background-color: mat-color($themeColor, default);
  }
}

@mixin _rds-packaging-processes-palette($themeColor) {
  header {
    color: mat-color($themeColor, default-contrast);
    background-color: mat-color($themeColor, default);
  }
}

@mixin rds-select-table-theme($theme) {
  $is-dark-theme: map-get($theme, is-dark);
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);
  $ghostBackground: if($is-dark-theme, map_get($mat-grey, 800), map_get($mat-grey, 200));
  $inspectedBackground: if($is-dark-theme, map_get($mat-grey, 700), map_get($mat-grey, 300));

  rds-select-table {
    .mat-table {
      // hovering over a header cell, not when ghost, not when another cell is being resized
      &:not(.ghost):not(.resize-active) th.mat-header-cell.rds-can-inspect-cell:hover,
      // header cell being resized
      th.mat-header-cell.resizing,
      // ghost elements
      &.ghost th.mat-header-cell::after,
      &.ghost td.mat-cell::after {
        background-color: $ghostBackground;
      }
      th.mat-header-cell {
        background-color: mat-color($background, background);
        &.inspected {
          background-color: $inspectedBackground;
          text-decoration: underline;
        }
        &.resizing {
          border-color: mat-color($foreground, text);
        }
        &.resizing .drag-handle,
        .drag-handle:hover {
          background-color: mat-color($foreground, text);
        }
      }
      td.rds-select-table-locked-column {
        background: mat-color($background, card);
      }
      .rds-select-table-last-locked-column {
        border-right-color: mat-color($foreground, divider);
      }
      rds-select-table-decorators svg {
        fill: mat-color($foreground, icon);
      }
    }
  }
}

@mixin rds-tabulation-display-options-theme($theme) {
  rds-tabulation-display-options {
    .mat-button-toggle-group .mat-button-toggle.mat-button-toggle-appearance-standard:not(.mat-button-toggle-checked) {
      background-color: transparent;
    }
  }
}

@mixin rds-tabulation-sort-options-theme($theme) {
  $foreground: map-get($theme, foreground);
  $background: map-get($theme, background);

  rds-tabulation-sort-options {
    .mat-caption {
      color: mat-color($foreground, text);
    }
    .mat-icon-button:not([disabled]) {
      border-color: mat-color($foreground, divider);
      &:hover {
        background: map-get($background, hover);
      }
    }
  }
}

@mixin rds-tabulation-table-theme($theme, $columnPalette, $rowPalette) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);
  $is-dark-theme: map-get($theme, is-dark);
  rds-tabulation-table {
    table[mat-table] {
      background-color: mat-color($background, background);
    }
  }
  rds-tabulation-table.mat-primary {
    @include _rds-tabulation-table-palette($primary, $accent, $columnPalette, $rowPalette, $foreground, $background, $is-dark-theme);
  }
  rds-tabulation-table.mat-accent {
    @include _rds-tabulation-table-palette($accent, $primary, $columnPalette, $rowPalette, $foreground, $background, $is-dark-theme);
  }
}

@mixin _rds-tabulation-table-palette($primary, $accent, $columnPalette, $rowPalette, $foreground, $background, $is-dark-theme) {
  $backgroundColor: mat-color($background, background);
  $columnColor: mat-color($columnPalette, default);
  $columnContrastColor: mat-color($columnPalette, default-contrast);
  $rowAltColor: if($is-dark-theme, mat-color($rowPalette, 900), mat-color($rowPalette, 50));
  $rowAltContrastColor: if($is-dark-theme, mat-contrast($rowPalette, 900), mat-contrast($rowPalette, 50));
  $rowColor: mat-color($rowPalette, default);
  $rowContrastColor: mat-color($rowPalette, default-contrast);
  $secondaryTextColor: mat-color($foreground, secondary-text);
  table[mat-table] {
    tr {
      &.even {
        td:not(.total-col) {
          &.count-cell,
          &.row-header-cell,
          &.last-row-header-cell {
            background-color: $rowAltColor;
          }
          &.count-cell,
          &.row-header-cell {
            color: if($is-dark-theme, $rowAltContrastColor, $secondaryTextColor);
          }
          &.count-cell.sub-total-cell,
          &.last-row-header-cell {
            color: $rowAltContrastColor;
          }
        }
      }
      &.sub-total {
        td {
          &.count-cell,
          &.last-row-header-cell {
            color: $rowContrastColor;
          }
        }
      }
      &.row-names-column-values-row {
        th:not(.row-dimension-header):not(.total-col) {
          border-bottom-color: $columnColor;
        }
      }
      &.column-names-row {
        th.col-dimension-header {
          background-color: $columnColor;
          color: $columnContrastColor;
        }
      }
      th {
        &.row-dimension-header {
          background-color: $rowColor;
          color: $rowContrastColor;
          &:not(:first-child)::before {
            content: '';
            display: block;
            position: absolute;
            bottom: 0;
            top: 0;
            left: 0;
            width: 1px;
            background-color: $backgroundColor;
          }
        }
        &.mat-header-cell {
          &.total-col {
            @include _totalHeaderCell($accent);
          }
          &.sub-total-cell {
            color: mat-color($foreground, text);
          }
        }
        @include _firstCol($columnColor);
        @include _evenCol($columnColor, $columnContrastColor, $secondaryTextColor, $is-dark-theme);
      }
      td {
        @include _firstCol($columnColor);
        @include _evenCol($columnColor, $columnContrastColor, $secondaryTextColor, $is-dark-theme);
        &.row-header-cell {
          color: $secondaryTextColor;
          &.mat-footer-cell.row-header-cell {
            @include _totalHeaderCell($accent);
          }
        }
        &.mat-cell {
          border-bottom-color: $rowColor;
          &.last-row-header-cell {
            color: mat-color($foreground, text);
          }
        }
      }
    }
    .total-col {
      background-color: if($is-dark-theme, mat-color($accent, default, 0.38), mat-color($accent, default, 0.12));
    }
    tr.sub-total .total-col,
    .row-header-cell.mat-footer-cell,
    .mat-footer-cell {
      background-color: if($is-dark-theme, mat-color($accent, default, 0.38), mat-color($accent, default, 0.12));
      font-weight: 700;
      color: mat-contrast($accent, default);
    }
  }
}

@mixin _evenCol($backgroundColor, $backgroundContrastColor, $secondaryTextColor, $is-dark-theme) {
  &.even-col {
    color: if($is-dark-theme, $backgroundContrastColor, $secondaryTextColor);
    &.sub-total-cell,
    &.mat-footer-cell {
      color: if($is-dark-theme, #fff, #000);
    }
    &::after {
      background-color: if($is-dark-theme, rgba($backgroundColor, 0.38), rgba($backgroundColor, 0.12));
    }
  }
}

@mixin _firstCol($borderColor) {
  &.first-col {
    border-left: 1px solid $borderColor;
  }
  &.last-col {
    border-right: 1px solid $borderColor;
  }
}

@mixin _totalHeaderCell($themeColor) {
  background-color: mat-color($themeColor, default);
  color: mat-color($themeColor, default-contrast);
}

@mixin rds-tabulation-totals-options-theme($theme) {
  $foreground: map-get($theme, foreground);

  rds-tabulation-totals-options .mat-caption {
    color: mat-color($foreground, text);
  }
}

@mixin rds-variable-distribution-theme($theme) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);
  rds-variable-distribution.mat-primary {
    @include _rds-variable-distribution-palette($primary, $accent);
  }
  rds-variable-distribution.mat-accent {
    @include _rds-variable-distribution-palette($accent, $primary);
  }
}

@mixin _rds-variable-distribution-palette($themeColor, $secondaryThemeColor) {
  .rds-vd-line {
    background-color: mat-color($themeColor, default);
  }

  .rds-vd-min > span,
  .rds-vd-max > span {
    color: mat-color($themeColor, default);
  }

  .rds-vd-sdBox,
  .rds-vd-mean-shape {
    border-color: mat-color($secondaryThemeColor, default);
  }
}

@mixin rds-variable-information-theme($theme) {
  $foreground: map-get($theme, foreground);
  $secondary-text: mat-color($foreground, secondary-text);
  rds-variable-information p {
    color: $secondary-text;
    a {
      color: mat-color($foreground, text);
    }
    rds-variable-information-decorators {
      mat-icon {
        border-color: $secondary-text;
      }
    }
  }
}

@mixin rds-variable-list-theme($palette) {
    $activeColor: mat-color($palette, default);
    rds-variable-list {
        .mat-list-base .mat-list-item.active {
            color: $activeColor;
            font-weight: bold;
            background-color: rgba($activeColor, .1);
        }
    }
}

@mixin rds-variable-select-theme($theme) {
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  $disabled-text: mat-color($foreground, disabled-text);

  rds-variable-select {
    .filter-select-container {
      .no-variable {
        color: $disabled-text;
      }
    }
    .rds-selection-info-icon::after {
      background: mat-color($background, background);
    }
  }
}


@mixin rds-theme($theme, $success, $columnPalette, $rowPalette) {
  @include rds-api-snippets-theme($theme);
  @include rds-app-footer-theme($theme);
  @include rds-app-toolbar-theme($theme);
  @include rds-bundle-selection-list-theme($theme);
  @include rds-catalog-header-theme($theme);
  @include rds-chips-theme($theme);
  @include rds-data-dictionary-table-theme($theme);
  @include rds-data-product-banner-theme($theme);
  @include rds-data-product-selection-theme($theme);
  @include rds-dimension-selection-theme($theme);
  @include rds-filter-theme($theme);
  @include rds-format-selection-list-theme($theme);
  @include rds-measure-select-theme($theme);
  @include rds-packaging-theme($theme, $success);
  @include rds-select-table-theme($theme);
  @include rds-tabulation-display-options-theme($theme);
  @include rds-tabulation-sort-options-theme($theme);
  @include rds-tabulation-table-theme($theme, $columnPalette, $rowPalette);
  @include rds-tabulation-totals-options-theme($theme);
  @include rds-variable-distribution-theme($theme);
  @include rds-variable-information-theme($theme);
  @include rds-variable-list-theme($columnPalette);
  @include rds-variable-select-theme($theme);
}