@use "sass:map";
@use '~@angular/material' as mat;

@import "../../../common/base-styles.theme";

@mixin ql-sidebar-group-theme($theme, $typo, $overrides: ()) {
  $config: mat.get-color-config($theme);
  $primary: map-get($config, primary);
  $ascent: map-get($config, accent);
  $warn: map-get($config, warn);

  $content-values: (

  );

  $content-values: map.merge($content-values, $overrides);


  ql-sidebar-group {
    color: mat.get-color-from-palette($primary);
    fill: mat.get-color-from-palette($primary);
    @include extract-style-map($content-values);

    &.has-icon {
      .group-row {
        max-height: map.get($content-values, row-height);
      }
    }

    .text {
      @if ($typo != null) {
        font-size: mat.font-size($typo, body-1);
        font-family: mat.font-family($typo);
      }
    }

    .group-content {
      background-color: var(--group-open-background-color);

      ql-sidebar-item {
        @if ($typo != null) {
          font-size: mat.font-size($typo, caption);
          font-family: mat.font-family($typo);
        }
      }
    }

  }

}
