/**
 * Complianz cookie-policy accordion.
 *
 * Replaces Complianz document.css so legal pages use theme type, while
 * keeping the native <details> chevron and the placed-cookies table.
 */

.cmplz-obfuscate span {
	display: none;
}

#cmplz-manage-consent-container {
	display: none;
}

#cmplz-cookies-overview .cmplz-dropdown,
#cmplz-document .cmplz-dropdown {
	margin-block: 0.5rem;
}

#cmplz-cookies-overview .cmplz-dropdown summary,
#cmplz-document .cmplz-dropdown summary {
	display: block;
	cursor: pointer;
	list-style: none;
	padding-block: 0.4rem;
	padding-inline: 0.25rem 0.5rem;
}

#cmplz-cookies-overview .cmplz-dropdown summary::-webkit-details-marker,
#cmplz-cookies-overview .cmplz-dropdown summary::marker,
#cmplz-document .cmplz-dropdown summary::-webkit-details-marker,
#cmplz-document .cmplz-dropdown summary::marker {
	display: none;
	content: "";
}

#cmplz-cookies-overview .cmplz-dropdown summary div,
#cmplz-document .cmplz-dropdown summary div {
	display: grid;
	grid-template: "heading chevron";
	grid-template-columns: 2fr 25px;
	grid-gap: 15px;
	align-items: center;
}

#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div,
#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div {
	grid-template: "heading paragraph label checkbox chevron";
	grid-template-columns: 2fr auto 0 auto 25px;
}

#cmplz-cookies-overview .cmplz-dropdown summary div h3,
#cmplz-document .cmplz-dropdown summary div h3 {
	grid-area: heading;
	margin: 0;
	padding: 0;
	border-bottom: 0;
	font-size: var(--wp--preset--font-size--medium);
}

#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div p,
#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div p {
	grid-area: paragraph;
	margin: 0;
	padding: 0;
	text-align: right;
	font-size: var(--wp--preset--font-size--small);
}

#cmplz-cookies-overview .cmplz-dropdown summary div input[data-category="functional"],
#cmplz-document .cmplz-dropdown summary div input[data-category="functional"] {
	visibility: hidden;
}

#cmplz-cookies-overview .cmplz-dropdown summary div::after,
#cmplz-document .cmplz-dropdown summary div::after {
	grid-area: chevron;
	content: "";
	width: 18px;
	height: 18px;
	margin: 3px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/%3E%3C/svg%3E")
		center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/%3E%3C/svg%3E")
		center / contain no-repeat;
	transform: rotate(0deg);
	transition: transform 0.5s ease;
}

#cmplz-cookies-overview .cmplz-dropdown[open] summary div::after,
#cmplz-document .cmplz-dropdown[open] summary div::after {
	transform: rotate(180deg);
}

#cmplz-cookies-overview .cmplz-dropdown .cmplz-service-description,
#cmplz-cookies-overview .cmplz-dropdown .cmplz-sharing-data,
#cmplz-document .cmplz-dropdown .cmplz-service-description,
#cmplz-document .cmplz-dropdown .cmplz-sharing-data {
	display: inline-block;
	width: calc(50% - 35px);
	vertical-align: top;
	padding: 0 15px 15px;
}

#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose,
#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose {
	display: grid;
	grid-gap: 1px;
	margin-bottom: 10px;
	border: 1px solid var(--wp--preset--color--accent-5);
	background-color: var(--wp--preset--color--accent-5);
}

#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div,
#cmplz-document .cmplz-dropdown .cookies-per-purpose div {
	background-color: var(--wp--preset--color--base);
	padding: 15px;
}

#cmplz-cookies-overview .cmplz-dropdown h4,
#cmplz-document .cmplz-dropdown h4 {
	margin: 5px 0;
	padding: 0 15px;
	font-size: var(--wp--preset--font-size--small);
	text-transform: none;
}

#cmplz-cookies-overview .cmplz-dropdown h5,
#cmplz-document .cmplz-dropdown h5 {
	margin: 0;
}

@media only screen and (min-width: 600px) {
	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose {
		grid-column: span 2;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template: "purpose purpose purpose" "header1 header2 header3" auto;
	}

	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .purpose,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .purpose {
		grid-area: purpose;
	}

	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .name-header,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .name-header {
		grid-area: header1;
		background-color: var(--wp--preset--color--accent-5);
	}

	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .retention-header,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .retention-header {
		grid-area: header2;
		background-color: var(--wp--preset--color--accent-5);
	}

	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .function-header,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .function-header {
		grid-area: header3;
		background-color: var(--wp--preset--color--accent-5);
	}
}

@media only screen and (max-width: 600px) {
	#cmplz-cookies-overview .cmplz-dropdown .cmplz-service-description,
	#cmplz-cookies-overview .cmplz-dropdown .cmplz-sharing-data,
	#cmplz-document .cmplz-dropdown .cmplz-service-description,
	#cmplz-document .cmplz-dropdown .cmplz-sharing-data {
		width: 100%;
	}

	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose {
		grid-template-columns: 100px 1fr;
	}

	#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .purpose,
	#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose .purpose {
		grid-column: span 2;
	}

	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 2),
	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 3),
	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 4),
	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 5),
	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 6),
	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 7),
	#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 2),
	#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 3),
	#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 4),
	#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 5),
	#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 6),
	#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n + 7) {
		background-color: var(--wp--preset--color--accent-5);
	}
}

@media (prefers-reduced-motion: reduce) {
	#cmplz-cookies-overview .cmplz-dropdown summary div::after,
	#cmplz-document .cmplz-dropdown summary div::after {
		transition: none;
	}
}
