:root {
  /* 蓝色主题 */
  --primary: #2579f2;
  --primary-gradient: #d6e7ff;
  --primary-bg: #1980ff;
  --primary-fit-bg: #e8f3ff;

  /* 红色主题 */
  --primary-red: #ff3434;
  --primary-gradient-red: #ff7661;
  --primary-bg-red: #ff3c3c;
  --primary-fit-bg-red: #fff3f3;
}

.whiteBgc {
  height: 100%;
  width: 100%;
  overflow: auto;
}

html,
body {
  height: 100%;
  overflow: auto;
  background-color: #f5f5f5;
  -webkit-tap-highlight-color: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: PingFangSC-Medium, PingFang SC;
}

#app {
  height: 100%;
}

.van-number-keyboard {
  border-radius: 0;
  background-color: #e2e2e2;
  /* border-top: 1px solid #cccccc; */
}

.van-number-keyboard .van-number-keyboard__header {
  background-color: #f5f5f5;
  height: 9.067vw;
  align-items: flex-start;
  padding: 0;
  font-size: 3.467vw;
}

.van-number-keyboard .van-number-keyboard__header .van-number-keyboard__title-left {
  width: 100%;
  left: 50%;
  transform: translate(-50%, 0);
  text-align: center;
}

.van-number-keyboard .van-number-keyboard__header .van-number-keyboard__title-left .title {
  color: var(--primary-bg);
}

.red .van-number-keyboard .van-number-keyboard__header .van-number-keyboard__title-left .title {
  color: var(--primary-bg-red);
}

.van-number-keyboard .van-number-keyboard__header .van-number-keyboard__title-left .text {
  color: #999999;
}

.van-number-keyboard .van-number-keyboard__header .van-number-keyboard__title {
  display: flex;
  align-items: center;
  font-size: 3.467vw;
  color: #999999;
  margin: 0;
  padding: 0;
}

.van-number-keyboard .van-number-keyboard__body {
  padding: 2.4vw 0 0 2.133vw;
}

.van-number-keyboard .van-number-keyboard__body .van-key__wrapper {
  width: 24.533vw;
  height: 14.933vw;
  margin: 0;
  padding: 0 2.133vw 2.133vw 0;
  box-sizing: border-box;
}

.van-number-keyboard .van-number-keyboard__body .van-key {
  border-radius: 1.6vw;
  font-size: 6.667vw;
  height: 12.8vw;
  font-family: Helvetica;
  color: #333333;
}

.van-number-keyboard .van-number-keyboard__body .van-number-keyboard__sidebar {
  display: block;
}

.van-number-keyboard .van-number-keyboard__body .van-number-keyboard__sidebar .van-key__wrapper .van-key--delete {
  height: 12.8vw;
}

.van-number-keyboard
  .van-number-keyboard__body
  .van-number-keyboard__sidebar
  .van-key__wrapper
  .van-key--delete
  .delete-style {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.van-number-keyboard .van-number-keyboard__body .van-number-keyboard__sidebar .van-key__wrapper:nth-child(1) {
  height: 14.933vw;
}

.van-number-keyboard .van-number-keyboard__body .van-number-keyboard__sidebar .van-key__wrapper:nth-child(2) {
  height: 44.8vw;
}

.van-number-keyboard
  .van-number-keyboard__body
  .van-number-keyboard__sidebar
  .van-key__wrapper:nth-child(2)
  .van-key--blue {
  height: 42.667vw;
  font-size: 4.8vw;
  color: #ffffff;
  background: var(--primary);
}

.red
  .van-number-keyboard
  .van-number-keyboard__body
  .van-number-keyboard__sidebar
  .van-key__wrapper:nth-child(2)
  .van-key--blue {
  background: var(--primary-red);
}
