:root {
  --wcob-admin-bar-offset: 0px;
  --wcob-header-height: 0px;
  --wcob-header-offset: 0px;
  --wcob-category-offset: var(--wcob-header-offset);
}

[data-wcob-sticky-header][data-wcob-sticky-mode="sticky"] {
  position: sticky !important;
  top: var(--wcob-admin-bar-offset, 0px) !important;
  z-index: 100000 !important;
  isolation: isolate;
}

[data-wcob-sticky-header][data-wcob-sticky-mode="fixed"] {
  position: fixed !important;
  top: calc(var(--wcob-admin-bar-offset, 0px) + var(--wcob-fixed-compensation-y, 0px)) !important;
  left: var(--wcob-fixed-header-left, 0px) !important;
  width: var(--wcob-fixed-header-width, 100%) !important;
  max-width: 100vw;
  z-index: 100000 !important;
  isolation: isolate;
}

[data-wcob-sticky-header][data-wcob-sticky-mode="native"] {
  z-index: max(100000, var(--wcob-theme-header-z-index, 1));
}

.wcob-header-spacer {
  display: block;
  width: 100%;
  min-height: var(--wcob-header-height, 0px);
  pointer-events: none;
}

.wcob-header-account-target {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  margin-inline-start: auto;
  padding-inline: .5rem;
  box-sizing: border-box;
}

.wcob-frontend-identity-fallback {
  position: sticky;
  top: var(--wcob-admin-bar-offset, 0px);
  z-index: 100000;
  display: flex;
  justify-content: flex-end;
  box-sizing: border-box;
  width: 100%;
  padding: .5rem max(1rem, env(safe-area-inset-right));
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
}

[data-wcob-account-target] .wcob-frontend-identity-fallback,
[data-wcob-account-target] > .wcob-frontend-identity {
  position: relative;
  top: auto;
  width: auto;
  padding: 0;
  border: 0;
  background: transparent;
}

.wcob-frontend-identity {
  position: relative;
  display: inline-flex;
  align-items: center;
  color: #172033;
  font: inherit;
}

.wcob-frontend-identity__toggle {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .6rem .85rem;
  border: 1px solid #cbd5e1;
  border-radius: .65rem;
  background: #fff;
  color: #172033;
  font: inherit;
  font-weight: 650;
  line-height: 1.2;
  cursor: pointer;
}

.wcob-frontend-identity .wcob-frontend-identity__toggle {
  border-color: #cbd5e1 !important;
  background: #fff !important;
  color: #172033 !important;
  opacity: 1 !important;
}
.wcob-frontend-identity .wcob-frontend-identity__toggle:hover,
.wcob-frontend-identity .wcob-frontend-identity__toggle:focus,
.wcob-frontend-identity .wcob-frontend-identity__toggle:focus-visible,
.wcob-frontend-identity .wcob-frontend-identity__toggle[aria-expanded="true"] {
  border-color: #94a3b8 !important;
  background: #f8fafc !important;
  color: #172033 !important;
  opacity: 1 !important;
}
.wcob-frontend-identity .wcob-frontend-identity__toggle .wcob-frontend-identity__greeting,
.wcob-frontend-identity .wcob-frontend-identity__toggle:hover .wcob-frontend-identity__greeting,
.wcob-frontend-identity .wcob-frontend-identity__toggle:focus .wcob-frontend-identity__greeting,
.wcob-frontend-identity .wcob-frontend-identity__toggle:focus-visible .wcob-frontend-identity__greeting,
.wcob-frontend-identity .wcob-frontend-identity__toggle[aria-expanded="true"] .wcob-frontend-identity__greeting,
.wcob-frontend-identity .wcob-frontend-identity__toggle .wcob-frontend-identity__chevron {
  color: #172033 !important;
}
.wcob-frontend-identity__toggle:focus-visible,
.wcob-frontend-identity__link:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; }

.wcob-frontend-identity__chevron {
  width: .55rem;
  height: .55rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .16s ease;
}
.wcob-frontend-identity__toggle[aria-expanded="true"] .wcob-frontend-identity__chevron { transform: rotate(225deg) translate(-1px, -1px); }

.wcob-frontend-identity__menu {
  position: absolute;
  inset: calc(100% + .45rem) 0 auto auto;
  z-index: 100010;
  display: grid;
  min-width: min(18rem, calc(100vw - 2rem));
  padding: .45rem;
  border: 1px solid #dbe2ea;
  border-radius: .75rem;
  background: #fff;
  box-shadow: 0 .75rem 2rem rgba(15, 23, 42, .16);
}
.wcob-frontend-identity__menu[hidden] { display: none !important; }
.wcob-frontend-identity__link {
  display: flex;
  min-height: 44px;
  align-items: center;
  padding: .65rem .75rem;
  border-radius: .5rem;
  color: #172033;
  text-decoration: none;
}
.wcob-frontend-identity__link:hover { background: #eef2ff; color: #172033; }

[data-wcob-category-navigation],
.wcob-category-rail,
.wcob-catalogue-layout--horizontal .wcob-public-menu__categories {
  scroll-margin-top: calc(var(--wcob-header-offset, 0px) + 1rem);
}

@media (max-width: 782px) {
  .wcob-header-account-target { padding-inline: .25rem; }
  .wcob-frontend-identity-fallback { padding-left: max(.75rem, env(safe-area-inset-left)); padding-right: max(.75rem, env(safe-area-inset-right)); }
  .wcob-frontend-identity__menu { position: fixed; inset: var(--wcob-header-offset, 46px) .75rem auto .75rem; min-width: 0; }
  .wcob-frontend-identity__greeting { max-width: 11rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  .wcob-frontend-identity__chevron { transition: none; }
}