/* ------------------------------
 * Swiper  (2026-09-26)
 * ------------------------------
 */

.swiper {
  position: relative;
  margin-bottom: 0;

  figure {
    margin-bottom: 0;
  }
}


.caption-wrapper {
  position: absolute;
  height: 100%;
  inset: 0;

  .container {
    height: 100%;
    position: relative;

    .swiper-caption {
      position: absolute;
      /*font-size: var(--font-size-stage-slider);*/
      font-weight: var(--font-weight-semi-bold);
      line-height: 1.2;
      margin: 0;
      bottom: 2.5rem;
      left: 0.5em;
      background: rgba(255,255,255,0.75);
      color: var(--bs-black);
      padding: 0.3em 0.8em;
    }
  }
}


.swiper img {
  max-width: 100%;
  height: auto;
}

/* ------------------------------
 * Announcement-Banner 2026-07-21
 * ------------------------------
 */

.swiper {

/* ------------------------------ Swiper Stage */
&.swiper-stage {

  figcaption {
    font-size: var(--font-size_14-25, 18px);

    &.text-overlay {
      font-size: var(--font-size_14-25, 18px);
      font-weight: 600;
      line-height: 1.1;
      color: #333333;

      position: absolute;
      left: 1.5em;
      bottom: 1.5em;
      background: rgba(255, 255, 255, 0.7);
      margin: 0;
      padding: 0.2em 0.6em;
    }
  }

  .swiper-pagination {
    bottom: 3%;

    .swiper-pagination-bullet {
      background: var(--bs-white);
      opacity: .8;
      border-radius: 0;
      width: 5%;
      height: 3px;
    }

    .swiper-pagination-bullet-active {
      background: var(--primary);
    }
  }

  .swiper-button-prev,
  .swiper-button-next {
    top: 50%;
    width: 70px;
    height: auto;
    opacity: 0;
    color: var(--bs-white);
    transition: opacity .5s;

    &::after {
      content: '';
    }

    svg {
      width: var(--svg-icon-size_25-70);
      height: 100%;
    }

    @media (max-width: var(--bs-breakpoint-xs)) {
      margin-bottom: var(--ukm-space-small_16-32);
    }
  }

  .swiper-button-prev {
    left: 5%;
  }

  .swiper-button-next {
    right: 5%;
  }

  &:hover {
    .swiper-button-next,
    .swiper-button-prev {
      opacity: 1;

      &:hover {
        color: white;
      }
    }
  }
}
}
