kupos-ui-components-lib 10.4.14 → 10.4.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/components/FilterSortBar/FilterSortBarMobile.js +15 -0
  2. package/dist/ui/PaymentCardMobile/PaymentCardMobile.js +23 -48
  3. package/package.json +2 -2
  4. package/src/components/FilterSortBar/FilterSortBarMobile.tsx +16 -0
  5. package/src/ui/PaymentCardMobile/PaymentCardMobile.tsx +35 -67
package/dist/components/FilterSortBar/FilterSortBarMobile.js CHANGED
@@ -124,6 +124,21 @@ const FilterSortBarMobile = ({ categories, onApply, onClearFilter, sortOptions,
124
124
  return s.key === key ? Object.assign(Object.assign({}, s), { active: !s.active }) : s;
125
125
  });
126
126
  onSortChange(updated);
127
+ // A cohort sort chip's matching checkbox (checkedViaSort: true, option
128
+ // id === sort key) mirrors this chip inside the Filtros sheet. Keep that
129
+ // mirror in sync when the chip is toggled from the bar — otherwise the
130
+ // chip turns off but the underlying filter option stays selected.
131
+ if (!target.direction) {
132
+ const nextSelected = !target.active;
133
+ const hasMirror = categories.some((cat) => { var _a; return (_a = cat.options) === null || _a === void 0 ? void 0 : _a.some((o) => o.checkedViaSort && o.id === key); });
134
+ if (hasMirror) {
135
+ const updatedCategories = categories.map((cat) => {
136
+ var _a;
137
+ return (Object.assign(Object.assign({}, cat), { options: (_a = cat.options) === null || _a === void 0 ? void 0 : _a.map((o) => (o.checkedViaSort && o.id === key ? Object.assign(Object.assign({}, o), { selected: nextSelected }) : o)) }));
138
+ });
139
+ onApply("all", updatedCategories);
140
+ }
141
+ }
127
142
  };
128
143
  return (React.createElement("div", null,
129
144
  React.createElement("div", { className: "flex items-center gap-[8px]" },
package/dist/ui/PaymentCardMobile/PaymentCardMobile.js CHANGED
@@ -17,6 +17,7 @@ class ModalTabStateWrapper extends React.Component {
17
17
  }
18
18
  }
19
19
  export const PaymentCardMobile = (props) => {
20
+ var _a, _b;
20
21
  const { serviceNameOnward, serviceNameReturn, currencySign, dateOnward, dateReturn, sourceOnward, sourceReturn, destinationOnward, destinationReturn, boardingStageOnward, boardingStageReturn, droppingStageOnward, droppingStageReturn, boardingTimeOnward, boardingTimeReturn, droppingTimeOnward, droppingTimeReturn, durationOnward, durationReturn, selectSeatOnward, selectSeatReturn, journeyTypeActive, setJourneyTypeActive, translation, trainTypeOnward, trainTypeReturn, colors, trainType, icons, selectedOnward, selectedReturn, removeDiscountAtomValue, netFare, promoCode, onPromoRemove, renderDiscount, discountAmount, currency, insuranceData, isPeru, walletMoney, walletLabel, virtualMoney, virtualLimit, creditosLabel, showDetails = false, setShowDetails, } = props;
21
22
  // We use a Class component wrapper below to hold the state,
22
23
  // avoiding Invalid Hook Call issues when linked in external apps with multiple React instances.
@@ -31,8 +32,8 @@ export const PaymentCardMobile = (props) => {
31
32
  ? droppingStageReturn
32
33
  : droppingStageOnward;
33
34
  const activeDroppingTime = isReturn ? droppingTimeReturn : droppingTimeOnward;
34
- const activeSource = isReturn ? sourceReturn : sourceOnward;
35
- const activeDest = isReturn ? destinationReturn : destinationOnward;
35
+ const activeSource = (_a = (isReturn ? sourceReturn : sourceOnward)) === null || _a === void 0 ? void 0 : _a.replace(/,\s*/g, ", ");
36
+ const activeDest = (_b = (isReturn ? destinationReturn : destinationOnward)) === null || _b === void 0 ? void 0 : _b.replace(/,\s*/g, ", ");
36
37
  const activeServiceName = isReturn ? serviceNameReturn : serviceNameOnward;
37
38
  const activeDate = isReturn ? dateReturn : dateOnward;
38
39
  const activeDuration = isReturn ? durationReturn : durationOnward;
@@ -119,7 +120,7 @@ export const PaymentCardMobile = (props) => {
119
120
  : "2px solid transparent",
120
121
  transition: "all 0.2s ease",
121
122
  } }, (translation === null || translation === void 0 ? void 0 : translation.return) || "Vuelta"))) : null,
122
- React.createElement("div", { style: { padding: "16px 16px 0 16px" } },
123
+ React.createElement("div", { style: { padding: "16px 10px 0 10px" } },
123
124
  React.createElement("div", { style: {
124
125
  display: "flex",
125
126
  alignItems: "flex-start",
@@ -159,27 +160,14 @@ export const PaymentCardMobile = (props) => {
159
160
  } },
160
161
  React.createElement("div", { style: {
161
162
  flexShrink: 0,
162
- width: "28px",
163
- height: "28px",
163
+ width: "20px",
164
+ height: "20px",
164
165
  display: "flex",
165
166
  alignItems: "center",
166
167
  justifyContent: "center",
167
168
  marginTop: "2px",
168
- } }, (icons === null || icons === void 0 ? void 0 : icons.origin) ? (React.createElement("img", { src: icons.origin, style: { width: "18px", height: "18px" }, alt: "origin" })) : (React.createElement("div", { style: {
169
- width: "22px",
170
- height: "22px",
171
- borderRadius: "50%",
172
- border: "2.5px solid #e0321c",
173
- display: "flex",
174
- alignItems: "center",
175
- justifyContent: "center",
176
169
  } },
177
- React.createElement("div", { style: {
178
- width: "8px",
179
- height: "8px",
180
- borderRadius: "50%",
181
- backgroundColor: "#e0321c",
182
- } })))),
170
+ React.createElement("img", { src: icons.origin, style: { width: "18px", height: "18px" }, alt: "origin" })),
183
171
  React.createElement("div", { style: { flex: 1 } },
184
172
  React.createElement("div", { style: {
185
173
  fontSize: "15px",
@@ -187,7 +175,7 @@ export const PaymentCardMobile = (props) => {
187
175
  color: "#464647",
188
176
  textTransform: "capitalize",
189
177
  lineHeight: 1.3,
190
- } }, activeSource),
178
+ }, className: "bold-text" }, activeSource),
191
179
  formatSubText(activeBoardingStage, activeBoardingTime) && (React.createElement("div", { style: {
192
180
  fontSize: "12px",
193
181
  color: "#464647",
@@ -197,25 +185,18 @@ export const PaymentCardMobile = (props) => {
197
185
  React.createElement("div", { style: {
198
186
  display: "flex",
199
187
  alignItems: "flex-start",
200
- gap: "8px",
188
+ gap: "7px",
201
189
  } },
202
190
  React.createElement("div", { style: {
203
191
  flexShrink: 0,
204
- width: "28px",
205
- height: "28px",
192
+ width: "20px",
193
+ height: "20px",
206
194
  display: "flex",
207
195
  alignItems: "center",
208
196
  justifyContent: "center",
209
197
  marginTop: "2px",
210
- } }, (icons === null || icons === void 0 ? void 0 : icons.destination) ? (React.createElement("img", { src: icons.destination, style: { width: "18px", height: "18px" }, alt: "destination" })) : (React.createElement("div", { style: {
211
- width: "22px",
212
- height: "22px",
213
- display: "flex",
214
- alignItems: "center",
215
- justifyContent: "center",
216
198
  } },
217
- React.createElement("svg", { viewBox: "0 0 24 24", width: "24", height: "24", fill: "none" },
218
- React.createElement("path", { d: "M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z", fill: "#e05252" }))))),
199
+ React.createElement("img", { src: icons.destination, style: { width: "18px", height: "18px" }, alt: "destination" })),
219
200
  React.createElement("div", { style: { flex: 1 } },
220
201
  React.createElement("div", { style: {
221
202
  fontSize: "15px",
@@ -223,7 +204,7 @@ export const PaymentCardMobile = (props) => {
223
204
  color: "#464647",
224
205
  textTransform: "capitalize",
225
206
  lineHeight: 1.3,
226
- } }, activeDest),
207
+ }, className: "bold-text" }, activeDest),
227
208
  formatSubText(activeDroppingStage, activeDroppingTime) && (React.createElement("div", { style: {
228
209
  fontSize: "12px",
229
210
  color: "#464647",
@@ -268,7 +249,7 @@ export const PaymentCardMobile = (props) => {
268
249
  zIndex: 20,
269
250
  } })),
270
251
  React.createElement(ModalTabStateWrapper, { initialTab: journeyTypeActive || 1, showDetails: showDetails, render: (modalTab, setModalTab) => {
271
- var _a, _b, _c, _d, _e, _f, _g;
252
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
272
253
  const modalIsReturn = modalTab === 2;
273
254
  const modalBoardingStage = modalIsReturn
274
255
  ? boardingStageReturn
@@ -282,10 +263,8 @@ export const PaymentCardMobile = (props) => {
282
263
  const modalDroppingTime = modalIsReturn
283
264
  ? droppingTimeReturn
284
265
  : droppingTimeOnward;
285
- const modalSource = modalIsReturn ? sourceReturn : sourceOnward;
286
- const modalDest = modalIsReturn
287
- ? destinationReturn
288
- : destinationOnward;
266
+ const modalSource = (_a = (modalIsReturn ? sourceReturn : sourceOnward)) === null || _a === void 0 ? void 0 : _a.replace(/,\s*/g, ", ");
267
+ const modalDest = (_b = (modalIsReturn ? destinationReturn : destinationOnward)) === null || _b === void 0 ? void 0 : _b.replace(/,\s*/g, ", ");
289
268
  const modalServiceName = modalIsReturn
290
269
  ? serviceNameReturn
291
270
  : serviceNameOnward;
@@ -402,11 +381,6 @@ export const PaymentCardMobile = (props) => {
402
381
  marginLeft: "4px",
403
382
  } }, (_b = (_a = val.type) === null || _a === void 0 ? void 0 : _a.charAt(0)) === null || _b === void 0 ? void 0 : _b.toUpperCase()))));
404
383
  }))))),
405
- React.createElement("div", { style: S.section, className: "mt-[30px]" },
406
- React.createElement("div", { style: S.sectionTitle, className: "bold-text" }, "Pol\u00EDtica"),
407
- React.createElement("div", { style: S.sectionRow },
408
- React.createElement("span", { style: { flex: 1 } }, "Cancelaci\u00F3n"),
409
- React.createElement("span", { style: Object.assign(Object.assign({}, S.sectionRowValue), { fontSize: "13px" }), className: "bold-text" }, "Gratis hasta 24h antes"))),
410
384
  React.createElement("div", { style: S.section, className: "mt-[30px]" },
411
385
  React.createElement("div", { style: S.sectionTitle, className: "bold-text" }, "Tarifa"),
412
386
  selectSeatOnward && selectedOnward && selectedOnward[0]
@@ -437,19 +411,19 @@ export const PaymentCardMobile = (props) => {
437
411
  : null,
438
412
  (insuranceData === null || insuranceData === void 0 ? void 0 : insuranceData.insurance_enabled) ? (React.createElement("div", { style: S.sectionRow },
439
413
  React.createElement("span", { style: { flex: 1 } },
440
- ((_b = (_a = selectedOnward === null || selectedOnward === void 0 ? void 0 : selectedOnward[1]) === null || _a === void 0 ? void 0 : _a.reduce((acc, qty) => acc + qty, 0)) !== null && _b !== void 0 ? _b : 0) +
441
- ((_d = (_c = selectedReturn === null || selectedReturn === void 0 ? void 0 : selectedReturn[1]) === null || _c === void 0 ? void 0 : _c.reduce((acc, qty) => acc + qty, 0)) !== null && _d !== void 0 ? _d : 0),
414
+ ((_d = (_c = selectedOnward === null || selectedOnward === void 0 ? void 0 : selectedOnward[1]) === null || _c === void 0 ? void 0 : _c.reduce((acc, qty) => acc + qty, 0)) !== null && _d !== void 0 ? _d : 0) +
415
+ ((_f = (_e = selectedReturn === null || selectedReturn === void 0 ? void 0 : selectedReturn[1]) === null || _e === void 0 ? void 0 : _e.reduce((acc, qty) => acc + qty, 0)) !== null && _f !== void 0 ? _f : 0),
442
416
  " ",
443
417
  "x Viajero Seguro"),
444
- React.createElement("span", { style: S.sectionRowValue, className: "bold-text" }, CommonService.currency((_e = insuranceData === null || insuranceData === void 0 ? void 0 : insuranceData.insurance_total) !== null && _e !== void 0 ? _e : 0, currencySign)))) : null,
445
- ((_f = props.serviceFeeDataStateValue) === null || _f === void 0 ? void 0 : _f.total_convenience_fee_amount) && (React.createElement("div", { style: S.sectionRow },
418
+ React.createElement("span", { style: S.sectionRowValue, className: "bold-text" }, CommonService.currency((_g = insuranceData === null || insuranceData === void 0 ? void 0 : insuranceData.insurance_total) !== null && _g !== void 0 ? _g : 0, currencySign)))) : null,
419
+ ((_h = props.serviceFeeDataStateValue) === null || _h === void 0 ? void 0 : _h.total_convenience_fee_amount) && (React.createElement("div", { style: S.sectionRow },
446
420
  React.createElement("span", { style: { flex: 1 } }, "Cargo por servicio"),
447
421
  React.createElement("span", { style: S.sectionRowValue, className: "bold-text" }, CommonService.currency(props.serviceFeeDataStateValue
448
422
  .total_convenience_fee_amount, currencySign)))),
449
423
  (promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCodeApplied) && (React.createElement(React.Fragment, null,
450
424
  React.createElement("div", { style: S.sectionRow },
451
425
  React.createElement("span", { style: { flex: 1 } }, (translation === null || translation === void 0 ? void 0 : translation.promotionalCode) || "Código promocional"),
452
- React.createElement("span", { style: Object.assign(Object.assign({}, S.sectionRowValue), { color: colors === null || colors === void 0 ? void 0 : colors.promoCodePriceColor }), className: "bold-text" }, CommonService.currency((_g = promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) !== null && _g !== void 0 ? _g : 0, currencySign))),
426
+ React.createElement("span", { style: Object.assign(Object.assign({}, S.sectionRowValue), { color: colors === null || colors === void 0 ? void 0 : colors.promoCodePriceColor }), className: "bold-text" }, CommonService.currency((_j = promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) !== null && _j !== void 0 ? _j : 0, currencySign))),
453
427
  (promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? (React.createElement("div", { style: {
454
428
  display: "flex",
455
429
  alignItems: "center",
@@ -530,9 +504,10 @@ export const PaymentCardMobile = (props) => {
530
504
  alignItems: "center",
531
505
  justifyContent: "center",
532
506
  gap: "6px",
533
- paddingBottom: "14px",
507
+ paddingBottom: "8px",
534
508
  cursor: "pointer",
535
509
  userSelect: "none",
510
+ marginTop: "-5px",
536
511
  }, onClick: () => setShowDetails && setShowDetails(!showDetails) },
537
512
  React.createElement("span", { style: { fontSize: "14px", fontWeight: 700, color: "#464647" } }, "Ver todos los detalles"),
538
513
  React.createElement("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", style: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "10.4.14",
3
+ "version": "10.4.15",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -30,7 +30,7 @@
30
30
  "author": "Zahid Dar",
31
31
  "license": "MIT",
32
32
  "dependencies": {
33
- "kupos-ui-components-lib": "^9.0.7",
33
+ "kupos-ui-components-lib": "^10.4.15",
34
34
  "lottie-react": "^2.4.1",
35
35
  "lottie-web": "^5.13.0",
36
36
  "moment": "^2.30.1",
package/src/components/FilterSortBar/FilterSortBarMobile.tsx CHANGED
@@ -175,6 +175,22 @@ const FilterSortBarMobile = ({
175
175
  return s.key === key ? { ...s, active: !s.active } : s;
176
176
  });
177
177
  onSortChange(updated);
178
+
179
+ // A cohort sort chip's matching checkbox (checkedViaSort: true, option
180
+ // id === sort key) mirrors this chip inside the Filtros sheet. Keep that
181
+ // mirror in sync when the chip is toggled from the bar — otherwise the
182
+ // chip turns off but the underlying filter option stays selected.
183
+ if (!target.direction) {
184
+ const nextSelected = !target.active;
185
+ const hasMirror = categories.some((cat) => cat.options?.some((o) => o.checkedViaSort && o.id === key));
186
+ if (hasMirror) {
187
+ const updatedCategories = categories.map((cat) => ({
188
+ ...cat,
189
+ options: cat.options?.map((o) => (o.checkedViaSort && o.id === key ? { ...o, selected: nextSelected } : o)),
190
+ }));
191
+ onApply("all", updatedCategories);
192
+ }
193
+ }
178
194
  };
179
195
 
180
196
  return (
package/src/ui/PaymentCardMobile/PaymentCardMobile.tsx CHANGED
@@ -89,8 +89,13 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
89
89
  ? droppingStageReturn
90
90
  : droppingStageOnward;
91
91
  const activeDroppingTime = isReturn ? droppingTimeReturn : droppingTimeOnward;
92
- const activeSource = isReturn ? sourceReturn : sourceOnward;
93
- const activeDest = isReturn ? destinationReturn : destinationOnward;
92
+ const activeSource = (isReturn ? sourceReturn : sourceOnward)?.replace(
93
+ /,\s*/g,
94
+ ", ",
95
+ );
96
+ const activeDest = (
97
+ isReturn ? destinationReturn : destinationOnward
98
+ )?.replace(/,\s*/g, ", ");
94
99
  const activeServiceName = isReturn ? serviceNameReturn : serviceNameOnward;
95
100
  const activeDate = isReturn ? dateReturn : dateOnward;
96
101
  const activeDuration = isReturn ? durationReturn : durationOnward;
@@ -206,7 +211,7 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
206
211
  </div>
207
212
  ) : null}
208
213
 
209
- <div style={{ padding: "16px 16px 0 16px" }}>
214
+ <div style={{ padding: "16px 10px 0 10px" }}>
210
215
  {/* Service Name + Date Badge */}
211
216
  <div
212
217
  style={{
@@ -270,42 +275,19 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
270
275
  <div
271
276
  style={{
272
277
  flexShrink: 0,
273
- width: "28px",
274
- height: "28px",
278
+ width: "20px",
279
+ height: "20px",
275
280
  display: "flex",
276
281
  alignItems: "center",
277
282
  justifyContent: "center",
278
283
  marginTop: "2px",
279
284
  }}
280
285
  >
281
- {icons?.origin ? (
282
- <img
283
- src={icons.origin}
284
- style={{ width: "18px", height: "18px" }}
285
- alt="origin"
286
- />
287
- ) : (
288
- <div
289
- style={{
290
- width: "22px",
291
- height: "22px",
292
- borderRadius: "50%",
293
- border: "2.5px solid #e0321c",
294
- display: "flex",
295
- alignItems: "center",
296
- justifyContent: "center",
297
- }}
298
- >
299
- <div
300
- style={{
301
- width: "8px",
302
- height: "8px",
303
- borderRadius: "50%",
304
- backgroundColor: "#e0321c",
305
- }}
306
- />
307
- </div>
308
- )}
286
+ <img
287
+ src={icons.origin}
288
+ style={{ width: "18px", height: "18px" }}
289
+ alt="origin"
290
+ />
309
291
  </div>
310
292
  <div style={{ flex: 1 }}>
311
293
  <div
@@ -316,6 +298,7 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
316
298
  textTransform: "capitalize",
317
299
  lineHeight: 1.3,
318
300
  }}
301
+ className="bold-text"
319
302
  >
320
303
  {activeSource}
321
304
  </div>
@@ -339,44 +322,25 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
339
322
  style={{
340
323
  display: "flex",
341
324
  alignItems: "flex-start",
342
- gap: "8px",
325
+ gap: "7px",
343
326
  }}
344
327
  >
345
328
  <div
346
329
  style={{
347
330
  flexShrink: 0,
348
- width: "28px",
349
- height: "28px",
331
+ width: "20px",
332
+ height: "20px",
350
333
  display: "flex",
351
334
  alignItems: "center",
352
335
  justifyContent: "center",
353
336
  marginTop: "2px",
354
337
  }}
355
338
  >
356
- {icons?.destination ? (
357
- <img
358
- src={icons.destination}
359
- style={{ width: "18px", height: "18px" }}
360
- alt="destination"
361
- />
362
- ) : (
363
- <div
364
- style={{
365
- width: "22px",
366
- height: "22px",
367
- display: "flex",
368
- alignItems: "center",
369
- justifyContent: "center",
370
- }}
371
- >
372
- <svg viewBox="0 0 24 24" width="24" height="24" fill="none">
373
- <path
374
- d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"
375
- fill="#e05252"
376
- />
377
- </svg>
378
- </div>
379
- )}
339
+ <img
340
+ src={icons.destination}
341
+ style={{ width: "18px", height: "18px" }}
342
+ alt="destination"
343
+ />
380
344
  </div>
381
345
  <div style={{ flex: 1 }}>
382
346
  <div
@@ -387,6 +351,7 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
387
351
  textTransform: "capitalize",
388
352
  lineHeight: 1.3,
389
353
  }}
354
+ className="bold-text"
390
355
  >
391
356
  {activeDest}
392
357
  </div>
@@ -476,10 +441,12 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
476
441
  const modalDroppingTime = modalIsReturn
477
442
  ? droppingTimeReturn
478
443
  : droppingTimeOnward;
479
- const modalSource = modalIsReturn ? sourceReturn : sourceOnward;
480
- const modalDest = modalIsReturn
481
- ? destinationReturn
482
- : destinationOnward;
444
+ const modalSource = (
445
+ modalIsReturn ? sourceReturn : sourceOnward
446
+ )?.replace(/,\s*/g, ", ");
447
+ const modalDest = (
448
+ modalIsReturn ? destinationReturn : destinationOnward
449
+ )?.replace(/,\s*/g, ", ");
483
450
  const modalServiceName = modalIsReturn
484
451
  ? serviceNameReturn
485
452
  : serviceNameOnward;
@@ -710,7 +677,7 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
710
677
  </div>
711
678
 
712
679
  {/* ── POLÍTICA ── */}
713
- <div style={S.section} className="mt-[30px]">
680
+ {/* <div style={S.section} className="mt-[30px]">
714
681
  <div style={S.sectionTitle} className="bold-text">
715
682
  Política
716
683
  </div>
@@ -723,7 +690,7 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
723
690
  Gratis hasta 24h antes
724
691
  </span>
725
692
  </div>
726
- </div>
693
+ </div> */}
727
694
 
728
695
  {/* ── TARIFA ── */}
729
696
  <div style={S.section} className="mt-[30px]">
@@ -1016,9 +983,10 @@ export const PaymentCardMobile: React.FC<PaymentSideBarProps> = (props) => {
1016
983
  alignItems: "center",
1017
984
  justifyContent: "center",
1018
985
  gap: "6px",
1019
- paddingBottom: "14px",
986
+ paddingBottom: "8px",
1020
987
  cursor: "pointer",
1021
988
  userSelect: "none",
989
+ marginTop: "-5px",
1022
990
  }}
1023
991
  onClick={() => setShowDetails && setShowDetails(!showDetails)}
1024
992
  >