/*
Theme Name:   SPSTI GAS BTP (Ollie Child)
Theme URI:    https://olliewp.com
Description:  A child theme for Ollie.
Author:       OllieWP
Author URI:   https://anamorphik.com
Template:     ollie
Version:      1.0.52
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Tags:         Tags: blog, portfolio, entertainment
Text Domain:  ollie
*/

/* Fixed header on scroll */
body.is-scrolled {
  padding-top: var(--header-height);

  .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;

    & > div:first-child {
      display: none;
    }
  }
}

@media (min-width: 600px) {
  .site-header {
    /* SIST-BTP like submenus */
    .wp-block-navigation__submenu-container {
      padding: 1rem !important;
      background-color: #232325 !important;
      border: 1px solid #00000026;
      color: #fafafa !important;
    }

    .wp-block-navigation__submenu-container .wp-block-navigation-item {
      font-size: 1rem;
      font-weight: 400;
      padding: 0 !important;
      white-space: nowrap;
    }
    .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content {
      justify-content: flex-start;
      padding: 1rem 0 !important;
    }
  }
}

@media (max-width: 1580px) {
  .site-header {
    .wp-block-navigation .wp-block-navigation-item {
      font-size: 1rem !important;
      font-weight: 600;
    }

    .wp-block-navigation .wp-block-navigation__submenu-icon {
      margin-left: 0;
    }

    .wp-block-social-links {
      gap: 0.5rem;
    }

    .wp-block-navigation-item .wp-block-navigation-item__content {
      padding: 1em;
    }
  }
}

@media (max-width: 1580px) {
  .site-header {
    .wp-block-navigation .wp-block-navigation-item {
      font-size: 0.875rem !important;
    }
  }
}

/* Mobile menu button */
.wp-block-navigation__responsive-container-open {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0.25em;
  margin: 0.5rem !important;
}

.wp-block-navigation__responsive-container-open::after {
  content: "MENU";
  display: block;
  font-size: 1rem;
}

.wp-block-navigation__responsive-close {
  .wp-block-navigation__responsive-container-close {
    background: none;
  }
}

/* Custom navigation styles */

.wp-block-page-list--custom {
  .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content {
    color: var(--wp--preset--color--main-accent);

    &::before {
      width: 100%;
    }
  }

  .wp-block-navigation-item .wp-block-navigation-item__content {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    text-decoration: none !important;
    position: relative;

    &::before {
      content: "";
      background-color: currentColor;
      display: block;
      position: absolute;
      bottom: 0;
      left: 0;
      height: 3px;
      width: 0%;
      transition: all cubic-bezier(0, 0.96, 0.58, 1) 0.3s;
      will-change: width, opacity;
      opacity: 1;
    }

    &:focus-visible,
    &:hover {
      color: var(--wp--preset--color--main-accent);
      &::before {
        width: 100%;
        opacity: 1;
      }
    }
  }
}

/* horizontal post loop */

.is-horizontal {
  .wp-block-post-template {
    display: flex;
    flex-wrap: wrap;
    flex-basis: 100%;
    gap: var(--wp--preset--spacing--medium);

    /* justify-content: space-evenly;
    align-items: flex-start; */
    justify-content: inherit;
    align-items: inherit;

    li {
      flex-basis: 20rem;
      margin: 0 !important;
    }
  }
}

.is-content-justification-space-evenly {
  justify-content: space-evenly;
}

.text-decoration-none > a {
  text-decoration: none !important;
}

/* custom list */

.list--lines {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-flow: column;
  gap: 0;

  li:not(:last-child) a {
    border-bottom: 1px solid #e3e3e3;
  }

  li a {
    display: inline-flex;
    flex-flow: row nowrap;
    gap: 0.5em;
    justify-content: flex-start;
    align-items: center;
    padding: 0.5em;
    width: 100%;
    text-decoration: none;
  }

  &[class*="item-icon--"] a::before {
    content: "";
    background-position: center;
    display: block;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
  }

  &.item-icon--location a::before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmMzZlMTAiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1tYXAtcGluIj48cGF0aCBkPSJNMjAgMTBjMCA0Ljk5My01LjUzOSAxMC4xOTMtNy4zOTkgMTEuNzk5YTEgMSAwIDAgMS0xLjIwMiAwQzkuNTM5IDIwLjE5MyA0IDE0Ljk5MyA0IDEwYTggOCAwIDAgMSAxNiAwIi8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxMCIgcj0iMyIvPjwvc3ZnPg==);
  }

  &.item-icon--file-text a::before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmMzZlMTAiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1maWxlLXRleHQiPjxwYXRoIGQ9Ik0xNSAySDZhMiAyIDAgMCAwLTIgMnYxNmEyIDIgMCAwIDAgMiAyaDEyYTIgMiAwIDAgMCAyLTJWN1oiLz48cGF0aCBkPSJNMTQgMnY0YTIgMiAwIDAgMCAyIDJoNCIvPjxwYXRoIGQ9Ik0xMCA5SDgiLz48cGF0aCBkPSJNMTYgMTNIOCIvPjxwYXRoIGQ9Ik0xNiAxN0g4Ii8+PC9zdmc+);
  }
}

.max-w-20rem {
  max-width: 20rem !important;
}
.max-w-16rem {
  max-width: 16rem !important;
}
.min-w-13rem {
  min-width: 13rem !important;
}

.flex-basis-20rem {
  flex-basis: 20rem;
}

/* custom-access-points */

.custom-access-points {
  a:not(:hover):not(focus-visible):not(:focus) {
    text-decoration: none;
  }

  .wp-block-search {
    .wp-block-search__inside-wrapper {
      width: 100%;
      display: flex;
      flex-flow: row wrap;
      justify-content: center;
      align-items: center;
      gap: 1rem;
    }

    .wp-block-search__input {
      flex-basis: 100%;
      border: none;
    }

    button.wp-block-search__button {
      background: transparent;
      border: 3px solid white;
      padding: 0.5em 1em;
      line-height: 1;
      display: inline-flex;
      text-decoration: none;
      font-weight: 700;

      &:hover,
      &:focus-visible {
        background: var(--wp--preset--color--main-accent);
        border-color: var(--wp--preset--color--main-accent);
        text-decoration: none;
      }
    }
  }
}

.banner-events {
  background-size: 130px !important;
}

.rwd-desktop-only {
  display: block !important;
}

.rwd-mobile-only {
  display: none !important;
}

@media (max-width: 550px) {
  .rwd-desktop-only {
    display: none !important;
  }

  .rwd-mobile-only {
    display: block !important;
  }

  .site-header .header-logos-col .wp-block-column {
    flex-basis: 50% !important;
  }
}

@media (min-width: 550px) {
  .rwd-desktop-only {
    display: block !important;
  }

  .rwd-mobile-only {
    display: none !important;
  }
}