/**
 * @file modules/logo-carousel/assets/style.css
 *
 * Frontend styles for tcp-super/logo-carousel (Swiper).
 */

.wp-block-tcp-super-logo-carousel.tcp-lc {
  position: relative;
  --tcp-lc-logo-h: 80px;
}

.tcp-lc__viewport {
  overflow: hidden;
  width: 100%;
}

.tcp-lc__scroller.swiper-wrapper {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  box-sizing: content-box;
}

.tcp-lc.tcp-lc--rows .tcp-lc__scroller.swiper-wrapper {
  flex-wrap: wrap !important;
}

.tcp-lc__cell.swiper-slide {
  flex-shrink: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto;
}

/* Default behavior (master height) */
.tcp-lc.tcp-lc--mode-height .tcp-lc__cell.swiper-slide,
.tcp-lc.tcp-lc--mode-both .tcp-lc__cell.swiper-slide {
  height: var(--tcp-lc-logo-h) !important;
  min-height: var(--tcp-lc-logo-h);
}


.tcp-lc__item,
.tcp-lc__link {
  display: flex;
  align-items: center;
  justify-content: var(--tcp-lc-v-align, center);
  width: 100%;
  height: 100%;
}

.tcp-lc__img {
  display: block;
  width: 100%;
  max-width: var(--tcp-lc-logo-w, 9999px);
  height: 100%;
  object-fit: contain;
}

/* Width mode uses intrinsic height */
.tcp-lc.tcp-lc--mode-width .tcp-lc__img {
  height: auto;
}

/* Both mode constrains height too */
.tcp-lc.tcp-lc--mode-both .tcp-lc__img {
  max-height: var(--tcp-lc-logo-h);
}

/* Fit modes */
.tcp-lc.tcp-lc--fit-cover .tcp-lc__img { object-fit: cover; }
.tcp-lc.tcp-lc--fit-contain .tcp-lc__img { object-fit: contain; }
.tcp-lc.tcp-lc--fit-stretch .tcp-lc__img { object-fit: fill; }


.tcp-lc.tcp-lc--fit-cover .tcp-lc__img { object-fit: cover; }
.tcp-lc.tcp-lc--fit-contain .tcp-lc__img { object-fit: contain; }

.tcp-lc__caption {
  margin-top: 8px;
  font-size: 14px;
  text-align: center;
}

/* Nav */
.tcp-lc__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 8px;
}
.tcp-lc__prev { left: 0; }
.tcp-lc__next { right: 0; }

.tcp-lc.tcp-lc--nav-off .tcp-lc__nav { display: none !important; }

/* Pagination */
.tcp-lc__pagination {
  margin-top: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.tcp-lc.tcp-lc--pag-off .tcp-lc__pagination { display: none !important; }

.tcp-lc__dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  opacity: 0.4;
}
.tcp-lc__dot.is-active { opacity: 1; }

.tcp-lc__fraction {
  font-size: 13px;
}

.tcp-lc__progress {
  width: min(320px, 80%);
  height: 4px;
  background: rgba(0,0,0,0.15);
  border-radius: 999px;
  overflow: hidden;
}
.tcp-lc__progress__fill {
  display: block;
  height: 100%;
}

/* Positions */
.tcp-lc--pag-top .tcp-lc__pagination { order: -1; margin-top: 0; margin-bottom: 12px; }

/* Stagger visual (simple) */
.tcp-lc--stagger .tcp-lc__cell:nth-child(even) { transform: translateY(6px); }
.tcp-lc--stagger .tcp-lc__cell:nth-child(odd) { transform: translateY(-6px); }


/* Image fit mode */
.tcp-lc[data-fit="cover"] .tcp-lc__img{ object-fit: cover; }


/* Per-row swipers (each row is its own Swiper instance) */
.tcp-lc.tcp-lc--row-swipers .tcp-lc__rows {
  display: flex;
  flex-direction: column;
  gap: var(--tcp-lc-gap, 0px);
}

.tcp-lc.tcp-lc--row-swipers .tcp-lc__row.swiper {
  width: 100%;
}