form.formtastic fieldset > ol > li.radio fieldset,
form.formtastic fieldset > ol > li fieldset {

  .FeatureAccessList {
    margin-top: 2em;

    &--noServicePermissionsGranted {
      .FeatureAccessList-item.FeatureAccessList-item--monitoring::after,
      .FeatureAccessList-item.FeatureAccessList-item--partners::after,
      .FeatureAccessList-item.FeatureAccessList-item--plans::after,
      .FeatureAccessList-item--services {
        display: none;
      }
    }

    &-item {
      position: relative;

      &--partners {
        margin-top: 3em;
      }

      &.is-checked.FeatureAccessList-item--monitoring::after,
      &.is-checked.FeatureAccessList-item--partners::after,
      &.is-checked.FeatureAccessList-item--plans::after {
        border-top-style: solid;
        border-right-style: solid;
      }

      &--monitoring::after,
      &--partners::after,
      &--plans::after {
        position: absolute;
        width: 62.5%;
        margin-top: -0.6em;
        border-top: 1px dotted $border-color;
        display: block;
        content: "";
        margin-left: 32%;
        height: 1000px;
        border-right: 1px dotted $border-color;
        z-index: 0;
        border-top-right-radius: 6px;
      }

      &--monitoring:after {
        margin-left: 11%;
        width: 69%;
      }

      &--plans:after {
        margin-left: 28%;
        width: 31%;
      }

      &--services {
        margin-top: 3em;
        margin-bottom: -0.5em;
      }
    }
  }

  .ServiceAccessList {
    margin-top: 2em;
    position: relative;
    z-index: 1000;

    &--noServicePermissionsGranted {
      display: none;
    }

    &-labelText {
      display: inline-block;
      width: 24%;
      @include ellipsis;
    }

    &-item {
      position: relative;
      margin-bottom: 0 !important;

      &:last-of-type .ServiceAccessList-label{
        margin-bottom: 0;
      }
    }

    &-label {
      width: auto;
      display: block;
      margin-bottom: 1em;
      padding: 1em 2% 1em 2%;
      border: 1px dotted $border-color;
      margin-left: -2%;
      border-radius: 6px;
      background-color: white;

      &.is-checked {
        border: 1px solid $border-color;
        background-color: rgba(white, 0.8)
      }
    }

    &-sections {
      white-space: nowrap;
      text-align: right;
      width: 70%;
      position: absolute;
      top: 12px;
      right: 12px;
    }

    &-sectionItem {
      display: inline;
      margin-left: 8% !important;
      font-weight: normal;

      &:first-child {
        margin-left: 0 !important;
      }
    }
  }
}

.is-hidden {
  display: none !important;
}

.is-unavailable {
   text-decoration: line-through !important;
   color: $light-color;
}


form.formtastic fieldset > ol > li.radio.u-servicePermissionsDisabled fieldset,
form.formtastic fieldset > ol > li.u-servicePermissionsDisabled fieldset {

  .ServiceAccessList {
    display: none;
  }

  .FeatureAccessList {
    &-item {
      &--monitoring::after,
      &--partners::after {
        display: none;
      }

      &--monitoring,
      &--plans {
        margin-top: 0.1em;
        margin-bottom: 0.5em;
      }
    }
  }
}
