/* Header variant: catbar — category bar inside the sticky header (template/blocks/header/catbar.twig).
   Loaded only when variants.header = catbar. */
html[data-header="catbar"] .et-header { border-radius: 0 0 var(--et-radius) var(--et-radius); }

html[data-header="catbar"] .et-catbar {
  margin-inline: 0;
  background: var(--et-surface);
  border-radius: 0 0 var(--et-radius) var(--et-radius);
  position: relative;
}
html[data-header="catbar"] .et-catbar__inner { display: flex; align-items: center; }

html[data-header="catbar"] .et-catbar__all-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-lg);
  background: var(--et-accent);
  color: var(--et-accent-contrast, #fff);
  border: 0;
  border-radius: var(--et-btn-radius, var(--et-radius-sm));
  font-family: var(--et-font);
  font-size: var(--et-text-sm);
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  flex-shrink: 0;
  transition: background var(--et-transition);
}
html[data-header="catbar"] .et-catbar__all-btn:hover,
html[data-header="catbar"] .et-catbar__all-btn.is-active { background: var(--et-accent-hover); }

html[data-header="catbar"] .et-catbar__nav {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
html[data-header="catbar"] .et-catbar__nav::-webkit-scrollbar { display: none; }

html[data-header="catbar"] .et-catbar__link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-md) var(--space-md);
  color: var(--et-text);
  font-size: var(--et-text-sm);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--et-transition);
}
html[data-header="catbar"] .et-catbar__link:hover { color: var(--et-accent-text); }
html[data-header="catbar"] .et-catbar__link--accent { color: var(--et-sale, var(--et-danger)); font-weight: 700; }

/* Merge with the product sticky buy bar like the nav row does in classic */
html[data-header="catbar"] body:has(.et-sticky-bar.is-visible) .et-header,
html[data-header="catbar"] body:has(.et-sticky-bar.is-visible) .et-catbar { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

@media (max-width: 991.98px) {
  html[data-header="catbar"] .et-header,
  html[data-header="catbar"] .et-catbar { border-radius: 0; }
  /* Mobile: categories scroll in the bar, the full tree is in the drawer (bottom nav) */
  html[data-header="catbar"] .et-catbar__all-btn { display: none; }
  html[data-header="catbar"] .et-catbar__link { padding: var(--space-sm) var(--space-md); }
}

/* Large store settings (R42): the catalog button next to the logo (header.catalog_button = row), marks before the items
   (header.bar_marks), own links after a divider (header.bar_links), the department whose mega menu is open */
html[data-header="catbar"] .et-catbar__mark { font-style: normal; font-size: var(--et-text-xs); font-variant-numeric: tabular-nums; color: var(--et-text-muted); }
html[data-header="catbar"] .et-catbar__sep { flex: none; width: var(--et-border-width); height: 1.25rem; margin-inline: var(--space-sm); background: var(--et-border); }
html[data-header="catbar"] .et-catbar__link--extra { font-weight: 500; }
html[data-header="catbar"] .et-catbar__link--extra.et-catbar__link--accent { font-weight: 700; }
html[data-header="catbar"] .et-catbar__link.is-active { color: var(--et-accent-text); box-shadow: inset 0 calc(var(--et-border-width) * -2) 0 currentColor; }
html[data-header="catbar"] .et-header--catalog-row .et-catbar__nav { margin-inline: calc(var(--space-md) * -1); }
@media (max-width: 991.98px) {
  html[data-header="catbar"] .et-header--catalog-row .et-catbar__nav { margin-inline: 0; }
}