/* --- 1. INFO PANEL LAYOUT --- */
.info-panel {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding-block: var(--spacing-lg, 1rem);
  gap: var(--spacing-sm, 0.5rem);
}

/* Breadcrumb v paneli zaberá celú šírku hore */
.info-panel .breadcrumb {
  width: 100%;
  margin-bottom: var(--spacing-md, 0.75rem);
}

/* Výsledky (counts) a tlačidlá sú v jednom riadku */
.info-panel .counts {
  font-size: var(--font-size-sm, 0.875rem);
  color: var(--color-text-secondary);
}

.info-panel .filter-btn-wrapper {
  margin-left: auto;
  /* Odsunie tlačidlá doprava */
}

/* --- 2. ACTION BUTTONS (Filter & Sort) --- */
.info-panel .btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-inline-start: 0.5rem;
  text-transform: none;
}

.info-panel .icon {
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}

.info-panel .title {
  text-transform: none;
}

/* --- 3. BREADCRUMBS --- */
.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  align-items: center;
}

.breadcrumb li {
  display: flex;
  align-items: center;
  font-size: var(--font-size-sm, 0.875rem);
  color: var(--color-text-primary);
}

/* Separátor */
.breadcrumb li:not(:last-child)::after {
  content: "\00203A";
  margin-inline: var(--spacing-sm, 0.5rem);
  color: var(--color-text-tertiary);
  font-weight: 300;
}

.breadcrumb a {
  color: inherit;
  text-decoration: none;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
}

.breadcrumb a:hover {
  color: var(--color-orange, orange);
  text-decoration: underline;
}

/* Špeciálna úprava pre Home ikonu v breadcrumb */
.breadcrumb .icon {
  width: 1.15rem;
  height: 1.15rem;
}

.group {
  display: flex;
  gap: .5rem;
  justify-content: end;
  flex-grow: 1;
}

.hc {
  justify-content: center;
}