@use '@angular/material' as mat;
@mixin sc-inner-layout-theme($theme) {
  $foreground: map-get($theme, foreground);
  $background: map-get($theme, background);

  //* Inner layouts (for dialogs and cards)
  //*
  //* Dividing content

  .inner-layout {
    &__main,
    &__sidebar-left,
    &__sidebar-right,
    &__left,
    &__middle,
    &__right {
      border-color: mat.get-color-from-palette($foreground, divider) !important;
    }

    &__section-heading {
      border-color: map-get($foreground, divider);
    }

    //*
    //* Card in Card
    //*

    &__card {
      border-color: mat.get-color-from-palette($foreground, divider);
      background-color: mat.get-color-from-palette($background, hover);
    }
  }

  //*
  //* Repeater construct
  //*

  .repeater {
    &__section-heading {
      border-color: map-get($foreground, divider);
    }

    &--action-block,
    &--action-flat-block {
      .repeater__action {
        .mat-button {
          background-color: map-get($background, card) !important;
        }
      }
    }

    &--action-flat-block {
      .repeater__action {
        border-color: map-get($foreground, divider);
      }
    }
  }
}