/*
 Theme Name:   Waterhouse Young
 Theme URI:    https://waterhouseyoung.com/
 Description:  Waterhouse Young child theme
 Author:       James Evans
 Author URI:   https://websright.com
 Template:     generatepress
 Version:      0.1
*/

/* anchor links allow for fixed header */
html {
  scroll-padding-top: 6rem;
}

b, strong {
    font-weight: 500;
}
.single-post hr.wp-block-separator {
	background-color: #ccc;
	border-top: none;
}

/* address popup */
#address-popup {
	text-align: center;
}
#address-popup img {
	width: 100px;
	margin-bottom: 15px;
}


/* announcement bar */
#wpfront-notification-bar-table a {
	color: #fff;
	text-decoration: underline;
}
#wpfront-notification-bar-table .wpfront-button {
	text-decoration: none;
}
.wpfront-notification-bar-spacer.wpfront-fixed-position {
	z-index: 9 !important;
}

/* cookie bar */
.cky-notice .cky-title {
	display: none;
}
.cky-notice .cky-btn {
	padding: 5px 10px;
	font-size: 13px;
}
.cky-notice .cky-notice-des {
	font-size: 13px;	
}
.cky-consent-container .cky-consent-bar {
	padding: 10px 14px;
}

/* side cta */
.fixed-side-icons {
	position: fixed;
	bottom: 10px;
	right: 3px;
	z-index: 100;
}
#fixed-contact {
	bottom: 0;
	display: none;

}

/* nav */
.inside-header {
	position: relative;
}
.header-contact {
	position: absolute;
	right: 20px;
	top: 0;
}
.site-logo.mobile-header-logo {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.breadcrumbs {
	font-size: 14px;
}
.breadcrumbs span {
	padding: 0 6px;
}

@media (max-width: 990px) {
	.gb-container.header-contact {
		display: none;
	}
	#mobile-header.mobile-header-navigation .site-logo {
		margin-left: 0;
	}
	#mobile-header.is_stuck .menu-toggle {
		margin-top: -5px;
	}
	#mobile-header.is_stuck .inside-navigation.grid-container {
		padding-left: 0; 
		padding-right: 0;
	}
}
@media (min-width: 991px) {
	span.dropdown-menu-toggle .icon-arrow, li.mob-book, li.mob-contact {
		display: none;
	}
}
@media (max-width: 549px) {
	.mobile-header-navigation .site-logo.mobile-header-logo img {
		height: auto;
    	max-width: 220px;
	}
}
@media (min-width: 550px) and (max-width: 990px) {
	.mobile-header-navigation .site-logo.mobile-header-logo img {
		height: auto;
		max-width: 240px;
	}
}
/* mobile nav */
@media (max-width: 990px) {
	.gb-container.menu-img {
		display: flex;
		align-items: center;
		text-align: left;
		padding-left: 15px;
	}
	.gb-container.menu-img img {
		width: 50px;
	}
	.menu-img .gb-block-image {
		margin-bottom: 0;
	}
	.main-navigation .main-nav ul ul li .menu-img a {
		padding: 0 5px;
	}
    #mobile-header.main-navigation .inside-navigation {
        justify-content: flex-end;
    }
	#generate-slideout-menu.do-overlay .main-nav .slideout-menu li {
    text-align: left;
}
	#generate-slideout-menu.do-overlay .main-nav .slideout-menu li a {
		display: flex;
		justify-content: space-between 
	}
	#generate-slideout-menu.slideout-navigation.do-overlay .menu-item-has-children .dropdown-menu-toggle {
		border-left: none;
	}
	#generate-slideout-menu.slideout-navigation.do-overlay .inside-navigation {
		max-width: none;
	}
	.nav-below-header .main-navigation .inside-navigation.grid-container {
		padding: 0;
	}
	.main-navigation .menu-toggle, .main-navigation .menu-bar-items, .main-navigation a {
		font-size: 18px;
	}
	#generate-slideout-menu.slideout-navigation.do-overlay .slideout-exit {
		position: fixed;
		font-size: 22px;
	}
	.sub-menu.toggled-on .sub-menu.toggled-on li {
		padding-left: 10px;
	}
	.sub-menu-parent .sub-menu.toggled-on li a:before {
		content: '-';
		display: inline-block;
		padding-right: 3px;
	}
	#generate-slideout-menu.do-overlay .main-nav .slideout-menu .sub-menu-parent .sub-menu.toggled-on li a {
		justify-content: flex-start;
	}
	#generate-slideout-menu li.no-link > a {
		color: var(--contrast-1)  !important;
	}
	#mobile-header {
		height: 60px;
    	padding-top: 5px;
	}
	span.menu-bar-item {
		display: none;
	}
}
@media (max-width: 399px) {
	#generate-slideout-menu.slideout-navigation button.slideout-exit {
		padding-right: 10px;
	}
	.main-navigation a {
		font-size: 17px;
	}
}

/* mega menu */
@media (min-width: 991px) {
	.main-navigation:not(.is_stuck) .inside-navigation, .main-navigation.is_stuck .inside-navigation {
		position: initial;
	}
	.inside-header {
		position: relative;
	}
    nav .main-nav .mega-menu {
        position: static;
    }

    nav .main-nav .mega-menu > ul {
        position: absolute;
        width: 100%;
        left: 0 !important;
        display: flex;
        flex-wrap: wrap;
		padding: 20px;
    }

    nav .main-nav .mega-menu > ul > li > a {
        text-transform: uppercase;
		letter-spacing: 0.2em;
		border-bottom: 1px solid #ccc;
		padding-left: 0; 
		padding-right: 0;
		margin-left: 20px; 
		margin-right: 20px; 
		margin-bottom: 10px;
    }

    nav .main-nav .mega-menu>ul>li {
        display: inline-block;
        width: 25%;
        vertical-align: top;
		margin-left: auto;
        margin-right: auto;
    }

    nav .main-nav .mega-menu.mega-menu-col-2>ul>li {
        width: 50%;
    }

    nav .main-nav .mega-menu.mega-menu-col-3>ul>li {
        width: 33.3333%;
    }

    nav .main-nav .mega-menu.mega-menu-col-5>ul>li {
        width: 20%;
    }
	nav .main-nav .mega-menu.mega-menu-col-5>ul>li.col-5-2 {
		width: 40%;
	}
	nav .main-nav .mega-menu.mega-menu-col-5>ul>li.col-5-4 {
		width: 80%;
		margin: auto;
	}
	nav .main-nav .mega-menu.mega-menu-col-5>ul>li.col-5-4 ul {
		columns: 2;
  		-webkit-columns: 2;
  		-moz-columns: 2;
	}
	nav .main-nav .mega-menu.mega-menu-col-3>ul>li.col-3-2 ul li ul {
		columns: 1;
  		-webkit-columns: 1;
  		-moz-columns: 1;		
	}
	nav .main-nav .mega-menu>ul>li ul li ul {
		padding-bottom: 10px;
	}

    nav .main-nav .mega-menu > ul > li:hover > a,
    nav .main-nav .mega-menu > ul > li:focus > a,
    nav .main-nav .mega-menu > ul > li[class*="current-"] > a,
    nav .main-nav .mega-menu ul ul {
        background-color: transparent !important;
        color: inherit;
    }
    nav .main-nav .mega-menu ul .sub-menu {
        position: static;
        display: block;
        opacity: 1;
        visibility: visible;
        width: 100%;
        box-shadow: 0 0 0;
        left: 0;
        height: auto;
        pointer-events: auto;
        transform: scale(1);
    }

    nav .main-nav .mega-menu ul.toggled-on .sub-menu {
        pointer-events: auto;
    }

    nav .main-nav .mega-menu .sub-menu .menu-item-has-children .dropdown-menu-toggle {
        display: none;
    }
	/*
	nav .main-nav .mega-menu>ul>li.hidden {
		visibility: hidden;
		margin-top: -45px;
	}
	*/
	li.inline-sub-item a {
		color: var(--contrast-3) !important;
		padding-right: 5px !important;
    	padding-left: 5px !important;
		border-left: 1px solid  var(--contrast-3);
		line-height: 0px !important;
	}
	li.inline-sub-item.first a {
		padding-left: 20px !important;
		border-left: 0;
	}
	li.inline-sub-item {
		display: inline-block;
		width: auto !important;
	}
	li.sub-item-parent a {
		padding-bottom: 0px !important;
	}
	.menu-img a {
		padding: 0 !important;
	}
	nav .main-nav .mega-menu > ul > li.no-link > a, li.no-link > a {
		pointer-events: none !important;
		color: var(--contrast-1)  !important;
	}
	nav .main-nav .mega-menu > ul > li.parent-link > a {
		color: var(--contrast-1)  !important;
	}

}
@media (min-width: 1280px) and (max-width: 1499px) {
	nav .main-nav .mega-menu > ul {
		padding: 20px 8%;
	}
	nav .main-nav .mega-menu.mega-menu-col-2 > ul {
		padding-left: 14%;
		padding-right: 14%;
	}
}
@media (min-width: 1500px) {
	nav .main-nav .mega-menu > ul {
		padding: 20px 14%;
	}
	nav .main-nav .mega-menu.mega-menu-col-2 > ul {
		padding-left: 20%;
		padding-right: 20%;
	}
}
@media (min-width: 991px) and (max-width: 1149px) {
	li.inline-sub-item a {
		font-size: 14px !important;
	}
}
@media (min-width: 991px) and (max-width: 1049px) {
	.main-navigation .main-nav ul ul li a {
		padding-left: 10px; 
		padding-right: 10px; 
	}
	li.inline-sub-item.first a {
		padding-left: 10px !important;
	}
	nav .main-nav .mega-menu > ul > li > a {
		margin-left: 10px;
		margin-right: 10px;
		padding-left: 0;
	}
}
li.hide, .menu-img.hide {
	display: none !important;
}

/* home hero */
.home-hero .wp-block-cover {
	padding: 0;
}
.gb-container.play-btn {
    position: absolute;
    bottom: 0;
	pointer-events: always;
}

/* page sections */
.play-button {
	position: relative;
}
.play-button::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent url(/wp-content/uploads/2023/12/play-circle.svg) no-repeat center center;
    background-size: 15%;
    -webkit-transition: transform 2s ease;
    -moz-transition: transform 2s ease;
    -ms-transition: transform 2s ease;
    -o-transition: transform 2s ease;
    transition: transform 2s ease;
}

.page-id-18983 .page-header, .page-id-152 .page-header, .page-id-11844 .page-header, .page-id-159 .page-header {
	background-color: var(--base);
	margin-bottom: 0;
}



/* blog */
.blog .entry-summary, .archive.category .entry-summary {
	display: none;
}
.blog-relevant-topics a {
	padding: 5px 15px;
    border-radius: 100px;
    background-color: #f5f5f5;
    margin: 5px 0;
	display: inline-block;
	color: var(--contrast-1);
}
.loop-categories .post-term-item {
	display: none;
}
.loop-categories .post-term-item:first-child {
	display: block;
}
#blog-toc ul {
	list-style: none;
	margin: 10px 0 20px;
}
#blog-toc ul li {
	display: inline-block;
	margin-right: 4px;
    margin-bottom: 8px;
	padding: 4px 8px;
    border: 1px solid;
    font-size: 16px;
}
#blog-toc ul li a {
	color: var(--contrast-2);
}
@media (max-width: 767px) {
	#blog-toc ul li {
		font-size: 14px;
	}
}
.single-post .featured-image.page-header-image-single img  {
	width: 100%;
}

@media (min-width: 768px) {
	.single-post .site-content .content-area {
		border-right: 1px solid #ccc;
	}	
	.single-post .content-area h2 {
		font-size: 22px;
	}
}

@media (max-width: 767px) {
	.single-post .content-area h2 {
		font-size: 18px;
	}
}

@media (max-width: 419px) {
	.latest-news-feed .gb-grid-wrapper .gb-grid-column {
		width: 100%;
	}
}

/* knowledge hub */
.kh-search .wpgb-facet .wpgb-search-facet input[type="search"] {
	border-width: 1px;
	border-radius: 0;
}


/* footer */
#footer ul li {
	margin-top: 4px;
	margin-bottom: 4px;
}
#footer .wp-block-navigation__container {
	gap: 5px;
}
/* ninja forms */
#form .nf-form-wrap textarea, #form .nf-form-wrap input[type="tel"],
#form .nf-form-wrap input[type="text"], #form .nf-form-wrap input[type="email"] {
	border: 0 !important;
	border-bottom: 1px solid #000 !important;
	line-height: 1;
	padding: 2px 0;
	-webkit-appearance: none;

}
#form .nf-field:last-of-type .nf-field-container {
	margin: 0;
} 
#form .nf-field-label label {
	font-weight: 300 !important;
	font-size: 16px;
}
#form input[type=submit] {
	background-color: var(--contrast);
}
#form .centred {
	text-align: center;
}

/* swipers */
.related-treatments-swiper, .reviews-swiper, .treatment-reviews-swiper, .wy-treatments-swiper {
	overflow: hidden;
	position: relative;
}
.related-treatments-swiper .gb-grid-wrapper, 
.wy-treatments-swiper .gb-grid-wrapper,
.reviews-swiper .gb-grid-wrapper, 
.treatment-reviews-swiper .gb-grid-wrapper {
	flex-wrap: nowrap;
	justify-content: inherit;
	margin-left: 0;
}
.related-treatments-swiper .gb-grid-wrapper .gb-grid-column,
.wy-treatments-swiper .gb-grid-wrapper .gb-grid-column,
.reviews-swiper .gb-grid-wrapper .gb-grid-column,
.treatment-reviews-swiper .gb-grid-wrapper .gb-grid-column {
	padding-left: 0;
	display: block;
}
.related-treatments-swiper .swiper-wrapper, 
.wy-treatments-swiper .swiper-wrapper
.reviews-swiper .swiper-wrapper, 
.treatment-reviews-swiper .swiper-wrapper {
	padding-bottom: 0px;
}
.reviews-swiper .gb-grid-wrapper,
.treatment-reviews-swiper .gb-grid-wrapper {
	height: 100%;
}
.reviews-swiper .swiper-slide, 
.treatment-reviews-swiper .swiper-slide {
	height: auto;
}

.reviews-swiper .swiper-button-next, .reviews-swiper .swiper-button-prev, 
.treatment-reviews-swiper .swiper-button-next, .treatment-reviews-swiper .swiper-button-prev,
.spotlight-swiper .swiper-button-next, .spotlight-swiper .swiper-button-prev, .product-spotlight-swiper .swiper-button-next, .product-spotlight-swiper .swiper-button-prev {
	bottom: 10px;
	top: auto;
}
.related-treatments-swiper .swiper-button-next, .related-treatments-swiper .swiper-button-prev,
.wy-treatments-swiper .swiper-button-next, .wy-treatments-swiper .swiper-button-prev {
	bottom: auto;
	top: 10px;	
}

.related-treatments-swiper .swiper-button-next,
.wy-treatments-swiper .swiper-button-next,
.spotlight-swiper .swiper-button-next, 
.product-spotlight-swiper .swiper-button-next{
	right: 0;
}
.related-treatments-swiper .swiper-button-prev,
.wy-treatments-swiper .swiper-button-prev, 
.spotlight-swiper .swiper-button-prev,
.product-spotlight-swiper .swiper-button-prev{
	left: 0;
}
@media (max-width: 1024px) {
	.spotlight-swiper .swiper-button-next {
		right: 70px;
	}
	.spotlight-swiper .swiper-button-prev {
		left: 70px;
	}
}


.swiper-button-next, .swiper-button-prev, .swiper-button-next:hover, .swiper-button-prev:hover {
	background: none;
}
.swiper-button-next:after, .swiper-button-prev:after {
	display: none;
}
.disabled_swiper_button, .disabled_swiper_button1 {
    opacity: 0;
    cursor: auto;
    pointer-events: none;
}

/* treatments */
@media (max-width: 549px) {
	.conditions-grid.gb-grid-wrapper .gb-grid-column, 
	.benefits-grid.gb-grid-wrapper .gb-grid-column {
		width: 50%;
	}
}

/* offers */

.offer-text {
	position: absolute;
    z-index: 1;
    transform: rotate(90deg);
    overflow: hidden;
	top: 0;
    left: auto;
    right: 0;
    width: 150px;
    height: 150px;
	background-color: transparent !important;
}
.offer-text p {
    text-align: center;
    left: 0;
    width: 200%;
    transform: translateY(-50%) translateX(-50%) translateX(35px) rotate(-45deg);
    margin-top: 35px;
    font-size: 13px;
    line-height: 2;
    background: #000;
    color: #fff;
}

/* ninja forms */
.nf-form-wrap textarea {
	-webkit-transition: max-height 0.5s ease;
   		-moz-transition: max-height 0.5s ease;
   		-ms-transition: max-height 0.5s ease;
  		-o-transition: max-height 0.5s ease;
   		transition: max-height 0.5s ease;
		max-height: 1.9em;
}
.nf-form-wrap textarea:focus {
	max-height: 8em;
	outline: none;
}
.nf-form-wrap .nf-field-label .nf-label-span {
	font-weight: 400 !important;
}

.nf-form-wrap {
	textarea,
	input[type="tel"],
	input[type="text"],
	input[type="email"] {
		border: 0;
		border-bottom: 1px solid #000;
		background: transparent;
		padding: 0;
	}
	.nf-field-label label {
		font-weight: 200;
		font-size: 16px;
	}
	.nf-field-label .nf-label-span {
		font-weight: 400 !important;
	}
	input[type="button"] {
		color: $black;
		background-color: white;
		line-height: 1;
		border-radius: 0 !important;
		font-weight: 400;
		&:hover, &:focus, &:active {
			background-color: $black;
			color: white;
		}
	}
	nf-field:last-of-type .nf-field-container {
		margin: 0;
	}
	input[type="submit"] {
		padding: 15px 30px;
		background-color: #000
	}
	input[type="submit"]:hover {
		background-color: #fff;
		color: #000;
	}
	.ninja-forms-req-symbol {
		display: none;
	}
}
