/*
Theme Name: visTable®
Description: Bricks Child Theme for visTABLE.
Author: plavis GmbH
Template: bricks
Version: 1.0.0
Text Domain: vistable
*/

/* ==========================================================================
   Splide Slider – Global Arrow & Pagination Styles
   ========================================================================== */

@media (max-width: 767.5px) {
  .splide {
    padding-bottom: calc(var(--base-spacing-multiplier) * 6 + var(--base-spacing-multiplier) * 12);
  }
}

.splide .splide__arrows {
  display: flex;
  position: absolute;
  top: calc(-1 * var(--base-spacing-multiplier) * 6 - var(--base-spacing-multiplier) * 12);
  right: 0;
  gap: calc(var(--base-spacing-multiplier) * 5);
}

@media (max-width: 767.5px) {
  .splide .splide__arrows {
    top: unset;
    bottom: 0;
    right: 0;
  }
  .splide .splide__arrows.splide__arrow--next {
    left: 56px;
  }
}

.splide .splide__arrows .splide__arrow {
  background-color: var(--slider-arrow-background);
  border: 2px solid var(--slider-arrow-background);
  color: var(--slider-arrow-color);
  fill: var(--slider-arrow-color);
  width: calc(var(--base-spacing-multiplier) * 12);
  height: calc(var(--base-spacing-multiplier) * 12);
  position: unset;
  transform: unset;
  padding: calc(var(--base-spacing-multiplier) * 2);
  transition: all ease-in-out 0.2s;
}

.splide .splide__arrows .splide__arrow.splide__arrow--prev {
  transform: scaleX(-1);
}

@media (min-width: 980px) {
  .splide .splide__arrows .splide__arrow:hover {
    background-color: var(--slider-arrow-color);
    color: var(--slider-arrow-background);
    fill: var(--slider-arrow-background);
  }
}

.splide .splide__pagination {
  bottom: calc(var(--base-spacing-multiplier) * 12 - 16px);
}