/*
    Theme Name: Iowa AEA Theme
    Theme URI: https://example.com/
    Description: A custom AEA theme based on twentytwentyfive.
    Author: Iowa AEAs
    Author URI: https://example.com/
    Template: twentytwentyfive
    Version: 1.4.8
    License: GNU General Public License v2 or later
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
    Text Domain: iowa-aea-theme
    */

/* Styles that cannot be represented in theme.json */

.has-bottom-dots {
  position: relative;
  z-index: 10;
  & > * {
    position: relative;
    z-index: 1;
  }
  isolation: isolate;
  &:after {
    content: "";
    background: linear-gradient(
        to top,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 10%,
        rgba(255, 255, 255, 0.8) 40%,
        rgba(255, 255, 255, 1) 100%
      ),
      var(--wp--custom--dot-pattern-url);
    background-repeat: repeat;
    background-size: contain;
    width: 100%;
    height: 100px;
    position: absolute;
    left: 0;
    bottom: 0rem;
    z-index: 0;
    opacity: 0.5;
  }

  &.shift-dots-down {
    &::after {
      bottom: -1rem;
    }
  }
}

.has-top-dots {
  position: relative;
  & > * {
    position: relative;
    z-index: 1;
  }
  isolation: isolate;
  &:after {
    content: "";
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 10%,
        rgba(255, 255, 255, 0.8) 40%,
        rgba(255, 255, 255, 1) 100%
      ),
      var(--wp--custom--dot-pattern-url);
    background-repeat: repeat;
    background-size: contain;
    width: 100%;
    height: 100px;
    position: absolute;
    left: 0;
    top: 0.5rem;
    z-index: 0;
    opacity: 0.5;
  }
}

.wp-block-table,
.wp-block-table.is-style-aea-styled-table {
  table {
    border-collapse: collapse;
    width: 100%;

    thead {
      border: 2px solid var(--wp--preset--color--primary);
    }

    th,
    td {
      padding: 12px 15px;
      text-align: left;
      border: none;
    }

    th {
      background-color: var(--wp--preset--color--primary);
      color: #ffffff;
      font-weight: bold;
    }

    td {
      border: 1px solid #dddddd;
    }

    tr:nth-child(2n) {
      background-color: #eee;
    }

    tbody {
      border: 2px solid #dddddd;
    }
  }
}

/* Image caption hover effects that theme.json doesn't support */
.wp-block-image {
  &:has(figcaption) {
    figcaption {
      display: none;
    }

    &:hover {
      figcaption {
        display: block;
      }
    }
  }
}

.wp-block-button:is(:hover, .active, :active) .wp-block-button__link {
  color: var(--wp--preset--color--text-color) !important;
  background-color: #ffffff !important;
}

.wp-block-button.is-style-alt-one-button:is(:hover, .active, :active)
  .wp-block-button__link {
  color: var(--wp--preset--color--text-color) !important;
  background-color: #ffffff !important;
  border-color: var(--wp--preset--color--alt-one) !important;
}

.wp-block-button.is-style-alt-two-button:is(:hover, .active, :active)
  .wp-block-button__link {
  color: var(--wp--preset--color--text-color) !important;
  background-color: #ffffff !important;
  border-color: var(--wp--preset--color--alt-one) !important;
}

.wp-block-button.is-style-alt-three-button:is(:hover, .active, :active)
  .wp-block-button__link {
  color: var(--wp--preset--color--text-color) !important;
  background-color: #ffffff !important;
  border-color: var(--wp--preset--color--alt-two) !important;
}

.wp-block-button.is-style-alt-four-button
  .wp-block-button__link:is(:hover, .active, :active) {
  color: var(--wp--preset--color--text-color) !important;
  background-color: #ffffff !important;
  border-color: var(--wp--preset--color--alt-three) !important;
}

.color-bar {
  position: relative;
  z-index: 1;
  background: linear-gradient(
    to right,
    var(--wp--preset--color--primary) 20%,
    var(--wp--preset--color--secondary) 20% 40%,
    var(--wp--preset--color--alt-one) 40% 60%,
    var(--wp--preset--color--alt-three) 60% 80%,
    var(--wp--preset--color--alt-two) 80% 100%
  );
  height: 20px;

  &.solid {
    background: var(--wp--preset--color--primary);
  }
}

.is-style-logos-only {
  svg {
    color: var(--wp--preset--color--primary) !important;
  }
}

.quote-with-image {
  text-align: right;
}

.wp-block-quote {
  position: relative;
  padding-inline: 6rem;
  cite {
    color: var(--wp--preset--color--primary);
    font-size: 1.5rem;
    font-weight: 500;
  }

  &:before {
    content: "";
    background-color: var(--wp--preset--color--primary, red);
    mask: url('data:image/svg+xml,<svg width="85" height="58" viewBox="0 0 85 58" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_493_1537)"><path d="M34.8307 2.51931C35.9993 4.47083 30.6287 7.40743 29.2146 9.23001C28.3244 10.3831 26.3335 13.7051 26.3706 15.0185C26.4242 16.6862 29.1225 17.0148 30.3024 17.8264C55.8881 35.3896 22.7387 68.576 5.48294 46.6045C-4.26548 34.1885 3.19296 16.8494 14.6992 8.44832C17.5401 6.37764 32.5662 -1.24324 34.8193 2.51874L34.8307 2.51931Z" fill="black"/><path d="M78.2032 4.68454C79.414 6.70659 73.3652 9.97428 71.9545 11.9567C66.789 19.2373 71.963 18.1841 76.4689 22.0585C94.6577 37.6786 70.7098 66.8195 51.7912 51.8815C37.7995 40.8389 45.5944 19.7302 58.0945 10.6147C60.9354 8.54401 75.9614 0.923126 78.2146 4.68511L78.2032 4.68454Z" fill="black"/></g><defs><clipPath id="clip0_493_1537"><rect width="82" height="53" fill="white" transform="translate(81.8979 57.0227) rotate(-177.142)"/></clipPath></defs></svg>')
      no-repeat;
    mask-size: contain;
    -webkit-mask: url('data:image/svg+xml,<svg width="85" height="58" viewBox="0 0 85 58" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_493_1537)"><path d="M34.8307 2.51931C35.9993 4.47083 30.6287 7.40743 29.2146 9.23001C28.3244 10.3831 26.3335 13.7051 26.3706 15.0185C26.4242 16.6862 29.1225 17.0148 30.3024 17.8264C55.8881 35.3896 22.7387 68.576 5.48294 46.6045C-4.26548 34.1885 3.19296 16.8494 14.6992 8.44832C17.5401 6.37764 32.5662 -1.24324 34.8193 2.51874L34.8307 2.51931Z" fill="black"/><path d="M78.2032 4.68454C79.414 6.70659 73.3652 9.97428 71.9545 11.9567C66.789 19.2373 71.963 18.1841 76.4689 22.0585C94.6577 37.6786 70.7098 66.8195 51.7912 51.8815C37.7995 40.8389 45.5944 19.7302 58.0945 10.6147C60.9354 8.54401 75.9614 0.923126 78.2146 4.68511L78.2032 4.68454Z" fill="black"/></g><defs><clipPath id="clip0_493_1537"><rect width="82" height="53" fill="white" transform="translate(81.8979 57.0227) rotate(-177.142)"/></clipPath></defs></svg>')
      no-repeat;
    -webkit-mask-size: contain;
    display: block;
    height: 58px;
    width: 85px;
    position: absolute;
    top: -3.5rem;
    left: 0rem;
    z-index: 99;
  }

  &:after {
    content: "";
    background-color: var(--wp--preset--color--primary, red);
    mask: url('data:image/svg+xml,<svg width="85" height="58" viewBox="0 0 85 58" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_493_1682)"><path d="M49.7098 54.5034C48.5411 52.5519 53.9118 49.6153 55.3259 47.7927C56.2161 46.6396 58.207 43.3176 58.1699 42.0042C58.1163 40.3365 55.418 40.0079 54.2381 39.1963C28.6524 21.6331 61.8018 -11.5533 79.0576 10.4182C88.806 22.8342 81.3475 40.1733 69.8413 48.5744C67.0004 50.6451 51.9743 58.2659 49.7212 54.504L49.7098 54.5034Z" fill="black"/><path d="M6.33743 52.3382C5.12667 50.3161 11.1754 47.0484 12.5861 45.066C17.7516 37.7854 12.5776 38.8386 8.07168 34.9642C-10.1171 19.3441 13.8308 -9.79682 32.7494 5.14122C46.7411 16.1838 38.9462 37.2925 26.4461 46.408C23.6053 48.4787 8.57918 56.0996 6.32606 52.3376L6.33743 52.3382Z" fill="black"/></g><defs><clipPath id="clip0_493_1682"><rect width="82" height="53" fill="white" transform="translate(2.64267) rotate(2.85805)"/></clipPath></defs></svg>')
      no-repeat;
    mask-size: contain;
    -webkit-mask: url('data:image/svg+xml,<svg width="85" height="58" viewBox="0 0 85 58" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_493_1682)"><path d="M49.7098 54.5034C48.5411 52.5519 53.9118 49.6153 55.3259 47.7927C56.2161 46.6396 58.207 43.3176 58.1699 42.0042C58.1163 40.3365 55.418 40.0079 54.2381 39.1963C28.6524 21.6331 61.8018 -11.5533 79.0576 10.4182C88.806 22.8342 81.3475 40.1733 69.8413 48.5744C67.0004 50.6451 51.9743 58.2659 49.7212 54.504L49.7098 54.5034Z" fill="black"/><path d="M6.33743 52.3382C5.12667 50.3161 11.1754 47.0484 12.5861 45.066C17.7516 37.7854 12.5776 38.8386 8.07168 34.9642C-10.1171 19.3441 13.8308 -9.79682 32.7494 5.14122C46.7411 16.1838 38.9462 37.2925 26.4461 46.408C23.6053 48.4787 8.57918 56.0996 6.32606 52.3376L6.33743 52.3382Z" fill="black"/></g><defs><clipPath id="clip0_493_1682"><rect width="82" height="53" fill="white" transform="translate(2.64267) rotate(2.85805)"/></clipPath></defs></svg>')
      no-repeat;
    -webkit-mask-size: contain;
    display: block;
    height: 58px;
    width: 85px;
    z-index: 99;
    position: absolute;
    bottom: 03.5rem;
    right: 0rem;
  }

  &.beside-picture {
    border: 0px solid var(--wp--preset--color--primary);
    border-left-width: 2px;

    max-width: 800px;
    padding-inline: unset;
    padding-left: 2rem;
    margin-left: 2rem;
    &:before {
      content: "";
      background-color: var(--wp--preset--color--primary, red);
      mask: url('data:image/svg+xml,<svg width="85" height="58" viewBox="0 0 85 58" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_493_1537)"><path d="M34.8307 2.51931C35.9993 4.47083 30.6287 7.40743 29.2146 9.23001C28.3244 10.3831 26.3335 13.7051 26.3706 15.0185C26.4242 16.6862 29.1225 17.0148 30.3024 17.8264C55.8881 35.3896 22.7387 68.576 5.48294 46.6045C-4.26548 34.1885 3.19296 16.8494 14.6992 8.44832C17.5401 6.37764 32.5662 -1.24324 34.8193 2.51874L34.8307 2.51931Z" fill="black"/><path d="M78.2032 4.68454C79.414 6.70659 73.3652 9.97428 71.9545 11.9567C66.789 19.2373 71.963 18.1841 76.4689 22.0585C94.6577 37.6786 70.7098 66.8195 51.7912 51.8815C37.7995 40.8389 45.5944 19.7302 58.0945 10.6147C60.9354 8.54401 75.9614 0.923126 78.2146 4.68511L78.2032 4.68454Z" fill="black"/></g><defs><clipPath id="clip0_493_1537"><rect width="82" height="53" fill="white" transform="translate(81.8979 57.0227) rotate(-177.142)"/></clipPath></defs></svg>')
        no-repeat;
      mask-size: contain;
      -webkit-mask: url('data:image/svg+xml,<svg width="85" height="58" viewBox="0 0 85 58" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_493_1537)"><path d="M34.8307 2.51931C35.9993 4.47083 30.6287 7.40743 29.2146 9.23001C28.3244 10.3831 26.3335 13.7051 26.3706 15.0185C26.4242 16.6862 29.1225 17.0148 30.3024 17.8264C55.8881 35.3896 22.7387 68.576 5.48294 46.6045C-4.26548 34.1885 3.19296 16.8494 14.6992 8.44832C17.5401 6.37764 32.5662 -1.24324 34.8193 2.51874L34.8307 2.51931Z" fill="black"/><path d="M78.2032 4.68454C79.414 6.70659 73.3652 9.97428 71.9545 11.9567C66.789 19.2373 71.963 18.1841 76.4689 22.0585C94.6577 37.6786 70.7098 66.8195 51.7912 51.8815C37.7995 40.8389 45.5944 19.7302 58.0945 10.6147C60.9354 8.54401 75.9614 0.923126 78.2146 4.68511L78.2032 4.68454Z" fill="black"/></g><defs><clipPath id="clip0_493_1537"><rect width="82" height="53" fill="white" transform="translate(81.8979 57.0227) rotate(-177.142)"/></clipPath></defs></svg>')
        no-repeat;
      -webkit-mask-size: contain;
      position: absolute;
      top: -3.5rem;
      left: 2rem;
      height: 58px;
      width: 85px;
    }

    &:after {
      all: unset;
    }

    @media (max-width: 800px) {
      margin-left: 0;
      margin-top: 3rem;
    }
  }
}

.home-news-links {
  .wp-block-post.news {
    border: 1px solid var(--wp--preset--color--primary);
    border-bottom-width: 15px;
    border-radius: 19px 19px 0 0;
    text-align: center;
    overflow: hidden;
  }
}

.posts-list {
  li {
    margin-bottom: 1.2rem;
  }
}

.wp-block-button__link {
  &:focus,
  &:active {
    outline: 2px solid var(--wp--preset--color--primary);
    background-color: white;
    color: var(--wp--preset--color--text-color);
  }
}

.weather-alerts-notices {
  background: #eee;
  padding: 2rem;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 3rem;
  align-items: flex-start;
  flex-wrap: wrap;

  .weather-alert {
    --main-color: var(--wp--preset--color--primary);
    position: relative;
    background: white;
    padding: 1.5rem 2rem 1rem;
    border: 2px solid var(--main-color);
    border-bottom-width: 10px;
    border-radius: 19px 19px 0 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    max-width: min(400px, 100%);
    min-width: 300px;

    &:nth-child(2) {
      --main-color: var(--wp--preset--color--alt-one);
    }

    &:nth-child(3) {
      --main-color: var(--wp--preset--color--alt-two);
    }
  }

  * {
    margin: 0;
    padding: 0;
  }

  .location {
    position: absolute;
    color: white;
    top: -1.25rem;
    left: -2rem;
    font-weight: bold;
    background: var(--main-color);
    padding: 0.2rem 0.75rem;
    border-radius: 8px;
    border: 2px solid white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  }
}

.skip-to-content {
  position: absolute;
  top: -100%;
  left: 1rem;
  background: var(--wp--preset--color--primary);
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  text-decoration: none;
  z-index: 1000;

  &:focus,
  &:hover {
    top: 1rem;
  }
}

.header-image {
  height: 600px;
}

.sm-align-right {
  justify-content: flex-end;
}

#google_translate_element {
  margin-left: 1rem;
  height: 50px !important;
  display: flex;
  align-items: center;
  justify-content: center;

  span {
    display: none !important;
  }

  select {
    padding: 0.5rem 1.25rem;
    background: var(--wp--preset--color--primary);
    color: white;
    border: none;
    width: 150px;
    font-size: var(--wp--preset--font-size--medium);
    font-weight: bold;
  }
}

.card-link-group {
  display: grid;
  width: 95%;
  margin: auto;
  box-sizing: border-box;
  gap: 1.2rem;
  max-width: unset;

  .icon-card {
    width: 100%;
    box-sizing: border-box;
    margin: auto;
    height: 100%;

    text-decoration: none;

    span {
      align-self: start;
    }
  }

  /* @media screen and (min-width: 700px) {
    display: ;
  } */

  @media (min-width: 800px) {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }

  @media (min-width: 1200px) {
    width: 90%;
    grid-template-columns: repeat(
      6,
      1fr
    ); /* repeat(auto-fit, minmax(175px, 1fr)); */

    .icon-card {
      font-size: 0.8rem;
      grid-template-rows: 1fr auto;
    }
  }

  @media (min-width: 1440px) {
    max-width: 1300px;

    .icon-card {
      font-size: 1.2rem;
      grid-template-rows: 1fr 1fr;
    }
    /* grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); */
  }
}

.news-events {
  display: grid;
  width: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  justify-items: center;

  gap: 2rem;

  .wp-block-iowa-aea-theme-events-list {
    width: 100%;
    min-width: unset;
    box-sizing: border-box;
  }

  @media (min-width: 800px) {
    .wp-block-iowa-aea-theme-events-list {
      width: 400px;
    }
  }

  @media (min-width: 1200px) {
    grid-template-columns: 1fr auto;
  }
}

.wp-block-navigation-item__content {
  padding-block: 0.5rem;
}

.wp-block-navigation-item {
  .wp-block-navigation__submenu-container {
    @media (min-width: 800px) {
      border: 1px solid var(--wp--preset--color--primary) !important;
      border-top-width: 10px !important;

      width: 300px !important;

      box-shadow: 2px 0 5px rgba(0, 0, 0, 0.5);
    }
  }
}

.wp-block-navigation-item.has-child:last-child {
  .wp-block-navigation__submenu-container {
    @media (min-width: 800px) {
      left: unset !important;
      right: 0 !important;
    }
  }
}

.side-nav {
  h3 {
    font-weight: 400;
    text-transform: uppercase;
  }

  .wp-block-navigation-item__content {
    font-weight: normal;
    font-size: var(--wp--preset--font-size--normal);
    display: block;

    &[aria-current="page"] {
      font-weight: bold;
      text-decoration: underline;
    }
  }

  .has-child {
    flex-wrap: wrap;

    .wp-block-navigation-submenu__toggle[aria-expanded="true"] {
      & ~ .wp-block-navigation__submenu-container {
        position: relative !important;
        height: auto !important;
        min-width: 200px;
        opacity: 1 !important;
        overflow: visible;
        visibility: visible;
        width: auto;

        border: none !important;
        box-shadow: none !important;
      }
    }
  }

  .current-menu-item {
    &.has-child {
      flex-wrap: wrap;

      .wp-block-navigation-submenu__toggle {
        display: none;
      }

      .wp-block-navigation__submenu-container {
        position: relative !important;
        height: auto !important;
        min-width: 200px;
        opacity: 1 !important;
        overflow: visible;
        visibility: visible;
        width: auto;

        border: none !important;
        box-shadow: none !important;
      }
    }
  }
}

.relevanssi-live-search-results {
  top: calc(100% + 5px) !important;
  left: 0 !important;
  width: 100% !important;

  .relevanssi-live-search-result-status {
    background: var(--wp--preset--color--primary);
  }

  .wp-block-search:has(&) {
    position: relative;
  }
}
