/**
 * ATAMAP Associates — Breadcrumb Styles
 * Horizontal flex layout, gold links, steel separator, dark current
 * Responsive: truncate on mobile (show only last 2 items)
 */

.breadcrumb-nav {
  padding: var(--space-3, 0.75rem) 0;
  margin-bottom: 0;
}

.breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: var(--font-size-xs, 0.75rem);
  line-height: 1.5;
}

.breadcrumb-item {
  display: flex;
  align-items: center;
  color: var(--color-steel-400, #6b7280);
}

.breadcrumb-item a {
   color: var(--color-accent, #D4AF37);
  text-decoration: none;
  transition: color var(--duration-fast, 150ms) var(--ease-out, ease-out);
}

.breadcrumb-item a:hover,
.breadcrumb-item a:focus-visible {
  color: var(--color-white, #111827);
  text-decoration: underline;
}

.breadcrumb-item a:focus-visible {
  outline: 2px solid var(--color-accent, #D4AF37);
  outline-offset: 2px;
  border-radius: 2px;
}

.breadcrumb-item--current {
  color: var(--color-white, #111827);
  font-weight: var(--font-weight-medium, 500);
}

/* Separator: "›" between items */
.breadcrumb-item + .breadcrumb-item::before {
  content: '›';
  margin: 0 var(--space-2, 0.5rem);
  color: #9ca3af;
  font-weight: normal;
  speak: never;
}

/* ─── Responsive: truncate on mobile (show only last 2 items) ────── */
@media (max-width: 639px) {
  .breadcrumb-item:not(.breadcrumb-item--current) {
    /* Hide all non-current items except the one immediately preceding current */
  }

  .breadcrumb-list[data-truncate="true"] .breadcrumb-item:not(:nth-last-child(-n+2)) {
    display: none;
  }

  .breadcrumb-list[data-truncate="true"] .breadcrumb-item:nth-last-child(2)::before {
    content: '… ›';
    margin-right: var(--space-2, 0.5rem);
  }
}

/* Auto-truncate via JS on mobile */
@media (max-width: 639px) {
  .breadcrumb-list.breadcrumb-list--truncated .breadcrumb-item:not(:nth-last-child(-n+2)) {
    display: none;
  }

  .breadcrumb-list.breadcrumb-list--truncated .breadcrumb-item:nth-last-child(2)::before {
    content: '… ›';
    margin-right: var(--space-2, 0.5rem);
  }
}

/* ─── Container alignment ──────────────────────────────────────────── */
.breadcrumb-nav .container {
  /* If breadcrumb is inside a .container, match page alignment */
}

/* ─── Dark mode / page-hero context ───────────────────────────────── */
.page-hero .breadcrumb-nav,
.page-hero + .breadcrumb-nav {
  /* Breadcrumb follows page-hero styling */
}

/* ─── Within page-hero section (existing .breadcrumb compat) ──────── */
.page-hero .breadcrumb {
  /* Existing static breadcrumbs — leave untouched */
}