/* ============================================================
   NC24B BREADCRUMB – 3 style warianty
   ============================================================ */

/* SHARED BASE */
.nc24b-breadcrumb__list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nc24b-breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 0;
  min-width: 0;
}

.nc24b-breadcrumb__link,
.nc24b-breadcrumb__current {
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 18rem;
  transition: color 0.2s;
}

.nc24b-breadcrumb__sep {
  display: flex;
  align-items: center;
  padding: 0 0.375rem;
  flex-shrink: 0;
}

/* ── DARK (dark navbar bar) ──────────────────────────── */
.nc24b-breadcrumb--dark {
  background: #0f172a;                         /* --nav-bg */
  border-bottom: 1px solid #1e293b;            /* --nav-border */
  padding: 0.5rem 0;
}

.nc24b-breadcrumb--dark .nc24b-breadcrumb__link {
  color: #94a3b8;                              /* slate-400 */
  text-decoration: none;
}
.nc24b-breadcrumb--dark .nc24b-breadcrumb__link:hover {
  color: #60a5fa;                              /* blue-400 */
}
.nc24b-breadcrumb--dark .nc24b-breadcrumb__current {
  color: #60a5fa;                              /* blue-400 – current page */
  font-weight: 600;
}
.nc24b-breadcrumb--dark .nc24b-breadcrumb__sep svg {
  stroke: #475569;                             /* slate-600 */
}

/* ── LIGHT (white/slate background) ─────────────────── */
.nc24b-breadcrumb--light {
  padding: 0.625rem 0;
  background: transparent;
}

.nc24b-breadcrumb--light .nc24b-breadcrumb__link {
  color: #64748b;                              /* slate-500 */
  text-decoration: none;
}
.nc24b-breadcrumb--light .nc24b-breadcrumb__link:hover {
  color: #2563eb;                              /* blue-600 */
}
.nc24b-breadcrumb--light .nc24b-breadcrumb__current {
  color: #2563eb;                              /* blue-600 */
  font-weight: 600;
}
.nc24b-breadcrumb--light .nc24b-breadcrumb__sep svg {
  stroke: #cbd5e1;                             /* slate-300 */
}

/* ── INLINE (inside article content) ────────────────── */
.nc24b-breadcrumb--inline {
  margin-bottom: 1.25rem;
  background: transparent;
}

.nc24b-breadcrumb--inline .nc24b-breadcrumb__list {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.5rem 0.875rem;
  display: inline-flex;
}

.nc24b-breadcrumb--inline .nc24b-breadcrumb__link {
  color: #64748b;
  text-decoration: none;
  font-size: 0.8125rem;
}
.nc24b-breadcrumb--inline .nc24b-breadcrumb__link:hover {
  color: #2563eb;
}
.nc24b-breadcrumb--inline .nc24b-breadcrumb__current {
  color: #0f172a;
  font-weight: 600;
  font-size: 0.8125rem;
}
.nc24b-breadcrumb--inline .nc24b-breadcrumb__sep svg {
  stroke: #cbd5e1;
}

/* Home icon na pierwszym elemencie */
.nc24b-breadcrumb__item:first-child .nc24b-breadcrumb__link::before {
  content: '';
  display: inline-block;
  width: 0.875rem;
  height: 0.875rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  margin-right: 0.25rem;
  vertical-align: middle;
  position: relative;
  top: -1px;
}

.nc24b-breadcrumb--light .nc24b-breadcrumb__item:first-child .nc24b-breadcrumb__link::before,
.nc24b-breadcrumb--inline .nc24b-breadcrumb__item:first-child .nc24b-breadcrumb__link::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E");
}

/* Responsive – skracaj na mobile */
@media (max-width: 639px) {
  .nc24b-breadcrumb__link,
  .nc24b-breadcrumb__current {
    max-width: 9rem;
  }
  /* Ukryj środkowe kroki na bardzo małych ekranach, zostaw Home i current */
  .nc24b-breadcrumb__item:not(:first-child):not(:last-child) {
    display: none;
  }
  .nc24b-breadcrumb__item:nth-last-child(2) .nc24b-breadcrumb__sep {
    display: none;
  }
  /* Pokaż … w miejscu ukrytych kroków */
  .nc24b-breadcrumb__list::after {
    content: '…';
    color: #94a3b8;
    font-size: .75rem;
    padding: 0 .25rem;
    order: -1;
  }
}