/*
Theme Name: Etch Child Theme
Theme URI: https://etchwp.com/
Author: Marco Michely
Author URI: https://www.michelyweb.de
Description: Child Theme for EtchWP with my defaults
Template: etch-theme
Version: 1.2.4
Text Domain: etch-child-theme

License: GPL v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.txt

*/

/*
 * Headroom Configuration
 */
header {
  position: fixed;
  top: 0;
  z-index: 9999;
}

.headroom {
  will-change: transform;
  transition: 0.3s ease-in-out;
}

.headroom--pinned {
  transform: translateY(0%);
}

.admin-bar header.headroom--pinned {
  top: 32px;
}

.headroom--unpinned {
  transform: translateY(-100%);
}

html,
body {
  scroll-padding-top: 65px; /* set to the height of your header */
}

.menu {
  & .menu__list {
    display: flex;
    flex-direction: row;
    gap: 0em 2em;
    align-items: center;
  }

  & .menu__item {
    & a,
    & .submenu-toggle {
      display: flex;
    }
  }

  & .menu__item--has-children {
    position: relative;
    display: flex;
    flex-direction: column;

    & .submenu-toggle {
      align-items: center;
      cursor: pointer;
      display: flex;
    }

    & .sub-menu {
      display: flex;
      flex-direction: column;
      min-width: max-content;
      padding: 1em;
      margin: 0;
      list-style-type: none;
    }

    &:hover > .sub-menu,
    &:focus-within > .sub-menu,
    &.open > .sub-menu {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }

    &.submenu-closing > .sub-menu {
      opacity: 0;
      visibility: hidden;
    }
  }

  & .menu__hamburger {
    display: none;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    padding: 0;
    background-color: transparent;
    transition-property: opacity, background-color, scale, filter;
    transition-duration: 0.15s;
    transition-timing-function: linear;
    --hamburger-line-color: var(--base);
    --hamburger-line-size: 40px;
    --hamburger-line-height: 0.2em;

    & .menu__hamburger-box {
      width: var(--hamburger-line-size);
      height: calc((var(--hamburger-line-height) + 3px) * 3);
      display: flex;
      position: relative;
    }

    & .menu__hamburger-inner {
      width: var(--hamburger-line-size);
      height: var(--hamburger-line-height);
      display: block;
      margin-top: -2px;
      position: absolute;
      top: 2px;
      background-color: var(--hamburger-line-color);
      transition-property: transform;
      transition-duration: 0.275s;
      transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);

      &::before,
      &::after {
        content: "";
        display: block;
        width: var(--hamburger-line-size);
        height: var(--hamburger-line-height);
        background-color: var(--hamburger-line-color);
        position: absolute;
      }

      &::before {
        top: 10px;
        transition: opacity 0.125s 0.275s ease;
      }

      &::after {
        top: 20px;
        bottom: -10px;
        transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
      }
    }
  }

  & .menu__hamburger :hover,
  &.menu--mobile-open .menu__hamburger {
    opacity: 0.9;
  }
  &.menu--mobile-open .menu__hamburger {
    --hamburger-line-color: var(--primary);
  }

  &.menu--mobile-open .menu__hamburger .menu__hamburger-inner {
    transform: translate3d(0, 10px, 0) rotate(135deg);
    transition-delay: 0.075s;
  }

  &.menu--mobile-open .menu__hamburger .menu__hamburger-inner::before {
    transition-delay: 0s;
    opacity: 0;
  }

  &.menu--mobile-open .menu__hamburger .menu__hamburger-inner::after {
    transform: translate3d(0, -20px, 0) rotate(-270deg);
    transition-delay: 0.075s;
  }

  @media (min-width: 992px) {
    & .menu__item--has-children:hover > .submenu-toggle > *,
    & .menu__item--has-children:focus-within > .submenu-toggle > * {
      color: var(--primary-dark);
    }

    & .sub-menu {
      position: absolute;
      top: 100%;
      z-index: 1001;
      transition-duration: var(--transition-duration);
      transition-property: opacity, transform, visibility;
      transition-timing-function: var(--transition-function);
      transform: translateY(-0.5em);
      opacity: 0;
      visibility: hidden;
    }
  }

  @media (max-width: 991px) {
    & .menu__list {
      position: absolute;
      overflow-y: auto;
      top: 100%;
      left: var(--gutter);
      right: var(--gutter);
      visibility: hidden;
      opacity: 0;
      pointer-events: none;
      z-index: 9999;
      flex-direction: column;
      align-items: start;
    }

    & .sub-menu {
      padding-bottom: 0;
    }

    & .submenu-toggle {
      cursor: none;
      pointer-events: none;
    }

    & .menu__hamburger {
      display: flex;
    }

    &.menu--mobile-open .menu__list {
      visibility: visible;
      opacity: 1;
      pointer-events: auto;
      transition: visibility var(--transition-duration),
        opacity var(--transition-duration);
    }
  }
}

address {
  font-family: inherit;
    font-style: normal;
    font-size: inherit;
    & > a {
      display: inline;
    }
}

/**
 * SEOPress HTML-Sitemap -- START
 */
ul.sp-list-posts,
ul.sp-list-posts ul.children {
    padding-inline-start: 1.5em;
}

ul.sp-list-posts {
    margin-block: 1em;
  & .page-item-2677,
  & .page-item-40,
  & .page-item-42 > ul {
    display: none;
  }
}

.sp-archive-link {
    display: none;
}

li.page_item a {
    padding-block: 0.15em;
}
/* SEOPress HTML-Sitemap -- END */