/**
 * TC1913slideshow - RENMA (https://renma.it)
 */
.tc1913ss {
  --tc-sbw-local: var(--tc-sbw, 0px);
  position: relative;
  display: block;
  width: 100%;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background: var(--tc-bg, #000);
  box-sizing: border-box;
  padding: 0;
  isolation: isolate;
}

/* Larghezza piena dello schermo anche dentro un contenitore del template */
.tc1913ss--fullbleed {
  width: calc(100vw - var(--tc-sbw-local));
  max-width: none;
  margin-left: calc(50% - (100vw - var(--tc-sbw-local)) / 2);
  margin-right: 0;
}

.tc1913ss__slide {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  z-index: 1;
  backface-visibility: hidden;
}

.tc1913ss__slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

.tc1913ss__slide.is-leaving {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}

.tc1913ss__slide.is-entering {
  z-index: 3;
}

/* Immagine: sempre al 100% di larghezza, centrata in verticale e orizzontale */
.tc1913ss__img {
  display: block;
  flex: 0 0 auto;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
  border: 0;
  padding: 0;
}

.tc1913ss--fit-cover .tc1913ss__img,
.tc1913ss--fit-contain .tc1913ss__img {
  height: 100%;
  object-position: center center;
}

.tc1913ss--fit-cover .tc1913ss__img { object-fit: cover; }
.tc1913ss--fit-contain .tc1913ss__img { object-fit: contain; }

/* ---------- Transizioni ---------- */
.tc1913ss .is-entering,
.tc1913ss .is-leaving {
  animation-duration: var(--tc-d, 1.5s);
  animation-timing-function: ease-in-out;
  animation-fill-mode: both;
}

/* Dissolvenza (+ Ken Burns) */
.tc1913ss--fx-fade .is-entering,
.tc1913ss--fx-kenburns .is-entering { animation-name: tc1913-fade-in; }
.tc1913ss--fx-fade .is-leaving,
.tc1913ss--fx-kenburns .is-leaving { animation-name: tc1913-fade-out; }

/* Scorrimento orizzontale */
.tc1913ss--fx-slide .is-entering { animation-name: tc1913-slide-in-next; }
.tc1913ss--fx-slide .is-leaving { animation-name: tc1913-slide-out-next; }
.tc1913ss--fx-slide.is-reverse .is-entering { animation-name: tc1913-slide-in-prev; }
.tc1913ss--fx-slide.is-reverse .is-leaving { animation-name: tc1913-slide-out-prev; }

/* Scorrimento verticale */
.tc1913ss--fx-slide-up .is-entering { animation-name: tc1913-up-in-next; }
.tc1913ss--fx-slide-up .is-leaving { animation-name: tc1913-up-out-next; }
.tc1913ss--fx-slide-up.is-reverse .is-entering { animation-name: tc1913-up-in-prev; }
.tc1913ss--fx-slide-up.is-reverse .is-leaving { animation-name: tc1913-up-out-prev; }

/* Zoom in entrata */
.tc1913ss--fx-zoom .is-entering { animation-name: tc1913-zoom-in; }
.tc1913ss--fx-zoom .is-leaving { animation-name: tc1913-fade-out; }

/* Zoom in uscita */
.tc1913ss--fx-zoom-out .is-leaving { animation-name: tc1913-zoom-out; z-index: 3; }
.tc1913ss--fx-zoom-out .is-entering { animation-name: tc1913-fade-in; z-index: 2; }

/* Sfocatura */
.tc1913ss--fx-blur .is-entering { animation-name: tc1913-blur-in; }
.tc1913ss--fx-blur .is-leaving { animation-name: tc1913-blur-out; }

/* Ken Burns: zoom lento durante la visualizzazione */
.tc1913ss--fx-kenburns .is-active .tc1913ss__img,
.tc1913ss--fx-kenburns .is-leaving .tc1913ss__img {
  animation: tc1913-kb var(--tc-kb, 8s) linear both;
}

@keyframes tc1913-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes tc1913-fade-out { from { opacity: 1; } to { opacity: 0; } }

@keyframes tc1913-slide-in-next { from { transform: translate3d(100%, 0, 0); } to { transform: translate3d(0, 0, 0); } }
@keyframes tc1913-slide-out-next { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-100%, 0, 0); } }
@keyframes tc1913-slide-in-prev { from { transform: translate3d(-100%, 0, 0); } to { transform: translate3d(0, 0, 0); } }
@keyframes tc1913-slide-out-prev { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(100%, 0, 0); } }

@keyframes tc1913-up-in-next { from { transform: translate3d(0, 100%, 0); } to { transform: translate3d(0, 0, 0); } }
@keyframes tc1913-up-out-next { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, -100%, 0); } }
@keyframes tc1913-up-in-prev { from { transform: translate3d(0, -100%, 0); } to { transform: translate3d(0, 0, 0); } }
@keyframes tc1913-up-out-prev { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 100%, 0); } }

@keyframes tc1913-zoom-in { from { opacity: 0; transform: scale(1.2); } to { opacity: 1; transform: scale(1); } }
@keyframes tc1913-zoom-out { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(1.2); } }

@keyframes tc1913-blur-in { from { opacity: 0; filter: blur(20px); transform: scale(1.05); } to { opacity: 1; filter: blur(0); transform: scale(1); } }
@keyframes tc1913-blur-out { from { opacity: 1; filter: blur(0); transform: scale(1); } to { opacity: 0; filter: blur(20px); transform: scale(1.05); } }

@keyframes tc1913-kb { from { transform: scale(1); } to { transform: scale(1.1); } }

/* ---------- Controlli (opzionali) ---------- */
.tc1913ss__arrow {
  position: absolute;
  top: 50%;
  z-index: 5;
  width: 44px;
  height: 44px;
  margin-top: -22px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, .35);
  cursor: pointer;
  transition: background-color .2s;
}

.tc1913ss__arrow:hover,
.tc1913ss__arrow:focus-visible { background: rgba(0, 0, 0, .6); }
.tc1913ss__arrow--prev { left: 16px; }
.tc1913ss__arrow--next { right: 16px; }

.tc1913ss__arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

.tc1913ss__arrow--prev::before { transform: translate(-30%, -50%) rotate(-135deg); }
.tc1913ss__arrow--next::before { transform: translate(-70%, -50%) rotate(45deg); }

.tc1913ss__dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 16px;
  z-index: 5;
  display: flex;
  justify-content: center;
  gap: 8px;
}

.tc1913ss__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .5);
  cursor: pointer;
  transition: background-color .2s, transform .2s;
}

.tc1913ss__dot.is-active { background: #fff; transform: scale(1.2); }

@media (prefers-reduced-motion: reduce) {
  .tc1913ss .is-entering { animation-name: tc1913-fade-in !important; }
  .tc1913ss .is-leaving { animation-name: tc1913-fade-out !important; }
  .tc1913ss .tc1913ss__img { animation: none !important; }
}
