.gzpm-logos { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.gzpm-logo-img { display:inline-block; vertical-align:middle; height:auto; }

/* GZPM - globalny wygląd kafelków i dymka.
   Tu edytujesz wszystko normalnym CSS-em, bez varów. */

.gzpm-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.gzpm-badges-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(62px, 1fr));
  gap: 8px;
}

.gzpm-badge {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-width: 62px;
  max-width: 70px;
  min-height: 74px;
  padding: 0 2px;
  background: rgba(255,255,255,.80);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 9px;
  box-shadow: 0 4px 12px rgba(0,0,0,.04);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  overflow: visible;
  cursor: pointer;
  user-select: none;
  box-sizing: border-box;
}

.gzpm-badge:focus,
.gzpm-badge:focus-visible,
.gzpm-badge *:focus,
.gzpm-badge *:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.gzpm-badge-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  margin-bottom: 2px;
}

.gzpm-badge-icon img {
  display: block !important;
  object-fit: contain !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

/* Obrazek schowany w kafelku */
.gzpm-badge-img-hidden .gzpm-badge-icon {
  height: 38px;
}

.gzpm-badge-img-hidden .gzpm-badge-icon img {
  width: 45px !important;
  height: 35px !important;
}

/* Obrazek wystający nad kafelek */
.gzpm-badge-img-out {
  padding-top: 38px;
}

.gzpm-badge-img-out .gzpm-badge-icon {
  position: absolute;
  left: 50%;
  top: -28px;
  transform: translateX(-50%);
  height: auto;
  margin: 0;
  overflow: visible;
  z-index: 2;
}

.gzpm-badge-img-out .gzpm-badge-icon img {
  width: 45px !important;
  height: 50px !important;
}

.gzpm-badge-label {
  display: block;
  font-size: 10px;
  line-height: 1.15;
  font-weight: 500;
  color: #333;
}

.gzpm-badge-label b,
.gzpm-badge-label strong {
  font-weight: 800;
}

.gzpm-badge-desc,
.gzpm-badge-tooltip-title,
.gzpm-badge-tooltip-desc {
  display: none !important;
}

.gzpm-badges-single .gzpm-badge {
  min-width: 90px;
  max-width: none;
}

.gzpm-tooltip {
  position: fixed;
  z-index: 999999;
  width: min(310px, calc(100vw - 28px));
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  box-shadow: 0 10px 35px rgba(0,0,0,.18);
  padding: 22px 24px 18px 18px;
  display: none;
  box-sizing: border-box;
}

.gzpm-tooltip.is-active {
  display: block;
}

.gzpm-tooltip-inner {
  position: relative;
}

.gzpm-tooltip-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  padding-right: 44px;
}

.gzpm-tooltip-icon {
  width: 52px !important;
  height: 52px !important;
  object-fit: contain !important;
  flex: 0 0 auto;
  max-width: none !important;
  max-height: none !important;
}

.gzpm-tooltip-title {
  font-size: 17px;
  line-height: 1.2;
  font-weight: 800;
  color: #111;
}

.gzpm-tooltip-desc {
  font-size: 14px;
  line-height: 1.55;
  color: #333;
  padding-right: 36px;
}

.gzpm-tooltip-title b,
.gzpm-tooltip-title strong,
.gzpm-tooltip-desc b,
.gzpm-tooltip-desc strong {
  font-weight: 800;
}

.gzpm-tooltip-desc ul,
.gzpm-tooltip-desc ol {
  margin: 8px 0 0 18px;
  padding: 0;
}

.gzpm-tooltip-desc li {
  margin: 0 0 5px 0;
  padding-left: 2px;
  line-height: 1.35;
}

.gzpm-tooltip-desc li::marker {
  font-size: .8em;
}

.gzpm-tooltip-close {
  position: absolute;
  top: 0;
  right: 0;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: #f4f4f4;
  cursor: pointer;
  font-size: 24px;
  line-height: 28px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.gzpm-tooltip-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 999998;
  display: none;
}

.gzpm-tooltip-backdrop.is-active {
  display: block;
}

@media (max-width: 767px) {
  .gzpm-badges-grid {
    grid-template-columns: repeat(2, minmax(62px, 1fr));
  }

  .gzpm-tooltip {
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%);
    width: calc(100vw - 44px);
    max-width: 360px;
  }
}
/* GZPM carousel - bazowe zachowanie, niezależne od pola CSS w panelu */
.gzpm-carousel-auto-holder {
  width: 100%;
  flex: 0 0 100%;
  max-width: 100%;
  margin: 0 0 18px 0;
}
.gzpm-carousel-wrap {
  --gzpm-carousel-bg: #141920;
  --gzpm-carousel-bg-hover: #20172b;
  --gzpm-carousel-text: #dfe5ef;
  --gzpm-carousel-text-hover: #ffffff;
  --gzpm-carousel-accent: #8b19ff;
  --gzpm-carousel-accent-2: #28BBF0;
  --gzpm-carousel-fade: 58px;
  position: relative;
  overflow: hidden;
}
.gzpm-carousel {
  cursor: grab;
  user-select: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--gzpm-carousel-fade), #000 calc(100% - var(--gzpm-carousel-fade)), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 var(--gzpm-carousel-fade), #000 calc(100% - var(--gzpm-carousel-fade)), transparent 100%);
}
.gzpm-carousel.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto !important;
}
.gzpm-carousel,
.gzpm-carousel * {
  -webkit-user-drag: none !important;
  user-drag: none !important;
  user-select: none;
}
.gzpm-carousel a,
.gzpm-carousel img {
  -webkit-user-drag: none !important;
  user-drag: none !important;
}
.gzpm-carousel img { pointer-events: none; }
.gzpm-carousel.is-dragging .gzpm-carousel-item { pointer-events: none; }
.gzpm-carousel-item {
  --gzpm-carousel-item-main: var(--gzpm-carousel-accent);
  --gzpm-carousel-item-second: var(--gzpm-carousel-accent-2);
  position: relative;
  isolation: isolate;
  background: var(--gzpm-carousel-bg) !important;
  border: 1px solid transparent !important;
  overflow: hidden;
}
.gzpm-carousel-item::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(90deg, var(--gzpm-carousel-item-main), var(--gzpm-carousel-item-second));
  pointer-events: none;
  z-index: 0;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.gzpm-carousel-item:hover,
.gzpm-carousel-item.is-active { background: var(--gzpm-carousel-bg-hover) !important; }
.gzpm-carousel-icon,
.gzpm-carousel-label { position: relative; z-index: 1; }
@media (max-width: 767px) {
  .gzpm-carousel-wrap { --gzpm-carousel-fade: 34px; }
}

/* GZPM 1.0.2 - zapasowe zanikanie krawędzi karuzeli, niezależne od CSS z panelu */
.gzpm-carousel-wrap::before,
.gzpm-carousel-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 16px;
  width: var(--gzpm-carousel-fade, 58px);
  z-index: 5;
  pointer-events: none;
}
.gzpm-carousel-wrap::before {
  left: 0;
  background: linear-gradient(90deg, #1b191e 0%, rgba(27,25,30,0) 100%);
}
.gzpm-carousel-wrap::after {
  right: 0;
  background: linear-gradient(270deg, #1b191e 0%, rgba(27,25,30,0) 100%);
}
@media (max-width: 767px) {
  .gzpm-carousel-wrap::before,
  .gzpm-carousel-wrap::after { width: 34px; }
}


/* GZPM 1.0.8 - twarde wyłączenie smooth scroll w karuzeli.
   Smooth scroll + requestAnimationFrame powodował telepanie po czasie. */
.gzpm-carousel {
  scroll-behavior: auto !important;
}
.gzpm-carousel.is-auto-moving {
  scroll-behavior: auto !important;
}