/* idel Banner Slider — tam ekran hero */
.idel-banner-slider {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: calc(var(--idel-banner-vh, 100) * 1vh);
  min-height: 260px;
  max-width: 100%;
  box-sizing: border-box;
  --idel-banner-dot-size: 10px;
  --idel-banner-dot-gap: 8px;
  --idel-slider-dot-size: var(--idel-banner-dot-size, 10px);
  --idel-slider-dots-gap: var(--idel-banner-dot-gap, 8px);
  --idel-slider-dot-bar-height: 4px;
  --idel-banner-pagination-bar-height: 4px;
  /* Pasif nokta rengi (orta gri); tema --idel-banner-dot-bg ile override edilebilir */
  --idel-banner-dot-inactive-bg: var(--idel-banner-dot-bg, #808080);
  --idel-slider-dot-track-bg: var(--idel-banner-dot-inactive-bg, #808080);
  --idel-slider-dot-fill: var(--idel-banner-dot-active-fg, var(--idel-banner-dot-active-bg, #ffffff));
  --idel-slider-dot-active-color: var(--idel-banner-dot-active-fg, var(--idel-banner-dot-active-bg, #ffffff));
  --idel-slider-dot-hover-track: var(
    --idel-banner-dot-hover-bg,
    rgba(255, 255, 255, 0.48)
  );
}

.idel-banner-slider--full-height {
  height: 100vh;
}

@supports (height: 100dvh) {
  .idel-banner-slider--full-height {
    height: 100dvh;
  }
}

.idel-banner-slider--full-bleed {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.idel-banner-slider__viewport {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #0c0c0c;
  /* Yatay swipe ile slayt; dikey kaydırma sayfaya kalır */
  touch-action: pan-y pinch-zoom;
}

/* —— Fade —— */
.idel-banner-slider[data-transition="fade"] .idel-banner-slider__stack {
  position: relative;
  width: 100%;
  height: 100%;
}

.idel-banner-slider[data-transition="fade"] .idel-banner-slider__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.75s cubic-bezier(0.22, 0.61, 0.36, 1), visibility 0.75s ease;
  z-index: 0;
  backface-visibility: hidden;
}

.idel-banner-slider[data-transition="fade"] .idel-banner-slider__slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

/* —— Slide —— */
.idel-banner-slider[data-transition="slide"] .idel-banner-slider__track {
  display: flex;
  flex-direction: row;
  width: calc(var(--idel-banner-slide-count, 1) * 100%);
  height: 100%;
  will-change: transform;
  transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.idel-banner-slider[data-transition="slide"] .idel-banner-slider__slide {
  position: relative;
  flex: 0 0 calc(100% / var(--idel-banner-slide-count, 1));
  height: 100%;
  overflow: hidden;
}

.idel-banner-slider__slide-link {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
  outline: none;
}

.idel-banner-slider__slide-link:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.85);
}

.idel-banner-slider__slide:not(.is-active) .idel-banner-slider__slide-link {
  pointer-events: none;
}

.idel-banner-slider__media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.idel-banner-slider__media-inner {
  position: absolute;
  inset: 0;
  overflow: hidden;
  will-change: transform;
}

.idel-banner-slider__bg {
  position: absolute;
  inset: 0;
  background-image: var(--idel-banner-slide-bg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  display: block;
}

.idel-banner-slider__img {
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  object-position: center center !important;
  display: block;
}

.idel-banner-slider__picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.idel-banner-slider__picture .idel-banner-slider__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Mobil görsel yok: masaüstü görseli dar ekranda alanı doldurur; Ken Burns mobilde kırpmayı bozmasın diye kapatılır */
@media (max-width: 768px) {
  .idel-banner-slider__slide--no-mobile-image .idel-banner-slider__media-inner {
    inset: 0;
  }

  .idel-banner-slider--ken-burns .idel-banner-slider__slide--no-mobile-image.is-active .idel-banner-slider__media-inner {
    animation: none !important;
    transform: none !important;
  }

  /* Masaüstü Ken Burns “inactive” tabanı mobilde bu slaytta da uygulanmasın */
  .idel-banner-slider--ken-burns .idel-banner-slider__slide--no-mobile-image:not(.is-active) .idel-banner-slider__media-inner {
    transform: none;
    animation: none;
  }

  .idel-banner-slider__slide--has-mobile-image .idel-banner-slider__bg {
    background-image: var(
      --idel-banner-slide-bg-mobile,
      var(--idel-banner-slide-bg)
    );
  }

  .idel-banner-slider__slide--no-mobile-image .idel-banner-slider__bg {
    background-image: var(--idel-banner-slide-bg);
  }
}

/*
 * Ken Burns: is-active kalkınca animasyon kesilir; transform sıfırlanıp scale 1.0’a düşer (ani küçülme).
 * Aktif olmayan slaytta da aynı taban scale + başlangıç translate korunur; geçiş fade ile uyumludur.
 */
.idel-banner-slider--ken-burns .idel-banner-slider__slide:not(.is-active) .idel-banner-slider__media-inner {
  transform: scale(var(--idel-banner-kb-scale, 1.06)) translate3d(var(--idel-banner-kb-tx-start, -2%), 0, 0);
  animation: none;
}

/* Hafif yatay kayma: yalnızca aktif slaytta sonsuz alternatif animasyon */
.idel-banner-slider--ken-burns .idel-banner-slider__slide.is-active .idel-banner-slider__media-inner {
  animation: idel-banner-kenburns var(--idel-banner-kb-duration, 24s) ease-in-out infinite alternate;
}

@keyframes idel-banner-kenburns {
  0% {
    transform: scale(var(--idel-banner-kb-scale, 1.06)) translate3d(var(--idel-banner-kb-tx-start, -2%), 0, 0);
  }
  100% {
    transform: scale(var(--idel-banner-kb-scale, 1.06)) translate3d(var(--idel-banner-kb-tx-end, 2%), 0, 0);
  }
}

/*
 * Ken Burns yok: zoom fade/slide ile aynı sürede transition (opacity + track ile senkron).
 * Giden slayt hafif “zoom out”, gelen slayt “zoom in” — animation yerine transition (sıçrama azalır).
 */
.idel-banner-slider[data-transition="fade"]:not(.idel-banner-slider--ken-burns)
  .idel-banner-slider__slide
  .idel-banner-slider__media-inner {
  transition: transform 0.75s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.idel-banner-slider[data-transition="fade"]:not(.idel-banner-slider--ken-burns)
  .idel-banner-slider__slide:not(.is-active)
  .idel-banner-slider__media-inner {
  transform: scale(1.07);
}

.idel-banner-slider[data-transition="fade"]:not(.idel-banner-slider--ken-burns)
  .idel-banner-slider__slide.is-active
  .idel-banner-slider__media-inner {
  transform: scale(1);
}

.idel-banner-slider[data-transition="slide"]:not(.idel-banner-slider--ken-burns)
  .idel-banner-slider__slide
  .idel-banner-slider__media-inner {
  transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.idel-banner-slider[data-transition="slide"]:not(.idel-banner-slider--ken-burns)
  .idel-banner-slider__slide:not(.is-active)
  .idel-banner-slider__media-inner {
  transform: scale(1.06);
}

.idel-banner-slider[data-transition="slide"]:not(.idel-banner-slider--ken-burns)
  .idel-banner-slider__slide.is-active
  .idel-banner-slider__media-inner {
  transform: scale(1);
}

.idel-banner-slider--ken-burns .idel-banner-slider__slide.idel-banner-slide--enter.is-active .idel-banner-slider__media-inner {
  animation: idel-banner-kb-enter-zoom 0.75s cubic-bezier(0.22, 0.61, 0.36, 1) forwards !important;
}

@keyframes idel-banner-kb-enter-zoom {
  from {
    transform: scale(1.1) translate3d(var(--idel-banner-kb-tx-start, -2%), 0, 0);
  }

  to {
    transform: scale(var(--idel-banner-kb-scale, 1.06)) translate3d(var(--idel-banner-kb-tx-start, -2%), 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .idel-banner-slider--ken-burns .idel-banner-slider__slide.is-active .idel-banner-slider__media-inner {
    animation: none !important;
  }

  .idel-banner-slider[data-transition="fade"]:not(.idel-banner-slider--ken-burns)
    .idel-banner-slider__slide
    .idel-banner-slider__media-inner,
  .idel-banner-slider[data-transition="slide"]:not(.idel-banner-slider--ken-burns)
    .idel-banner-slider__slide
    .idel-banner-slider__media-inner {
    transition: none !important;
    transform: none !important;
  }

  .idel-banner-slider--ken-burns .idel-banner-slider__slide.idel-banner-slide--enter.is-active .idel-banner-slider__media-inner {
    animation: none !important;
    transform: scale(var(--idel-banner-kb-scale, 1.06)) translate3d(var(--idel-banner-kb-tx-start, -2%), 0, 0);
  }
}

/* Üst → alt: iki renkli gradyan (PHP rgba değişkenleri) */
.idel-banner-slider__overlay:not(.idel-banner-slider__overlay--bottom) {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 1;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    var(--idel-banner-overlay-a, rgba(0, 48, 100, 0.5)) 0%,
    var(--idel-banner-overlay-b, rgba(0, 0, 0, 0.8)) var(--idel-banner-overlay-stop-end, 100%)
  );
}

/* Alt → üst: ikinci gradyan katmanı (caption / dots üstünde kalmaları için z-index) */
.idel-banner-slider__overlay--bottom {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 1;
  z-index: 2;
  background: linear-gradient(
    to top,
    var(--idel-banner-overlay-bottom-a, rgba(0, 0, 0, 0.65)) 0%,
    var(--idel-banner-overlay-bottom-b, rgba(0, 0, 0, 0)) var(--idel-banner-overlay-bottom-stop-end, 100%)
  );
}

/* Tam genişlik şerit + yan boşluk; flex ile outer sütunu sol/orta/sağa hizalar */
.idel-banner-slider__caption-shell {
  position: absolute;
  bottom: var(--idel-banner-caption-mb, 56px);
  left: 0;
  right: 0;
  z-index: 4;
  box-sizing: border-box;
  padding-left: var(--idel-banner-caption-ms, 56px);
  padding-right: var(--idel-banner-caption-ms, 56px);
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}

/* Dış sütun daraldığında yatayda ortalanır; metin hizası aşağıdaki .caption text-align ile kalır (sol/orta/sağ) */
.idel-banner-slider--caption-left .idel-banner-slider__caption-shell {
  justify-content: center;
  margin-bottom: 20px;
}

.idel-banner-slider--caption-center .idel-banner-slider__caption-shell {
  justify-content: center;
}

.idel-banner-slider--caption-right .idel-banner-slider__caption-shell {
  justify-content: flex-end;
}

/* Dış sütun: max-width ile daraltılınca shell içinde ortalanır; içerik sola yaslı kalabilir */
.idel-banner-slider__caption-outer {
  width: 100%;
  max-width: var(--idel-banner-caption-outer-max, 100%);
  min-width: 0;
  box-sizing: border-box;
}

.idel-banner-slider__caption {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  max-width: min(var(--idel-banner-caption-max, 900px), 100%);
  padding: var(--idel-banner-caption-pad, 0);
  border-radius: var(--idel-banner-caption-radius, 14px);
  box-sizing: border-box;
  color: var(--idel-banner-title-color, #fff);
}

/* Cam kutu */
.idel-banner-slider--caption-style-glass .idel-banner-slider__caption {
  background: color-mix(in srgb, var(--idel-banner-caption-bg, #0a0a0a) calc(var(--idel-banner-caption-bg-opacity, 0.55) * 100%), transparent);
  backdrop-filter: blur(var(--idel-banner-caption-blur, 14px));
  -webkit-backdrop-filter: blur(var(--idel-banner-caption-blur, 14px));
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

@supports not (background: color-mix(in srgb, #000 50%, transparent)) {
  .idel-banner-slider--caption-style-glass .idel-banner-slider__caption {
    background: var(--idel-banner-caption-bg, rgba(10, 10, 10, 0.55));
  }
}

/* Minimal: gradyan üzerinde düz metin (referans hero) */
.idel-banner-slider--caption-style-minimal .idel-banner-slider__caption {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}

.idel-banner-slider--caption-left .idel-banner-slider__caption {
  text-align: left;
}

.idel-banner-slider--caption-center .idel-banner-slider__caption {
  text-align: center;
}

.idel-banner-slider--caption-right .idel-banner-slider__caption {
  text-align: right;
}

.idel-banner-slider__title {
  margin: 0 0 var(--idel-banner-title-mb, 14px);
  
  box-sizing: border-box;
  font-family: var(--idel-banner-title-font, inherit);
  font-size: var(--idel-banner-title-size, clamp(1.85rem, 3.5vw, 3rem));
  font-weight: var(--idel-banner-title-weight, 700);
  /* Tema genelindeki `* { line-height: 2 }` etkisini bu blokta tamamen devre disi birakir. */
  line-height: var(--idel-banner-title-lh, 1.15) !important;
  color: var(--idel-banner-title-color, #fff);
}

.idel-banner-slider--caption-center .idel-banner-slider__title {
  margin-left: auto;
  margin-right: auto;
}

.idel-banner-slider--caption-right .idel-banner-slider__title {
  margin-left: auto;
}

.idel-banner-slider__title-highlight {
  color: var(--idel-banner-title-highlight-color, #ff7a2e);
  font-weight: inherit;
}

/* Vurgu span dahil baslik icindeki tum inline elemanlar ayni satir yuksekligini kullanir. */
.idel-banner-slider__title * {
  line-height: inherit !important;
}

.idel-banner-slider__title p,
.idel-banner-slider__title span,
.idel-banner-slider__title a,
.idel-banner-slider__title strong,
.idel-banner-slider__title em {
  line-height: inherit !important;
}

.idel-banner-slider--caption-style-minimal .idel-banner-slider__title {
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.6);
}

.idel-banner-slider__desc {
  margin: var(--idel-banner-desc-mt, 0) 0 0;
  font-family: var(--idel-banner-desc-font, inherit);
  font-size: var(--idel-banner-desc-size, 1.05rem);
  line-height: var(--idel-banner-desc-lh, 1.55) !important;
  font-weight: var(--idel-banner-desc-weight, 400);
  color: var(--idel-banner-desc-color, #fff);
}

.idel-banner-slider--caption-style-minimal .idel-banner-slider__desc {
  text-shadow: 0 1px 16px rgba(0, 0, 0, 0.5);
}

.idel-banner-slider__desc p {
  margin: 0 0 0.5em;
  line-height: inherit !important;
}

.idel-banner-slider__desc span,
.idel-banner-slider__desc a,
.idel-banner-slider__desc strong,
.idel-banner-slider__desc em {
  line-height: inherit !important;
}

.idel-banner-slider__desc p:last-child {
  margin-bottom: 0;
}

/* Oklar: 03-gallery.css içindeki .idel-slider-nav ile birebir (aynı sınıflar + Unicode oklar).
   Banner’da caption/overlay üstünde kalsın diye yalnızca z-index eklenir. */
.idel-banner-slider > .idel-slider-nav {
  z-index: 8;
}

/*
 * Pagination — küçük gri noktalar; aktif: beyaz çekirdek + tam halka ilerleme (SVG circle stroke-dash).
 * 03-gallery ::before kapalı — çift çubuk önlenir.
 */
.idel-banner-slider .idel-slider-dot::before {
  display: none !important;
  content: none !important;
}

.idel-banner-slider .idel-slider-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 20px;
  margin-top: 0 !important;
  z-index: 6;
  max-width: min(100%, 520px);
  margin-left: auto;
  margin-right: auto;
  padding: 0 8px;
  box-sizing: border-box;
  pointer-events: none;
  gap: var(--idel-slider-dots-gap, 8px);
  justify-content: center;
  align-items: center;
}

.idel-banner-slider .idel-slider-dots .idel-slider-dot {
  pointer-events: auto;
  width: auto;
  flex: 0 0 auto;
  min-width: 0;
  max-width: none;
  height: auto;
  min-height: 0;
  padding: 6px 4px;
  border: none;
  background: transparent;
  cursor: pointer;
  position: relative;
  touch-action: manipulation;
  box-sizing: border-box;
}

.idel-banner-slider .idel-slider-dots .idel-slider-dot:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.85);
  outline-offset: 3px;
  border-radius: 999px;
}

/* Orta nokta + tam halka için kutu */
.idel-banner-slider .idel-slider-dot__track {
  display: block;
  position: relative;
  width: var(--idel-banner-pagination-dot-wrap, 24px);
  height: var(--idel-banner-pagination-dot-wrap, 24px);
  flex-shrink: 0;
  border-radius: 50%;
  background: transparent;
  overflow: visible;
  box-sizing: border-box;
  isolation: isolate;
}

/* Pasif / aktif çekirdek */
.idel-banner-slider .idel-slider-dot__core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--idel-slider-dot-size, 10px);
  height: var(--idel-slider-dot-size, 10px);
  margin-left: calc(var(--idel-slider-dot-size, 10px) / -2);
  margin-top: calc(var(--idel-slider-dot-size, 10px) / -2);
  border-radius: 50%;
  background: var(--idel-banner-dot-inactive-bg, #808080);
  box-sizing: border-box;
  z-index: 1;
  pointer-events: none;
}

.idel-banner-slider .idel-slider-dot:hover .idel-slider-dot__core {
  background: var(
    --idel-slider-dot-hover-track,
    var(--idel-banner-dot-hover-bg, #9a9a9a)
  );
}

.idel-banner-slider .idel-slider-dot.is-active .idel-slider-dot__core {
  background: var(
    --idel-slider-dot-active-color,
    var(--idel-slider-dot-fill, #ffffff)
  );
}

/* Tam dairesel halka — yalnızca aktif slaytta */
.idel-banner-slider .idel-slider-dot__arc {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--idel-banner-pagination-dot-wrap, 24px);
  height: var(--idel-banner-pagination-dot-wrap, 24px);
  margin-left: calc(var(--idel-banner-pagination-dot-wrap, 24px) / -2);
  margin-top: calc(var(--idel-banner-pagination-dot-wrap, 24px) / -2);
  overflow: visible;
  pointer-events: none;
  z-index: 2;
  color: var(--idel-slider-dot-fill, var(--idel-slider-dot-active-color, #ffffff));
}

.idel-banner-slider .idel-slider-dot:not(.is-active) .idel-slider-dot__arc {
  opacity: 0;
  visibility: hidden;
}

.idel-banner-slider .idel-slider-dot__progress {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  /* Kapalı daire: butt; round uçlar bazen çizgi uzunluğunu kabartır */
  stroke-linecap: butt;
  stroke-linejoin: round;
  /* r=8 tam çevre ≈ 50.265; JS getTotalLength + çift değer ile senkron */
  stroke-dasharray: 50.265 50.265;
  stroke-dashoffset: 50.265;
  /*
   * SVG çember varsayılanı 3 o’clock; -90° ile çizim 12’den başlar.
   * 03-gallery scaleX(1) ile çakışmaması için !important (transform: none kaldırıldı).
   */
  transform: rotate(-90deg) !important;
  transform-origin: center center;
  transform-box: fill-box;
  will-change: stroke-dashoffset;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.idel-banner-slider .idel-slider-dot.is-active .idel-slider-dot__track {
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
}

/* Başlangıç stroke-dashoffset JS ile ayarlanır; yalnızca 0’a animasyon */
@keyframes idel-banner-dot-arc-kf {
  to {
    stroke-dashoffset: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .idel-banner-slider .idel-slider-dot__progress {
    animation: none !important;
  }

  .idel-banner-slider .idel-slider-dot.is-active .idel-slider-dot__progress {
    stroke-dashoffset: 0;
  }
}

@media (max-width: 768px) {
  .idel-banner-slider--hide-arrows-mobile > .idel-slider-nav {
    display: none !important;
  }

  .idel-banner-slider__caption-shell {
    padding-left: var(--idel-banner-caption-ms-mobile, 16px);
    padding-right: var(--idel-banner-caption-ms-mobile, 16px);
    bottom: var(--idel-banner-caption-mb-mobile, 56px);
    margin-bottom: 15px;
  }

  .idel-banner-slider__caption-outer {
    max-width: var(
      --idel-banner-caption-outer-max-mobile,
      var(--idel-banner-caption-outer-max, 100%)
    );
  }

  .idel-banner-slider__caption {
    max-width: var(--idel-banner-caption-max-mobile, none);
    padding: var(--idel-banner-caption-pad-mobile, var(--idel-banner-caption-pad, 0));
  }

  .idel-banner-slider__title {
    font-size: var(
      --idel-banner-title-size-mobile,
      var(--idel-banner-title-size, clamp(1.85rem, 3.5vw, 3rem))
    );
    line-height: var(--idel-banner-title-lh-mobile, var(--idel-banner-title-lh, 1.15)) !important;
    margin-bottom: var(--idel-banner-title-mb-mobile, var(--idel-banner-title-mb, 14px));
    max-width: var(
      --idel-banner-title-max-width-mobile,
      var(--idel-banner-title-max-width, min(40rem, 100%))
    );
    font-weight: var(--idel-banner-title-weight-mobile, var(--idel-banner-title-weight, 700));
  }

  .idel-banner-slider__desc {
    font-size: var(--idel-banner-desc-size-mobile, var(--idel-banner-desc-size, 1.05rem));
    line-height: var(--idel-banner-desc-lh-mobile, var(--idel-banner-desc-lh, 1.55)) !important;
    margin-top: var(--idel-banner-desc-mt-mobile, var(--idel-banner-desc-mt, 0));
    font-weight: var(--idel-banner-desc-weight-mobile, var(--idel-banner-desc-weight, 400));
  }
}
