kupos-ui-components-lib 10.4.34 → 10.4.36

package/dist/assets/images/index.ts

@@ -34,7 +34,6 @@ export const amenities = {
   "amenity-cortina": require("./amenities/amenity-cortina.png"),
 };
 
-
 export const backgroundImages = {
   "discount-banner-1": require("./discount/green.png"),
   "discount-banner-2": require("./discount/yellow.png"),
@@ -46,4 +45,4 @@ export const backgroundImages = {
   "discount-promo-code": require("./discount/promo.png"),
   "discount-seat-level": require("./discount/seat.png"),
   "discount-instant": require("./discount/instant.png"),
-};
+};

package/dist/components/DiscountBanners/DiscountBannerMobile.js

@@ -120,9 +120,6 @@ class DiscountBannersMobile extends React.Component {
                 React.createElement("span", { className: `bold-text flex-shrink-0 rounded-full text-center text-[#464647] overflow-hidden whitespace-nowrap ${sizeClasses.chip}`, style: chipPillInArt
                         ? undefined
                         : { backgroundColor: "rgba(255,255,255,0.55)" } }, label),
-                showFlamePercent && (React.createElement("span", { className: `bold-text absolute text-[#ffffff] text-center pointer-events-none ${sizeClasses.flameBadge}`, style: Object.assign(Object.assign({}, FLAME_CENTER), { transform: "translate(-50%, -50%)", textShadow: "0 1px 2px rgba(0,0,0,0.28)", fontWeight: 900, whiteSpace: "nowrap" }) },
-                    card.amount,
-                    React.createElement("span", { className: sizeClasses.flamePercent, style: { fontWeight: 700 } }, "%"))),
                 React.createElement("span", { className: `flex flex-col ${sizeClasses.column}` },
                     React.createElement("span", { className: `bold-text text-[#464647] ${sizeClasses.discount}` }, card.discountLabel),
                     React.createElement("span", { className: `bold-text ${sizeClasses.subtitle}`, style: { color: accentColor } }, card.subtitle))));

package/dist/components/ServiceItem/ServiceItemDesktop.js

@@ -305,7 +305,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
         },
     ];
     const otherItems = items.filter((i) => i.key !== "pet" && i.key !== "flexible" && !!i.condition);
-    return (React.createElement(React.Fragment, null, isPeruSites ? (React.createElement(PeruServiceItemDesktop, { serviceItem: serviceItem, onBookButtonPress: onBookButtonPress, colors: colors, metaData: metaData, children: children, busStage: busStage, serviceDetailsLoading: serviceDetailsLoading, cityOrigin: cityOrigin, cityDestination: cityDestination, translation: translation, orignLabel: orignLabel, destinationLabel: destinationLabel, currencySign: currencySign, isCiva: isCiva, showRating: showRating, showLastSeats: showLastSeats, removeArrivalTime: removeArrivalTime, removeDuplicateSeats: removeDuplicateSeats, isPeruSites: isPeruSites, t: (key) => t(key), showAvailableSeats: showAvailableSeats, isSeatIcon: isSeatIcon, isPeru: isPeru, siteType: siteType, isAllinBus: isAllinBus, viewersConfig: viewersConfig, isLoggedIn: isLoggedIn, showLoginModal: showLoginModal, isExpand: isExpand, setIsExpand: setIsExpand, coachKey: coachKey, isFlores: isFlores, isNewUiEnabled: isNewUiEnabledPeru, showLoginOption: showLoginOption, priority_stage_ids: priority_stage_ids })) : isNewUi && !isTrain ? (React.createElement(FeatureServiceUi, { serviceItem: serviceItem, showTopLabel: showTopLabel, getAnimationIcon: getAnimationIcon, cityOrigin: cityOrigin, cityDestination: cityDestination, renderIcon: renderIcon, viewersConfig: viewersConfig, isFeatureDropDownExpand: isFeatureDropDownExpand, ticketQuantity: ticketQuantity, onIncreaseTicketQuantity: onIncreaseTicketQuantity, onDecreaseTicketQuantity: onDecreaseTicketQuantity, onBookButtonPress: onRemateUiButtonClick, onToggleExpand: () => setIsFeatureDropDownExpand &&
+    return (React.createElement(React.Fragment, null, isPeruSites ? (React.createElement(PeruServiceItemDesktop, { serviceItem: serviceItem, onBookButtonPress: onBookButtonPress, colors: colors, metaData: metaData, children: children, busStage: busStage, serviceDetailsLoading: serviceDetailsLoading, cityOrigin: cityOrigin, cityDestination: cityDestination, translation: translation, orignLabel: orignLabel, destinationLabel: destinationLabel, currencySign: currencySign, isCiva: isCiva, showRating: showRating, showLastSeats: showLastSeats, removeArrivalTime: removeArrivalTime, removeDuplicateSeats: removeDuplicateSeats, isPeruSites: isPeruSites, t: (key) => t(key), showAvailableSeats: showAvailableSeats, isSeatIcon: isSeatIcon, isPeru: isPeru, siteType: siteType, isAllinBus: isAllinBus, viewersConfig: viewersConfig, isLoggedIn: isLoggedIn, showLoginModal: showLoginModal, isExpand: isExpand, setIsExpand: setIsExpand, coachKey: coachKey, isFlores: isFlores, isNewUiEnabled: isNewUiEnabledPeru, showLoginOption: showLoginOption })) : isNewUi && !isTrain ? (React.createElement(FeatureServiceUi, { serviceItem: serviceItem, showTopLabel: showTopLabel, getAnimationIcon: getAnimationIcon, cityOrigin: cityOrigin, cityDestination: cityDestination, renderIcon: renderIcon, viewersConfig: viewersConfig, isFeatureDropDownExpand: isFeatureDropDownExpand, ticketQuantity: ticketQuantity, onIncreaseTicketQuantity: onIncreaseTicketQuantity, onDecreaseTicketQuantity: onDecreaseTicketQuantity, onBookButtonPress: onRemateUiButtonClick, onToggleExpand: () => setIsFeatureDropDownExpand &&
             setIsFeatureDropDownExpand(isFeatureDropDownExpand === serviceItem.id ||
                 isFeatureDropDownExpand === true
                 ? null

package/dist/ui/DiscountBanners/defaultBackgrounds.js

@@ -32,7 +32,7 @@ export const CAMPAIGN_ART = {
     first_time: { image: toImageUrl(firstTimeArt), accent: "#D63384" },
     cashback: { image: toImageUrl(cashbackArt), accent: "#0069D1" },
     round_trip: { image: toImageUrl(roundTripArt), accent: "#5C8A00" },
-    promo_code: { image: toImageUrl(promoCodeArt), accent: "#E08A00" },
+    instant_discount: { image: toImageUrl(promoCodeArt), accent: "#E08A00" },
     seat_level: { image: toImageUrl(seatLevelArt), accent: "#B87500" },
-    instant_discount: { image: toImageUrl(instantArt), accent: "#107E23" },
+    promo_code: { image: toImageUrl(instantArt), accent: "#107E23" },
 };

package/dist/ui/DiscountBanners/discountUtils.js

@@ -3,15 +3,15 @@ const DESCUENTOS_ESPECIALES_KEY = "descuentos_especiales";
 const DESCUENTOS_ESPECIALES_LABEL = "Descuentos especiales";
 const REMATE_KEY = "remate";
 export const CAMPAIGN_TYPE_LABELS = {
-    last_minute: "Última hora",
+    last_minute: "Oferta de último minuto",
     first_time: "Primera compra",
     cashback: "Cashback",
     return_booking: "Pasaje de vuelta",
-    round_trip: "Ida y vuelta",
+    round_trip: "Ofertas de ida y vuelta",
     early_bird: "Compra anticipada",
     promo_code: "Código promocional",
     seat_level: "Descuento por asiento",
-    instant_discount: "Descuento inmediato",
+    instant_discount: "Oferta instantánea",
 };
 const ACCENTED_CHARS = {
     á: "a",
@@ -48,7 +48,8 @@ function getServiceDiscount(service) {
         service.discount_value > 0) {
         return { type: "percentage", amount: Number(service.discount_value) };
     }
-    if ((service === null || service === void 0 ? void 0 : service.discount_type) === "fixed" &&
+    if (((service === null || service === void 0 ? void 0 : service.discount_type) === "fixed" ||
+        (service === null || service === void 0 ? void 0 : service.discount_type) === "fixed_price") &&
         (service === null || service === void 0 ? void 0 : service.discount_value) != null &&
         service.discount_value > 0) {
         const rawDiscount = Number(service.discount_value);

package/dist/ui/SeatSection/PeruSeatSection.js

@@ -57,7 +57,7 @@ function getNumberOfSeats(seatTypes) {
     return seatTypes.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
 }
 function hasInclinationSeatTypes(seatTypes) {
-    return seatTypes.some((seat) => seat.label.includes("°"));
+    return (seatTypes !== null && seatTypes !== void 0 ? seatTypes : []).some((seat) => { var _a; return String((_a = seat === null || seat === void 0 ? void 0 : seat.label) !== null && _a !== void 0 ? _a : "").includes("°"); });
 }
 function getSeatTypeIcon(label, serviceItem) {
     var _a, _b, _c, _d;
@@ -75,7 +75,15 @@ function PeruSeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, cur
     const uniqueSeats = getUniqueSeats(seatTypes);
     const sortedSeatTypes = getSortedSeatTypes(seatTypes);
     const numberOfSeats = getNumberOfSeats(seatTypes);
-    const isCentered = numberOfSeats < 2 || removeDuplicateSeats;
+    const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
+        (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
+    const hasInclination = hasInclinationSeatTypes(seatTypes);
+    const seatTypeRows = uniqueSeats.filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
+    // A service that exposes more than one seat type (e.g. "Bus Cama" + "160°")
+    // lists every type with its own fare, under a shared "Desde" heading.
+    const showSeatTypeRows = (isMovilBus || hasInclination) && seatTypeRows.length > 1;
+    // Stacked seat-type rows must stay top-aligned with their labels.
+    const isCentered = !showSeatTypeRows && (numberOfSeats < 2 || removeDuplicateSeats);
     const formatPrice = (price) => availableSeats <= 0
         ? CommonService.currency(0, currencySign)
         : CommonService.currency(price, currencySign);
@@ -95,23 +103,16 @@ function PeruSeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, cur
         });
     };
     const renderSeatPrices = () => {
-        const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
-            (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
-        const hasInclination = hasInclinationSeatTypes(seatTypes);
         // Multiple unique seat types → show a price row for each (MovilBus or inclination types)
-        if ((isMovilBus || hasInclination) && uniqueSeats.length > 1) {
-            const filteredSeats = uniqueSeats.filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
-            const prices = filteredSeats.map((val, key) => {
-                const { discountedPrice } = CommonService.calculateDiscountedPrice(val.price, serviceItem);
-                return (React.createElement("span", { key: key, className: "flex items-center text-[13.33px] bold-text" }, formatPrice(discountedPrice)));
+        if (showSeatTypeRows) {
+            const prices = seatTypeRows.map((val, key) => {
+                const { originalPrice, discountedPrice } = CommonService.calculateDiscountedPrice(val.price, serviceItem);
+                return (React.createElement("span", { key: key, className: "flex items-center text-[13.33px] bold-text" }, formatPrice(showOriginalFare ? originalPrice : discountedPrice)));
             });
-            // Only add "Desde" for inclination types, not for MovilBus
-            if (hasInclination && !isMovilBus) {
-                return (React.createElement("div", { className: "relative" },
-                    React.createElement("span", { key: "desde", className: "text-[12px] font-normal text-[#6a6a6a] absolute", style: { top: "-15px" } }, "Desde"),
-                    React.createElement("div", { className: "flex flex-col", style: { gap: "12px" } }, prices)));
-            }
-            return prices;
+            // Stacked fares always sit under a "Desde" heading.
+            return (React.createElement("div", { className: "relative" },
+                React.createElement("span", { key: "desde", className: "text-[12px] font-normal text-[#6a6a6a] absolute", style: { top: "-15px" } }, "Desde"),
+                React.createElement("div", { className: "flex flex-col", style: { gap: "12px" } }, prices)));
         }
         // Single seat type → original behaviour (one lowest-fare price)
         const allSeats = getAllSeatTypes(seatTypes);
@@ -130,6 +131,9 @@ function PeruSeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, cur
     // itself; only ui_type and the ready-made badge text come from discounts[0].
     const peruDiscount = (_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discounts) === null || _a === void 0 ? void 0 : _a[0];
     const uiType = peruDiscount === null || peruDiscount === void 0 ? void 0 : peruDiscount.ui_type;
+    // Tier B (ui_type 1) announces the offer elsewhere, so the fare itself must
+    // render exactly as it would with no discount.
+    const showOriginalFare = hasDiscount && uiType === 1;
     const discountType = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type;
     const discountValueRaw = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value;
     const maxDiscount = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.max_discount;
@@ -165,15 +169,11 @@ function PeruSeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, cur
                 ? `${discountValue}% OFF`
                 : null);
     const renderLabels = () => {
-        const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
-            (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
-        const hasInclination = hasInclinationSeatTypes(seatTypes);
         // Multiple unique seat types → show a label row for each (MovilBus or inclination types)
-        if ((isMovilBus || hasInclination) && uniqueSeats.length > 1) {
-            return uniqueSeats
-                .filter((s) => !SEAT_EXCEPTIONS.includes(s.label))
+        if (showSeatTypeRows) {
+            return seatTypeRows
                 .map((val, key) => (React.createElement("span", { key: key, className: `flex items-center justify-between text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
-                isSeatIcon && !hasDiscount && (React.createElement("img", { src: getSeatTypeIcon(val.label, serviceItem), alt: "seattype", style: {
+                isSeatIcon && (React.createElement("img", { src: getSeatTypeIcon(val.label, serviceItem), alt: "seattype", style: {
                         width: "20px",
                         height: "20px",
                         marginRight: "5px",
@@ -202,7 +202,7 @@ function PeruSeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, cur
                     } })),
                 CommonService.capitalize(seatLabel))) : (React.createElement("span", { className: "text-[13.33px]" }, "Desde")))));
     };
-    if (hasDiscount && discountSeat) {
+    if (hasDiscount && discountSeat && !(uiType === 1 && showSeatTypeRows)) {
         // Tier B (ui_type 1): offer text is announced elsewhere, but the fare
         // itself must render exactly as it would with no discount — no
         // strike-off, no badge, no fire icon.

package/dist/ui/ServiceBadges/ServiceBadges.js

@@ -40,7 +40,7 @@ const ServiceBadges = ({ showTopLabel, isSoldOut, colors, renderIcon, translatio
             } },
             renderIcon("directo", "12px"),
             React.createElement("div", null, "Tren Express"))),
-        boardingName && isAllinBus && !showTopLabel && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px]  z-20`, style: {
+        boardingName && isAllinBus && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px]  z-20`, style: {
                 backgroundColor: colors.topLabelBgColor || "#fff",
                 border: isSoldOut
                     ? "1px solid #ccc"

package/dist/ui/mobileweb/SeatSectionMobile.js

@@ -29,7 +29,7 @@ const getFilteredSeats = (item) => {
     return item;
 };
 function hasInclinationSeatTypes(seatTypes) {
-    return seatTypes.some((seat) => seat.label.includes("°"));
+    return (seatTypes !== null && seatTypes !== void 0 ? seatTypes : []).some((seat) => { var _a; return String((_a = seat === null || seat === void 0 ? void 0 : seat.label) !== null && _a !== void 0 ? _a : "").includes("°"); });
 }
 const getUniqueSeats = (data, limit) => {
     var _a;
@@ -48,8 +48,19 @@ const getUniqueSeats = (data, limit) => {
         .slice(0, limit);
 };
 function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, isTrain, discountSeatCrossPriceColor, }) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const hasMultipleTypes = ((_a = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.length) !== null && _a !== void 0 ? _a : 0) > 2;
+    const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
+        (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
+    const hasInclination = hasInclinationSeatTypes(seatTypesData !== null && seatTypesData !== void 0 ? seatTypesData : []);
+    // Fetch ALL unique seats (no slice limit) for the multi-row seat-type case
+    const allUniqueSeats = getUniqueSeats(seatTypesData !== null && seatTypesData !== void 0 ? seatTypesData : [], Infinity);
+    // A service that exposes more than one seat type (e.g. "Bus Cama" + "160°")
+    // lists every type with its own fare, under a shared "Desde" heading.
+    const showSeatTypeRows = (isMovilBus || hasInclination) && allUniqueSeats.length > 1;
+    // Tier B (ui_type 1) announces the offer elsewhere, so the fare itself must
+    // render exactly as it would with no discount.
+    const isOfferTextOnlyTier = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1;
     const getFare = (fare) => {
         if (removeDuplicateSeats && availableSeats <= 0 && !isPeru) {
             return commonService.currency(0, currencySign);
@@ -69,29 +80,17 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
         if (lowestFare === null)
             return null;
         const priceColor = isSoldOut ? "#bbb" : seatPriceColor;
-        const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
-            (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
-        const hasInclination = hasInclinationSeatTypes(seatTypesData !== null && seatTypesData !== void 0 ? seatTypesData : []);
-        // Fetch ALL unique seats (no slice limit) for the multi-row MovilBus case
-        const uniqueSeats = getUniqueSeats(seatTypesData !== null && seatTypesData !== void 0 ? seatTypesData : [], Infinity);
-        // MovilBus + multiple unique seat types → render a row per seat
-        if (isMovilBus && uniqueSeats.length > 1) {
-            return (React.createElement(React.Fragment, null, uniqueSeats.map((seat, key) => {
-                const { discountedPrice } = commonService.calculateDiscountedPrice(Number(seat.fare), serviceItem);
-                return (React.createElement("div", { key: key, className: "w-[100%] flex flex-row justify-between items-center" },
-                    React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text whitespace-nowrap", style: { color: isSoldOut ? "#bbb" : "#464647" } }, commonService.truncateSeatLabel(seat.label)),
-                    React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: priceColor } }, commonService.currency(discountedPrice, currencySign))));
-            })));
-        }
-        // Inclination seat types + multiple unique seat types → render a row per seat with "Desde" above prices
-        if (hasInclination && uniqueSeats.length > 1) {
+        const uniqueSeats = allUniqueSeats;
+        // Multiple unique seat types → render a row per seat, always under a
+        // "Desde" heading.
+        if (showSeatTypeRows) {
             return (React.createElement("div", { className: "relative" },
                 React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] absolute", style: { color: "#6a6a6a", top: -20, right: 0 } }, "Desde"),
                 uniqueSeats.map((seat, key) => {
-                    const { discountedPrice } = commonService.calculateDiscountedPrice(Number(seat.fare), serviceItem);
+                    const { originalPrice, discountedPrice } = commonService.calculateDiscountedPrice(Number(seat.fare), serviceItem);
                     return (React.createElement("div", { key: key, className: "w-[100%] flex flex-row justify-between items-center", style: { marginTop: key > 0 ? "8px" : "0" } },
                         React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text whitespace-nowrap", style: { color: isSoldOut ? "#bbb" : "#464647" } }, commonService.truncateSeatLabel(seat.label)),
-                        React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: priceColor } }, commonService.currency(discountedPrice, currencySign))));
+                        React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: priceColor } }, commonService.currency(showOriginalFare ? originalPrice : discountedPrice, currencySign))));
                 })));
         }
         const { originalPrice, discountedPrice } = commonService.calculateDiscountedPrice(lowestFare, serviceItem);
@@ -165,8 +164,12 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
         ? peruDiscountCalc != null &&
             peruDiscountCalc.originalPrice !== peruDiscountCalc.discountedPrice
         : discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.some((s) => s.originalPrice !== s.discountedPrice);
+    const showOriginalFare = Boolean(hasDiscount) && isOfferTextOnlyTier;
+    // Peru prices off the lowest fare across all seat types, so the label comes
+    // from the cheapest seat rather than being left blank.
+    const peruLowestFareLabel = (_c = (_b = allUniqueSeats[0]) === null || _b === void 0 ? void 0 : _b.label) !== null && _c !== void 0 ? _c : "";
     const discountSeat = isPeru && peruDiscountCalc
-        ? Object.assign({ label: "", fare: peruLowestFare }, peruDiscountCalc) : (_b = discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.filter((seat) => !EXCEPTIONS.includes(seat.label))) === null || _b === void 0 ? void 0 : _b.sort((a, b) => a.discountedPrice - b.discountedPrice)[0];
+        ? Object.assign({ label: peruLowestFareLabel, fare: peruLowestFare }, peruDiscountCalc) : (_d = discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.filter((seat) => !EXCEPTIONS.includes(seat.label))) === null || _d === void 0 ? void 0 : _d.sort((a, b) => a.discountedPrice - b.discountedPrice)[0];
     const discountValue = (() => {
         if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "percentage" &&
             typeof (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) === "number") {
@@ -195,7 +198,7 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
     })();
     // Backend-provided ready-made badge text (e.g. "30% OFF" / "$2.000 OFF")
     // takes precedence over the value computed client-side.
-    const discountBadgeText = ((_d = (_c = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discounts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.discount_display_badge) ||
+    const discountBadgeText = ((_f = (_e = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discounts) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.discount_display_badge) ||
         (isMaxDiscountApplied
             ? `${commonService.currency(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.max_discount)} OFF`
             : discountValue != null
@@ -210,14 +213,14 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
     };
     const originalDpPrice = getMinValue(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.original_dp_price);
     const dpDiscountPercent = getMinValue(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents);
-    const firstSeatFare = (_f = (_e = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label) && !EXCEPTIONS.includes(item.label))) === null || _e === void 0 ? void 0 : _e.sort((a, b) => a.fare - b.fare)[0]) === null || _f === void 0 ? void 0 : _f.fare;
+    const firstSeatFare = (_h = (_g = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label) && !EXCEPTIONS.includes(item.label))) === null || _g === void 0 ? void 0 : _g.sort((a, b) => a.fare - b.fare)[0]) === null || _h === void 0 ? void 0 : _h.fare;
     const hasDpDiscount = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) &&
         (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) &&
         originalDpPrice != null &&
         dpDiscountPercent != null &&
         firstSeatFare != null;
     return (React.createElement("div", { className: "content-center relative", style: { width: "40%" } }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
-        !((_g = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) === null || _g === void 0 ? void 0 : _g.length) &&
+        !((_j = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) === null || _j === void 0 ? void 0 : _j.length) &&
         !dpDiscountPercent ? (React.createElement("div", { className: "flex flex-col justify-between h-[2.5rem]", style: { gap: isSoldOut ? "0px" : "5px" } }, renderDpSeats())) : hasDpDiscount ? (React.createElement("div", { className: "relative grid grid-cols-[auto_auto] justify-between gap-x-[8px] " },
         !isNaN(Number(dpDiscountPercent)) &&
             Number(dpDiscountPercent) > 0 && (React.createElement("div", { className: "absolute -top-[18px] right-[0px]", style: {
@@ -249,9 +252,11 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
         React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: {
                 color: isSoldOut ? "#bbb" : discountSeatPriceColor || "#ff5964",
             } },
-            ((_h = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _h === void 0 ? void 0 : _h.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { filter: isSoldOut ? "grayscale" : "" } })) : null,
+            ((_k = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _k === void 0 ? void 0 : _k.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { filter: isSoldOut ? "grayscale" : "" } })) : null,
             commonService.discountedCurrency(Number(firstSeatFare), currencySign)),
-        isSoldOut ? (React.createElement("span", { className: "col-span-2 min-[420]:text-[13px] text-right text-[12px] text-[#ccc]" }, "Agotado")) : null)) : hasDiscount && discountSeat ? (React.createElement("div", null,
+        isSoldOut ? (React.createElement("span", { className: "col-span-2 min-[420]:text-[13px] text-right text-[12px] text-[#ccc]" }, "Agotado")) : null)) : hasDiscount &&
+        discountSeat &&
+        !(isPeru && showSeatTypeRows && isOfferTextOnlyTier) ? (React.createElement("div", null,
         React.createElement("div", { className: "relative grid grid-cols-[auto_auto] justify-between gap-x-[8px] " },
             (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 1 && discountBadgeText && (React.createElement(React.Fragment, null,
                 React.createElement("div", { className: "absolute -top-[18px] right-[0px]", style: {
@@ -279,7 +284,9 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
                             transform: "rotate(-12deg)",
                             transformOrigin: "center",
                         } })))),
-            React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#464647" } }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 ? discountSeat.label : "Desde"),
+            React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#464647" } }, isOfferTextOnlyTier
+                ? commonService.capitalize(commonService.truncateSeatLabel(discountSeat.label))
+                : "Desde"),
             React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: {
                     color: isSoldOut
                         ? "#bbb"
@@ -287,7 +294,7 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
                             ? "#464647"
                             : discountSeatPriceColor || "#ff5964",
                 } },
-                (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 1 && ((_j = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _j === void 0 ? void 0 : _j.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { opacity: isSoldOut ? 0.5 : 1 } })) : null,
+                (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 1 && ((_l = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _l === void 0 ? void 0 : _l.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { opacity: isSoldOut ? 0.5 : 1 } })) : null,
                 commonService.discountedCurrency((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1
                     ? discountSeat.originalPrice
                     : discountSeat.discountedPrice, currencySign))))) : (React.createElement("div", { className: `flex flex-col justify-between ${isTrain ? "" : "h-[2.5rem]"} `, style: {

package/dist/ui/mobileweb/ServiceBadgesMobile.js

@@ -40,7 +40,7 @@ const ServiceBadgesMobile = ({ showTopLabel, isSoldOut, colors, renderIcon, serv
             } },
             renderIcon("directo", "12px"),
             React.createElement("div", null, "Tren Express"))),
-        boardingName && isAllinBus && !showTopLabel && (React.createElement("div", { className: `flex items-center gap-[2p x] py-[4px] px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] h-[24px] z-20`, style: {
+        boardingName && isAllinBus && (React.createElement("div", { className: `flex items-center gap-[2p x] py-[4px] px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] h-[24px] z-20`, style: {
                 backgroundColor: colors.topLabelBgColor || "#fff",
                 border: isSoldOut
                     ? "1px solid #ccc"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kupos-ui-components-lib",
-  "version": "10.4.34",
+  "version": "10.4.36",
   "description": "A reusable UI components package",
   "publishConfig": {
     "access": "public"

package/src/assets/images/index.ts

@@ -34,7 +34,6 @@ export const amenities = {
   "amenity-cortina": require("./amenities/amenity-cortina.png"),
 };
 
-
 export const backgroundImages = {
   "discount-banner-1": require("./discount/green.png"),
   "discount-banner-2": require("./discount/yellow.png"),
@@ -46,4 +45,4 @@ export const backgroundImages = {
   "discount-promo-code": require("./discount/promo.png"),
   "discount-seat-level": require("./discount/seat.png"),
   "discount-instant": require("./discount/instant.png"),
-};
+};

package/src/components/DiscountBanners/DiscountBannerMobile.tsx

@@ -190,7 +190,7 @@ class DiscountBannersMobile extends React.Component<
               >
                 {label}
               </span>
-              {showFlamePercent && (
+              {/* {showFlamePercent && (
                 <span
                   className={`bold-text absolute text-[#ffffff] text-center pointer-events-none ${sizeClasses.flameBadge}`}
                   style={{
@@ -209,7 +209,7 @@ class DiscountBannersMobile extends React.Component<
                     %
                   </span>
                 </span>
-              )}
+              )} */}
               <span className={`flex flex-col ${sizeClasses.column}`}>
                 <span
                   className={`bold-text text-[#464647] ${sizeClasses.discount}`}

package/src/components/ServiceItem/ServiceItemDesktop.tsx

@@ -520,7 +520,6 @@ function ServiceItemPB({
           isFlores={isFlores}
           isNewUiEnabled={isNewUiEnabledPeru}
           showLoginOption={showLoginOption}
-          priority_stage_ids={priority_stage_ids}
         />
       ) : isNewUi && !isTrain ? (
         <FeatureServiceUi

package/src/ui/DiscountBanners/defaultBackgrounds.ts

@@ -36,7 +36,7 @@ export const CAMPAIGN_ART: Record<string, { image: string; accent: string }> = {
   first_time: { image: toImageUrl(firstTimeArt), accent: "#D63384" },
   cashback: { image: toImageUrl(cashbackArt), accent: "#0069D1" },
   round_trip: { image: toImageUrl(roundTripArt), accent: "#5C8A00" },
-  promo_code: { image: toImageUrl(promoCodeArt), accent: "#E08A00" },
+  instant_discount: { image: toImageUrl(promoCodeArt), accent: "#E08A00" },
   seat_level: { image: toImageUrl(seatLevelArt), accent: "#B87500" },
-  instant_discount: { image: toImageUrl(instantArt), accent: "#107E23" },
+  promo_code: { image: toImageUrl(instantArt), accent: "#107E23" },
 };

package/src/ui/DiscountBanners/discountUtils.ts

@@ -10,15 +10,15 @@ const DESCUENTOS_ESPECIALES_LABEL = "Descuentos especiales";
 const REMATE_KEY = "remate";
 
 export const CAMPAIGN_TYPE_LABELS: Record<string, string> = {
-  last_minute: "Última hora",
+  last_minute: "Oferta de último minuto",
   first_time: "Primera compra",
   cashback: "Cashback",
   return_booking: "Pasaje de vuelta",
-  round_trip: "Ida y vuelta",
+  round_trip: "Ofertas de ida y vuelta",
   early_bird: "Compra anticipada",
   promo_code: "Código promocional",
   seat_level: "Descuento por asiento",
-  instant_discount: "Descuento inmediato",
+  instant_discount: "Oferta instantánea",
 };
 const ACCENTED_CHARS: Record<string, string> = {
   á: "a",
@@ -68,7 +68,8 @@ function getServiceDiscount(
   }
 
   if (
-    service?.discount_type === "fixed" &&
+    (service?.discount_type === "fixed" ||
+      service?.discount_type === "fixed_price") &&
     service?.discount_value != null &&
     service.discount_value > 0
   ) {

package/src/ui/SeatSection/PeruSeatSection.tsx

@@ -95,7 +95,9 @@ function getNumberOfSeats(seatTypes: SeatType[]) {
 }
 
 function hasInclinationSeatTypes(seatTypes: SeatType[]): boolean {
-  return seatTypes.some((seat) => seat.label.includes("°"));
+  return (seatTypes ?? []).some((seat) =>
+    String(seat?.label ?? "").includes("°"),
+  );
 }
 
 function getSeatTypeIcon(label: string, serviceItem: any) {
@@ -121,7 +123,20 @@ function PeruSeatSection({
   const uniqueSeats = getUniqueSeats(seatTypes);
   const sortedSeatTypes = getSortedSeatTypes(seatTypes);
   const numberOfSeats = getNumberOfSeats(seatTypes);
-  const isCentered = numberOfSeats < 2 || removeDuplicateSeats;
+  const isMovilBus =
+    serviceItem?.operator_service_name === "MovilBus" ||
+    serviceItem?.operator_service_name === "Movil Bus";
+  const hasInclination = hasInclinationSeatTypes(seatTypes);
+  const seatTypeRows = uniqueSeats.filter(
+    (s) => !SEAT_EXCEPTIONS.includes(s.label),
+  );
+  // A service that exposes more than one seat type (e.g. "Bus Cama" + "160°")
+  // lists every type with its own fare, under a shared "Desde" heading.
+  const showSeatTypeRows =
+    (isMovilBus || hasInclination) && seatTypeRows.length > 1;
+  // Stacked seat-type rows must stay top-aligned with their labels.
+  const isCentered =
+    !showSeatTypeRows && (numberOfSeats < 2 || removeDuplicateSeats);
 
   const formatPrice = (price: number) =>
     availableSeats <= 0
@@ -161,48 +176,36 @@ function PeruSeatSection({
   };
 
   const renderSeatPrices = () => {
-    const isMovilBus =
-      serviceItem?.operator_service_name === "MovilBus" ||
-      serviceItem?.operator_service_name === "Movil Bus";
-    const hasInclination = hasInclinationSeatTypes(seatTypes);
-
     // Multiple unique seat types → show a price row for each (MovilBus or inclination types)
-    if ((isMovilBus || hasInclination) && uniqueSeats.length > 1) {
-      const filteredSeats = uniqueSeats.filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
-      const prices = filteredSeats.map((val, key) => {
-        const { discountedPrice } = CommonService.calculateDiscountedPrice(
-          val.price,
-          serviceItem,
-        );
+    if (showSeatTypeRows) {
+      const prices = seatTypeRows.map((val, key) => {
+        const { originalPrice, discountedPrice } =
+          CommonService.calculateDiscountedPrice(val.price, serviceItem);
         return (
           <span
             key={key}
             className="flex items-center text-[13.33px] bold-text"
           >
-            {formatPrice(discountedPrice)}
+            {formatPrice(showOriginalFare ? originalPrice : discountedPrice)}
           </span>
         );
       });
 
-      // Only add "Desde" for inclination types, not for MovilBus
-      if (hasInclination && !isMovilBus) {
-        return (
-          <div className="relative">
-            <span
-              key="desde"
-              className="text-[12px] font-normal text-[#6a6a6a] absolute"
-              style={{ top: "-15px" }}
-            >
-              Desde
-            </span>
-            <div className="flex flex-col" style={{ gap: "12px" }}>
-              {prices}
-            </div>
+      // Stacked fares always sit under a "Desde" heading.
+      return (
+        <div className="relative">
+          <span
+            key="desde"
+            className="text-[12px] font-normal text-[#6a6a6a] absolute"
+            style={{ top: "-15px" }}
+          >
+            Desde
+          </span>
+          <div className="flex flex-col" style={{ gap: "12px" }}>
+            {prices}
           </div>
-        );
-      }
-
-      return prices;
+        </div>
+      );
     }
 
     // Single seat type → original behaviour (one lowest-fare price)
@@ -240,6 +243,9 @@ function PeruSeatSection({
   // itself; only ui_type and the ready-made badge text come from discounts[0].
   const peruDiscount = serviceItem?.discounts?.[0];
   const uiType = peruDiscount?.ui_type;
+  // Tier B (ui_type 1) announces the offer elsewhere, so the fare itself must
+  // render exactly as it would with no discount.
+  const showOriginalFare = hasDiscount && uiType === 1;
   const discountType = serviceItem?.discount_type;
   const discountValueRaw = serviceItem?.discount_value;
   const maxDiscount = serviceItem?.max_discount;
@@ -285,15 +291,9 @@ function PeruSeatSection({
         : null);
 
   const renderLabels = () => {
-    const isMovilBus =
-      serviceItem?.operator_service_name === "MovilBus" ||
-      serviceItem?.operator_service_name === "Movil Bus";
-    const hasInclination = hasInclinationSeatTypes(seatTypes);
-
     // Multiple unique seat types → show a label row for each (MovilBus or inclination types)
-    if ((isMovilBus || hasInclination) && uniqueSeats.length > 1) {
-      return uniqueSeats
-        .filter((s) => !SEAT_EXCEPTIONS.includes(s.label))
+    if (showSeatTypeRows) {
+      return seatTypeRows
         .map((val, key) => (
           <span
             key={key}
@@ -301,7 +301,7 @@ function PeruSeatSection({
               isSoldOut ? "text-[#c0c0c0]" : ""
             }`}
           >
-            {isSeatIcon && !hasDiscount && (
+            {isSeatIcon && (
               <img
                 src={getSeatTypeIcon(val.label, serviceItem) as string}
                 alt="seattype"
@@ -376,7 +376,7 @@ function PeruSeatSection({
     );
   };
 
-  if (hasDiscount && discountSeat) {
+  if (hasDiscount && discountSeat && !(uiType === 1 && showSeatTypeRows)) {
     // Tier B (ui_type 1): offer text is announced elsewhere, but the fare
     // itself must render exactly as it would with no discount — no
     // strike-off, no badge, no fire icon.

package/src/ui/ServiceBadges/ServiceBadges.tsx

@@ -97,7 +97,7 @@ const ServiceBadges: React.FC<ServiceBadgesProps> = ({
           <div>{"Tren Express"}</div>
         </div>
       )}
-      {boardingName && isAllinBus && !showTopLabel && (
+      {boardingName && isAllinBus && (
         <div
           className={`flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px]  z-20`}
           style={{

package/src/ui/mobileweb/SeatSectionMobile.tsx

@@ -96,7 +96,9 @@ const getFilteredSeats = (item: string) => {
 };
 
 function hasInclinationSeatTypes(seatTypes: SeatType[]): boolean {
-  return seatTypes.some((seat) => seat.label.includes("°"));
+  return (seatTypes ?? []).some((seat) =>
+    String(seat?.label ?? "").includes("°"),
+  );
 }
 
 const getUniqueSeats = (data: SeatType[], limit: number): SeatType[] => {
@@ -137,6 +139,20 @@ function SeatSectionMobile({
 }: SeatSectionMobileProps): React.ReactElement {
   const hasMultipleTypes = (seatTypesData?.length ?? 0) > 2;
 
+  const isMovilBus =
+    serviceItem?.operator_service_name === "MovilBus" ||
+    serviceItem?.operator_service_name === "Movil Bus";
+  const hasInclination = hasInclinationSeatTypes(seatTypesData ?? []);
+  // Fetch ALL unique seats (no slice limit) for the multi-row seat-type case
+  const allUniqueSeats = getUniqueSeats(seatTypesData ?? [], Infinity as number);
+  // A service that exposes more than one seat type (e.g. "Bus Cama" + "160°")
+  // lists every type with its own fare, under a shared "Desde" heading.
+  const showSeatTypeRows =
+    (isMovilBus || hasInclination) && allUniqueSeats.length > 1;
+  // Tier B (ui_type 1) announces the offer elsewhere, so the fare itself must
+  // render exactly as it would with no discount.
+  const isOfferTextOnlyTier = serviceItem?.ui_type === 1;
+
   const getFare = (fare: number) => {
     if (removeDuplicateSeats && availableSeats <= 0 && !isPeru) {
       return commonService.currency(0, currencySign);
@@ -165,49 +181,11 @@ function SeatSectionMobile({
     if (lowestFare === null) return null;
 
     const priceColor = isSoldOut ? "#bbb" : seatPriceColor;
-    const isMovilBus =
-      serviceItem?.operator_service_name === "MovilBus" ||
-      serviceItem?.operator_service_name === "Movil Bus";
-    const hasInclination = hasInclinationSeatTypes(seatTypesData ?? []);
-
-    // Fetch ALL unique seats (no slice limit) for the multi-row MovilBus case
-    const uniqueSeats = getUniqueSeats(seatTypesData ?? [], Infinity as number);
-
-    // MovilBus + multiple unique seat types → render a row per seat
-    if (isMovilBus && uniqueSeats.length > 1) {
-      return (
-        <>
-          {uniqueSeats.map((seat, key) => {
-            const { discountedPrice } = commonService.calculateDiscountedPrice(
-              Number(seat.fare),
-              serviceItem,
-            );
-            return (
-              <div
-                key={key}
-                className="w-[100%] flex flex-row justify-between items-center"
-              >
-                <span
-                  className="min-[420]:text-[13px] text-[12px] bold-text whitespace-nowrap"
-                  style={{ color: isSoldOut ? "#bbb" : "#464647" }}
-                >
-                  {commonService.truncateSeatLabel(seat.label)}
-                </span>
-                <span
-                  className="min-[420]:text-[13px] text-[12px] bold-text"
-                  style={{ color: priceColor }}
-                >
-                  {commonService.currency(discountedPrice, currencySign)}
-                </span>
-              </div>
-            );
-          })}
-        </>
-      );
-    }
+    const uniqueSeats = allUniqueSeats;
 
-    // Inclination seat types + multiple unique seat types → render a row per seat with "Desde" above prices
-    if (hasInclination && uniqueSeats.length > 1) {
+    // Multiple unique seat types → render a row per seat, always under a
+    // "Desde" heading.
+    if (showSeatTypeRows) {
       return (
         <div className="relative">
           <span
@@ -217,10 +195,11 @@ function SeatSectionMobile({
             Desde
           </span>
           {uniqueSeats.map((seat, key) => {
-            const { discountedPrice } = commonService.calculateDiscountedPrice(
-              Number(seat.fare),
-              serviceItem,
-            );
+            const { originalPrice, discountedPrice } =
+              commonService.calculateDiscountedPrice(
+                Number(seat.fare),
+                serviceItem,
+              );
             return (
               <div
                 key={key}
@@ -237,7 +216,10 @@ function SeatSectionMobile({
                   className="min-[420]:text-[13px] text-[12px] bold-text"
                   style={{ color: priceColor }}
                 >
-                  {commonService.currency(discountedPrice, currencySign)}
+                  {commonService.currency(
+                    showOriginalFare ? originalPrice : discountedPrice,
+                    currencySign,
+                  )}
                 </span>
               </div>
             );
@@ -436,9 +418,19 @@ function SeatSectionMobile({
       peruDiscountCalc.originalPrice !== peruDiscountCalc.discountedPrice
     : discountedSeats?.some((s) => s.originalPrice !== s.discountedPrice);
 
+  const showOriginalFare = Boolean(hasDiscount) && isOfferTextOnlyTier;
+
+  // Peru prices off the lowest fare across all seat types, so the label comes
+  // from the cheapest seat rather than being left blank.
+  const peruLowestFareLabel = allUniqueSeats[0]?.label ?? "";
+
   const discountSeat =
     isPeru && peruDiscountCalc
-      ? { label: "", fare: peruLowestFare as number, ...peruDiscountCalc }
+      ? {
+          label: peruLowestFareLabel,
+          fare: peruLowestFare as number,
+          ...peruDiscountCalc,
+        }
       : discountedSeats
           ?.filter((seat) => !EXCEPTIONS.includes(seat.label))
           ?.sort((a, b) => a.discountedPrice - b.discountedPrice)[0];
@@ -602,7 +594,9 @@ function SeatSectionMobile({
             </span>
           ) : null}
         </div>
-      ) : hasDiscount && discountSeat ? (
+      ) : hasDiscount &&
+        discountSeat &&
+        !(isPeru && showSeatTypeRows && isOfferTextOnlyTier) ? (
         <div>
           <div className="relative grid grid-cols-[auto_auto] justify-between gap-x-[8px] ">
             {serviceItem?.ui_type !== 1 && discountBadgeText && (
@@ -660,7 +654,11 @@ function SeatSectionMobile({
               className="min-[420]:text-[13px] text-[12px] leading-[24px]"
               style={{ color: isSoldOut ? "#bbb" : "#464647" }}
             >
-              {serviceItem?.ui_type === 1 ? discountSeat.label : "Desde"}
+              {isOfferTextOnlyTier
+                ? commonService.capitalize(
+                    commonService.truncateSeatLabel(discountSeat.label),
+                  )
+                : "Desde"}
             </span>
             <span
               className="flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]"

package/src/ui/mobileweb/ServiceBadgesMobile.tsx

@@ -104,7 +104,7 @@ const ServiceBadgesMobile: React.FC<ServiceBadgesMobileProps> = ({
           <div>{"Tren Express"}</div>
         </div>
       )}
-      {boardingName && isAllinBus && !showTopLabel && (
+      {boardingName && isAllinBus && (
         <div
           className={`flex items-center gap-[2p x] py-[4px] px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] h-[24px] z-20`}
           style={{