parking_h5/pages/index/index.scss

page{background-color: $my-page-bg-color;}

.header-bar{
	background-color: $my-main-color;
	height: 106rpx;
	display: flex;
	padding: 0 40rpx;
	.city{
		display: flex;
		margin-right: 23rpx;
		color: #fff;
		align-items: center;
		.city-name{
			margin-right: 8rpx;
		}
	}
	.scan{margin-left: 23rpx;}
}
.content-nav{
	display: flex;
	justify-content: space-between;
	align-items: center;
	.content-nav-item{
		.content-nav-item-icon-wrap{
			width: 95rpx;
			height: 95rpx;
			margin: 0 auto 13rpx;
			// border-radius: 30rpx;
			// background: linear-gradient(163deg, #FFCC60 0%, #FF9221 100%);
		}
		.content-nav-item-icon-text{
			font-size: 28rpx;
			font-weight: 500;
			color: #5A5A5A;
			line-height: 1;
		}
	}
	.content-nav-item + .content-nav-item{
		// margin-left: 74rpx;
	}
}
.pending-order-head{
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: $my-main-color;
	.pending-order-head-left{
		font-size: 30rpx;
		b{font-weight: 500;font-size: 50rpx;margin-right: 5rpx;}
	}
	.pending-order-head-right{
		font-size: 22rpx;
		font-weight: 500;
	}
}
.pending-order-body{
	.pending-order-body-nav{
		display: flex;
		border-radius: 32px;
		border: 1px solid $my-main-color;
		margin-bottom: 36rpx;
		.nav-item{
			flex: 1;
			height: 62rpx;
			line-height: 62rpx;
			font-size: 24rpx;
			text-align: center;
			&.active{
				background: $my-main-color;
				color: #fff;
				border-radius: 32rpx;
			}
		}
	}
	.pending-order-body-wrap{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		.pending-order-body-left-label{
			font-size: 22rpx;
			font-weight: 500;
			color: #787878;
		}
	}
	.pending-order-body-left{
		.car-number{
			margin-bottom: 32rpx;
			font-size: 30rpx;
			font-weight: 600;
			color: #3A3A3A;
			line-height: 42rpx;
			letter-spacing: 1px;
		}
		.duration{
			margin-bottom: 5rpx;
			font-size: 26rpx
		}
		.cost{
			.number{
				font-size: 26rpx;
				line-height: 50rpx;
				color: $my-main-color;
			}
		}
	}
	.pending-order-body-right{
		text-align: left;
		font-size: 24rpx;
		.order{
			margin-bottom: 28rpx;			
			font-weight: 400;
			color: #9A9A9A;
		}
		
	}
	.go-pay-wrap{
		margin-top: 150rpx;
		width: 100%;
		text-align: center;
		.go-pay{
			display: inline-block;
			padding: 12rpx 39rpx 11rpx;
			background: linear-gradient(90deg, #FF2727 0%, #FF9A13 100%, #FF0F0F 100%);
			color: #fff;
			border-radius: 35rpx;
			cursor: pointer;
		}
	}
	
}

.popup-order-details{
	color: #545454;
	&-til{
		padding: 61rpx 40rpx 16rpx;
		font-size: 36rpx;
		color: #008CFF;
		line-height: 50rpx;
		text-align: center;
	}
	&-con{
		margin-bottom: 40rpx;
	}
	&-footer{
		border-top: 1px solid #CECECE;
		padding: 28rpx 0 26rpx;
		font-size: 45rpx;
		line-height: 63rpx;
		text-align: center;
		color: #008CFF;
	}
	dl{
		margin: 20rpx 38rpx;
		display: flex;
		font-size: 30rpx;
		dt{
			width: 150rpx;
			color: #A3A3A3;
			text-align: right;
		}
		dd{
			flex: 1;
		}
	}
}

.promotion{
	margin: 20rpx 40rpx 40rpx;
	background-color: #FFFFFF;
	border-radius: 15rpx;
	&-header{
		padding: 26rpx 40rpx 12rpx;
		border-bottom: 1px solid #DFDFDF;
		margin-bottom: 26rpx;
		.promotion-header-til{
			font-size: 30rpx;
			color: #383838;
			line-height: 42rpx;
		}
		.promotion-header-con{
			font-size: 22rpx;
			color: #787878;
			line-height: 30rpx;
		}
	}
	&-body{
		padding: 0 40rpx 24rpx;
		.promotion-body-til{
			font-size: 26rpx;
			color: #676767;
			line-height: 37rpx;
			margin-bottom: 15rpx;
		}
		.promotion-body-con{
			font-size: 20rpx;
			color: #A5A5A5;
			line-height: 34rpx;
		}
	}
}