/*
Theme Name: YAH25
Theme URI: https://youareherecanberra.com.au/
Author: the New Best Friend
Author URI: https://newbestfriend.com.au
Requires at least: 6
Tested up to: 6.8.1
Requires PHP: 8.0
Version: 1.0
Text Domain: yah25-blocks
*/

footer {
  margin-top: 0 !important;
}

html {
  scroll-behavior: smooth;
}

main.wp-block-group {
  margin-top: 0 !important;
}

img {
  display: block;
}

input::placeholder {
  opacity: 0.5;
}

.hide-on-mobile {
  @media (max-width: 781px) {
    & {
      display: none !important;
    }
  }
}
.hide-on-tablet {
  @media (min-width: 782px) and (max-width: 1009px) {
    & {
      display: none !important;
    }
  }
}
.hide-on-desktop {
  @media (min-width: 1010px) {
    & {
      display: none !important;
    }
  }
}
.d-none {
  display: none !important;
}
.d-block {
  display: block !important;
}

/*
 * CHANGE CONTENT ORDER
 */
.order-1 {
  order: 1;
}
.order-2 {
  order: 2;
}
.order-3 {
  order: 3;
}
@media (max-width: 781px) {
  .order-mobile-1 {
    order: 1;
  }
  .order-mobile-2 {
    order: 2;
  }
  .order-mobile-3 {
    order: 3;
  }

  .align-mobile-start {
    justify-content: flex-start;
  }
}

.w-100 {
  width: 100%;
}

.is-position-sticky {
  top: var(--wp--preset--spacing--30);
  &.t-0 {
    top: 0 !important;
  }
}


/* Fix rotated text for mobile */
@media (max-width: 785px) {
  *.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]) {
    rotate: 0deg !important;
    text-align: left !important;
    writing-mode: initial !important;
  }
}


.post-card {
  position: relative;
  overflow: hidden;
  & a {
    border-bottom: 0 !important;
  }
}

.post-card a:hover {
  text-decoration: none !important;
  &:after {
    opacity: 0.2;
    transition: 0.1s ease-out;
  }
}

.post-card a:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 450px;
  height: 600px;
  display: block;
  content: "";
  opacity: 0;
  background: var(--wp--preset--color--beige);
  transition: 0.4s ease-in-out;
}

.post-card[data-trigger-modal] {
  cursor: pointer;
  transition: 0.4s ease-in-out;
  &:hover {
    transition: 0.1s ease;
    opacity: 0.8;
  }
}

.is-layout-grid {
  @media (max-width: 900px) {
    & {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }   
  }

  @media (max-width: 500px) {
    & {
      grid-template-columns: repeat(1, minmax(0, 1fr));
    }   
  }  
}


@media (max-width: 781px) {
  .wp-block-buttons.is-content-justification-center {
    justify-content: flex-start;
  }
  .has-text-align-center {
    text-align: left !important;
  }
}

.wp-block-cover.is-home {
  max-width: 338px;
/*  margin-right: 0;
  margin-left: auto;  */
}

.is-style-swirly {
  visibility: hidden;
  position: relative;
}


.is-swirly-wrapper {
  position: relative;
}

.is-style-swirly canvas {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  background: transparent !important;
  visibility: visible;
  mix-blend-mode: color-dodge;
}

canvas {
    background-color: transparent !important;  /* fully transparent */
    /* or use white if you want to simulate white behind transparent canvas */
}