/* ══════════════════════════════════════════════════ *
 * MARK: Global Styles
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Root #═#═#═#═#═# */
:is(#id, :root) {
	--cvh-font-icon-friesenzaun: normal 900 1em / 1 "friesenzaun-icons";

	--cvh-border-width: 1px;
}


/* #═#═#═#═#═# Body #═#═#═#═#═# */
body main {
	& p:not(:is(hgroup, div).cvh--heading-ctn p) {
		max-inline-size: 75ch;
	}

	& :is(hgroup, div).cvh--heading-ctn.has-category p:first-child {
		text-transform: uppercase;
	}
}

*:is([class^="bg--"], [class*=" bg--"]):not([class$="-ultra-light"], [class$="-light"], [class*="-ultra-light "], [class*="-light "]) a.mail-link {
	color: var(--action);
}

svg path {
	color: inherit !important;
}


/* #═#═#═#═#═# Header #═#═#═#═#═# */
header#cvh--site-header {
	&::before {
		background-color: var(--primary) !important;
		border-bottom: 0.75rem solid var(--secondary) !important;
	}

}

	/* #════ Navigation ════# */
@media (max-width: 768px){
	#mega-menu-wrap-main-navigation .mega-menu-toggle + #mega-menu-main-navigation{
		width: 220px;
	}

	#mega-menu-wrap-main-navigation #mega-menu-main-navigation > 
	li.mega-menu-megamenu > 
	ul.mega-sub-menu li.mega-menu-column-standard > 
	a.mega-menu-link, 
	#mega-menu-wrap-main-navigation #mega-menu-main-navigation > 
	li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > 
	ul.mega-sub-menu > li.mega-menu-item > 
	a.mega-menu-link{
		font-size: 14px;
	}
	#mega-menu-wrap-main-navigation #mega-menu-main-navigation.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu, #mega-menu-wrap-main-navigation #mega-menu-main-navigation.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu, #mega-menu-wrap-main-navigation #mega-menu-main-navigation li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu {
    border-top: solid 1px white;
}
}

/* #═#═#═#═#═# Button row #═#═#═#═#═# */
#cvh--site-nav-button-row :is(button, a) {
	display: inline-flex;
	color: var(--cvh-color-text-light);
	align-items: center;
	gap: 6px;
	
	&:is(.cvh--button, [class^="cvh--button-"], [class*=" cvh--button-"]) {
		background: none;
		
		&:is(:hover, :active) {
			background: none;
		}
	}

}


/* ══════════════════════════════════════════════════ *
 * MARK: Combined Logo
 * ────────────────────────────────────────────────── */
#cvh--site-logo-ctn {
	flex-basis: 250px;

	.cvh--logo-ctn,
	.cvh--combined-logo__layout {
		width: 100%;
	}
}

.cvh--combined-logo__layout {
	display: flex;
	flex-direction: column;
	gap: var(--cvh-space-xs, 1.5rem);
	color: #fff;

	& > svg {
		color: inherit !important;

		&.cvh--combined-logo__symbol {
			flex: 3;
		}

		&.cvh--combined-logo__text {
			flex: 2;
		}	
	}

	@media screen and ( width <= 600px ) {
		flex-direction: row;
		align-items: center;

		& > svg {
			&.cvh--combined-logo__symbol {
				flex: 1;
				flex-basis: 20%;
			}

			&.cvh--combined-logo__text {
				flex: 20;
			}
		}
	}
}

header#cvh--site-header.compact {
	position: fixed;

	& + * {
		margin-top: var(--cvh-site-header-y-init, 150px);
	}

	& .cvh--navigation__layout {
		justify-content: flex-end;

		@media screen and ( 600px < width ) {
			& #cvh--site-nav-button-row {
				display: none;
			}
		}
	}

	& #cvh--site-logo-ctn {
		max-height: 8rem;

		& .cvh--combined-logo__layout {
			flex-direction: row;
			align-items: center;

			& > svg {
				&.cvh--combined-logo__symbol {
					flex: 1;
					flex-basis: 20%;
				}

				&.cvh--combined-logo__text {
					flex: 20;
				}
			}
		}
	}
}


/* ══════════════════════════════════════════════════ *
 * MARK: Buttons
 * ────────────────────────────────────────────────── */
:where(main) :is(.cvh--button, [class^="cvh--button-"], [class*=" cvh--button-"]) {
	padding: var(--cvh-space-xs, 1.5rem) var(--cvh-space-l, 5rem);
	border-radius: 5px;
}

.cvh--icon-ctn svg {
	fill: currentColor;
}


/* ══════════════════════════════════════════════════ *
 * MARK: Utility
 * ────────────────────────────────────────────────── */
/* #═#═#═#═#═# Listen Stylings #═#═#═#═#═# */
:is(#id, .cvh--use-checklist ul, ul.cvh--checklist) li::before {
	content: '\2713';
	font: var(--cvh-font-icon-fas);
	line-height: 1lh;
	font-size: 1.2em;
    margin-right: 10px;
}


/* ══════════════════════════════════════════════════ *
 * MARK: Accordions
 * ────────────────────────────────────────────────── */
.cvh--accordion-wrap {
	background: var(--base-ultra-light);
	padding-top: 1.25rem;
	padding-bottom: 2.2rem ;
	--_accordion-title-bg: none !important;
  	--_accordion-title-bg-hover: none !important;
  	--_accordion-title-fg-hover: none !important;
}

 .cvh--accordion-item {
	position: relative;
	isolation: isolate;

	&::after {
		content: '\A0';
		display: block;
		position: absolute;
		bottom: 0;
		inset-inline: var(--cvh-space-s, 2.5rem);
		z-index: 5;
		translate: 0 50%;
		height: 1px;
		background-color: currentColor;
	}

	& .cvh--icon-ctn {
		display: flex;
		justify-content: center;
		align-items: center;
		max-width: 32px;
		width: 100%;
		aspect-ratio: 1 / 1;
		background: var(--secondary);
		border-radius: 50%;
		padding: 3px;

		& svg {
			display: none;
			/* fill: var(--cvh-color-text-light); */
		}

		&::after {
			display: inline-block;
			content: '\F105';
			position: relative;
			z-index: 20;
			font: var(--cvh-font-icon-friesenzaun);
			color: var(--cvh-color-text-light);
			line-height: 1;
			-webkit-font-smoothing: antialiased;
		}
	}
}


/* ══════════════════════════════════════════════════ *
 * MARK: Formular
 * ────────────────────────────────────────────────── */
.frm_compact .frm_dropzone.dz-clickable {
	margin-top: 25px;
	margin-bottom: 20px;
}

 #file47_dropzone .dz-message,
 #file50_dropzone .dz-message  {
	display: flex;
	align-items: center;
  ;
}
#file50_dropzone .dz-message button,
#file50_dropzone .dz-message svg{
	color: var(--cvh-color-text-light) !important;
	fill: var(--cvh-color-text-light);
}


/* ══════════════════════════════════════════════════ *
 * MARK: Homepage
 * ────────────────────────────────────────────────── */
.cvh--headline-underline-left-full{
	display: inline-block;
	position: relative;
}

.cvh--headline-underline-left-full::after{
	content: "";
	position: absolute;
	bottom: -5px;
	height: 1px;
	background-color: var(--cvh-color-heading-dynamic);
	left: calc(-1 * (100vw - 100%) / 2); 
	left: -100vw; 
	width: calc(100vw + 100%);
}

.cvh--link-ctn:hover .cvh--product-category-hover {
	background-color: var(--secondary);
}

.cvh--link-ctn:hover .cvh--product-category-hover p {
	color: #fff;
}


/* ══════════════════════════════════════════════════ *
 * MARK: Footer	
 * ────────────────────────────────────────────────── */
:is(.cvh--nav-menu,.widget_nav_menu .menu) li>:is(a,button) {
	line-height: 1.2;
	padding: calc(var(--cvh-space-xs) / 3) calc(var(--cvh-space-xs) / 2);
	margin: 0;
}


/* ══════════════════════════════════════════════════ *
 * MARK: Social Media Icons	
 * ────────────────────────────────────────────────── */
.cvh--social_media-ctn .cvh--social_media-link {
	--padding: var(--cvh-space-xs, 1.5rem);
	--icon-size: calc((var(--text-m) * 1.2) * var(--cvh-line-height-m));

	/* border: 2px solid var(--cvh-color-text-light); */
	/* border-radius: 99vw; */

	&:is(:hover,:focus-visible) {
		background-color: var(--primary-dark);
	}
}

/* ══════════════════════════════════════════════════ *
 * MARK: Banner
 * ────────────────────────────────────────────────── */
#cvh--site-banner .cvh--banner-overlay {
	--overlay-bg: var(--secondary);
	--cvh-color-heading-dynamic: #fff;
	color: #fff;
}