/* assets/css/breadcrumbs.css
   Хлебные крошки + ссылка "Назад" под мобильный дизайн.
   ВАЖНО: разделитель НЕ рисуем через ::before, потому что он уже есть в HTML.
*/

:root{
  --bc-text: #111;
  --bc-muted: #666;
  --bc-sep: #bdbdbd;
  --bc-back: #111;
  --bc-back-hover: #ff6a00;
}

.breadcrumbs{
  padding: 8px 0 6px 0;
  background: transparent;
}

/* "Назад" */
.breadcrumbs-back{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-size: 13px;
  line-height: 1.2;
  color: var(--bc-back);
  text-decoration: none;

  margin: 0 0 6px 0;
  -webkit-tap-highlight-color: transparent;
}

.breadcrumbs-back:hover{
  color: var(--bc-back-hover);
}

.breadcrumbs-back:active{
  opacity: .85;
}

.breadcrumbs-back__arrow{
  font-size: 16px;
  line-height: 1;
}

/* список */
.breadcrumbs ul{
  list-style: none;
  margin: 0;
  padding: 0;

  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.breadcrumbs li{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-size: 12.5px;
  line-height: 1.25;
  color: var(--bc-muted);
  min-width: 0;
}

/* -------------------------------------------------
   FIX: убираем CSS-разделитель (второй ">" появлялся из-за него)
------------------------------------------------- */
.breadcrumbs li + li::before{
  content: none !important;
}

/* Если шаблон выводит разделитель отдельным элементом — стилизуем его */
.breadcrumbs li.sep,
.breadcrumbs li.breadcrumbs-sep,
.breadcrumbs .sep,
.breadcrumbs .breadcrumbs-sep{
  color: var(--bc-sep);
  font-weight: 700;
  opacity: .9;
}

/* ссылки */
.breadcrumbs a{
  color: var(--bc-muted);
  text-decoration: none;
  max-width: 100%;
}

.breadcrumbs a:hover{
  color: var(--bc-text);
}

.breadcrumbs a:active{
  opacity: .85;
}

/* Последний (текущая страница) */
.breadcrumbs li:last-child,
.breadcrumbs li:last-child span{
  color: var(--bc-text);
  font-weight: 600;
}

/* Последний, но кликабельный (a.is-current) */
.breadcrumbs a.is-current{
  color: var(--bc-text);
  font-weight: 600;
  text-decoration: none;
}

.breadcrumbs a.is-current:hover{
  color: var(--bc-text);
  text-decoration: underline; /* если не надо — удали строку */
}