@import '../../../../themes/t.cell.scss';
@import '../../common.scss';

.form-picker {
  &__header {
    display: flex;
    align-items: center;
    height: 116rpx;

    .title {
      flex: 1;
      text-align: center;
      font-weight: 600;
      font-size: 36rpx;
      color: var(--td-text-color-primary);
    }

    .btn {
      font-size: 32rpx;
      padding: 32rpx;

      &--cancel {
        color: var(--td-text-color-secondary);
      }

      &--confirm {
        color: var(--primary-color);
      }
    }
  }

  &__content {
    padding: 0 12px;
    box-sizing: border-box;
  }
}
.not-change {
  width: 100%;
  font-size: 14px;
  text-align: center;
  color: #1D6FF6;
  background-color: #F2F3FF;
  padding: 10px 20px;
  border-radius: 15rpx;
}
.sub-btn {
  width: 100%;
  color: white;
  background-color: #1D6FF6;
  font-size: 14px;
  text-align: center;
  padding: 10px 20px;
  border-radius: 15rpx;
}

/* module/chats/components/message-select/message-select.wxss */

.card {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4px;
  font-size: 28rpx;
  text-align: center;
  border-radius: 12rpx;
  overflow: hidden;
  box-sizing: border-box;
  background-color: white;
  border: 1px solid #EEEEEE;
  color: #191919;

  &--active {
    border: 1px solid #1D6FF6;
    padding: 4px 4px 4px 22px;

    &::after {
      content: '';
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 0;
      height: 0;
      border-width: 28px 28px 28px 0;
      border-style: solid;
      border-color: var(--td-bg-color-container) transparent transparent transparent;
      border: 14px solid #1D6FF6;
      border-bottom-color: transparent;
      border-right-color: transparent;
    }
  }

  &--disabled {
    opacity: 0.5;
  }

  &__icon {
    color: white;
    position: absolute;
    left: 1.5px;
    top: 1.5px;
    z-index: 1;
  }
}

.item.disabled {
  opacity: 0.5;
}