.overflow {
	overflow: hidden;
}

input[id^='eael-tabs-filter-type-'] {
	appearance: none;
	position: relative;
	width: 18px;
	min-width: 18px;
	height: 18px;
	border: 1px solid #000;
	overflow: hidden;

	&::before {
		content: '';
		position: absolute;
		top: -8px;
		left: 19px;
		width: 11px;
		height: 1.5px;
		background: #000;
		transform: rotate(-45deg);
		transition: all 250ms ease-in-out;
	}

	&::after {
		content: '';
		position: absolute;
		top: -6px;
		left: -13px;
		width: 5px;
		height: 1.5px;
		background: #000;
		transform: rotate(45deg);
		transition: all 250ms ease-in-out;
	}

	&:checked {
		&::before {
			top: 7px;
			left: 4px;
		}
		&::after {
			top: 9px;
			left: 2px;
		}
	}
}
.eael-tabs-filter {
	flex-wrap: wrap;
	row-gap: 20px !important;

	.eael-tabs-filter-types {
		ul {
			flex-wrap: wrap;
			row-gap: 20px !important;
		}
		label {
			padding-top: 3px;
		}
	}
}

.eael-tabs-nav {
	&.eael-tabs-nav-custom {
		// display: flex;
		// flex-direction: row;
		column-gap: 50px;

		display: grid;
		grid-template-areas:
			'tabs-name tabs-list'
			'tabs-name tabs-toggle';
		grid-template-columns: auto 1fr;

		.tabs-category-name {
			grid-area: tabs-name;

			@media (max-width: 1000px) {
				margin-bottom: 40px;

				br {
					display: none;
				}
			}
		}

		ul[role='tablist'] {
			grid-area: tabs-list;
			flex: 1;
			gap: 24px;
			flex-wrap: wrap;

			&.limit {
				overflow: hidden;
				max-height: 140px;
			}
		}

		.show-more-tabs {
			grid-area: tabs-toggle;
			position: relative;
			color: #000;
			font-size: 16px;
			font-weight: 700;
			font-family: 'Manrope', Sans-serif;
			text-transform: uppercase;
			letter-spacing: 0.6px;
			margin-top: 50px;
			width: fit-content;

			&::before {
				content: '\e65a';
				color: #000;
				font-family: 'themify';
				position: absolute;
				left: calc(100% + 10px);
				top: calc(50% - 3px);
				width: 30px;
				height: 30px;
				border-radius: 100%;
				transform: translateY(-50%) rotate(90deg);
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 24px;
				animation: bounce 2s infinite;
			}

			@keyframes bounce {
				0%,
				20%,
				50%,
				80%,
				100% {
					transform: translateY(calc(-50%)) translateX(0) rotate(90deg);
				}
				40% {
					transform: translateY(calc(-50% - 10px)) translateX(-10px)
						rotate(90deg);
				}
				60% {
					transform: translateY(calc(-50% - 5px)) translateX(-5px) rotate(90deg);
				}
			}
		}

		@media (max-width: 1000px) {
			grid-template-areas:
				'tabs-name'
				'tabs-list'
				'tabs-toggle';
			grid-template-columns: 1fr;
		}
	}

	> ul {
		display: grid !important;
		grid-template-columns: repeat(auto-fit, 194px);

		li {
			height: 100%;
		}
	}
}

.color-anchor {
	position: relative;
	height: 100px;
	display: flex;
	align-items: center;

	&::before {
		content: '\e65a';
		color: #000;
		font-family: 'themify';
		position: absolute;
		left: calc(100% - 20px);
		top: 50%;
		width: 100px;
		height: 100px;
		background: #f4f4f4;
		border-radius: 100%;
		transform: translateY(-50%);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 28px;
	}

	> .elementor-widget-container {
		position: relative;
		height: fit-content !important;
		z-index: 1;
	}
}

.anchor-arrow {
	.elementor-icon {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100px;
		height: 100px;
		border-radius: 100%;
		background: #f4f4f4;
		margin-left: -20px;
	}
}

.quality-box {
	position: relative;

	&::before {
		content: '';
		position: absolute;
		background-image: url('/wp-content/uploads/2024/04/quality-bg.svg');
		mix-blend-mode: multiply;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: 0.4;
		top: 0;
		bottom: 0;
		right: 0;
		left: auto;
		width: 320px;
		z-index: 1;
	}
	.quality-item {
		position: relative;
		z-index: 1;

		.elementor-icon-box-wrapper {
			.elementor-icon-box-content {
				position: relative;
				padding-left: 24px;

				&::before {
					content: '';
					position: absolute;
					left: 0;
					top: 6px;
					bottom: 6px;
					width: 2px;
					background: #000;
				}

				@media (max-width: 768px) {
					&:before {
						display: none;
					}
				}
			}
		}
	}
}

.numeric-list {
	ol {
		padding: 0;
		margin: 0;
		counter-reset: number;
		list-style-type: none;

		li {
			position: relative;
			counter-increment: number;
			padding-left: 55px;
			&:not(:last-child) {
				margin-bottom: 20px;
			}

			&:before {
				content: counter(number);
				position: absolute;
				left: 0;
				top: 0;
				width: 32px;
				height: 32px;
				border-radius: 100%;
				background: #f4f4f4;

				display: flex;
				align-items: center;
				justify-content: center;

				font-size: 18px;
				font-weight: 700;
				letter-spacing: 0.6px;
			}
		}
	}
}

.home-nasze-produkty {
	.premium-carousel-wrapper {
		.premium-carousel-inner {
			.carousel-arrow {
				position: absolute;
				top: -108px;
				padding: 0;
				border: none;
				margin: 0 !important;

				&:hover {
					background: transparent;
				}

				&.carousel-next {
					right: 50px;

					@media (max-width: 500px) {
						right: auto;
						left: calc(50% + 70px);
						transform: translateX(-50%);
					}
				}
				&.carousel-prev {
					right: 130px;
					left: auto;

					@media (max-width: 500px) {
						right: auto;
						left: calc(50% - 70px);
						transform: translateX(-50%);
					}
				}

				@media (max-width: 500px) {
					top: -50px;
				}
			}
		}
	}
}

.home-gallery {
	.elementor-widget-container {
		.swiper {
			.elementor-swiper-button {
				top: -92px;
				&.elementor-swiper-button-prev {
					left: auto;
					right: 130px;
					left: auto;

					@media (max-width: 500px) {
						right: auto;
						left: calc(50% - 70px);
						transform: translateX(-50%);
					}
				}
				&.elementor-swiper-button-next {
					right: 50px;

					@media (max-width: 500px) {
						right: auto;
						left: calc(50% + 70px);
						transform: translateX(-50%);
					}
				}

				@media (max-width: 500px) {
					top: -50px;
				}
			}
		}
	}
}

.home-numbers-1 {
	position: relative;

	&::before {
		content: '';
		position: absolute;
		left: 0;
		top: -115px;
		width: 495px;
		height: 495px;
		transform: translateX(-50%);
		background-image: url('/wp-content/uploads/2024/04/V.svg');
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
}

.home-troska {
	position: relative;

	.home-troska-left {
		position: relative;

		&::before {
			content: '';
			position: absolute;
			left: 10px;
			top: 0;
			bottom: 0;
			transform: translateX(-50%);
			background-image: url('/wp-content/uploads/2024/04/V.svg');
			background-repeat: no-repeat;
			background-size: contain;
			background-position: center;
		}
	}
}

#home-hero-slider {
	width: 100%;
	max-width: 1920px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;

	.premium-carousel-inner {
		.slick-dots {
			display: flex;
			justify-content: flex-end;
			left: 72%;

			position: absolute;
			bottom: 7.8%;

			counter-reset: list;
			list-style-type: none;

			& > li {
				position: relative;
				counter-increment: list;
				width: auto;
				margin: 0 10px;

				&:before {
					content: '0' counter(list);
					color: #000;
					font-size: 24px;
					font-weight: 700;
					font-family: 'Manrope', Sans-serif;

					@media (max-width: 900px) {
						font-size: 20px;
					}
				}

				&:first-child {
					&::after {
						content: '';
						position: absolute;
						top: 50%;
						right: calc(100% + 17px);
						width: 100vw;
						height: 2px;
						background: #000;
					}
				}

				&:last-child {
					&::after {
						content: '';
						position: absolute;
						top: 50%;
						left: calc(100% + 17px);
						width: 100vw;
						height: 2px;
						background: #000;
					}
				}

				&:last-child {
					&.slick-active {
						margin: 0 10px 0 53px;
						.dot-helper {
							position: relative;

							&::before {
								content: '';
								position: absolute;
								width: 33px;
								height: 2px;
								right: 47px;
								background: #000;
							}
						}
					}
				}
				&:first-child {
					&.slick-active {
						margin: 0 53px 0 10px;

						.dot-helper {
							position: relative;

							&::after {
								content: '';
								position: absolute;
								width: 33px;
								height: 2px;
								left: 15px;
								background: #000;
							}
						}
					}
				}
				&:not(:last-child, :first-child) {
					&.slick-active {
						margin: 0 53px;
						.dot-helper {
							position: relative;

							&::before {
								content: '';
								position: absolute;
								width: 33px;
								height: 2px;
								right: 47px;
								background: #000;
							}
							&::after {
								content: '';
								position: absolute;
								width: 33px;
								height: 2px;
								left: 15px;
								background: #000;
							}
						}
					}
				}
			}

			@media (max-width: 1100px) {
				left: 70%;
			}
			@media (max-width: 900px) {
				left: 60%;
				bottom: 6%;
			}
			@media (max-width: 768px) {
				left: 50%;
				transform: translateX(-50%);
			}
		}
	}

	.slide-text-box {
		@media (max-width: 768px) {
			bottom: 15%;
		}
	}
}

.product-gallery-colors {
	.show-more-colors {
		.premium-button-text-icon-wrapper {
			display: flex;
			align-items: center;

			span {
				padding-top: 5px;
			}
		}
	}
}
.product-colors {
	.elementor-image-gallery {
		.gallery {
			display: flex;
			flex-wrap: wrap;
			gap: 32px;
			max-height: 128px;
			overflow: hidden;

			.gallery-item {
				display: flex;
				flex-direction: row;
				align-items: center;
				gap: 13px;
				width: calc(50% - 16px);

				.gallery-icon {
					width: 48px;
					min-width: 48px;
					height: 48px;

					img {
						height: 100%;
						width: 100%;
						object-fit: cover;
					}
				}
				.gallery-caption {
					padding: 0;
				}
			}
		}
	}
}

.product-colors-s2 {
	.elementor-image-gallery {
		.gallery {
			display: flex;
			flex-wrap: wrap;

			.gallery-item {
				display: flex;
				flex-direction: column;
				align-items: flex-start;
				gap: 2px;
				// width: calc(50% - 16px);

				.gallery-icon {
					width: 98px;
					min-width: 98px;
					height: 98px;

					img {
						height: 100%;
						width: 100%;
						object-fit: cover;
					}
				}
				.gallery-caption {
					padding: 0;
				}
			}
		}
	}
}

.product-gallery-drafts {
	.show-more-drafts {
		.premium-button-text-icon-wrapper {
			display: flex;
			align-items: center;

			span {
				padding-top: 5px;
			}
		}
	}
}
.product-drafts {
	.elementor-image-gallery {
		.gallery {
			max-height: 210px;
			overflow: hidden;

			.gallery-item {
				.gallery-caption {
					padding: 0;
				}
			}
		}
	}
}

.product-gallery-drafts {
	.elementor-image-gallery {
		.gallery {
			max-height: 1030px;
			overflow: hidden;
		}
	}
}

.product-catalog-bg {
	position: relative;

	&::before {
		content: '';
		position: absolute;
		left: 30px;
		top: 0;
		width: 495px;
		height: 495px;
		transform: translateX(-50%);
		background-image: url('/wp-content/uploads/2024/04/V.svg');
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
}

#footer-data {
	position: relative;
	overflow: hidden;

	&::before {
		content: '';
		position: absolute;
		top: 115px;
		height: 2px;
		width: 100vw;
		background: #f4f4f4;
	}
}

//* Okna drewniane
body.page-id-729 {
	.custom-bg-v {
		.elementor-widget-container {
			position: relative;

			&::before {
				content: '';
				position: absolute;
				left: calc(100% - 5px);
				top: 50%;
				width: 495px;
				height: 495px;
				transform: translate(-50%, -50%);
				background-image: url('/wp-content/uploads/2024/04/Group-371.svg');
				background-repeat: no-repeat;
				background-size: contain;
				background-position: center;
			}
		}
	}
}

#quote-box {
	.carousel-arrow {
		left: auto;

		&.carousel-prev {
			top: -60px;
			right: 100px;
		}
		&.carousel-next {
			top: -60px;
			right: 0px;
		}
	}
}

#contact-form {
	select {
		&.wpcf7-select {
			visibility: hidden;
			opacity: 0;
			display: none;
		}
	}

	.select-custom-text {
		position: relative;
		padding: 15px 24px;
		border: 1px solid #000;

		font-family: 'League Spartan', Sans-serif;
		letter-spacing: 0.6px;
		font-weight: 400;

		&.selected {
			color: #000;
		}

		&.active {
			&::before {
				transform: translateY(-50%) scale(-1);
			}
		}
		&::before {
			content: '\33';
			position: absolute;
			top: 50%;
			right: 24px;
			transform: translateY(-50%);
			transition: all 250ms ease-in-out;
			font-family: 'ElegantIcons';
			font-size: 26px;
			color: #000;
		}
	}

	.select-custom-options {
		list-style: none;
		padding: 15px 24px;
		border-left: 1px solid #000;
		border-right: 1px solid #000;
		border-bottom: 1px solid #000;

		li {
			color: #000;
			font-family: 'League Spartan', Sans-serif;
			letter-spacing: 0.6px;
			font-weight: 400;
			cursor: pointer;

			&:not(:last-child) {
				margin-bottom: 10px;
			}
		}
	}

	.wpcf7-list-item {
		margin-left: 0;

		label {
			display: flex;
			flex-direction: row;
			gap: 10px;
			cursor: pointer;
		}
	}

	input {
		&[type='checkbox'] {
			position: relative;
			appearance: none;
			width: 14px;
			min-width: 14px;
			height: 14px;
			border-radius: 100%;
			border: 1px solid #000;
			overflow: hidden;
			margin-top: 2px;

			&:checked {
				&::before {
					top: 6px;
					left: 4px;
				}
				&::after {
					top: 7px;
					left: 3px;
				}
			}

			&::before {
				content: '';
				position: absolute;
				top: -4px;
				left: 14px;
				width: 6px;
				height: 1px;
				background: #000;
				transform: rotate(-45deg);
				transition: all 250ms ease-in-out;
			}
			&::after {
				content: '';
				position: absolute;
				top: -3px;
				left: -7px;
				width: 3px;
				height: 1px;
				background: #000;
				transform: rotate(45deg);
				transition: all 250ms ease-in-out;
			}
		}
		&[type='text'],
		&[type='tel'],
		&[type='email'] {
			&::placeholder {
				color: #a8a8a8;
			}
		}
	}
	textarea {
		&::placeholder {
			color: #a8a8a8;
		}
	}

	p {
		color: #a8a8a8;
		font-size: 16px;
		font-family: 'League Spartan' sans-serif;
		letter-spacing: 0.6px;
		font-weight: 400;
	}

	.form-submit-btn {
		position: relative;
		width: fit-content;
		margin: 20px 0 0 auto;

		&::before {
			content: '\e65a';
			color: #000;
			font-family: 'themify';
			position: absolute;
			right: 0;
			top: 0;
			width: 100px;
			height: 100px;
			background: #f4f4f4;
			border-radius: 100%;
			// transform: translateY(-50%);
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 28px;
		}

		input {
			&.wpcf7-submit {
				position: relative;
				height: 100px;
				display: flex;
				align-items: center;
				padding-right: 80px;
			}
		}
	}

	.wpcf7-spinner {
		display: block;
	}
}
#contact-form.contact-form-2 {
	.row {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 20px;

		.col-6 {
			p {
				width: 100%;
			}

			textarea {
				max-height: 208px;
			}
		}
	}
}

.customized-shapes-box {
	position: relative;

	&::before {
		content: '';
		position: absolute;
		background-image: url('/wp-content/uploads/2024/04/quality-bg.svg');
		mix-blend-mode: multiply;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: 0.4;
		top: 0;
		bottom: 0;
		right: 0;
		left: auto;
		width: 320px;
		z-index: 1;
	}
}

#accessories-head {
	&::before {
		content: '';
		position: absolute;
		background-image: url('/wp-content/uploads/2024/05/Group-373.svg');
		mix-blend-mode: multiply;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: 0.5;
		top: 0;
		bottom: 0;
		right: auto;
		left: 20px;
		width: 100px;
		z-index: 1;
	}
}

.box-bg-v {
	&::before {
		content: '';
		position: absolute;
		right: 0px;
		left: auto;
		top: 50%;
		width: 495px;
		height: 495px;
		transform: translate(50%, -50%);
		background-image: url('/wp-content/uploads/2024/04/V.svg');
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
		z-index: 1;
		opacity: 0.5;
	}
}

body.elementor-page {
	> div[data-elementor-type='single-page'] {
		overflow: hidden;
	}
}

#checkbox-btn {
	&.active {
		a {
			&::before {
				content: '';
				position: absolute;
				top: 7px;
				left: 4px;
				width: 11px;
				height: 6px;
				transform: rotate(-45deg);
				transition: all 250ms ease-in-out;
				border-bottom: 1.5px solid #000;
				border-left: 1.5px solid #000;
			}
		}
	}
	a {
		position: relative;
		padding-left: 30px;
		width: fit-content;
		display: block;

		&::after {
			content: '';
			position: absolute;
			top: 2px;
			left: 0px;
			width: 18px;
			height: 18px;
			border: 1px solid #000;
		}
	}
}

.product-list-icon-desc {
	.elementor-icon-box-icon {
		position: relative;
		padding-right: 20px;

		&::before {
			content: '';
			position: absolute;
			right: 0;
			top: 50%;
			transform: translateY(-50%);
			width: 2px;
			height: 40px;
			background: #000;
		}
	}
	.elementor-icon-box-title {
		margin: 0;
	}
}

.custom-acc {
	.eael-adv-accordion {
		.eael-accordion-list {
			&:not(:last-child) {
				border-bottom: 1px solid #000;
			}

			.eael-accordion-header {
				&.active {
					.fa-toggle {
						transform: rotate(180deg) !important;
					}
				}
			}
		}
	}
}

#top-header-box {
	&.fixed {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 999;
	}
}

header {
	background: #fff;

	&.active {
		position: sticky;
		top: 0;
		z-index: 999999;
	}
}

.addon-btn-title {
	margin: 0;
	display: flex;
	align-items: center;

	.elementor-icon {
		position: relative;
		margin-left: -20px;
		z-index: -1;

		&::before {
			content: '';
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			width: 90px;
			height: 90px;
			background: #e6e3e3;
			border-radius: 100%;
			z-index: -1;
			// transition: all 250ms ease-in-out;
		}

		i {
			color: #000;
			width: 100px;
			height: 100px;
			background: #f4f4f4;
			border-radius: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 28px;
			transition: all 250ms ease-in-out;
		}
	}

	span {
		position: relative;

		&::before {
			content: '';
			position: absolute;
			left: 0;
			bottom: 0;
			width: 0;
			height: 2px;
			background: #000;
			transition: width 250ms ease-in-out;
		}
	}

	&:hover {
		span {
			&::before {
				width: 100%;
			}
		}
		.elementor-icon {
			&::before {
				animation: puls 500ms ease-in-out;
			}
			i {
				background: #e6e3e3;
			}
		}
	}

	@keyframes puls {
		0% {
			opacity: 1;
		}
		100% {
			width: 140px;
			height: 140px;
			opacity: 0;
		}
	}
}

#center-header-box {
	@media (min-width: 501px) {
		> .e-con-inner {
			.center-header-box-menu {
				.elementor-nav-menu {
					li.menu-item-4927 {
						display: none;
					}
				}
			}
		}
	}
	@media (min-width: 1025px) {
		> .e-con-inner {
			.center-header-box-menu {
				.elementor-nav-menu {
					> .menu-item {
						&.current_page_item {
							> a {
								&::after {
									width: 100%;
								}
							}
						}
						> a {
							&::after {
								width: 0;
								transition: width 250ms ease-in-out;
							}
							&:hover {
								&::after {
									width: 100%;
								}
							}
						}
					}
				}
			}
		}
	}
	@media (max-width: 1024px) {
		> .e-con-inner {
			.center-header-box-logo {
				// order: 1;
				flex: 1;
				display: flex;
			}
			.center-header-box-menu {
				// order: 3;

				> .elementor-widget-container {
					> .elementor-nav-menu--dropdown {
						position: absolute;
						right: 0px;
						left: auto;
						top: 64px;
						width: 100vw;
						z-index: 1;

						@media (max-width: 768px) {
							top: 52px;
						}
					}
				}
				.elementor-nav-menu {
					.menu-item {
						ul.sub-menu {
							background: #f4f4f4;
						}
					}
				}
			}
			.center-header-box-contact {
				// order: 2;

				@media (max-width: 500px) {
					display: none;
				}
			}
		}
	}
}

#scroller-rows {
	overflow: hidden;

	> .e-con-inner {
		overflow: auto;
		padding-right: 20px;

		&::-webkit-scrollbar {
			width: 10px;
		}

		/* Track */
		&::-webkit-scrollbar-track {
			background: #f4f4f4;
		}

		/* Handle */
		&::-webkit-scrollbar-thumb {
			background: #d9d9d9;
		}

		/* Handle on hover */
		&::-webkit-scrollbar-thumb:hover {
			background: #afafaf;
		}
	}
}

#page-hero-baner {
	@media (max-width: 1024px) {
		h1 {
			font-size: 50px;
		}
		h2 {
			font-size: 24px;
		}
	}
	@media (max-width: 576px) {
		h1 {
			font-size: 40px;
		}
		h2 {
			font-size: 22px;
		}
	}
}
// body {
// 	.elementor-location-single {
// 		div[data-elementor-type='wp-page'] {
// 			&.elementor {
// 				.elementor-element {
// 					h1,
// 					h2,
// 					h3,
// 					h4,
// 					h5,
// 					h6 {
// 						&.elementor-heading-title {
// 							color: #444444;
// 						}
// 					}
// 				}
// 			}
// 		}

// 		p,
// 		a,
// 		span,
// 		.elementor-heading-title {
// 			color: #444444;
// 		}
// 	}
// }