/**
 * Header Sticky independiente.
 */
.sytec-theme-headers {
  display: contents;
}

.sytec-sticky-header {
  position: fixed;
  z-index: 1000;
  top: var(--sytec-sticky-admin-offset, 0px);
  right: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-100%);
  visibility: hidden;
  transition:
    transform 240ms ease,
    opacity 240ms ease,
    visibility 0s linear 240ms;
}

.sytec-sticky-header.is-sticky-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
  visibility: visible;
  transition-delay: 0s;
}

.sytec-sticky-header .sytec-header-row__inner {
  min-height: var(--sytec-row-height);
}

.sytec-sticky-header .sytec-builder-logo .custom-logo {
  width: min(var(--sytec-element-logo-width), 100%);
  max-height: var(--sytec-element-logo-height);
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) {
  margin: var(--sytec-menu-margin, 0);
  color: var(--sytec-menu-color, var(--sytec-row-link));
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-builder-navigation {
  font-family: var(--sytec-menu-font-family, var(--sytec-body-font-family, var(--sytec-font-primary)));
  font-size: var(--sytec-menu-font-size-desktop, var(--sytec-body-size-desktop, 16px));
  font-style: var(--sytec-menu-font-style, normal);
  font-weight: var(--sytec-menu-font-weight, 650);
  line-height: var(--sytec-menu-line-height, 1.4);
  letter-spacing: var(--sytec-menu-letter-spacing, normal);
  text-transform: var(--sytec-menu-text-transform, none);
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-builder-menu {
  display: flex;
  flex-wrap: nowrap;
  justify-content: var(--sytec-menu-alignment, center);
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-builder-menu > li > a {
  display: flex;
  margin: 0;
  padding: var(--sytec-menu-padding-block, 8px) var(--sytec-menu-padding-inline, 10px);
  align-items: center;
  border: var(--sytec-menu-border-width, 0) var(--sytec-menu-border-style, solid) var(--sytec-menu-border-color, transparent);
  border-radius: var(--sytec-menu-radius, 6px);
  background: var(--sytec-menu-background, transparent);
  box-shadow: var(--sytec-menu-shadow, none);
  color: var(--sytec-menu-color, var(--sytec-row-link));
  font: inherit;
  gap: var(--sytec-menu-icon-gap, 6px);
  transition:
    background-color var(--sytec-transition),
    box-shadow var(--sytec-transition),
    color var(--sytec-transition);
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-menu > li > a:hover {
  background: var(--sytec-menu-hover-background, rgba(255, 255, 255, 0.1));
  box-shadow: var(--sytec-menu-hover-shadow, none);
  color: var(--sytec-sticky-link-hover, var(--sytec-menu-hover-color, var(--sytec-menu-color, var(--sytec-row-link))));
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-menu :is(.current-menu-item, .current-menu-parent, .current-menu-ancestor, .current_page_item) > a {
  background: var(--sytec-menu-active-background, rgba(255, 255, 255, 0.1));
  color: var(--sytec-menu-active-color, var(--sytec-menu-color, var(--sytec-row-link)));
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-menu a:focus-visible {
  background: var(--sytec-menu-hover-background, rgba(255, 255, 255, 0.1));
  box-shadow: var(--sytec-menu-hover-shadow, none);
  color: var(--sytec-menu-focus-color, var(--sytec-sticky-link-hover, var(--sytec-menu-hover-color, var(--sytec-menu-color))));
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-menu .sub-menu {
  top: calc(100% + var(--sytec-submenu-offset, 0px));
  min-width: var(--sytec-submenu-min-width, 220px);
  width: max-content;
  max-width: min(90vw, 640px);
  padding: var(--sytec-submenu-padding, 8px);
  border: var(--sytec-submenu-border-width, 1px) solid var(--sytec-submenu-border-color, var(--sytec-color-border));
  border-radius: var(--sytec-submenu-radius, 8px);
  background: var(--sytec-submenu-background, #fff);
  box-shadow: var(--sytec-submenu-shadow, var(--sytec-shadow-medium));
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-menu .sub-menu a {
  color: var(--sytec-submenu-color, var(--sytec-color-primary));
}

.sytec-sticky-header :is(
  [data-builder-type="primary_menu"],
  [data-builder-type="secondary_menu"]
) .sytec-menu .sub-menu a:is(:hover, :focus-visible) {
  background: var(--sytec-submenu-hover-background, transparent);
  color: var(--sytec-submenu-hover-color, var(--sytec-sticky-link-hover, var(--sytec-menu-hover-color, var(--sytec-color-accent))));
}

.sytec-sticky-header__device--desktop {
  display: block;
}

.sytec-sticky-header__device--mobile {
  display: none;
}

@media (min-width: 768px) and (max-width: 1024px) {
  .sytec-sticky-header .sytec-builder-header__device--desktop {
    display: block;
  }

  .sytec-sticky-header :is(
    [data-builder-type="primary_menu"],
    [data-builder-type="secondary_menu"]
  ) {
    --sytec-menu-gap: 4px;
    --sytec-menu-font-size-desktop: 0.78rem;
    --sytec-menu-padding-inline: 6px;
  }

  .sytec-sticky-header .sytec-header-zone {
    gap: 0.3rem;
  }
}

@media (max-width: 767px) {
  .sytec-sticky-header .sytec-sticky-header__device--desktop {
    display: none;
  }

  .sytec-sticky-header .sytec-sticky-header__device--mobile {
    display: block;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sytec-sticky-header {
    transition: none;
  }
}
