/**
 * Jet Listing Grid — inner-gutter nav for centered peek sliders.
 *
 * Class `pfi-listing-grid--centered-peek` lives on the Jet block wrapper
 * (.jet-listing-grid--blocks), not on .jet-listing-grid itself.
 */

.pfi-listing-grid--centered-peek .jet-listing-grid,
.slider--dimmed .jet-listing-grid {
  position: relative;
  --pfi-arrow-size: 2.75rem;
}

.pfi-listing-grid--centered-peek .jet-listing-grid__slider-icon.swiper-arrow,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-prev-svg,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-next-svg,
.slider--dimmed .jet-listing-grid .jet-listing-grid__slider-icon.swiper-arrow,
.slider--dimmed .jet-listing-grid .swiper-button-prev-svg,
.slider--dimmed .jet-listing-grid .swiper-button-next-svg {
  width: var(--pfi-arrow-size) !important;
  height: var(--pfi-arrow-size) !important;
  margin-top: 0 !important;
  line-height: var(--pfi-arrow-size) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: #282a5e;
  color: #fff;
  box-shadow: 0 2px 14px rgba(26, 39, 68, 0.22);
  z-index: 95;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 0.2s ease, opacity 0.2s ease;
  bottom: auto !important;
}

.pfi-listing-grid--centered-peek .jet-listing-grid__slider-icon.swiper-arrow svg,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-prev-svg svg,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-next-svg svg,
.slider--dimmed .jet-listing-grid .jet-listing-grid__slider-icon.swiper-arrow svg,
.slider--dimmed .jet-listing-grid .swiper-button-prev-svg svg,
.slider--dimmed .jet-listing-grid .swiper-button-next-svg svg {
  height: 1.125rem !important;
  width: auto;
}

.pfi-listing-grid--centered-peek .jet-listing-grid__slider-icon.swiper-arrow svg path,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-prev-svg svg path,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-next-svg svg path,
.slider--dimmed .jet-listing-grid .jet-listing-grid__slider-icon.swiper-arrow svg path,
.slider--dimmed .jet-listing-grid .swiper-button-prev-svg svg path,
.slider--dimmed .jet-listing-grid .swiper-button-next-svg svg path {
  fill: currentColor;
}

.pfi-listing-grid--centered-peek .jet-listing-grid__slider-icon.swiper-arrow:hover,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-prev-svg:hover,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-next-svg:hover,
.slider--dimmed .jet-listing-grid .jet-listing-grid__slider-icon.swiper-arrow:hover,
.slider--dimmed .jet-listing-grid .swiper-button-prev-svg:hover,
.slider--dimmed .jet-listing-grid .swiper-button-next-svg:hover {
  background: #4f4c79;
}

.pfi-listing-grid--centered-peek .jet-listing-grid__slider-icon.swiper-button-disabled,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-prev-svg.swiper-button-disabled,
.pfi-listing-grid--centered-peek .jet-listing-grid .swiper-button-next-svg.swiper-button-disabled,
.slider--dimmed .jet-listing-grid .jet-listing-grid__slider-icon.swiper-button-disabled,
.slider--dimmed .jet-listing-grid .swiper-button-prev-svg.swiper-button-disabled,
.slider--dimmed .jet-listing-grid .swiper-button-next-svg.swiper-button-disabled {
  opacity: 0.35;
  pointer-events: none;
  cursor: not-allowed;
}

.pfi-listing-grid--centered-peek .jet-listing-grid:not(.pfi-nav-peek-ready) .jet-listing-grid__slider-icon,
.pfi-listing-grid--centered-peek .jet-listing-grid:not(.pfi-nav-peek-ready) .swiper-button-prev-svg,
.pfi-listing-grid--centered-peek .jet-listing-grid:not(.pfi-nav-peek-ready) .swiper-button-next-svg,
.slider--dimmed .jet-listing-grid:not(.pfi-nav-peek-ready) .jet-listing-grid__slider-icon,
.slider--dimmed .jet-listing-grid:not(.pfi-nav-peek-ready) .swiper-button-prev-svg,
.slider--dimmed .jet-listing-grid:not(.pfi-nav-peek-ready) .swiper-button-next-svg {
  opacity: 0;
  pointer-events: none;
}
