/*
 * Ferajna – Slider ofert
 * Plik: css/ferajna-slider.css
 */

.ferajna-slider-wrap {
  margin: 40px 0;
  font-family: var(--fj-font, 'Nunito', sans-serif);
}

.ferajna-slider__tytul {
  font-size: 22px;
  font-weight: 700;
  color: var(--fj-text, #1a1a2e);
  margin: 0 0 20px;
}

/* Outer: zawiera strzałki i viewport */
.ferajna-slider-outer {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Viewport – tu dzieje się overflow:hidden */
.ferajna-slider-viewport {
  overflow: hidden;
  width: 100%;
  min-width: 0;
}

/* Track – przesuwa się przez translateX */
.ferajna-slider {
  display: flex;
  gap: 20px;
  will-change: transform;
  transition: transform 0.35s ease;
}

/* Każda karta w sliderze */
.ferajna-slider__item {
  flex: 0 0 calc(33.333% - 14px);
  min-width: 0;
}

/* Strzałki – twarde kolory, nie zmienne CSS */
.ferajna-slider__arrow {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid #008080;
  background: #ffffff;
  color: #008080;
  font-size: 26px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  display: flex !important;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, color 0.2s;
  padding: 0;
  appearance: none;
  -webkit-appearance: none;
}

.ferajna-slider__arrow:hover {
  background: #008080;
  color: #ffffff;
}

.ferajna-slider__arrow:disabled {
  border-color: #ccc;
  color: #ccc;
  cursor: default;
  pointer-events: none;
}

/* Dots */
.ferajna-slider__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}

.ferajna-slider__dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: none;
  background: #d1d5db;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, transform 0.2s;
}

.ferajna-slider__dot--active {
  background: #008080;
  transform: scale(1.35);
}

/* Responsywność */
@media (max-width: 900px) {
  .ferajna-slider__item {
    flex: 0 0 calc(50% - 10px);
  }
}

@media (max-width: 580px) {
  .ferajna-slider__item {
    flex: 0 0 85%;
    scroll-snap-align: start;
  }

  .ferajna-slider-viewport {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  .ferajna-slider {
    transition: none;
  }

  /* Na mobile strzałki zostają, ale mniejsze i poza trackiem */
  .ferajna-slider__arrow {
    width: 36px !important;
    height: 36px !important;
    font-size: 22px !important;
    background: #008080 !important;
    color: #ffffff !important;
    border-color: #008080 !important;
    flex-shrink: 0;
  }

  .ferajna-slider__arrow:disabled {
    background: #d1d5db !important;
    border-color: #d1d5db !important;
    color: #fff !important;
  }
}

/* Grid typ – bez paddingu */
.ferajna-oferty-wrap--typ {
  padding: 0;
}