/*
 * CYC Ride UI141 R38X HOTFIX14
 * Passenger point label, recharge scan action, configured route fare and
 * reservation confirmation polish.
 */

#homeWalletCard .home-wallet-balance {
  justify-content: center;
}

#homeWalletCard .home-wallet-balance .home-wallet-value {
  margin-bottom: 0 !important;
}

#recharge .recharge-scan-actions {
  justify-content: center;
  margin: 18px 0 12px;
}

#recharge #startRechargeQrCamera.r38x-recharge-scan-button {
  align-items: center;
  background: #0b5ed7 !important;
  border: 2px solid #084db5 !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 18px rgba(11, 94, 215, .22);
  color: #fff !important;
  display: inline-flex;
  font-size: 22px !important;
  font-weight: 900 !important;
  justify-content: center;
  min-height: 76px;
  min-width: 168px;
  padding: 18px 28px !important;
}

#recharge #startRechargeQrCamera.r38x-recharge-scan-button:focus-visible {
  outline: 3px solid rgba(11, 94, 215, .3);
  outline-offset: 4px;
}

.ui88-route-title .r38x-route-fare {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  justify-content: center;
  line-height: 1.08;
  min-width: 76px;
  text-align: center;
}

.ui88-route-title .r38x-route-fare span {
  color: #0b5ed7;
  font-size: 17px;
  font-weight: 900;
}

.ui88-route-title .r38x-route-fare strong {
  color: #39d353;
  font-size: 25px;
  font-weight: 1000;
  margin-top: 5px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .05);
}

@media (max-width: 560px) {
  #recharge #startRechargeQrCamera.r38x-recharge-scan-button {
    font-size: 21px !important;
    min-height: 72px;
    min-width: 156px;
    padding: 16px 24px !important;
  }

  .ui88-route-title .r38x-route-fare {
    min-width: 68px;
  }

  .ui88-route-title .r38x-route-fare span {
    font-size: 16px;
  }

  .ui88-route-title .r38x-route-fare strong {
    font-size: 23px;
  }
}