/* EC Match Slugs — Stage 13 payment-method optical alignment.
 *
 * Each approved PNG uses a different amount of transparent canvas. The
 * dimensions below are calibrated against the visible artwork, not the file
 * bounds, so all five brands share one optical top line and one optical bottom
 * line without distorting, cropping, recoloring or altering the source assets.
 */

.site-footer__payment-rail {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1rem 2.25rem !important;
  overflow: visible !important;
}

.site-footer__payment-rail > img.site-footer__payment-method-image {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  object-fit: contain !important;
  background: transparent !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Desktop/tablet target: 37px of visible artwork for every brand. */
.site-footer__payment-rail > img.site-footer__payment-method-image--visa {
  height: 53.36px !important;
  max-height: 53.36px !important;
  margin: 0 -19.16px 0 -18.35px !important;
  transform: translateY(-.29px) !important;
}

.site-footer__payment-rail > img.site-footer__payment-method-image--amex {
  height: 59.13px !important;
  max-height: 59.13px !important;
  margin: 0 -47.94px 0 -48.03px !important;
  transform: translateY(-.04px) !important;
}

.site-footer__payment-rail > img.site-footer__payment-method-image--mastercard {
  height: 90.81px !important;
  max-height: 90.81px !important;
  margin: 0 -30.98px !important;
  transform: translateY(-.19px) !important;
}

.site-footer__payment-rail > img.site-footer__payment-method-image--paypal {
  height: 67.14px !important;
  max-height: 67.14px !important;
  margin: 0 -30.69px !important;
  transform: translateY(.14px) !important;
}

.site-footer__payment-rail > img.site-footer__payment-method-image--ath-movil {
  height: 70.31px !important;
  max-height: 70.31px !important;
  margin: 0 -20.88px 0 -20.69px !important;
  transform: translateY(-.24px) !important;
}

@media (max-width: 620px) {
  .site-footer__payment-rail {
    gap: .9rem 1.6rem !important;
    padding-inline: .35rem !important;

    /* The approved PNGs contain large transparent canvases used for optical
     * alignment. Mastercard's mobile image box extends beyond the rail even
     * though its visible artwork is centered. Clip only that transparent
     * overflow so it cannot widen the document or enable lateral panning. */
    overflow-x: clip !important;
    overflow-y: visible !important;
  }

  /* Mobile target: 31px of visible artwork for every brand. */
  .site-footer__payment-rail > img.site-footer__payment-method-image--visa {
    height: 44.71px !important;
    max-height: 44.71px !important;
    margin: 0 -16.06px 0 -15.38px !important;
    transform: translateY(-.25px) !important;
  }

  .site-footer__payment-rail > img.site-footer__payment-method-image--amex {
    height: 49.55px !important;
    max-height: 49.55px !important;
    margin: 0 -40.17px 0 -40.24px !important;
    transform: translateY(-.03px) !important;
  }

  .site-footer__payment-rail > img.site-footer__payment-method-image--mastercard {
    height: 76.08px !important;
    max-height: 76.08px !important;
    margin: 0 -25.96px !important;
    transform: translateY(-.16px) !important;
  }

  .site-footer__payment-rail > img.site-footer__payment-method-image--paypal {
    height: 56.25px !important;
    max-height: 56.25px !important;
    margin: 0 -25.72px !important;
    transform: translateY(.12px) !important;
  }

  .site-footer__payment-rail > img.site-footer__payment-method-image--ath-movil {
    height: 58.91px !important;
    max-height: 58.91px !important;
    margin: 0 -17.49px 0 -17.33px !important;
    transform: translateY(-.20px) !important;
  }
}
