// Accordion Block Styles
.wp-block-hb-accordion {
  position: relative;
  margin: 1em 0;

  .wp-block-hb-accordion__section {
    position: relative;

    &.wp-block-hb-accordion__section--active {

      .wp-block-hb-accordion__title {
        border-bottom: none;
        &::before {
          background-image: url('../../img/minus-circle.svg');
        }
      }

      .wp-block-hb-accordion__content {
        max-height: 999px;
        opacity: 1;
      }
    }

    &:first-of-type {
      .wp-block-hb-accordion__title {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
      }
    } 

    &:last-of-type {
      .wp-block-hb-accordion__content {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        border-bottom: 1px solid #f0f2f5;
      }
    }

  }

  .wp-block-hb-accordion__title {
    background: #f0f2f5;
    padding: 1em 1em 1em calc(1em + 20px);
    font-weight: bolder;
    line-height: 1;
    border-bottom: 1px solid #e6e8eb;
    position: relative;

    &:hover {
      cursor: pointer;
    }

    &::before {
      position: absolute;
      top: 50%;
      left: 12px;
      margin-top: -10px;
      background-image: url('../../img/plus-circle.svg');
      background-repeat: no-repeat;
      background-position: center  center;
      background-size: 20px;
      display: block;
      width: 20px;
      height: 20px;
      content: '';
    }
  }

  .wp-block-hb-accordion__content {    
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all .3s ease;

    .wp-block-hb-accordion__contentwrap {
      padding: 1em;
      border: 1px solid #f0f2f5;
    }
  }

  .wp-block-hb-accordion__remove_btn {
    position: absolute;
    display: flex;
    top: 50%;
    right: 20px;
    margin-top: -10px;
    opacity: 0;
    transition: .15s ease-in-out;  
  }
  .wp-block-hb-accordion__add_btn {
    opacity: 0;
    transition: .15s ease-in-out;  
  }

}

.is-selected .wp-block-hb-accordion {

  .wp-block-hb-accordion__remove_btn {
    opacity: 1;
  }
  .wp-block-hb-accordion__add_btn {
    opacity: 1;
  }

}