Elep

!! --- 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-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: "\e905";
			}
		}
	}
}

// WPCPV Lightbox.
.wpcpv-gallery {
	.lg-icon {
		font-family: lg;
	}
	.lg-actions {
		:is(.lg-next, .lg-prev) {
			&:hover {
				color: var(--vamtam-accent-color-6);
			}
		}
	}
}

/* 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: "\e902";
		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.
.elementor-container {
	form.elementor-form {
		input[type], select {
			margin-bottom: 0;
		}

.elementor-field-group .elementor-field-label {
			padding-left: 20px;
			padding-right: 20px;
		}

.elementor-field-textual {
			&.elementor-size-xl {
				padding: 6px 20px;
			}

&.elementor-size-lg {
				padding: 6px 20px;
			}

&.elementor-size-md {
				padding: 6px 20px;
			}

&.elementor-size-sm {
				padding: 5px 20px;
			}

&.elementor-size-xs {
				padding: 3px 20px;
			}
		}

textarea.elementor-field.elementor-field-textual {
			padding-top: 13px;
			padding-bottom: 13px;
		}

.elementor-field-option {
			input[type="radio"] {
				vertical-align: middle;
			}
			label {
				padding-left: 10px;
			}
		}
	}
}
.elementor-field-textual {
	border-radius: 0;
	&.elementor-size-lg {
		min-height: 60px
	}
}
.elementor-field-group .elementor-field-textual:focus {
	box-shadow: none;
}
.elementor-field-group .elementor-field-textual::placeholder,
.elementor-search-form__input::placeholder {
    opacity: 1;
}

.elementor-select-wrapper {
	&:before {
		z-index: 1;
		color: currentColor;
	}

&.woocommerce-input-wrapper:before {
		inset-inline-end: 0px;
	}
}

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%);
			right: 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);
			}
		}
	}

.woosw-items .woosw-item--actions .product {
		.button {
			text-align: center;
			width: 100%;
		}

}
}

// 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: 20px;

.bapf_body > ul {
		margin-top: 8px !important;
	}
}

/*
	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 "Upgrade Swiper Library" experiment.
.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.elementor-swiper-button {
	cursor: pointer;
	position: absolute;
	display: inline-flex;
	z-index: 1;
	top: 50%;
	transform: translateY(-50%);

&-prev {
		left: 10px;
	}
	&-next {
		right: 10px;
	}
}

// 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;
}

// Free Shipping Bar.
.vamtam-free-shipping-progress-bar {
	padding: 30px 0 30px;

body.woocommerce-cart & {
		padding-top: 5px;
	}

font-size: .9em;
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;

.message .amount {
		font-weight: 700;
	}

.rail {
		line-height: 5px;
		height: 5px;
		width: 100%;
		display: flex;
		align-items: center;
		margin-top: 18px;
	}

@keyframes vamtam-fspb-fade {
		0% {
			opacity: 0;
			transform: translate3d(-20px,0,0);
		}

100% {
			opacity: 1;
			transform: none;
		}
	}

.status {
		display: flex;
		z-index: 1;
		height: inherit;
		position: relative;
		animation: .6s vamtam-fspb-fade;

&.success .indicator {
			background: var(--vamtam-fspb-color-success, #67bb67);
		}
	}

.left {
		background: var(--vamtam-fspb-color-remaining, rgba(0,0,0,.1));
		height: 3px;
		flex-grow: 1;
	}

.indicator {
		@bg-color: var(--vamtam-fspb-color-primary, #b9a16b);
		background: linear-gradient(270deg, @bg-color 0, white 200%);
		background-color: @bg-color;
		flex-grow: 1;
	}

.progress-percent {
		padding: 0 .5em;
		font-weight: 900;
		font-size: 1.1em;
	}

&.bar-placeholder + .back-to-shop {
		display: none
	}
}

.vamtam-thumb-wrapper {
	position: relative;

.woocommerce ul.products li.product & > img {
		margin: 0;
	}

&:hover {
		.vamtam-product-gallery.swiper {
			opacity: 1;
		}
	}

.vamtam-product-gallery.swiper {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		transition: opacity .5s ease;
		padding-bottom: 0;
	}

.swiper-button-next,
	.swiper-button-prev {
		&::after {
			font-family: 'theme-icons';
			font-size: 14px;
			color: var(--vamtam-accent-color-3);
		}

background-color: white;
		padding: 20px;
		border-radius: 50%;
		width: 25px;
		height: 25px;
	}

.swiper-button-prev::after {
		content: var(--vamtam-icon-arrow-left);
	}
	.swiper-button-next::after {
		content: var(--vamtam-icon-arrow-right);
	}
}

body.vamtam-wc-cart-empty .vamtam-hide-on-empty-cart {
	opacity: 0 !important;
}

.vamtam-no-overflow-on-load {
	overflow: hidden !important;
}

.wpcpv-gallery.lg-outer .lg-thumb .lg-thumb-item img {
	object-fit: contain;
}