/*!
Theme Name: labelai
Theme URI: http://underscores.me/
Author: Campaign Edge
Author URI: https://campaignedge.com.au
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: labelai
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/*--------------------------------------------------------------
>>> labelai:
---------------------------------------------------------------- */


/* General
--------------------------------------------- */
body .dashicons {
	width: 1em;
	height: 1em;
	font-size: inherit;
}

.first-no-margin> :first-child, .fcnm > :first-child {
	margin-top: 0px;
}

.lcnm > :last-child {
	margin-bottom: 0px;
}

.mt0 {
	margin-top: 0;
}

.mb0 {
	margin-bottom: 0;
}

.pt0 {
	padding-top: 0;
}

.pb0 {
	padding-bottom: 0;
}


/* Colours
--------------------------------------------- */
.pc-color {
	color: var(--wp--preset--color--primary);
}

.sc-color {
	color: var(--wp--preset--color--secondary);
}

.tc-color {
	color: var(--wp--preset--color--tertiary);
}

.white-color {
	color: var(--wp--preset--color--white);
}

.black-color {
	color: var(--wp--preset--color--black);
}

.pc-bg {
	background-color: var(--wp--preset--color--primary);
}

.sc-bg {
	background-color: var(--wp--preset--color--secondary);
}

.tc-bg {
	background-color: var(--wp--preset--color--tertiary);
}

.white-bg {
	background-color: var(--wp--preset--color--white);
}

.black-bg {
	background-color: var(--wp--preset--color--black);
}

.pc-fill {
	fill: var(--wp--preset--color--primary);
}

.sc-fill {
	fill: var(--wp--preset--color--secondary);
}

.tc-fill {
	fill: var(--wp--preset--color--tertiary);
}

.white-fill {
	fill: var(--wp--preset--color--white);
}

.black-fill {
	fill: var(--wp--preset--color--black);
}

.pc-border {
	border-color: var(--wp--preset--color--primary);
}

.sc-border {
	border-color: var(--wp--preset--color--secondary);
}

.tc-border {
	border-color: var(--wp--preset--color--tertiary);
}

.white-border {
	border-color: var(--wp--preset--color--white);
}
.black-border {
	border-color: var(--wp--preset--color--black);
}

/* Full BG's
- To give an element a full sized background in code give it the class .full-bg along with the 
class wp color class eg .has-primary-background-color
--------------------------------------------- */
.full-bg, .wp-block-group.has-background {
	position: relative;
	overflow: visible;
}

.full-bg, .wp-block-group.has-background > * {
	position: relative;
	z-index: 2;
}

.full-bg:before, .wp-block-group.has-background:before {
	content: "";
	width: 100vw;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc(100% / 2);
	transform: translateX(-50%);
	z-index: 0;
	background-position: 50% 50%;
	background-size: cover;
	background: inherit;
}

/* Disable full BG's on nested groups */
.wp-block-group .wp-block-group.has-background:before, .wp-block-group .wp-block-group.has-background:after, 
.wp-block-group .wp-block-group.has-background[style*=".webp')"]:before, .wp-block-group .wp-block-group.has-background[style*=".webp')"]:after,
.wp-block-group .wp-block-group.has-background[style*=".png')"]:before, .wp-block-group .wp-block-group.has-background[style*=".png')"]:after,
.wp-block-group .wp-block-group.has-background[style*=".jpg')"]:before, .wp-block-group .wp-block-group.has-background[style*=".jpg')"]:after {
	width: 100%;
    transform: none;
    left: 0;
}

/* If the group has both a colour and image selected then the colour is moved to the :after placed ontop of the image*/
.wp-block-group.has-background[style*=".webp')"]:before, .wp-block-group.has-background[style*=".jpg')"]:before, .wp-block-group.has-background[style*=".png')"]:before {
	background-color: unset;
}

.wp-block-group.has-background[style*=".webp')"]:after, .wp-block-group.has-background[style*=".jpg')"]:after, .wp-block-group.has-background[style*=".png')"]:after {
	content: "";
	width: 100vw;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc(100% / 2);
	transform: translateX(-50%);
	z-index: 1;
	background-position: 50% 50%;
	background-size: cover;
	background-color: inherit;
}



/* Content Areas
--------------------------------------------- */
.main-content {
	max-width: var(--wp--style--global--wide-size);
	width: 100%;
	margin: 0 auto;
}

.main-content .main-content-inner {
	padding: 0 4%;
}


/* Header
--------------------------------------------- */
.site-header {
	position: relative;
	width: 100%;
	z-index: 3;
	background-color: var(--wp--preset--color--secondary);
	min-height: 3em;
}

.site-header .main-content .main-content-inner {
	position: relative;
}

/* Header - Logo and Menu container
--------------------------------------------- */

.site-header {
	.main-content-inner {
		.header-main {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 1em 0;
			transition: padding 0.25s ease;
			column-gap: 2em;
		}

		.header-logo {
			transition: flex 0.25s ease;
			flex: 0 1 200px;
			position: relative;

			a {
				display: flex;
				width: 100%;
				line-height: 0;
				padding-bottom: 30%;

				img {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					object-fit: contain;
					object-position: left center;
				}
			}
		}
	}

	&.site-header-scrolled .main-content-inner .header-main {
		padding: 1em 0 1em 0;
	}
}



/* Header - Menu
--------------------------------------------- */
.menu-container {
	flex: 1 1 auto;

	.menu {
		margin: 0px;
		list-style: none;
		padding: 0px;
		display: flex;
		justify-content: right;

		.menu-item {
			margin-left: 1.25em;
			padding: 0.2em;

			a {
				color: #333333;
				font-weight: 400;
				text-decoration: none;
				transition: color 0.2s ease, background 0.2s ease, border-color ease 0.2s ;
				font-size: 16px;
				padding: 0.25em 0.5em;
				display: block;
				border-bottom: 1px solid transparent;
			}

			&:hover > a {
				border-bottom: 1px solid white;
			}

			&.current-menu-item > a {
				border-bottom: 1px solid white;
			}

			&:last-child a {
				padding-right: 0px;
			}

			/* Header - Sub Menu
			--------------------------------------------- */
			&.menu-item-has-children {
				position: relative;

				> a {
					padding-right: 1.25em;
				}

				&::before {
					width: 0.5em;
					height: 0.5em;
					background-color: white;
					clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
					position: absolute;
					top: calc(50% - 0.25em);
					right: 0em;
					content: "";
					transition: 0.2s ease;
					transform: rotate(-90deg);
				}

				&:hover::before {
					color: white;
					transform: rotate(0deg);
				}

				&.current-menu-item::before {
					border-bottom: 1px solid white;
				}

				&:hover > .sub-menu {
					opacity: 1;
					pointer-events: all;
				}

				.sub-menu .menu-item.menu-item-has-children > a {
					padding-right: 0.75em;
				}
			}

			.sub-menu {
				opacity: 0;
				transition: opacity 0.2s ease;
				pointer-events: none;
				padding: 0px 0.5em;
				margin: 0px;
				position: absolute;
				top: 100%;
				left: 0px;
				z-index: 2;
				list-style: none;
				width: max-content;
				max-width: 200px;
				background: var(--wp--preset--color--primary);
				display: block;

				.menu-item {
					margin-left: 0px;
					padding-left: 0px;

					a {
						font-weight: 400;
						line-height: 1.2em;
					}

					.sub-menu {
						left: 100%;
						top: 0%;
						width: max-content;
					}
				}
			}
		}
	}

	.site-header-scrolled &,
	.site-header-bg & {
		.menu .menu-item .sub-menu {
			background-color: var(--wp--preset--color--tertiary);
		}
	}
}


/* Header - Menu Hamburger
--------------------------------------------- */
.menu-center {
	display: none;
}

.show-on-mobile-menu {
	display: none;
}



/* Footer
--------------------------------------------- */

.site-footer {
	padding: 1.5em 0;
	background-color: var(--wp--preset--color--secondary);
	color: white;
	overflow: hidden;
}

.site-footer .footer-info {
	position: relative;
    display: flex;
	column-gap: 2em;
    justify-content: space-between;
	align-items: center;
    width: 100%;
}

.site-footer .footer-info .footer-logo {
	flex: 0 1 150px;
}

.site-footer .footer-info .footer-logo a {
	display: inline-flex;
	width: 100%;
	line-height: 1em;
}

.site-footer .footer-info .footer-logo a img {
	display: block;
	width: 100%;
	line-height: 1em;
}


.site-footer .footer-info .footer-socials .footer-social {
	text-decoration: none;
}

.site-footer .footer-info .footer-socials .footer-social .dashicons {
	width: 1.5em;
	height: 1.5em;
	font-size: 1.5em;
}

.site-footer .footer-social-links .footer-link {
	text-decoration: none;
}

.site-footer .authorisation {
	font-size: 14px;
	text-align: center;
	color: grey;
}


/* WP Blocks
--------------------------------------------- */

.column-align-bottom {
	display: flex;
	align-items: flex-end;
}

.wp-block-cover a {
	text-decoration: none;
	transition: all 0.3s ease;
}

.wp-block-column {
	position: relative;
}

.is-layout-flow > *, .is-layout-constrained > * {
	margin-block-start: 1em;
}

/* Youtube */
.is-provider-youtube .wp-block-embed__wrapper {
	position: relative;
	padding-bottom: 56.25%;
	width: 100%;
}

.is-provider-youtube .wp-block-embed__wrapper iframe {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
}

/* image fixing */

.wp-block-group.is-nowrap.is-layout-flex.wp-block-group-is-layout-flex img {
	max-width: unset;
	vertical-align: unset;
}

.wp-block-image.size-full.is-resized img {
	max-width: unset;
}

/* Forms
--------------------------------------------- */

/* Forms
--------------------------------------------- */

#primary .gform_wrapper {
  .gform_heading {
    .gform_title {
      font-size: 1.5em;
      margin-top: 0;
      margin-bottom: 0em;
    }

    .gform_description {
      color: #666666;
    }
  }

  form {
    .gform-body {
      .gform_fields {
        row-gap: 1em;

        .gfield {
          .gfield_label {
          }

          input {
            border-color: #808080;
            border-radius: 0em;
			  border-width: 0;

            &::placeholder {
              color: #808080;
            }
          }
        }
      }
    }

    .gform-footer {
      margin-top: 1em;

      .gform_button {
        background: var(--wp--preset--color--primary);
        text-decoration: none;
        text-transform: uppercase;
        font-weight: 600;
        padding: 0.25em 1.5em;
        border-radius: 0;
        border: 0px solid #808080;
        color: white;
		margin-left: auto;
      }
    }
  }
}

.gform_required_legend {
  display: none;
}





/* Archive
--------------------------------------------- */




/* Pagination
--------------------------------------------- */

.news-pagination {
	text-align: center;
	font-weight: 700;
	margin: 1em 0;
}

.page-numbers {
	padding: 0;
	text-align: right;
	list-style: none;
	margin: 0px;
	display: inline-block;
}
.page-numbers li {
	display: inline-block;
	width: 1.2em;
	height: 1.25em;
	line-height: 1.25em;
	font-weight: 600;
	margin:0;
	text-align: center;
}

.page-numbers.current {
	text-decoration: underline;
	color: var(--wp--preset--color--primary);
}

.page-numbers a {
	color: var(--wp--preset--color--text);
}

.page-numbers li span, .page-numbers li a {
	text-decoration: none;
}
.page-numbers li .next, .page-numbers li .prev  {
	display: block;
	position: relative;
	color: transparent;
	margin: 0px;
}

.page-numbers li .next:after, .page-numbers li .prev:after {
	content: "";
	border-right: 0.2em solid black;
	border-bottom: 0.2em solid black;
	display: block;
	line-height: 1;
	font-weight: 400;
	font-style: normal;
	speak: never;
	text-decoration: inherit;
	text-transform: none;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	width: 0.6em;
	height: 0.6em;
	font-size: 0.9em;
	vertical-align: top;
	text-align: center;
	transition: color .1s ease-in;
	position: absolute;
	top: 50%;
	left: 40%;
	transform: translate(-50%, -50%) rotate(-45deg);
	z-index:2;
	pointer-events: none;
	cursor: pointer;
}

.page-numbers li .prev:after {
	transform: translate(-50%, -50%) rotate(135deg);
	left: 60%;
}



/* MOBILE
--------------------------------------------- */

@media only screen and (max-width: 1300px) {

	.site-header .main-content-inner .header-logo {
		flex: 0 1 200px;
	}


}

/* MENU MOBILE TRIGGER - Move last submenus to the left */

@media only screen and (max-width: 1675px) {
	.menu-container .menu .menu-item:last-child > .sub-menu {
		left: unset;
		right: 0;
	}
}

@media only screen and (max-width: 1380px) {

	.menu-container .menu .menu-item:last-child > .sub-menu .menu-item {
		position: relative;
	}

	.menu-container .menu .menu-item:last-child > .sub-menu .menu-item > .sub-menu {
		top: 0;
		left: 0;
		transform: translateX(-100%);
	}
}


/* MENU MOBILE TRIGGER */
@media only screen and (max-width: 1100px) {


	/* Menu - pullout */

	.menu-pullout-mask {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		background: var(--wp--preset--color--quaternary);
		z-index: 10;
		display: block;
	}

	.menu-pullout {
		display: block;
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		transform: translateX(-101%);
		transition: transform .5s ease;
		z-index: 11;
		padding: 3em;
		box-shadow: 1px 1px 7px 0 #00000045;
		background: var(--wp--preset--color--primary);
		height: 100vh;
	}

	.menu-pullout-active {
		transform: translateX(0%);
		overflow-y: scroll;
	}

	.menu-pullout .menu-container .menu .menu-item a {
		padding: 0.25em 0em;
	}


	/* Hamburger */
	.menu-center {
		position: relative;
		width: 2.3em;
		text-align: center;
		margin: 0 auto;
		display: inline-block;
		vertical-align: middle;
		border: 2px solid white;
		border-radius: 100%;
		height: 2.3em;
		padding: 0.5em;
	}

	.menu-center:before,
	.menu-center:after,
	.menu-center div {
		background: white;
		content: "";
		display: block;
		height: 2px;
		border-radius: 0px;
		margin: 3px 0;
		margin-top: 2px;
		transition: 0.5s;
	}

	.menu-center.menu-center-active:before {
		transform: translateY(5px) rotate(135deg);
	}

	.menu-center.menu-center-active:after {
		transform: translateY(-5px) rotate(-135deg);
	}

	.menu-center.menu-center-active div {
		transform: scale(0);
	}

	.menu-center:hover {
		background: var(--wp--preset--color--tertiary);
	}

	.menu-center:hover::before,
	.menu-center:hover::after,
	.menu-center:hover div {
		background: white;
	}

	.menu-pullout-inner .menu-center:before,
	.menu-pullout-inner .menu-center:after,
	.menu-pullout-inner .menu-center div {
		background: white;
	}

	.menu-pullout-inner .menu-center {
		border-color: white;
	}

	.site-header-scrolled .menu-center:before,
	.site-header-scrolled .menu-center:after,
	.site-header-scrolled .menu-center div,
	.site-header-bg .menu-center:before,
	.site-header-bg .menu-center:after,
	.site-header-bg .menu-center div {
		background: var(--wp--preset--color--tertiary);
	}

	.site-header-scrolled .menu-center,
	.site-header-bg .menu-center {
		border-color: var(--wp--preset--color--tertiary);
	}


	.menu-pullout .menu-center {
		margin: 0 auto;
		display: block;
		margin-top: 3em;
	}


	.single-campaign .menu-center {
		z-index: 5;
		margin: 0 auto;
		display: block;
	}


	/* menu */

	.site-header .main-content .main-content-inner .header-main .header-logo {
		flex: 0 1 200px;
	}

	.menu-container .menu {
		flex-wrap: wrap;
		font-size: 16px;
	}

	.menu-container .menu .menu-item {
		flex: 1 1 100%;
		padding-right: 0px;
		padding-left: 0px;
		margin-bottom: 0.75em;
		margin-left: 0;
	}

	.menu-container .menu .menu-item a {
		display: inline-block;
	}

	.menu-container .menu .menu-item .sub-menu {
		position: relative;
		top: unset;
		left: unset;
		display: none;
		width: 100%;
		max-width: unset;
	}


	.menu-container .menu .menu-item .sub-menu li {
		margin-bottom: 0px;
	}

	.menu-container .menu .menu-item.menu-item-has-children:hover>.sub-menu {
		display: block;
		border: 0px;
		padding-left: 1em;
		border-left: 1px solid white;
	}

	.menu-container .menu .menu-item .sub-menu .menu-item .sub-menu {
		left: unset;
		top: unset;
		width: 100%;
	}

	.menu-container .menu .menu-item.menu-item-has-children::before,
	.menu-container .menu .menu-item.menu-item-has-children:hover::before {
		top: 0.831em;
	}

	.site-header .main-content .main-content-inner .header-main .menu-container .menu .menu-item a {
		border-right: none;
	}

	


}

@media only screen and (max-width: 1024px) {

}


@media only screen and (max-width: 768px) {

	/* Flex Styling
	--------------------------------------------- */
	body .is-layout-grid.wp-block-group-is-layout-grid {
		display: flex;
		flex-direction: column;
	}


}


@media only screen and (max-width: 500px) {

	/* Flex Styling
	--------------------------------------------- */


	/* Menu
	--------------------------------------------- */
	.menu-pullout {
		padding-left: 5%;
		padding-right: 5%;
	}

	.menu-container .menu .menu-item:hover > a {
		border-bottom: unset;
	}

	.menu-container .menu .menu-item .sub-menu {
		padding-top: 0.5em;
        margin-bottom: 1em;
	}


}