/* Customizations for WebCamp NJ to Event Horizon */
:root {
  --color--black: --color--primary
}

body {
  background-color: var(--color--primary-80);
}

.site-header__action {
    @container style(--wide-nav: true) {
        display: none;
    }
}

.site-header {
  margin-bottom: 0;
}

button.primary-nav__button-toggle .icon--menu-toggle {
  background-color: transparent;
}

li.primary-nav__menu-item.primary-nav__menu-item--link.primary-nav__menu-item--level-1.primary-nav__menu-item--has-children .primary-nav__menu-link {
  text-decoration-color: transparent;
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 6px;

  &:hover,
  &:focus,
  &:where(:hover) {
    text-decoration-color: var(--color--primary-50);
  }
}


li.primary-nav__menu-item.primary-nav__menu-item--link.primary-nav__menu-item--level-1.primary-nav__menu-item--has-children .primary-nav__menu--level-2 {
  background-color: var(--color--primary-50);
}


.site-header__register {
  background: var(--color--primary-60);
  border: .25rem solid var(--color--primary-60);
  padding: 0;
  text-wrap: nowrap;

  &::before {
    background-color: transparent;
  }

  & a:hover,
  & a:focus {
    background: var(--color--white);
    border-color: var(--color--primary-60);
    color: var(--color--primary-60);
  }

  & svg {
    display: none;
  }
}

.site-hero__container {
  background-color: rgba(255,255,255,.8);
  margin-bottom: 3rem;
  margin-top: 3rem;
  padding: 0 0 2rem 0;
}

.site-hero__title[class] {
  color: var(--color--primary-50);
  filter: none;
  text-transform: unset;

    @supports (animation-timeline: scroll()) {
      color: var(--color--primary-50);
      text-transform: unset;
    }
}

.site-hero-details__button,
.site-hero-details__flyout {
  background-color: var(--color--primary-50);
}

.site-hero-details__flyout-general-location,
.site-hero-details__flyout-day-heading {
  color: var(--color--secondary-50);
}

.eh-section {
    &.eh-section--full-width {
      right: 0;
      left: 0;
      width: 100vw;
      margin-left: 0;
      margin-right: 0;
    }
}

.site-footer {
  background: var(--color--primary-60);

  & ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1.5rem;
    list-style: none;
    margin-left: 0;
  }

  a:hover,
  a:focus {
    color: var(--color--white);
    text-decoration-thickness: 3px;
  }
}

.path-taxonomy .region--content {
  max-width: 80%;
    margin-inline: auto;
    padding-inline: var(--sp1);

    @container style(--md: true) {
      padding-inline: var(--sp2);
    }
}

.view-event-sponsors {
  background-color: transparent;
}