.ias-accordion-group {
  display: block;
  max-width: $accordion-group-max-width;

  > .ias-accordion-link {
    cursor: pointer;
    margin-bottom: $accordion-link-margin-bottom;
    text-align: right;
  }

  > .ias-accordion {
    margin-bottom: $accordion-margin-bottom;
    outline: none;

    &.ias-open {
      > .ias-accordion-header {
        border-color: $accordion-border-color-open $accordion-border-color-open $accordion-header-bg-color;
        border-radius: $border-radius $border-radius 0 0;
      }

      > .ias-accordion-content {
        border-color: $accordion-border-color-open;
        display: block;
      }
    }

    > .ias-accordion-header {
      align-items: center;
      background-color: $accordion-header-bg-color;
      border: $accordion-border-width solid $accordion-header-bg-color;
      border-radius: $border-radius;
      color: $accordion-header-color;
      display: flex;
      height: $accordion-header-height;
      padding: 0 $accordion-padding;
      outline: none;

      &:hover {
        cursor: pointer;
        background-color: $accordion-header-bg-color-hover;
        border-color: $accordion-header-border-color-hover;
      }

      .ias-icon {
        margin-left: $accordion-icon-spacing;

        &.ias-accordion-icon-toggle {
          color: $accordion-icon-toggle-color;
          font-size: $accordion-icon-toggle-size;
        }
      }
    }

    > .ias-accordion-content {
      border: $accordion-border-width solid;
      border-radius: 0 0 $border-radius $border-radius;
      border-top-width: 0;
      display: none;
      padding: $accordion-padding;
    }

    .ias-accordion-title {
      align-items: center;
      display: flex;
      flex-direction: row;
    }
  }
}

[dir="rtl"] {
  .ias-accordion-group {
    > .ias-accordion-link {
      text-align: left;
    }

    > .ias-accordion {
      > .ias-accordion-header {
        > .ias-icon {
          margin-left: 0;
          margin-right: $accordion-icon-spacing;
        }
      }
    }
  }
}