//
// CivicTheme Fieldset component styles.
//

.ct-fieldset {
  $root: &;

  border: none;
  padding: ct-spacing(2) 0;

  legend {
    float: left;
    width: 100%;
    padding: 0;

    & + * {
      clear: left;
    }
  }

  &__wrapper {
    & > *:not(:last-child) {
      margin-bottom: ct-spacing(2);
    }
  }

  &__fields {
    & > .ct-field:not(:last-child) {
      margin-bottom: ct-spacing(4);
    }
  }

  #{$root} {
    margin-top: ct-spacing(4);
    border-left: solid var(--ct-fieldset-stripe-width);
    padding-left: calc(ct-spacing(3) - var(--ct-fieldset-stripe-width));
  }

  @include ct-component-theme($root) using($root, $theme) {
    .ct-fieldset {
      @include ct-component-property($root, $theme, stripe, border-color);
    }
  }
}
