/* ============================================= */
/* =============== IFRAME HIDE ================= */
/* ============================================= */

.pomm-in-iframe .pomm-toggle,
.pomm-in-iframe .pomm-mobile-nav {
	display: none !important;
}

.pomm-mobile-nav {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: var(--pomm-panel-z);
}

/* ============================================= */
/* ================= TOGGLE ==================== */
/* ============================================= */

.pomm-toggle {
	position: fixed;
	top: var(--pomm-toggle-top);
	z-index: var(--pomm-toggle-z);
	background: none !important;
	border: none;
	cursor: pointer;
	width: var(--pomm-hamburger-size);
	height: var(--pomm-hamburger-size);
	padding: 0 !important;
}


/* Left / Right positioning preserved */

.pomm-toggle[data-position="left"] {
	left: var(--pomm-toggle-edge);
	right: auto;
}

.pomm-toggle[data-position="right"] {
	right: var(--pomm-toggle-edge);
	left: auto;
}


/* ============================================= */
/* =============== LINE BASE =================== */
/* ============================================= */

.pomm-toggle span {
	position: absolute;
	left: 0;
	width: 100%;
	height: var(--pomm-hamburger-line-height);
	background: var(--pomm-toggle-colour-closed);
	transform-origin: center;
	transition:
		top .3s ease,
		transform .3s ease,
		opacity .3s ease,
		background .3s ease;
}


/* ============================================= */
/* =============== CLOSED STATE ================ */
/* ============================================= */

.pomm-toggle span:nth-child(1) {
	top: 1px; /* was 0 */
}

.pomm-toggle span:nth-child(2) {
	top: calc((var(--pomm-hamburger-size) - (3 * var(--pomm-hamburger-line-height))) / 2 + var(--pomm-hamburger-line-height));
}

.pomm-toggle span:nth-child(3) {
	top: calc(var(--pomm-hamburger-size) - var(--pomm-hamburger-line-height) - 1px); /* move up 1px */
}


/* Transparent header state */

body.pomm-transparent-active .pomm-toggle span {
	background: var(--pomm-toggle-colour-transparent);
}

/* Open state colour always wins */

body.pomm-open .pomm-toggle span {
	background: var(--pomm-toggle-colour-open);
}


/* ============================================= */
/* =============== STATIC ANIM ================= */
/* ============================================= */

/* STATIC ANIM — TRANSFORM ONLY */


body.pomm-open .pomm-hamburger-static span:nth-child(1) {
	transform: translateY(
		calc(
			(var(--pomm-hamburger-size) - var(--pomm-hamburger-line-height)) / 2 - 1px
		)
	) rotate(45deg);
}

body.pomm-open .pomm-hamburger-static span:nth-child(2) {
	opacity: 0;
}

body.pomm-open .pomm-hamburger-static span:nth-child(3) {
	transform: translateY(
		calc(
			-1 * ((var(--pomm-hamburger-size) - var(--pomm-hamburger-line-height)) / 2 - 1px)
		)
	) rotate(-45deg);
}


/* ============================================= */
/* ================= SPIN ANIM ================= */
/* ============================================= */

.pomm-hamburger-tox {
	transition: transform .4s ease;
}

body.pomm-open .pomm-hamburger-tox {
	transform: rotate(180deg);
}

body.pomm-open .pomm-hamburger-tox span:nth-child(1),
body.pomm-open .pomm-hamburger-tox span:nth-child(3) {
	top: calc(var(--pomm-hamburger-size) / 2 - var(--pomm-hamburger-line-height) / 2);
}

body.pomm-open .pomm-hamburger-tox span:nth-child(1) {
	transform: rotate(45deg);
}

body.pomm-open .pomm-hamburger-tox span:nth-child(2) {
	opacity: 0;
}

body.pomm-open .pomm-hamburger-tox span:nth-child(3) {
	transform: rotate(-45deg);
}


/* ============================================= */
/* ================= MINUS ANIM ================ */
/* ============================================= */

body.pomm-open .pomm-hamburger-tominus span:nth-child(1),
body.pomm-open .pomm-hamburger-tominus span:nth-child(3) {
	top: calc(var(--pomm-hamburger-size) / 2 - var(--pomm-hamburger-line-height) / 2);
}

body.pomm-open .pomm-hamburger-tominus span:nth-child(2) {
	opacity: 0;
}


/* =OVERLAY */

.pomm-mobile-overlay{position: absolute; inset: 0; background: var(--pomm-overlay-background); opacity: 0; transition: opacity .3s ease;}

.pomm-mobile-panel{position: absolute; top: 0; width: var(--pomm-width); height: 100%; background: var(--pomm-panel-background); overflow-y: auto; transition: transform var(--pomm-panel-speed) ease, opacity var(--pomm-panel-speed) ease; will-change: transform, opacity; display: flex; padding: var(--pomm-panel-padding)}

.pomm-menu-middle{align-items: center}

.pomm-menu-bottom{align-items: flex-end}

/* =ANIMATE RIGHT */

.pomm-anim-right .pomm-mobile-panel {right: 0; transform: translateX(100%);}

.pomm-anim-right.is-open .pomm-mobile-panel {transform: translateX(0);}


/* =ANIMATE LEFT */

.pomm-anim-left .pomm-mobile-panel {left: 0; transform: translateX(-100%);}

.pomm-anim-left.is-open .pomm-mobile-panel {transform: translateX(0);}


/* =ANIMATE BOTTOM */

.pomm-anim-bottom .pomm-mobile-panel {left: 0; top: 100%; width: 100%; height: var(--pomm-width); transform: translateY(0);}

.pomm-anim-bottom.is-open .pomm-mobile-panel {transform: translateY(-100%);}


/* =ANIMATE FADE */

.pomm-anim-fade .pomm-mobile-panel {left: 0; width: 100%; height: 100%; transform: none; opacity: 0;}

.pomm-anim-fade.is-open .pomm-mobile-panel {opacity: 1;}


/* =ANIMATE FADE */

.pomm-mobile-nav.is-open {pointer-events: auto;}

.pomm-mobile-nav.is-open .pomm-mobile-overlay {opacity: 1;}



body.pomm-open {overflow: hidden;}

.pomm-mobile-menu .sub-menu {display: none; padding-left: 20px; padding-bottom:20px}

.sub-menu li.menu-item-has-children.is-open > a{padding-left:0px; padding-right:0px}



/* =MENU BUTTONS */

.pomm-mobile-menu, .pomm-mobile-menu .sub-menu{list-style: none; padding-left:0px; margin: 0px; width: 100%}

.pomm-mobile-menu > li > a, .pomm-mobile-menu .sub-menu a {display: block; padding: var(--pomm-button-padding-top-bottom) var(--pomm-button-padding-left-right); font-size: var(--pomm-button-font-size); text-transform: var(--pomm-button-text-transform); background: var(--pomm-button-bg); color: var(--pomm-button-colour); transition: background .25s ease, color .25s ease; font-weight: var(--pomm-button-font-weight); letter-spacing: var(--pomm-button-letter-spacing);}

.pomm-mobile-menu .sub-menu a{font-weight: var(--pomm-sub-button-font-weight); font-size: var(--pomm-sub-button-font-size); padding: var(--pomm-sub-button-padding-top-bottom) var(--pomm-sub-button-padding-left-right)}

.pomm-mobile-menu > li > a:hover, .pomm-mobile-menu .sub-menu a:hover, .pomm-mobile-menu > li.is-open > a, .pomm-mobile-menu li.current-menu-item a {background: var(--pomm-button-bg-hover); color: var(--pomm-button-colour-hover);}

i.pomm-submenu-icon{font-size: var(--pomm-button-font-size)!important}


.panel-inner-center{text-align: center}

.panel-inner-center .pomm-additional-wrapper{justify-content: center}

.pomm-mobile-menu > li > a, .pomm-mobile-menu > li.menu-item-has-children > .sub-menu > li.menu-item-has-children > a {
	display: flex;
	align-items: center;
	gap: 8px;
}

.pomm-submenu-icon {
	margin-left: auto;
	font-size: 14px;
	transition: transform .2s ease;
}


.pomm-menu-wrapper{width: 100%}

.pomm-panel-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%
}

.panel-inner-center .pomm-mobile-menu > li > a{justify-content: center}

.panel-inner-center .pomm-mobile-menu > li > a i{margin-left:5px}



.pomm-add-top .pomm-additional-wrapper {
	order: -1;
}

.pomm-add-bottom .pomm-additional-wrapper {
	order: 2;
}

.pomm-menu-top .pomm-menu-wrapper {
	margin-top: 0;
}

.pomm-menu-middle .pomm-menu-wrapper {
	margin: auto 0;
}

.pomm-menu-bottom .pomm-menu-wrapper {
	margin-top: auto;
}

.pomm-menu-stretched .pomm-menu-wrapper {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.pomm-additional-wrapper {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.pomm-additional-text {
	font-size: var(--pomm-add-font-size, 14px);
	color: var(--pomm-add-colour, inherit);
}

.pomm-additional-link{font-size: var(--pomm-add-font-size);}

.pomm-additional-wrapper {
	font-size: var(--pomm-add-font-size);
	color: var(--pomm-add-colour);
}

.pomm-additional-wrapper i {
	font-size: var(--pomm-add-icon-size);
	width: var(--pomm-add-icon-size);
}

.pomm-additional-wrapper a {
	color: var(--pomm-add-btn-colour);
	transition: color .2s ease;
}

.pomm-additional-wrapper a:hover {
	color: var(--pomm-add-btn-hover);
}

.pomm-additional-wrapper{display: flex; gap: 20px; flex-wrap: wrap; flex-direction: var(--pomm-add-layout);}

.pomm-additional-text{width: 100%}



/* ============================================= */
/* ========== TOGGLE + ADDITIONAL ALIGN ========= */
/* ============================================= */

.pomm-toggle,
.pomm-additional-button {
	top: var(--pomm-toggle-top);
	transform: translateY(-50%);
}


/* ============================================= */
/* ========== ADDITIONAL HEADER BUTTON ========= */
/* ============================================= */

.pomm-additional-button {
	position: fixed;
	z-index: var(--pomm-toggle-z);
	text-decoration: none;
	line-height: 1;
	color: var(--pomm-toggle-colour-closed);
	transition: color .25s ease;
}

/* Positioning */

.pomm-additional-beside.pomm-side-right {
	right: calc(var(--pomm-toggle-edge) + var(--pomm-hamburger-size) + 20px);
	left: auto;
}

.pomm-additional-beside.pomm-side-left {
	left: calc(var(--pomm-toggle-edge) + var(--pomm-hamburger-size) + 20px);
	right: auto;
}

.pomm-additional-opposite.pomm-side-right {
	left: var(--pomm-toggle-edge);
	right: auto;
}

.pomm-additional-opposite.pomm-side-left {
	right: var(--pomm-toggle-edge);
	left: auto;
}

/* Icon sizing */

.pomm-additional-button.pomm-icon i {
	font-size: var(--pomm-hamburger-size);
	line-height: 1;
}

/* Transparent header */

body.pomm-transparent-active .pomm-additional-button {
	color: var(--pomm-toggle-colour-transparent);
}

/* Menu open overrides transparent */

body.pomm-open .pomm-additional-button {
	color: var(--pomm-button-colour);
}

/* Hover always wins */

.pomm-additional-button:hover {
	color: var(--pomm-toggle-colour-open)!important;
}

/* Text styling (inherits body font size) */

.pomm-additional-button.pomm-text, span.pomm-additional-text-label {
	font-weight: var(--pomm-button-font-weight);
	letter-spacing: var(--pomm-button-letter-spacing);
	text-transform: var(--pomm-button-text-transform);
}


.pomm-additional-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.pomm-additional-button i {
	font-size: var(--pomm-hamburger-size);
	line-height: 1;
	display: block;
}

.pomm-additional-text-label {
	line-height: 1;
}

.pomm-additional-button.pomm-additional-opposite.pomm-side-left.pomm-both i{order: 2}

.pomm-additional-button.pomm-additional-opposite.pomm-side-left.pomm-both .pomm-additional-text-label{order: 1}