.wpf-related-products--carousel {
    --wpf-carousel-arrow-size: 42px;
    --wpf-carousel-arrow: #fff;
    --wpf-carousel-arrow-bg: #072ed2;
    --wpf-carousel-dot: #cbd5e1;
    --wpf-carousel-dot-active: #072ed2;
    --wpf-carousel-dot-border: #98a2b3;
}

.wpf-related-carousel { align-items: center; display: flex; position: relative; }
.wpf-related-carousel__viewport { overflow: hidden; width: 100%; }
.wpf-related-products--carousel .wpf-related-products__grid { display: flex !important; gap: var(--wpf-style-related-grid-gap, 28px) !important; transition: transform .45s ease; }
.wpf-related-products--carousel .wpf-related-product { flex: 0 0 calc((100% - var(--wpf-carousel-gap-total, 84px)) / var(--wpf-carousel-visible, 4)); }
.wpf-related-carousel__arrow { align-items: center !important; appearance: none !important; background: var(--wpf-carousel-arrow-bg) !important; border: 0 !important; border-radius: 50% !important; box-shadow: 0 8px 20px rgba(16,24,40,.18) !important; color: var(--wpf-carousel-arrow) !important; cursor: pointer; display: flex !important; font-family: Arial,sans-serif !important; font-size: 27px !important; font-weight: 400 !important; height: var(--wpf-carousel-arrow-size) !important; justify-content: center !important; line-height: 1 !important; min-height: var(--wpf-carousel-arrow-size) !important; min-width: var(--wpf-carousel-arrow-size) !important; padding: 0 0 3px !important; position: absolute; top: 38%; transition: box-shadow .2s ease,transform .2s ease; transform: translateY(-50%); width: var(--wpf-carousel-arrow-size) !important; z-index: 3; }
.wpf-related-carousel__arrow:hover { box-shadow: 0 12px 26px rgba(7,46,210,.3) !important; transform: translateY(-50%) scale(1.06); }
.wpf-related-carousel__arrow.is-prev { left: 12px; }
.wpf-related-carousel__arrow.is-next { right: 12px; }
.wpf-related-carousel__arrow:disabled { cursor: not-allowed; opacity: .35; }
.wpf-related-carousel__dots { align-items: center; display: flex; gap: 9px; justify-content: center; margin-top: 26px; }
.wpf-related-carousel__dot { appearance: none !important; background: var(--wpf-carousel-dot) !important; border: 1px solid var(--wpf-carousel-dot-border) !important; border-radius: 50% !important; box-shadow: none !important; box-sizing: border-box !important; cursor: pointer; display: block !important; flex: 0 0 auto !important; height: 9px !important; margin: 0 !important; max-height: 9px !important; max-width: 9px !important; min-height: 9px !important; min-width: 9px !important; padding: 0 !important; transition: background .2s ease,transform .2s ease; width: 9px !important; }
.wpf-related-carousel__dot:hover { transform: scale(1.18); }
.wpf-related-carousel__dot.is-active { background: var(--wpf-carousel-dot-active) !important; border-color: var(--wpf-carousel-dot-active) !important; transform: scale(1.2); }

@media (max-width: 782px) {
    .wpf-related-carousel__arrow { font-size: 24px !important; top: 35%; }
    .wpf-related-carousel__arrow.is-prev { left: 7px; }
    .wpf-related-carousel__arrow.is-next { right: 7px; }
}

/* When carousel is disabled at a breakpoint, use the matching dashboard column setting. */
@media (min-width: 1025px) {
    .wpf-related-products--carousel[data-desktop-carousel="0"] .wpf-related-carousel { display: block; }
    .wpf-related-products--carousel[data-desktop-carousel="0"] .wpf-related-carousel__viewport { overflow: visible; }
    .wpf-related-products--carousel[data-desktop-carousel="0"] .wpf-related-products__grid { display: grid !important; grid-template-columns: repeat(var(--wpf-style-related-columns, 4), minmax(0, 1fr)); transform: none !important; }
    .wpf-related-products--carousel[data-desktop-carousel="0"] .wpf-related-product { flex: auto; }
    .wpf-related-products--carousel[data-desktop-carousel="0"] .wpf-related-carousel__arrow,
    .wpf-related-products--carousel[data-desktop-carousel="0"] .wpf-related-carousel__dots { display: none !important; }
}
@media (min-width: 783px) and (max-width: 1024px) {
    .wpf-related-products--carousel[data-tablet-carousel="0"] .wpf-related-carousel { display: block; }
    .wpf-related-products--carousel[data-tablet-carousel="0"] .wpf-related-carousel__viewport { overflow: visible; }
    .wpf-related-products--carousel[data-tablet-carousel="0"] .wpf-related-products__grid { display: grid !important; grid-template-columns: repeat(var(--wpf-style-tablet-related-columns, 3), minmax(0, 1fr)); transform: none !important; }
    .wpf-related-products--carousel[data-tablet-carousel="0"] .wpf-related-product { flex: auto; }
    .wpf-related-products--carousel[data-tablet-carousel="0"] .wpf-related-carousel__arrow,
    .wpf-related-products--carousel[data-tablet-carousel="0"] .wpf-related-carousel__dots { display: none !important; }
}
@media (max-width: 782px) {
    .wpf-related-products--carousel[data-mobile-carousel="0"] .wpf-related-carousel { display: block; }
    .wpf-related-products--carousel[data-mobile-carousel="0"] .wpf-related-carousel__viewport { overflow: visible; }
    .wpf-related-products--carousel[data-mobile-carousel="0"] .wpf-related-products__grid { display: grid !important; grid-template-columns: repeat(var(--wpf-style-mobile-related-columns, 2), minmax(0, 1fr)); transform: none !important; }
    .wpf-related-products--carousel[data-mobile-carousel="0"] .wpf-related-product { flex: auto; }
    .wpf-related-products--carousel[data-mobile-carousel="0"] .wpf-related-carousel__arrow,
    .wpf-related-products--carousel[data-mobile-carousel="0"] .wpf-related-carousel__dots { display: none !important; }
}