/* SonoFem - megamenu uslug (projekt: Figma SonoFem, strona megamenu). Wdrozone przez 2Sides. */

/* Przycisk rozwijania istnieje tylko w menu mobilnym. */
.sf-mm-toggle { display: none; }

@media (min-width: 981px) {
	/* Panel */
	.et-menu-nav .nav .sf-mm--ready > .sub-menu {
		position: absolute;
		top: var(--sf-mm-top, 34px) !important;
		left: var(--sf-mm-left, 0) !important;
		right: auto !important;
		width: var(--sf-mm-w, 1367px);
		height: 440px;
		padding: 0;
		background: #fff;
		border-top: 3px solid #862b8e;
		box-shadow: 2px 2px 8px rgba(0, 0, 0, .1);
		visibility: hidden;
		opacity: 0;
		transition: opacity .15s ease, visibility 0s linear .15s;
	}
	.et-menu-nav .nav .sf-mm--ready:hover > .sub-menu,
	.et-menu-nav .nav .sf-mm--ready:focus-within > .sub-menu,
	.et-menu-nav .nav .sf-mm--ready.et-touch-hover > .sub-menu {
		visibility: visible;
		opacity: 1;
		transition: opacity .15s ease, visibility 0s;
	}
	.et-menu-nav .nav .sf-mm--ready.sf-mm--closed > .sub-menu {
		visibility: hidden !important;
		opacity: 0 !important;
	}
	/* Pionowa linia miedzy kolumna kategorii a lista uslug */
	.et-menu-nav .nav .sf-mm--ready > .sub-menu::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 291px;
		width: 1px;
		background: #862b8e;
	}

	/* Lewa kolumna: kategorie */
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat {
		position: static;
		display: block;
		width: 247px;
		margin: 0 0 7px 23px;
		padding: 0;
		line-height: 31px;
	}
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat:first-child { margin-top: 30px; }
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat > a {
		position: relative;
		display: block;
		width: auto;
		height: 31px;
		padding: 0 34px 0 19px;
		font-weight: 400 !important;
		font-size: 14px !important;
		line-height: 31px !important;
		letter-spacing: 0 !important;
		text-transform: uppercase !important;
		color: #433391 !important;
		opacity: 1;
		transition: background-color .15s ease;
	}
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat.is-active > a,
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat > a:hover,
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat > a:focus-visible {
		background: #f8f8f8;
		opacity: 1;
	}
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-cat > a::after {
		content: "";
		position: absolute;
		top: 10px;
		right: 15px;
		width: 6px;
		height: 11px;
		font-family: inherit;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 11'%3E%3Cpath d='M1 1l4 4.5L1 10' fill='none' stroke='%23b0b0b0' stroke-width='1.2'/%3E%3C/svg%3E") center / contain no-repeat;
	}

	/* Srodkowa kolumna: uslugi */
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu {
		position: absolute;
		top: 30px !important;
		left: 338px !important;
		right: auto !important;
		z-index: 1;
		width: 416px;
		height: 377px;
		padding: 0;
		background: transparent;
		border: 0;
		box-shadow: none;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		scrollbar-color: #b0b0b0 #f8f8f8;
		visibility: hidden !important;
		opacity: 0 !important;
		transition: none;
	}
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat.is-active > .sub-menu {
		visibility: inherit !important;
		opacity: 1 !important;
	}
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu::-webkit-scrollbar { width: 8px; }
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu::-webkit-scrollbar-track { background: #f8f8f8; border-radius: 60px; }
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu::-webkit-scrollbar-thumb {
		background: #b0b0b0;
		background-clip: padding-box;
		border: 2px solid transparent;
		border-radius: 60px;
	}
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu > li {
		display: block;
		width: 360px;
		max-width: 100%;
		margin: 0 0 3px;
		padding: 0;
		line-height: 20px;
	}
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu > li > a {
		display: block;
		width: auto;
		padding: 5.5px 16px 5.5px 14px;
		font-weight: 300 !important;
		font-size: 14px !important;
		line-height: 20px !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		color: #545454 !important;
		opacity: 1;
		transition: background-color .15s ease, color .15s ease;
	}
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu > li > a:hover,
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu > li > a:focus-visible {
		background: #f8f8f8;
		color: #000 !important;
		opacity: 1;
	}

	/* Prawa kolumna: zdjecie kategorii */
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-media {
		position: absolute;
		top: 0;
		left: 816px;
		right: 0;
		display: block;
		height: 403px;
		margin: 0;
		padding: 0;
	}
	.sf-mm-media img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		border-radius: 0 0 0 120px;
	}
}

/* Waskie ekrany z menu desktopowym: bez zdjecia, lista dostaje cale miejsce. */
@media (min-width: 981px) and (max-width: 1140px) {
	.et-menu-nav .nav .sf-mm--ready > .sub-menu > .sf-mm-media { display: none; }
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu { width: calc(var(--sf-mm-w, 941px) - 362px); }
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu > li { width: auto; margin-right: 12px; }
}

@media (prefers-reduced-motion: reduce) {
	.et-menu-nav .nav .sf-mm--ready > .sub-menu,
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > a,
	.et-menu-nav .nav .sf-mm--ready .sf-mm-cat > .sub-menu > li > a { transition: none !important; }
}

/* Menu mobilne: kategorie rozwijane przyciskiem, nazwa kategorii pozostaje linkiem. */
@media (max-width: 980px) {
	.et_pb_menu .et_mobile_menu .sf-mm-media { display: none; }
	.et_pb_menu .et_mobile_menu li.sf-mm-cat { position: relative; }
	.et_pb_menu .et_mobile_menu li.sf-mm-cat > a { padding-right: 52px; }
	.et_pb_menu .et_mobile_menu li.sf-mm-cat > .sub-menu {
		display: none !important;
		padding-left: 0;
	}
	.et_pb_menu .et_mobile_menu li.sf-mm-cat.is-open > .sub-menu { display: block !important; }
	.et_pb_menu .et_mobile_menu li.sf-mm-cat > .sub-menu > li > a {
		font-weight: 300 !important;
		line-height: 20px !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		color: #545454 !important;
	}
	.et_pb_menu .et_mobile_menu li.sf-mm-cat > a::after { display: none; }
	.et_pb_menu .et_mobile_menu .sf-mm-toggle {
		position: absolute;
		top: 0;
		right: 0;
		display: block;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
	}
	.et_pb_menu .et_mobile_menu .sf-mm-toggle::before {
		content: "";
		position: absolute;
		top: 15px;
		left: 16px;
		width: 8px;
		height: 8px;
		border-right: 1.5px solid #862b8e;
		border-bottom: 1.5px solid #862b8e;
		transform: rotate(45deg);
	}
	.et_pb_menu .et_mobile_menu .sf-mm-toggle[aria-expanded="true"]::before {
		top: 20px;
		transform: rotate(-135deg);
	}
}