/* src/styles/components/header.scss */
.header {
  background-color: var(--top_nav);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.header_hamburger {
  border-width: 2px;
  border-color: var(--primary);
}
.header_hamburger svg path,
.header_hamburger svg rect {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
@media (min-width: 768px) {
  .header_hamburger.collapsed svg .bar1 {
    --tw-translate-x: 6px;
    --tw-translate-y: -4px;
    --tw-rotate: 45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
  .header_hamburger.collapsed svg .bar2 {
    --tw-translate-x: -100%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    opacity: 0;
  }
  .header_hamburger.collapsed svg .bar3 {
    --tw-translate-x: -8px;
    --tw-translate-y: 10px;
    --tw-rotate: -45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
  .header_hamburger.collapsed svg .arrow {
    --tw-translate-x: 100%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    opacity: 0;
  }
}
.header_hamburger:hover {
  border-color: var(--links_color);
}
.header_popupbtns {
  display: none;
  gap: 10px;
}
@media (min-width: 768px) {
  .header_popupbtns {
    display: flex;
    align-items: center;
  }
}
