.pisell-checkbox-group {
  display: flex;
  flex-direction: column;
  width: 100%;

  .pisell-checkbox-group-item {
    width: 100%;
    cursor: pointer;
    border-radius: 12px;
    position: relative;

    &::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 12px;
      border: 1px solid var(--Gray-200, #EAECF0);
      z-index: 2;
      pointer-events: none;
    }

    &.pisell-checkbox-group-item-active {
      &::before {
        border-width: 4px;
        border-color: var(--theme-color);
        z-index: 1;
        box-sizing: border-box;
      }
      
      // 可选的背景色样式，需要额外的类名才会应用
      &.pisell-checkbox-group-item-with-background {
        &::before {
          background: var(--Primary-50, #F9F5FF);
        }
      }
      .pisell-row-center {
        .pisell-row {
          position: relative;
          z-index: 1;
        }
      }
      .pisell-row-right {
        position: relative;
        z-index: 1;
      }
    }

    &.pisell-checkbox-group-item-error {
      &::before {
        border-color: var(--Error-500, #F04438);
        border-width: 2px;
        background: var(--Error-50, #FEF3F2);
        z-index: 1;
      }
    }
  }
}

.pisell-checkbox-group-item-checkbox {
  margin: 0;
}