.dark-scheme {

// Typography color

	&,
	.back-link .caption,
	.builder-switcher a,
	.site-footer-copyright,
	.site-footer, 
	.site-footer .widgets a, 
	.site-footer .button,
	.video-button-caption,
	p.subtitle,
	.heading .subtitle,
	.form-switch > .form-check-label,
	.alert:not(.-success):not(.-warning):not(.-danger) {
		color: $color-black-light-dm;
	}

	#{headings(1,6)},
	.titles-typo,
	.dynamic-text,
	.pill,
	.icon-button,
	.clb-slider-pagination,
	.headline-meta,
	.button.-flat,
	.site-footer .widget-title,
	.button.-text:not(.-primary):not(:hover),
	.button.-outlined:not(.-primary):not(:hover),
	.icon-group,
	.header:not(.-sticky) .mobile-overlay .icon-button,
	.social-networks:not(.-default-colors) .network,
	.dynamic-typo.dark-typo, 
	.dynamic-typo.dark-typo .titles-typo,
	.social-networks.-default-colors.-contained .network:hover,
	.social-networks.-default-colors.-outlined .network:hover,
	.alert:not(.-success):not(.-warning):not(.-danger) .icon-button .icon,
	.widget_search .wp-block-search__inside-wrapper button[type="submit"].wp-block-search__button:not(:hover),
	mark,
	input,
	select,
	textarea,
	th {
		color: $color-white;
	}

	code,
	pre {
		color: $color-neutral;
	}

	.woocommerce .stars:hover a::before, 
	.woocommerce .stars.selected a::before, 
	.woocommerce .stars.selected:hover span a::before {
		color: $color-grey;
	}

	.menu-blank,
	.blog-item.-layout1 .headline-meta,
	.subheader,
	.subheader a {
		color: $color-grey-light;
	}

	// Initial color (color reset)

	.-dark-mode-reset-color,
	.woo-products .clb-slider-nav-btn .icon-button,
	.woo-products .button-group .button.-outlined,
	.color-switcher-toddler-item,
	.tag-out-of-stock,
	.popup-subscribe .holder *,
	select > option { // Firefox issue
		color: initial;
	}

// Background color

	.portfolio-item {

		&.-with-slider {

			.overlay::after,
			.overlay-image::before {
				background-color: rgba($color-black, .992);
			}
		}

		&.-layout4 {

			.overlay {

				&::after {
					background-color: rgba($color-black, 0.5) !important;
				}
			}
		}
	}

	&,
	.site-content,
	.horizontal-accordion-item,
	.header.-sticky,
	// #masthead.header:not(.-sticky),
	.page-headline::before,
	.coming-soon,
	.site-footer,
	.woo-products .button:not(.-outlined):not(.-text):not(.-flat):not(.-primary):not(:hover),
	.logo-details {
		background: $color-black-light;
	}

	.clb-slider-pagination {
		background-color: rgba(#000, 0.25);

		.clb-slider-page {

			&.active {
		 		background-color: rgba(#000, 0.45);
		 	}
		}
	}

	.sticky-nav-holder,
	.cart-mini,
	.share-bar .social-networks,
	.header:not(.-mobile) .menu li > ul,
	.notification .alert,
	.sticky-product,
	.header.-mobile .mobile-overlay .holder {
		background-color: lighten($color-black, 4%);
	}

	.tabs {

		.tabs-nav-line {
			background-color: $color-black-light-dm;
		}
	}

	.button:not(.-outlined):not(.-text):not(.-flat):not(.-primary):not(.page-link):not(:hover),
	input[type="submit"],
	.video-button:not(.-outlined) .icon-button,
	.tabs.-with-button .tabs-nav-line,
	.social-networks:not(.-default-colors).-contained .network,
	.social-networks.-default-colors.-contained .network:hover,
	.cart-button .badge,
	.menu li.version span:after {
		background-color: $color-neutral-25;
	}

	.tooltip,
	.tooltip::before {
		background-color: lighten($color-black-light, 15%);
	}

	.purchase-button {
		background-color: rgba($color-grey, 0.95);
	}

	.portfolio-links,
	.-with-slider {

		.project-content {
		
			&::before {
				background-image: radial-gradient(circle at 1px 1px, lighten($color-black, 10%) 1px, transparent 0);
			}
		}
	}

	// Mobile

	@include sm-screen {
		
		.woo-product-details {
			background: $color-black-light;
		}
	}

// Border color

	.icon-group {
		border-color: $color-white;
	}

	.video-button.-outlined .icon-button {
		border-color: $color-black-light-dm;
	}

	.video-button.-outlined .icon-button:hover {
		border-color: currentColor;
	}

	.social-networks.-outlined:not(.-default-colors) .network:not(:hover) {
		border-color: $color-neutral-15;
	}

// Appearance
	
	// Box shadow

	.header.-mobile .mobile-overlay .holder,
	.header:not(.-mobile) .menu li > ul,
	.notification .alert,
	.sticky-product,
	.cart-mini {
	    box-shadow: 0 20px 32px -8px rgba(#000, .35), 0 0 1px rgba(#000, .25);
	}

// Components

	// Select

	select {
		
		@include chevron(light);
	}

	// Social networks

	.social-networks {

		&:not(.-text) {

			.network {
				background-image: none;
			}
		}
	}

	// Video button

	.video-button {

		&.-animation {

			.icon-button {
				position: relative;

				&::after {
					animation-name: video_sc_dark;

					@include box-shadow(false, 0px, 0px, 0px, 0px, rgba($color-white, 0.2));
				}

				@keyframes video_sc_dark {

					0% {
						opacity: 1;

						@include box-shadow(false, 0px, 0px, 0px, 0px, rgba($color-white, 0.2));
					}

					100% {
						opacity: 0;

						@include box-shadow(false, 0px, 0px, 0px, 0.85rem, rgba($color-white, 0.2));
					}
				}
			}
		}
	}

	// Slider Revolution

	rs-slide {

		.font-headlines {
			color: $color-white !important;
		}

		.font-paragraphs {
			color: $color-black-light-dm !important;
		}

		rs-sbg {

			&::after {
				content: "";
				background-color: rgba($color-black, .5);
				width: 100%;
				height: 100%;
				left: 0;
				top: 0;
				position: absolute;
			}
		}
	}

	// Projects

	.portfolio-item {

		&.-with-gradient {

			.portfolio-item-image {

				&::before {

					@include gradient(270deg, .95);

					@include sm-screen {
	
						@include gradient(360deg, 1);
					}
				}
			}

			@include md-screen {
				
				&.-layout10 {

					.portfolio-item-image {

						&::before {

							@include gradient(90deg, .95);
						}
					}
				}
			}
		}
	}

	// WPBakery and Elementor utilities overrides

	.clb__dark_mode_light.vc_row:not(.portfolio-grid):not(.blog-posts),
	.clb__dark_mode_light.vc_section,
	.clb__dark_mode_light.elementor-section,
	.clb__dark_mode_light.elementor-element .social-networks.-boxed,
	#page .clb__dark_mode_light.social-networks.-boxed,
	#page .clb__dark_mode_light.pricing-table,
	.clb__dark_mode_light .portfolio-item .card-details,
	.clb__dark_mode_light .blog-item.-contained .card-details,
	.clb__dark_mode_light .blog-item.-layout4 .image-holder,
	.clb__dark_mode_light > .vc_column-inner,
	.clb__dark_mode_light:not(.elementor-widget-ohio_recent_posts) > .elementor-widget-container,
	.clb__dark_mode_light > .elementor-widget-wrap,
	
	// old version fallbacks
	.dark_mode_light_row,
	.dark_mode_light_column.wpb_column > .vc_column-inner,
	.dark_mode_light_row,
	.dark_mode_light_column > .elementor-column-wrap,
	.dark_mode_light_widget > .elementor-widget-container {
		background-color: rgba($color-white, .025) !important;
	}

	.clb__dark_mode_black.vc_row,
	.clb__dark_mode_black.vc_section,
	.clb__dark_mode_black > .vc_column-inner,
	.clb__dark_mode_black.elementor-section,
	.clb__dark_mode_black > .elementor-widget-container,
	.clb__dark_mode_black > .elementor-widget-wrap {
		background-color: $color-black-light !important;
	}

	.clb__dark_mode_spacer {

		&, 
		.elementor-spacer {
			background-color: $color-black-light !important;
		}
	}

	.clb__dark_mode_spacer_light {

		&, 
		.elementor-spacer {
			background-color: rgba($color_neutral, 0.05) !important;
		}
	}

	.clb__dark_mode_spacer_reset {

		&, 
		.elementor-spacer {
			background-color: transparent !important;
		}
	}

	.clb__dark_mode_image {

		&,
		img {
			mix-blend-mode: multiply;
		}
	}

	// Logo

	.branding {

		.light-scheme-logo {
			display: none;
		}

		.dark-scheme-logo {
			
			@include flex;
		}
	}
}

// Default logo (light mode)

body:not(.dark-scheme) {

	.branding {

		.dark-scheme-logo {
			display: none;
		}
	}
}

// Disable transition while switching the color mode

.switching {

	*:not(.color-switcher-toddler),
	.portfolio-item.-layout12 .portfolio-item-details .portfolio-item-details-headline::after {
		transition: none !important;
	}
}

// Dynamic section colors

.dynamic-typo {

	&.light-typo {

        &, 
        .titles-typo {
        	transition-duration: 0s;
            color: $color-white;
        }
    }
    
    &.dark-typo {

        &, 
        .titles-typo {
        	transition-duration: 0s;
            color: $color-black;
        }
    }
}