@use '@angular/material' as mat;
@mixin sidebar-mat($theme) {
  $color-config: mat-get-color-config($theme);
  $primary-color: mat.get-color-from-palette(map-get($color-config, primary));

  app-sidebar,
  app-sidebar-mobile {
    #res-tab-menu {
      background-color: map-get($theme, header);
    }
    #sidebar-container {
      background-color: map-get($theme, sidebar-bg);
    }
    #res-tab-menu .active {
      border-top-color: $primary-color !important;
    }
    #res-tab-menu .active mat-icon {
      color: $primary-color;
    }
    #news-container {
      background-color: map-get($theme, sidebar);
    }
    .news-extension-panel,
    .news-expansion-panel,
    .mat-expansion-panel:hover,
    .mat-expansion-panel {
      background: none; //map-get($theme, sidebar);
    }
    #add-resource-button {
      .mat-mdc-mini-fab {
        /*TODO(mdc-migration): The following rule targets internal classes of button that may no longer apply for the MDC version.*/
        .mat-button-wrapper {
          padding: 0;
        }
      }
    }
    .mat-expansion-panel {
      padding-bottom: 20px;
    }
    .mat-expansion-panel-body {
      padding: 0;
    }
  }
}
