ittwxcust/pages/appointment/appointment.wxss

/* pages/appointment/appointment.wxss */
.appointment {
  width: 100%;
  min-height: 100%;
  background: #F7F7F7;
}
.main-con {
  width: 690rpx;
  min-height: 100%;
  margin: 0 auto;
  overflow-y: auto;
  padding-bottom: 50rpx;
}
.ac-title {
  width: 100%;
  height: 82rpx;
  font-size: 30rpx;
  font-weight: bold;
  color: #333333;
  line-height: 82rpx;
}
.ac-card {
  width: 690rpx;
  height: 160rpx;
  background: #FFFFFF;
  border-radius: 20rpx;
}
.ac-item {
  width: 50%;
  height: 100%;
}
.ac-avat {
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  margin: 0 14rpx 0 20rpx;
}
.headimg {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.ac-name {
  font-size: 30rpx;
  font-weight: bold;
  color: #333333;
}
.ac-right {
  justify-content: flex-end;
  align-items: baseline;
  line-height: 160rpx;
}
.ac-count {
  font-size: 48rpx;
  font-weight: bold;
  color: #333333;
}
.ac-unit {
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
  margin: 0 20rpx 0 10rpx;
}
.address {
  width: 100%;
  min-height: 100rpx;
}
.ad-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333333;
  margin: 40rpx 0 20rpx 0;
}
.no-address {
  width: 248rpx;
  height: 60rpx;
  background: var(--maincolor);
  border-radius: 10rpx;
  font-size: 26rpx;
  font-weight: 400;
  color: #FFFFFF;
}
.address-card {
  width: 100%;
  height: 194rpx;
  background: #FFFFFF;
  border-radius: 20rpx;
}
.ad-left {
  width: calc(70% - 20rpx);
  height: 100%;
  padding-left: 20rpx;
}
.ad-right {
  width: 30%;
  height: 100%;
}
.chose-address-btn {
  width: 144rpx;
  height: 60rpx;
  border-radius: 10rpx;
}
.ad-top {
  height: 92rpx;
  width: 100%;
}
.ad-name {
  font-size: 30rpx;
  font-weight: bold;
  color: #333333;
  margin-right:20rpx;
}
.ad-phone {
  font-size: 26rpx;
  font-weight: 400;
  color: #999999;
}
.address-detail {
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
  line-height: 36rpx;
}
.ad-tips {
  font-size: 26rpx;
  font-weight: 400;
  color: #9A1D16;
  margin-top: 20rpx;
}
.ca-title {
  font-size: 30rpx;
  font-weight: bold;
  color: #333333;
  margin: 40rpx 0 20rpx 0;
}
.calendar-card {
  width: 690rpx;
  min-height: 500rpx;
  background: #FFFFFF;
  border-radius: 20rpx 20rpx 0 0;
  border-bottom: 1rpx solid #DDDDDD;
}
.calendar-card-header {
  width: 100%;
  height: 84rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.calendar-card-body {
  width: 630rpx;
  margin: 0 auto;
  min-height: 70rpx;
}
.week-header {
  width: 100%;
  height: 90rpx;
}
.week-item {
  width: 90rpx;
  height: 90rpx;
  text-align: center;
  line-height: 90rpx;
  font-size: 24rpx;
  color: #999999;
}
.week-body {
  width: 100%;
  min-height: 450rpx;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.week-body-item {
  width: 90rpx;
  height: 90rpx;
  color: #333333;
  position: relative;
}
.week-body-item-disabled {
  color: #999999;
}
.week-body-item-active {
  color: #fff;
  background-color: var(--maincolor);
  border-radius: 50%;
}
.week-body-item-full {
  color: #9A1D16;
}
.week-body-item-active-busy {
  background-color: #9A1D16;
}
.week-body-item-active-busy-dot {
  width: 12rpx;
  height: 12rpx;
  background: #9A1D16;
  border-radius: 50%;
  position: absolute;
  bottom: 8rpx;
  left: calc(50% - 6rpx);
}
.date {
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 90rpx;
  font-size: 28rpx;
}
.curr-date {
  font-size: 32rpx;
  font-weight: bold;
  color: #333333;
  margin-left: 20rpx;
}
.warn-icon {
  width: 20rpx;
  height: 20rpx;
  background: #9A1D16;
  border-radius: 50%;
}
.warn-text{
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
  margin: 0 20rpx 0 10rpx;
}
.calendar {
  --calendar-height: 450rpx;
}
view .van-calendar__selected-day {
  width: 68rpx;
  height: 68rpx;
  border-radius: 50%;
}
view .van-calendar__month-title {
  display: none;
}
view .van-calendar__days {
  background-color: #fff;
}
.time-list {
  width: 100%;
  height: 148rpx;
  justify-content: space-around;
  background-color: #fff;
}
.time-item {
  width: 190rpx;
  height: 68rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FFFFFF;
  border-radius: 10rpx;
  border: 1rpx solid #DDDDDD;
}

.t-text {
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
}
.time-nurse-text {
  font-size: 22rpx;
  font-weight: 400;
  color: #9A1D16;
}
.time-nurse {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.time-active {
  background-color: var(--maincolor);
  border: 1rpx solid var(--maincolor);
}
.time-active .t-text{
  color: #fff;
}
.footer-actions {
  width: 100%;
  height: 80rpx;
  margin-top: 40rpx;
}
.f-btn {
  width: 322rpx;
  height: 80rpx;
  font-size: 26rpx;
  border-radius: 10rpx;
}
.cancel-btn {
  background-color: #F7F7F7;
}
.wrapper {
  height: 100%;
}
.model {
  width: 540rpx;
  height: 208rpx;
  background: #FFFFFF;
  border-radius: 24rpx;
}
.top-title {
  font-size: 34rpx;
  font-weight: bold;
  color: #333333;
  text-align: center;
  height: 118rpx;
  line-height: 118rpx;
  border-bottom: 1rpx solid #DDDDDD;
  box-sizing:border-box;
}
.btn {
  width: 270rpx;
  height: 90rpx;
  box-sizing: border-box;
  font-size: 34rpx;
  color: #333333;
}
.w-cancel-btn {
  font-weight: 400;
}
.w-confirm-btn {
  border-left: 1rpx solid #DDDDDD;
  font-weight: bold;
}
.calendar-all-full {
  color: #9A1D16 !important;
}
.time-item-disabled {
  background: #CCCCCC;
  border: 0;
}