movecar_wx/package-map/pages/map/index.wxss

.container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  background-color: #f9f9f9;
}
/*  */
.map {
  width: 100%;
  height: 60%;
}

.control-panel {
  position: fixed;
  bottom: 60rpx;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  padding: 0 20rpx;
}

.btn {
  width: 80%;
  height: 80rpx;
  line-height: 80rpx;
  text-align: center;
  color: white;
  border-radius: 40rpx;
  font-size: 30rpx;
}

.info {
  position: fixed;
  top: 30rpx;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.7);
  color: white;
  padding: 15rpx 30rpx;
  border-radius: 10rpx;
  font-size: 28rpx;
  z-index: 100;
}

/* 加载提示 */
.loading-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
}

.loading-view {
  background-color: white;
  padding: 30rpx 60rpx;
  border-radius: 10rpx;
}

/* 错误提示 */
.error-message {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(0, 0, 0, 0.7);
  color: white;
  padding: 20rpx 40rpx;
  border-radius: 8rpx;
  font-size: 28rpx;
  z-index: 99;
}

/* 路线列表容器 */
.routes-container {
  /* background-color: white; */
  padding: 20rpx;
  /* border-top: 1px solid #eee; */
  max-height: 50vh;
  overflow-y: auto;
}

/* 目的地标题 */
.destination-title {
  font-size: 32rpx;
  color: #333;
  padding-bottom: 10rpx;
  /* border-bottom: 1px solid #f0f0f0; */
}
/* 目的地标题 */
.destination-title1 {
  display: flex;
  align-items: center;
  color: #333;
}
.destination-font {
  font-size: 28rpx;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #333;
  margin-top: 10rpx;
  /* border-bottom: 1px solid #f0f0f0; */
}
.route{
  width: 100%;
  display: flex;
}
/* 路线列表 */
.routes-list {
  display: flex;
  flex-direction: column;
  gap: 15rpx;
}

/* 路线项 */
.route-item {
  padding: 15rpx;
  border-radius: 8rpx;
  background-color: #f9f9f9;
  border: 1px solid #eee;
}

.route-item.active {
  background-color: #e8f4ff;
  border-color: #007aff;
}

/* 路线头部 */
.route-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10rpx;
}

.route-number {
  font-size: 28rpx;
  font-weight: 500;
  color: #333;
}

.route-policy {
  font-size: 24rpx;
  color: #666;
  background-color: #f0f0f0;
  padding: 2rpx 10rpx;
  border-radius: 12rpx;
}

.route-item.active .route-policy {
  background-color: #007aff;
  color: white;
}

/* 路线详情 */
.route-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.detail-item {
  display: flex;
  align-items: center;
  margin-right: 20rpx;
}

.detail-text {
  font-size: 26rpx;
  color: #333;
  margin-left: 8rpx;
}

/* 路况信息 */
.traffic-info {
  margin-top: 10rpx;
}

.traffic-text {
  font-size: 24rpx;
  color: #ff6b00;
}
.storagecartext{
  width:100%;
  margin-bottom: 10rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
/* align-items: center; */
box-sizing: border-box;
}
.storagecartext_box{
  display: flex;
}
.contact-info{
  display: flex;
  align-items: center;
  margin-top: 20rpx;
}
.icon-call{
  margin-left: 10rpx;
}
.action-images{
  
}
.storagecar{
  width: 260rpx;
  height: 180rpx;
}
.storagecar1{
  width: 200rpx;
  height: 100rpx;
  margin-right: 30rpx;
}
.driver{
  display: flex;
}
.detailsbox{
 width: 100%;
 background-color: #ffffff;
border-radius: 40rpx;
padding: 0rpx 20rpx;
box-sizing: border-box;
}
.viewmore{
  width: 100%;
  margin-top: 20rpx;
  background-color: #ffffff;
  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.1);
  border-radius: 20rpx;
  padding: 0rpx 20rpx;

box-sizing: border-box;

}
.viewmore_box{
  width: 100%;
  height: 100rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  
}
.viewmore_left{
font-size: 32rpx;
}
.viewmore_right{
  font-size: 26rpx;
display: flex;
}

.viewmore_content{

}
.viewmore_details{
width: 100%;
height: 100rpx;
}
/* 1111111111111111111111111 */
/* pages/taxi-detail/taxi-detail.wxss */
.taxi-card-container {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: -1;
  transition: opacity 0.3s ease;
}

.taxi-card {
  width: 100%;
  background: #fff;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  position: relative;
}

/* 拖动指示器 */
.drag-handler {
  display: flex;
  justify-content: center;
  padding: 12rpx 0;
  background: #f8f9fa;
}

.drag-bar {
  width: 60rpx;
  height: 8rpx;
  background: #ddd;
  border-radius: 4rpx;
}

/* 卡片内容样式 */
.card-content {
  /* padding: 0 20rpx 20rpx; */
  padding: 0rpx 20rpx 20rpx;
  height: calc(100% - 52rpx);
  overflow-y: auto;
  box-sizing: border-box;
}

/* 全屏模式样式 */
.fullscreen-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30rpx;
  padding-bottom: 16rpx;
  border-bottom: 1px solid #f5f5f5;
}

.header-title {
  font-size: 36rpx;
  font-weight: 600;
  color: #333;
}

.close-fullscreen {
  width: 60rpx;
  height: 60rpx;
  line-height: 60rpx;
  padding: 0;
  font-size: 40rpx;
  color: #666;
  background: transparent;
}

.close-fullscreen::after {
  border: none;
}

.fee-list {
  margin-bottom: 30rpx;
}

/* 基础内容样式保持不变 */
.card-section .section-title {
  font-size: 32rpx;
  font-weight: 600;
  margin-bottom: 20rpx;
  color: #333;
}

.price-tag {
  font-size: 36rpx;
  font-weight: 700;
  color: #ff4d4f;
  margin-bottom: 12rpx;
}

.route-brief {
  font-size: 28rpx;
  color: #666;
}

.route-detail {
  margin-bottom: 20rpx;
}

.route-point {
  font-size: 28rpx;
  color: #333;
  margin-bottom: 12rpx;
  display: flex;
  align-items: center;
}

.route-point:before {
  content: '';
  width: 16rpx;
  height: 16rpx;
  border-radius: 50%;
  background: #ff4d4f;
  margin-right: 12rpx;
  display: inline-block;
}

.route-point:last-child:before {
  background: #00b42a;
}

.route-line {
  width: 4rpx;
  height: 40rpx;
  background: #eee;
  margin-left: 8rpx;
  margin-bottom: 12rpx;
}

.trip-meta {
  display: flex;
  justify-content: space-between;
  font-size: 26rpx;
  color: #666;
  background: #f8f9fa;
  padding: 16rpx;
  border-radius: 12rpx;
}

.fee-item {
  display: flex;
  justify-content: space-between;
  font-size: 28rpx;
  padding: 16rpx 0;
  border-bottom: 1px solid #f5f5f5;
}

.fee-item:last-child {
  border-bottom: none;
}

.fee-label {
  color: #666;
}

.fee-value {
  color: #333;
  font-weight: 500;
}

.fee-total .fee-label {
  font-weight: 600;
  color: #333;
}

.fee-total .fee-value {
  font-size: 32rpx;
  font-weight: 700;
  color: #ff4d4f;
}

.confirm-btn {
  width: 100%;
  height: 96rpx;
  line-height: 96rpx;
  background: #ff4d4f;
  color: #fff;
  font-size: 32rpx;
  border-radius: 48rpx;
  margin-top: 30rpx;
}

.confirm-btn::after {
  border: none;
}
/* 详情区块--通用样式 */
/* .detail-section {
  margin-bottom: 30rpx;
} */
.card_more{
  display: flex;
  /* justify-content: space-between; */
  border-top: 1rpx solid #f5f5f5;
  padding-top: 20rpx;
}
.card_morebox{
  width: 140rpx;
  height: 60rpx;
  margin: 0rpx;
  padding: 0rpx;
  font-size: 28rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50rpx;
  border: 1rpx solid #f9f9f9 !important; 
  background-color: #fff;
  box-shadow: 0 -2rpx 12px rgba(0, 0, 0, 0.1);

}

.card_moreboxleft{
  margin-left: 20rpx;
}
.card_box{
  width: 100%;
border-radius: 10rpx;
margin-top:16rpx;
padding: 0rpx 20rpx;
  box-shadow: 0 -2rpx 12px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
}
.section-title {
  font-size: 28rpx;
  font-weight: 600;
  color: #333;
  margin-bottom: 20rpx;
  padding-top: 10rpx;
  
}
.section-action{
  display: flex;
  align-items: center;
}
.section-title1 {
  font-size: 38rpx;
  font-weight: 600;
  color: #333;
  margin-bottom: 20rpx;
  padding-top: 10rpx;
  
}
.section_yuan{
  font-size: 28rpx;

}
/* 司机信息样式 */
.driver-section {
  display: flex;
  align-items: center;
  background-color: #fafafa;
  border-radius: 20rpx;
  padding: 20rpx;
}

.driver-avatar {
  width: 100rpx;
  height: 100rpx;
  border-radius: 50%;
  margin-right: 20rpx;
}
.order-status{
  display: flex;
  align-items: center;
}
.driver-info {
  flex: 1;
}

.driver-name {
  font-size: 26rpx;
  font-weight: 500;
  color: #333;
  margin-bottom: 10rpx;
}

.driver-grade {
  font-size: 22rpx;
  color: #ffc53d;
  margin-left: 10rpx;
}

.car-info {
  font-size: 22rpx;
  color: #666;
  margin-bottom: 10rpx;
}

.contact-btn {
  background-color: #00C775;
  color: #fff;
  font-size: 22rpx;
  padding: 5rpx 15rpx;
  border-radius: 15rpx;
  border: none;
}

/* 详情列表样式 */
.detail-list {
  background-color: #fafafa;
  border-radius: 20rpx;
  padding: 20rpx;
}

.detail-item {
  display: flex;
  justify-content: space-between;
  padding: 15rpx 0;
  border-bottom: 1rpx solid #eee;
}

.detail-item:last-child {
  border-bottom: none;
}

.item-label {
  font-size: 24rpx;
  color: #666;
}

.item-value {
  font-size: 24rpx;
  color: #333;
  text-align: right;
}

/* 费用明细样式 */
.fee-list {
  background-color: #fafafa;
  border-radius: 20rpx;
  padding: 20rpx;
}

.fee-item {
  display: flex;
  justify-content: space-between;
  padding: 15rpx 0;
  border-bottom: 1rpx solid #eee;
}

.fee-item:last-child {
  border-bottom: none;
}

.fee-label {
  font-size: 24rpx;
  color: #666;
}

.fee-value {
  font-size: 24rpx;
  color: #333;
}

.total-fee .fee-label {
  font-weight: 600;
  color: #333;
  font-size: 26rpx;
}

.total-fee .fee-value {
  font-weight: 600;
  color: #ff4d4f;
  font-size: 28rpx;
}
.estimated-time {
  font-size: 24rpx;
  color: #ff6b00;
margin-left: 20rpx;
}

.destination-title1 .estimated-time {
  /* display: block; */
  margin-left: 0;
}
.section-header{
 height: 80rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.payment{
width: 100%;
position: fixed;
right: 0rpx;
bottom: 60rpx;
display: flex;
align-items: center;
justify-content: center;
}
.pay{
  width: 500rpx;
height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: #00C775;
color: #fff;
border-radius: 10rpx;
}
.payccc{
  width: 500rpx;
  height: 88rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border: #00C775 1rpx solid;
  color: #fff;
  background-color: #00C775;
  border-radius: 10rpx;
}
.code-popup{
  z-index: 99;
}