/* =======================================================================
   AddiPress Category Icons – Stylesheet (scoped, professional, robust)
   ======================================================================= */

/* ---- Design tokens (łatwo zmienisz globalnie) ----------------------- */
:root{
  --apci-gap-xs: 4px;
  --apci-gap-sm: 6px;
  --apci-gap-md: 8px;

  --apci-size-xs: 16px;
  --apci-size-sm: 18px;
  --apci-size-md: 20px;
  --apci-size-lg: 28px;
  --apci-size-xl: 32px;
  --apci-size-xxl: 40px;

  --apci-badge-bg: rgba(255,255,255,.92);
  --apci-badge-border: rgba(0,0,0,.06);
  --apci-badge-shadow: 0 4px 12px rgba(0,0,0,.16);
}

/* ---- Reset / baza dla ikon ------------------------------------------ */
.apci-icon,
.apci-link-icon,
.apci-field-icon,
.apci-archive-title-icon{
  display:inline-block;
  vertical-align:middle;
  object-fit:contain;
  aspect-ratio:1 / 1;
  /* Odporność na reguły motywu typu img{height:auto} */
  width: var(--apci-size-md) !important;
  height: var(--apci-size-md) !important;
  margin-right: var(--apci-gap-sm);
  flex: 0 0 auto;
  line-height: 1;
  image-rendering:auto;
}

/* ---- Domyślne rozmiary per-kontext ---------------------------------- */
.apci-link-icon{               /* linki do kategorii, breadcrumbs, menu */
  width: var(--apci-size-sm) !important;
  height: var(--apci-size-sm) !important;
  margin-right: var(--apci-gap-sm);
}

.apci-archive-title-icon{      /* ikona przed H1 na stronach taksonomii */
  width: var(--apci-size-xl) !important;
  height: var(--apci-size-xl) !important;
  margin-right: var(--apci-gap-md);
}

.apci-field-icon--cell{        /* „Additional Info” – tytuł komórki */
  width: var(--apci-size-lg) !important;
  height: var(--apci-size-lg) !important;
  margin-right: var(--apci-gap-md);
}

.apci-field-icon--label{       /* formularze – ikona przy labelce */
  width: var(--apci-size-lg) !important;
  height: var(--apci-size-lg) !important;
  margin-right: var(--apci-gap-md);
}

/* ---- Kategorie pod tytułem ogłoszenia ------------------------------- */
.apci-single-cats .apci-cat-link{
  display:inline-flex;
  align-items:center;
  gap: var(--apci-gap-sm);
  margin-right: var(--apci-gap-sm);
  text-decoration:none;
  font-size: 14px;
  line-height: 1.2;
}

/* ---- Badge na miniaturze (nakładka) --------------------------------- */
.apci-thumb-wrap{
  position:relative;
  display:inline-block;
}

.apci-badge{
  position:absolute;
  z-index:5;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  /* rozmiar badge’u (możesz podmienić na --apci-size-lg/xxl) */
  width: var(--apci-size-lg);
  height: var(--apci-size-lg);

  border-radius:999px;
  padding: 6px;
  box-shadow: var(--apci-badge-shadow);
  backdrop-filter:saturate(1.1) blur(2px);
  -webkit-backdrop-filter:saturate(1.1) blur(2px);
  border:1px solid var(--apci-badge-border);
  background: var(--apci-badge-bg);
  pointer-events:none; /* nie przeszkadza w klikaniu miniatury */
}

.apci-badge img{
  width:100% !important;
  height:100% !important;
  object-fit:contain;
}

/* Pozycje badge’u */
.apci-pos-tl{ top:10px; left:10px; }
.apci-pos-tr{ top:10px; right:10px; }
.apci-pos-bl{ bottom:10px; left:10px; }
.apci-pos-br{ bottom:10px; right:10px; }

/* ---- Ikona inline (np. w tekstach) ---------------------------------- */
.apci-inline{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 1.25em;
  height: 1.25em;
  border-radius: 999px;
  vertical-align: middle;
  margin-right: .35em;
  top: -.05em; /* delikatne dosunięcie do linii bazowej */
}

/* ---- Utilities rozmiarowe (opcjonalne) ------------------------------- */
.apci-size-sm{ width: var(--apci-size-sm) !important; height: var(--apci-size-sm) !important; }
.apci-size-md{ width: var(--apci-size-lg) !important; height: var(--apci-size-lg) !important; }   /* celowo 28px */
.apci-size-lg{ width: var(--apci-size-xxl) !important; height: var(--apci-size-xxl) !important; }

/* ---- Drobne dopieszczenie tabeli „Additional Info” ------------------ */
.listing-custom-fields .listing-custom-field-title{
  white-space:nowrap;
}
.listing-custom-fields .apci-field-icon{
  opacity:.95;
  transform:translateZ(0);
}

/* ---- Preferencje dostępności/animacje (bezpieczne) ------------------ */
@media (prefers-reduced-motion: reduce){
  .apci-badge{ transition:none !important; }
}

/* ---- Light/Dark mode (delikatna korekta tła badge’u) ---------------- */
@media (prefers-color-scheme: dark){
  :root{
    --apci-badge-bg: rgba(20,20,20,.82);
    --apci-badge-border: rgba(255,255,255,.08);
    --apci-badge-shadow: 0 6px 18px rgba(0,0,0,.5);
  }
}
.apci-field-fallback { display:flex; align-items:center; gap:8px; }

/* Additional Info – ikona w kolumnie tytułów */
.apci-field-icon--cell{
  display:inline-block;
  width:22px;height:22px;
  object-fit:contain;
  vertical-align:middle;
  margin-right:8px;
}