/**
 * Frontend styles for the theme
 *
 * Enqueued in the frontend and the WordPress editor.
 */
@layer utilities;

/* Add padding to elements with background color */
.has-background:not(.wp-element-button):not(.wp-block-sowmedia-icon),
[class*="is-style-section-"] {
    padding: var(--wp--custom--global--spacing--padding--background);
	padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
}

/* Add simple hover effect to text links */
p>a,
li>a {
    transition: opacity 0.3s ease;

    &:hover {
        opacity: 0.8;
    }
}

body.site-label-interieur,
body.site-label-innovatie .editor-styles-wrapper {
	--wp--preset--color--primary: #f9b000 !important;
	
}

body.site-label-powered-by,
body.site-label-powered-by .editor-styles-wrapper {
	--wp--preset--color--primary: #666b6e !important;
	header + .wp-block-group.is-style-section-base-variant--4 {
		background-color: #666b6e;
		* {
			color: #fff;
		}
	}
	.entry-content {
		.wp-block-list, .wp-paragraph {
			a:not(.wp-block-button__link) {
				color: #1abc9c!important;
			}
		}
	}
}

body.site-label-rd,
body.site-label-rd .editor-styles-wrapper {
	--wp--preset--color--primary: #e7412b !important;
}

.entry-content > .alignfull {
    margin-top: 0;
}

/* Scroll */
.egm-scroll-toggle {
	position: fixed;
	right: 48px;
	bottom: 0;
	z-index: 50;
	width: 48px;
	height: 48px;
	border: 0;
	background: rgba(0, 0, 0, 0.5);
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease, bottom 0.2s ease, background-color 0.2s ease;
}

.egm-scroll-toggle.is-visible {
	opacity: 1;
	pointer-events: auto;
    bottom: 48px;
}

.egm-scroll-toggle:hover {
	background: rgba(0, 0, 0, 0.65);
}

.egm-scroll-toggle__icon::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0.65rem;
	height: 0.65rem;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
}

.egm-scroll-toggle.is-up .egm-scroll-toggle__icon::before {
	transform: translate(-50%, -35%) rotate(45deg);
}

.egm-scroll-toggle.is-down .egm-scroll-toggle__icon::before {
	transform: translate(-50%, -65%) rotate(225deg);
}

.wp-block-social-links .wp-block-social-link.wp-social-link {
    background: none !important;	
}