/* ====== CP Product Slider – „v2” modern look ====== */
.cp-pss--v2 {
  --cp-radius: 18px;
  --cp-radius-xl: 24px;
  --cp-card-bg: #fff;
  --cp-card-bd: rgba(0,0,0,.06);
  --cp-shadow: 0 10px 30px rgba(0,0,0,.08);
  --cp-shadow-hover: 0 16px 40px rgba(0,0,0,.12);
  --cp-text: #0f172a;          /* neutral-900 */
  --cp-muted: #64748b;         /* neutral-500/600 */
  --cp-price: #111827;         /* neutral-800 */
  --cp-brand: #0ea5e9;         /* kolor akcentu (zmień pod swoją identyfikację) */
  --cp-btn-bd: #0f172a;        /* obrys przycisku */
  --cp-btn-bg: #fff;
  --cp-btn-text: #0f172a;
  --cp-btn-bg-hover: var(--cp-brand);
  --cp-btn-text-hover: #fff;
  --cp-bullet: #0f172a;
}

.cp-pss--v2 .swiper { overflow: hidden; }

/* Karta produktu */
.cp-pss--v2 .cp-card {
  display: flex;
  flex-direction: column;
  background: var(--cp-card-bg);
  border: 1px solid var(--cp-card-bd);
  border-radius: var(--cp-radius-xl);
  box-shadow: var(--cp-shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  text-decoration: none;
  color: var(--cp-text);
}

.cp-pss--v2 .cp-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--cp-shadow-hover);
  border-color: rgba(0,0,0,.10);
}

/* Media – duże, czyste, centrowane */
.cp-pss--v2 .cp-thumb {
  width: 100%;
  display: block;
  background: #fff;
  /* proporcja jak na screenie: 4:3 (zmień na 1/1 jeśli wolisz kwadrat) */
  aspect-ratio: 4 / 3;
  object-fit: contain;
  padding: 16px;
  border-top-left-radius: var(--cp-radius-xl);
  border-top-right-radius: var(--cp-radius-xl);
}

/* Treść */
.cp-pss--v2 .cp-body {
  padding: 12px 16px 6px;
  text-align: center;
}

.cp-pss--v2 .cp-title {
  margin: 6px 0 8px;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 600;
  color: var(--cp-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.5em;
}

.cp-pss--v2 .cp-price {
  margin: 0 0 10px;
  font-weight: 600;
  font-size: 16px;
  color: var(--cp-price);
}

/* CTA – pełna szerokość, „pill” */
.cp-pss--v2 .cp-actions {
  padding: 0 16px 16px;
}

.cp-pss--v2 .cp-actions .button,
.cp-pss--v2 .cp-actions button,
.cp-pss--v2 .cp-actions a.button {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  border-radius: 9999px;
  border: 2px solid var(--cp-btn-bd);
  background: var(--cp-btn-bg) !important;
  color: var(--cp-btn-text) !important;
  font-weight: 600;
  line-height: 1;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .1s ease;
  text-decoration: none !important;
}

.cp-pss--v2 .cp-actions .button:hover {
  background: var(--cp-btn-bg-hover) !important;
  border-color: var(--cp-btn-bg-hover);
  color: var(--cp-btn-text-hover) !important;
  transform: translateY(-1px);
}

/* Strzałki i kropki – minimalistyczne */
.cp-pss--v2 .swiper-button-prev,
.cp-pss--v2 .swiper-button-next {
  width: 38px; height: 38px;
  border-radius: 9999px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  color: #111;
}

.cp-pss--v2 .swiper-button-prev:after,
.cp-pss--v2 .swiper-button-next:after {
  font-size: 14px;
  font-weight: 700;
}

.cp-pss--v2 .swiper-pagination-bullet {
  background: var(--cp-bullet);
  opacity: .3;
}

.cp-pss--v2 .swiper-pagination-bullet-active {
  opacity: 1;
}

/* Siatka wysokości – CTA zawsze na dole */
.cp-pss--v2 .swiper-slide { height: auto; }
.cp-pss--v2 .cp-card { height: 100%; }
.cp-pss--v2 .cp-body { flex: 1 1 auto; }

/* Odstępy i responsywność */
.cp-pss--v2 .cp-pss { padding: 0 4px; }
@media (max-width: 640px){
  .cp-pss--v2 .cp-title { font-size: 16px; }
  .cp-pss--v2 .cp-actions .button { padding: 11px 16px; }
}

/* Dark mode (opcjonalnie) */
@media (prefers-color-scheme: dark) {
  .cp-pss--v2 {
    --cp-card-bg: #0b1220;
    --cp-card-bd: rgba(255,255,255,.08);
    --cp-text: #e5e7eb;
    --cp-muted: #94a3b8;
    --cp-price: #f1f5f9;
    --cp-btn-bd: #e5e7eb;
    --cp-btn-bg: transparent;
    --cp-btn-text: #e5e7eb;
    --cp-bullet: #e5e7eb;
  }
  .cp-pss--v2 .cp-card { box-shadow: 0 10px 30px rgba(0,0,0,.4); }
  .cp-pss--v2 .swiper-button-prev,
  .cp-pss--v2 .swiper-button-next { background:#0b1220; border-color:rgba(255,255,255,.1); color:#e5e7eb; }
}