diff --git a/lib/components/narrative/default/default-itinerary.js b/lib/components/narrative/default/default-itinerary.js
index be3f34276..599a18ebf 100644
--- a/lib/components/narrative/default/default-itinerary.js
+++ b/lib/components/narrative/default/default-itinerary.js
@@ -8,10 +8,11 @@ import FieldTripGroupSize from '../../admin/field-trip-itinerary-group-size'
 import NarrativeItinerary from '../narrative-itinerary'
 import ItineraryBody from '../line-itin/connected-itinerary-body'
 import SimpleRealtimeAnnotation from '../simple-realtime-annotation'
+import { getTotalFare } from '../../../util/state'
 
 import ItinerarySummary from './itinerary-summary'
 
-const { calculateFares, isBicycle, isMicromobility, isTransit } = coreUtils.itinerary
+const { isBicycle, isMicromobility, isTransit } = coreUtils.itinerary
 
 /**
  * Obtains the description of an itinerary in the given locale.
@@ -125,14 +126,12 @@ const ITINERARY_ATTRIBUTES = [
     id: 'cost',
     order: 2,
     render: (itinerary, options) => {
-      // Get unformatted transit fare portion only (in cents).
-      const { transitFare } = calculateFares(itinerary)
       return (
         <FormattedNumber
           currency={options.currency}
           currencyDisplay='narrowSymbol'
           style='currency'
-          value={transitFare / 100}
+          value={getTotalFare(itinerary, options.configCosts) / 100}
         />
       )
     }
@@ -194,6 +193,7 @@ class DefaultItinerary extends NarrativeItinerary {
   render () {
     const {
       active,
+      configCosts,
       currency,
       expanded,
       itinerary,
@@ -246,6 +246,7 @@ class DefaultItinerary extends NarrativeItinerary {
                 }
                 options.LegIcon = LegIcon
                 options.timeFormat = use24HourFormat ? 'H:mm' : 'h:mm a'
+                options.configCosts = configCosts
                 options.currency = currency
                 return (
                   <li className={`${attribute.id}${isSelected ? ' main' : ''}`} key={attribute.id}>
@@ -276,6 +277,7 @@ class DefaultItinerary extends NarrativeItinerary {
 
 const mapStateToProps = (state, ownProps) => {
   return {
+    configCosts: state.otp.config.itinerary?.costs,
     // The configured (ambient) currency is needed for rendering the cost
     // of itineraries whether they include a fare or not, in which case
     // we show $0.00 or its equivalent in the configured currency and selected locale.
diff --git a/lib/util/state.js b/lib/util/state.js
index 0e1f1fa3b..79165f63a 100644
--- a/lib/util/state.js
+++ b/lib/util/state.js
@@ -289,8 +289,9 @@ function sortItineraries (type, direction, a, b, config) {
       if (direction === 'ASC') return a.duration - b.duration
       else return b.duration - a.duration
     case 'COST':
-      const aTotal = getTotalFare(a, config)
-      const bTotal = getTotalFare(b, config)
+      const configCosts = config.itinerary?.costs
+      const aTotal = getTotalFare(a, configCosts)
+      const bTotal = getTotalFare(b, configCosts)
       if (direction === 'ASC') return aTotal - bTotal
       else return bTotal - aTotal
     default:
@@ -329,7 +330,7 @@ function calculateItineraryCost (itinerary, config = {}) {
   // If config contains values to override defaults, apply those.
   const configWeights = config.itinerary && config.itinerary.weights
   if (configWeights) Object.assign(weights, configWeights)
-  return getTotalFare(itinerary, config) * weights.fareFactor +
+  return getTotalFare(itinerary, config.itinerary?.costs) * weights.fareFactor +
     itinerary.duration * weights.durationFactor +
     itinerary.walkDistance * weights.walkReluctance +
     getDriveTime(itinerary) * weights.driveReluctance +
@@ -368,13 +369,12 @@ const DEFAULT_COSTS = {
  * FIXME: Move to otp-ui?
  * TODO: Add GBFS fares
  */
-function getTotalFare (itinerary, config = {}) {
+export function getTotalFare (itinerary, configCosts = {}) {
   // Get transit/TNC fares.
   const {maxTNCFare, transitFare} = calculateFares(itinerary)
   // Start with default cost values.
   const costs = DEFAULT_COSTS
   // If config contains values to override defaults, apply those.
-  const configCosts = config.itinerary && config.itinerary.costs
   if (configCosts) Object.assign(costs, configCosts)
   // Calculate total cost from itinerary legs.
   let drivingCost = 0