@import './form-common.scss';

.picker-popup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;

  .picker-mask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
  }

  .picker-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #FFFFFF;
    border-top-left-radius: 24rpx;
    border-top-right-radius: 24rpx;
    overflow: hidden;
    padding-bottom: env(safe-area-inset-bottom);

    .picker-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 100rpx;
      padding: 0 40rpx;
      border-bottom: 1rpx solid #F0F4FC;

      .btn-cancel {
        font-size: 30rpx;
        color: #999999;
      }

      .title {
        font-size: 32rpx;
        color: #333333;
        font-weight: 600;
      }

      .btn-confirm {
        font-size: 30rpx;
        color: #1F6CFF; /* Primary color */
      }
    }

    .picker-view {
      width: 100%;
      height: 400rpx;
    }

    .picker-item {
      line-height: 100rpx; /* Matches indicator height 50px */
      text-align: center;
      font-size: 32rpx;
      color: #333333;
    }
  }
}