/*

!! --- Don't remove when initializing a new theme. --- !!

These are general-purpose style fixes used across themes.

*/

// Theme Icons.
[class^="vamtam-theme-"], [class*=" vamtam-theme-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: "theme-icons" !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

// Elementor Lightbox.
.dialog-lightbox-widget.dialog-type-buttons.elementor-lightbox {
	// Fix for slideshow controls.
	:is(.swiper-container, .swiper) {
		* {
			box-sizing: border-box;
		}

		.elementor-swiper-button {
			.eicon-chevron-left,
			.eicon-chevron-right {
				font-family: 'theme-icons';
			}
			.eicon-chevron-left::before {
				content: var(--vamtam-icon-chevron-left);
			}
			.eicon-chevron-right::before {
				content: var(--vamtam-icon-chevron-right);
			}
		}
	}

	.dialog-close-button .eicon-close {
		font-family: 'theme-icons';
		&::before {
			content: var(--vamtam-icon-close);
		}
	}
}
#elementor-lightbox.dialog-type-lightbox {
	z-index: 99999;
}
.elementor-lightbox .elementor-lightbox-image,
.elementor-lightbox .elementor-video-container {
	box-shadow: none;
	border-radius: 0;
}
.vamtam-popup-icon {
	.dialog-close-button.dialog-lightbox-close-button {
		.eicon-close {
			font-family: 'theme-icons';
			&::before {
				content: var(--vamtam-icon-close);
			}
		}
	}
}
.vamtam-popup {
	&.dialog-lightbox-widget .dialog-lightbox-close-button .eicon-close {
		font-family: 'theme-icons';
		&::before {
			content: var(--vamtam-icon-close);
		}
	}
}

/* Scroll to Top */
#scroll-to-top {
	display: none;
	position: fixed;
	z-index: 200;
	opacity: 0;
	bottom: 60px;
	right: 20px;
	width: 40px;
	height: 40px;
	font-size: 2em;
	margin-left: 0px;
    border: 1px solid;
    border-color: var(--vamtam-accent-color-2);
	text-shadow: none;
	transition: opacity .3s ease-out, color .3s ease-out, transform .3s ease-out;
	backface-visibility: hidden;
	transform: scale3d( 0, 0, 0 );
	text-align: center;
	cursor: pointer;
	background: var( --vamtam-accent-color-6-hc );
    border-radius: 100%;


	svg {
		pointer-events: none;
		width: 16px;
    	height: auto;
	}

	&:hover {
		color: var(--vamtam-accent-color-1);
		transform: translateY(-8px) !important;
	}
}

#scroll-to-top-text {
	transform: rotate( 270deg);
	&:extend(.vamtam-font-h6);
	font-size: 0;
    color: var(--vamtam-accent-color-2);
	margin-top: 76px;
	position: relative;
	&::after {
		content: var(--vamtam-icon-arrow-left-bottom);
		font-family: theme-icons;
		transform: none;
		display: inline-block;
		position: absolute;
		left: 68px;
		font-size: 15px;
		top: 0px;
	}
}

// Disable Scoll.
.vamtam-disable-scroll {
	overflow: hidden;
	max-height: 100vh;
	box-sizing: border-box;
}
// iOS-only. 🤮
html.ios-safari .vamtam-disable-scroll {
	position: fixed;
	width: 100%;
}

// Lists.
ol,
ul {
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	padding-inline-start: 1.7em;
}
// Select2.
body {
	.select2-container--default .select2-results ul {
		/* UL Exeption */
		margin: 0;
		padding: 0;
		margin-block-start: 0 !important;
		margin-block-end: 0 !important;
		padding-inline-start: 0em !important;
	}
	.select2-search--dropdown {
		margin: 20px;
		width: calc(100% - 40px);
		padding: 0;
	}
	.select2-container--open .select2-dropdown--above,
	.select2-container--open .select2-dropdown--below {
		border: 1px solid;
		border-radius: 0;
		overflow: hidden; /* Fix for this: https://www.dropbox.com/s/kjhz3grsgm7ofq5/Screenshot%202021-06-05%20at%2013.22.55.png?dl=0  */
	}
	.select2-container--open .select2-dropdown--above {
		margin-top: -5px;
	}
	.select2-container--open .select2-dropdown--below {
		margin-top: 5px;
	}
	.select2-dropdown .select2-search .select2-search__field {
		border: 1px solid !important;
	}
	.select2-container--default .select2-results__option {
		padding: 6px 20px;
	}

	.select2-container--default .select2-results__option {
		&[data-selected=true],
		&[aria-selected=true] {
			background-color: var(--vamtam-accent-color-7);
			color: var(--vamtam-accent-color-7-hc);
		}
	}

	.select2-container--default .select2-results__option--highlighted {
		&[data-selected],
		&[aria-selected] {
			background-color: var(--vamtam-accent-color-1);
			color: var(--vamtam-accent-color-1-hc);
		}
	}
}

.rotate-270 {
	transform: rotate(0.75turn);
}

// TODO: Check if we need styles below anymore.
body[class*="elementor-"] {
	.select2.select2-container .select2-selection[role="combobox"] {
		line-height: normal;
		// Bijoux-after.
		display: flex;
		align-items: center;

		.select2-selection__arrow {
			display: none;
		}

		.select2-selection__rendered {
			line-height: inherit;
			padding: 0px;
		}
	}

	:not([class*="elementor-select-wrapper"]) > .select2.select2-container .select2-selection[role="combobox"] {
		&:before {
			content: "\e92a";
			font-family: eicons;
			font-size: 15px;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			inset-inline-end: 30px;
			pointer-events: none;
		}
	}
}

.vamtam-overlay-trigger--overlay {
	> .vamtam-overlay-element {
		pointer-events: none;
		position: fixed;
		display: block;
		width: 100vw;
		height: 100vh;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0,0,0,0.5);
		z-index: 100;
	}
}
.elementor-field-group &:before {
	text-shadow: none;
}

/*for all wishlist buttons*/
.woosw-btn.woosw-added:before {
    margin-right: 0;
}
/*end for all wishlist buttons*/

/*wishlist popup message*/
.woosw-popup {
	background-color: rgba(var(--vamtam-accent-color-6-rgb), 0.3);

	.woosw-popup-inner {
		.woosw-popup-content {
			.woosw-popup-content-mid {
				.woosw-popup-content-mid-message {
					&::before {
						font-size: 110px;
						color: var(--vamtam-accent-color-1);
						display: block;
						font-family: "Font Awesome 5 Free";
						font-weight: 900;
						content: "\f004";
						line-height: 1;
						margin-bottom: 20px;
					}

					img {
						display: none;
					}

					padding: 0px 40px 90px 40px;
					&:extend(.vamtam-font-h3);
				}
			}

			.woosw-popup-content-top {
				.woosw-close {
					font-size: 12px;
					font-family: var(--e-global-typography-vamtam_primary_font-font-family);
					top: 25px;
					right: 18px;
					color: var(--vamtam-accent-color-1);
				}
			}
		}
	}

	&.woosw-message {
		.woosw-popup-inner {
			.woosw-popup-content {
				max-width: 520px;
				border-radius: 0;

				.woosw-popup-content-top {
					&:extend(.vamtam-font-h4);
					height: 65px;
					padding: 25px 60px 0 30px;
					color: var( --vamtam-accent-color-1);
					margin-bottom: 70px;

					.woosw-popup-close {
						&:after {
							content: "\e918";
							font-family: 'theme-icons';
							color: var(--vamtam-accent-color-1);
						}
					}
				}
			}
		}
	}
}
/*end wishlist popup message*/

// Whishlist page.
.vamtam-is-wishlist {

	.vamtam-box-outer-padding {
		.page-header {
			text-align: center;

			h1 {
				&:extend(.vamtam-font-h2);
			}
		}
	}
}

// WC Store Notice.
.woocommerce-store-notice,
p.demo_store {
	width: auto;
	padding: 1em 40px 1em 20px;

	@keyframes vamtam-fadein {
		from {
			opacity: 0;
		}

		to {
			opacity: 1;
		}
	}
	animation: vamtam-fadein 2s ease;

	.admin-bar & {
		top: var(--wp-admin--admin-bar--height, 32px);
	}
}
.woocommerce-demo-store {
	.demo_store {
		background-color: var(--vamtam-accent-color-8);
		color: var(--vamtam-accent-color-6);
		font-family: var(--e-global-typography-vamtam_h5-font-family), Sans-serif;
		font-size: var(--e-global-typography-vamtam_h5-font-size);
		font-weight: var(--e-global-typography-vamtam_h5-font-weight);
		text-transform: var(--e-global-typography-vamtam_h5-text-transform);
		line-height: var(--e-global-typography-vamtam_h5-line-height);
		letter-spacing: var(--e-global-typography-vamtam_h5-letter-spacing);
		box-shadow: none;

		a {
			color: var(--vamtam-accent-color-6);
		}

		.woocommerce-store-notice__dismiss-link {
			text-decoration: none;
			font-size: 0;
			line-height: 1;

			&::before {
				content: "\e921";
				font-family: theme-icons !important;
				font-weight: 900;
				font-size: 10px;
				color: var( --vamtam-accent-color-6);
				top: 50%;
				transform: translateY(-50%);
			}
		}
	}
}


// Resetting user agent styles for form submit.
input:is([type="submit"]) {
	border-width: 0;
}

.vamtam-abs-pos {
	&.vamtam-abs-pos {
		position: absolute;
	}
}

// this is outside of a widget selector, so that we don't end up with loading indicators only for some parts of WC
.woocommerce .blockUI.blockOverlay::before {
	display: none !important;
}

// Hide the close notice button.
.vamtam-close-notice-btn {
	display: none;
}

// Search form popup - Close icon.
.dialog-lightbox-widget.elementor-popup-modal.vamtam-popup-search-form {
	.dialog-close-button {
		.eicon-close {
			font-family: 'theme-icons' !important;
			&::before {
				content: var(--vamtam-icon-close);
			}
		}
	}
}

/* Flatpickr fix*/
body {
	.flatpickr-calendar input {
		border: 0px !important;
		border-radius: 0 !important;
		padding: 0px 10px!important;
	}

	.flatpickr-current-month input.cur-year {
		min-height: auto;
	}

	.flatpickr-day:is(
		.selected,
		.startRange,
		.endRange,
		.selected.inRange,
		.startRange.inRange,
		.endRange.inRange,
		.selected:focus,
		.startRange:focus,
		.endRange:focus,
		.selected:hover,
		.startRange:hover,
		.endRange:hover,
		.selected.prevMonthDay,
		.startRange.prevMonthDay,
		.endRange.prevMonthDay,
		.selected.nextMonthDay,
		.startRange.nextMonthDay,
		.endRange.nextMonthDay
	) {
		background: var(--vamtam-accent-color-6);
		border-color: var(--vamtam-accent-color-6);
		color: var( --vamtam-accent-color-5);
	}
}
/* END flatpickr fix */

.bapf_sfilter {
    margin-bottom: 15px;
}

/*
	Fix for Elementor Pro v3.12.0 adding the editor's color-scheme to the page.
	TODO: Remove when fixed.
*/
@media (prefers-color-scheme: dark) {
	:root {
		color-scheme: unset;
	}
}

.dialog-widget-content {
	background-color: #fff;
}

// Fix for blink-based browsers so the scrollbar is not included in the calculation (like in max-width:100%).
body.e--ua-blink .elementor-popup-modal .dialog-widget-content {
	max-width: 100vw;
}

// WOO Extra Product Options Override.
.ui-widget-content {
	z-index: auto !important;
}

// iOS - Safari Disable Link Preview.
body.e--ua-isTouchDevice.e--ua-appleWebkit a {
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
}

// Header / class for mixed colors
.mix-blend {
	mix-blend-mode: difference;
}

.background-blur .elementor-widget-container {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}