@import '../core/style/variables';
@import '../core/style/elevation';
@import '../../cdk/a11y/a11y';

.mat-expansion-panel {
  $border-radius: 4px;

  box-sizing: content-box;
  display: block;
  margin: 0;
  border-radius: $border-radius;
  overflow: hidden;
  transition: margin 225ms $mat-fast-out-slow-in-timing-function,
      mat-elevation-transition-property-value();

  .mat-accordion & {
    &:not(.mat-expanded), &:not(.mat-expansion-panel-spacing) {
      border-radius: 0;
    }

    &:first-of-type {
      border-top-right-radius: $border-radius;
      border-top-left-radius: $border-radius;
    }

    &:last-of-type {
      border-bottom-right-radius: $border-radius;
      border-bottom-left-radius: $border-radius;
    }
  }

  @include cdk-high-contrast {
    outline: solid 1px;
  }

  &.ng-animate-disabled,
  .ng-animate-disabled &,
  &._mat-animation-noopable {
    transition: none;
  }
}

.mat-expansion-panel-content {
  display: flex;
  flex-direction: column;
  overflow: visible;
}

.mat-expansion-panel-body {
  padding: 0 24px 16px;
}

.mat-expansion-panel-spacing {
  margin: 16px 0;

  .mat-accordion > &:first-child,
  .mat-accordion > *:first-child:not(.mat-expansion-panel) & {
    margin-top: 0;
  }

  .mat-accordion > &:last-child,
  .mat-accordion > *:last-child:not(.mat-expansion-panel) & {
    margin-bottom: 0;
  }
}

.mat-action-row {
  border-top-style: solid;
  border-top-width: 1px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding: 16px 8px 16px 24px;

  button.mat-button-base {
    margin-left: 8px;

    [dir='rtl'] & {
      margin-left: 0;
      margin-right: 8px;
    }
  }
}