.wpj-panel {
   border-radius: $border-radius-base;
   box-shadow: $box-shadow;
}

.wpj-panel-heading,
.wpj-panel-group-heading {
   @include border-top-radius($border-radius-base);

   padding: 8px 15px;
   background: $body-bg;

   > .row {
      display: flex;
      align-items: center;
   }

   p {
      margin: 0;
   }

   &[data-toggle] {
      cursor: pointer;
      transition: background $transition-speed;

      &:hover,
      &:focus,
      &:active {
         background: $lightgray-light;
      }
   }

   .drag-drop-mover-hidden {
      pointer-events: none;
      color: transparent;
   }
}

.wpj-panel-collapse-arrow {
   margin-left: 15px;
   display: inline;

   .bi {
      position: relative;
      top: 2px;

      &::before {
         transition: transform $transition-speed;
      }
   }
}

.wpj-panel-body {
   padding: 20px 15px;
}

.wpj-panel-group {
   border-radius: $border-radius-base;
   box-shadow: $box-shadow;

   .wpj-panel {
      border-radius: 0;
      box-shadow: none;
      border: 0;
   }

   .wpj-panel-heading {
      padding: 10px 15px;
      min-height: 54px;
      border-bottom: 1px solid $border-color-light;
      display: flex;
      flex-direction: column;
      justify-content: center;
   }

   .wpj-panel-body {
      border-bottom: 1px solid $border-color-light;
   }
}

// collapsable panels
.wpj-panel-heading {
   &[data-toggle] {
      &:has( + .collapsing),
      &:has( + .collapse.in) {
         background: $lightgray-light;
         border-bottom-color: $lightgray-light;

         .wpj-panel-collapse-arrow .bi::before {
            transform: rotateX(-180deg);
         }
      }
   }
}

.wpj-panel-collapse {
   &.collapse.in,
   &.collapsing {
      background: $lightgray-light;
   }
}

.wpj-panel{
   > .wpj-list-group,
   > .wpj-panel-collapse > .wpj-list-group {
      margin-bottom: 0;
      border-radius: 0;
      box-shadow: none;

      &:last-child {
         .wpj-list-group-item:last-child {
            @include border-bottom-radius($border-radius-base);

            border-bottom: 0;
         }
      }
   }
}

.wpj-panel-default {
   @include wpj-panel-variant($gray-background, $black);
}

.wpj-panel-primary {
   @include wpj-panel-variant($primary, $white);
}

.wpj-panel-secondary {
   @include wpj-panel-variant($mediumgray-dark, $white);
}

.wpj-panel-success {
   @include wpj-panel-variant($success, $white);
}

.wpj-panel-info {
   @include wpj-panel-variant($info, $white);
}

.wpj-panel-warning {
   @include wpj-panel-variant($warning, $white);
}

.wpj-panel-danger {
   @include wpj-panel-variant($danger, $white);
}

.wpj-panel-group-default {
   @include wpj-panel-group-variant($gray-background, $black);
}

.wpj-panel-group-primary {
   @include wpj-panel-group-variant($primary, $white);
}

.wpj-panel-group-secondary {
   @include wpj-panel-group-variant($mediumgray-dark, $white);
}

.wpj-panel-group-success {
   @include wpj-panel-group-variant($success, $white);
}

.wpj-panel-group-info {
   @include wpj-panel-group-variant($info, $white);
}

.wpj-panel-group-warning {
   @include wpj-panel-group-variant($warning, $white);
}

.wpj-panel-group-danger {
   @include wpj-panel-group-variant($danger, $white);
}