/**
 * ICC Privacy Suite — front-end policy document styles.
 *
 * Loaded by `Policy\Renderer::enqueue_style()` on pages that render a policy
 * block, and on the site's stored policy pages. Scoped under `.iccp-document`,
 * `.iccp-cookie-list`, `.iccp-consent-manager` and `.iccp-policy-page` so it
 * never touches the rest of the theme.
 *
 * This file is the ONLY stylesheet for the in-page consent manager
 * (`[icc_consent_manager]`: `.iccp-consent-manager`, `.iccp-switch`,
 * `.iccp-slider`, `.iccp-cm-*`). `banner.css` is not loaded when the banner is
 * off for a site, and owns only `#iccp-root` (banner, modal, pill).
 */

.iccp-document {
	--iccp-doc-border: #e0e0e0;
	--iccp-doc-muted: #5c5f62;
	--iccp-doc-bg-soft: #f6f7f7;
	--iccp-doc-radius: 6px;
}

.iccp-document > *:first-child {
	margin-top: 0;
}

.iccp-document > *:last-child {
	margin-bottom: 0;
}

.iccp-document .iccp-site-notes {
	margin: 1.5em 0;
}

/* ------------------------------------------------------- Policy page title */

/*
 * Hello Elementor colours `.page-header .entry-title` for pages that carry an
 * Elementor hero; on a plain policy page that makes the H1 invisible (white on
 * white). `iccp-policy-page` is added to <body> by `Policy\Shortcodes` on the
 * site's stored policy pages. Override with `--iccp-policy-title-color`.
 */
.iccp-policy-page .page-header .entry-title,
.iccp-policy-page h1.entry-title {
	color: var(--iccp-policy-title-color, var(--e-global-color-primary, #1e1e1e));
}

/* --------------------------------------------------------- Consent manager */

.iccp-consent-manager {
	--iccp-text: #1e1e1e;
	--iccp-link: #0a58ca;
	--iccp-border: rgba(0, 0, 0, 0.14);
	--iccp-toggle-on: #0a58ca;
	--iccp-toggle-off: #b9b9b9;
	--iccp-btn-radius: 6px;
	--iccp-accept-bg: #1e1e1e;
	--iccp-accept-text: #ffffff;
	--iccp-surface-2: rgba(0, 0, 0, 0.04);
	--iccp-saved: #1a7f37;

	margin: 1.5em 0;
	font-size: 15px;
	line-height: 1.5;
	color: inherit;
	text-align: left;
}

.iccp-document .iccp-consent-manager {
	margin: 2em 0;
}

/* banner.js mirrors the banner theme onto the block (`iccp-theme-*`). */
.iccp-consent-manager.iccp-theme-dark {
	--iccp-text: #f2f2f2;
	--iccp-link: #7ab8ff;
	--iccp-border: rgba(255, 255, 255, 0.18);
	--iccp-toggle-on: #4c9aff;
	--iccp-toggle-off: #58585c;
	--iccp-accept-bg: #ffffff;
	--iccp-accept-text: #1c1c1e;
	--iccp-surface-2: rgba(255, 255, 255, 0.07);
	--iccp-saved: #4ac26b;
}

.iccp-consent-manager * {
	box-sizing: border-box;
}

.iccp-consent-manager p {
	margin: 0;
}

/*
 * The row is a wrapping flex container, so both `.iccp-cm-head` (full width)
 * and a bare button + switch lay out correctly, with the description and the
 * saved notice always dropping onto their own line.
 */
.iccp-consent-manager .iccp-cm-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 14px;
	margin: 0;
	padding: 4px 0;
	border-bottom: 1px solid var(--iccp-border);
}

.iccp-consent-manager .iccp-cm-row:first-of-type {
	border-top: 1px solid var(--iccp-border);
}

.iccp-consent-manager .iccp-cm-head {
	flex: 1 1 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin: 0;
	padding: 0;
}

/*
 * Defensive reset. Themes and Elementor kits style every `button`
 * (`[type=button]`, `.elementor-kit-N button`, with :hover/:focus variants that
 * repaint background and colour). `.iccp-consent-manager button.iccp-cm-toggle-row`
 * (0,2,1) and its state variants (0,3,1) out-rank all of those without
 * `!important`.
 */
.iccp-consent-manager button.iccp-cm-toggle-row,
.iccp-consent-manager button.iccp-cm-toggle-row:hover,
.iccp-consent-manager button.iccp-cm-toggle-row:focus,
.iccp-consent-manager button.iccp-cm-toggle-row:active {
	flex: 1 1 auto;
	display: block;
	width: auto;
	min-width: 0;
	min-height: 0;
	height: auto;
	margin: 0;
	padding: 14px 0;
	border: 0;
	border-radius: 0;
	background: none;
	background-color: transparent;
	box-shadow: none;
	color: inherit;
	font: inherit;
	font-weight: 600;
	line-height: 1.4;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	letter-spacing: normal;
	white-space: normal;
	cursor: pointer;
	opacity: 1;
	transform: none;
	-webkit-appearance: none;
	appearance: none;
}

.iccp-consent-manager button.iccp-cm-toggle-row:focus {
	outline: none;
}

.iccp-consent-manager button.iccp-cm-toggle-row:focus-visible {
	outline: 2px solid var(--iccp-link);
	outline-offset: 2px;
}

.iccp-consent-manager button.iccp-cm-toggle-row::before {
	content: "\25B8";
	display: inline-block;
	width: 1em;
	margin-right: 0.35em;
	transition: transform 0.15s ease;
}

.iccp-consent-manager button.iccp-cm-toggle-row[aria-expanded="true"]::before {
	transform: rotate(90deg);
}

.iccp-consent-manager .iccp-cm-desc {
	flex: 1 1 100%;
	padding: 0 0 14px 1.35em;
	font-size: 0.94em;
	opacity: 0.85;
}

.iccp-consent-manager .iccp-cm-desc p {
	margin: 0 0 8px;
}

.iccp-consent-manager .iccp-cm-desc p:last-child {
	margin-bottom: 0;
}

.iccp-consent-manager .iccp-cm-desc a {
	color: var(--iccp-link);
}

.iccp-consent-manager .iccp-cm-always {
	flex: 0 0 auto;
	font-size: 0.85em;
	font-weight: 600;
	opacity: 0.7;
	white-space: nowrap;
}

/* ---- Toggle switch: the native checkbox is invisible but still receives
 * focus, clicks and keyboard input; the slider is pure decoration. */

.iccp-consent-manager label.iccp-switch {
	position: relative;
	display: inline-block;
	flex: 0 0 auto;
	width: 44px;
	height: 24px;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	line-height: 1;
	vertical-align: middle;
	cursor: pointer;
}

.iccp-consent-manager .iccp-switch input.iccp-cm-input {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	box-shadow: none;
	background: none;
	opacity: 0;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.iccp-consent-manager .iccp-switch .iccp-slider {
	position: absolute;
	inset: 0;
	display: block;
	margin: 0;
	padding: 0;
	background: var(--iccp-toggle-off);
	border-radius: 999px;
	transition: background-color 0.18s ease;
	pointer-events: none;
}

.iccp-consent-manager .iccp-switch .iccp-slider::before {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	background: #ffffff;
	border-radius: 50%;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
	transition: transform 0.18s ease;
}

.iccp-consent-manager .iccp-switch input.iccp-cm-input:checked + .iccp-slider {
	background: var(--iccp-toggle-on);
}

.iccp-consent-manager .iccp-switch input.iccp-cm-input:checked + .iccp-slider::before {
	transform: translateX(20px);
}

.iccp-consent-manager .iccp-switch input.iccp-cm-input:focus-visible + .iccp-slider {
	outline: 2px solid var(--iccp-link);
	outline-offset: 2px;
}

.iccp-consent-manager .iccp-switch input.iccp-cm-input:disabled {
	cursor: default;
}

.iccp-consent-manager .iccp-switch input.iccp-cm-input:disabled + .iccp-slider {
	opacity: 0.55;
}

/* ---- Status, confirmations, signal line */

.iccp-consent-manager .iccp-cm-status {
	margin: 0 0 12px;
	font-size: 0.92em;
	opacity: 0.8;
}

.iccp-consent-manager .iccp-cm-status:empty {
	display: none;
}

.iccp-consent-manager .iccp-cm-signal {
	margin: 0 0 14px;
	padding: 10px 12px;
	border-left: 3px solid var(--iccp-toggle-on);
	border-radius: 4px;
	background: var(--iccp-surface-2);
	font-size: 0.92em;
	line-height: 1.45;
}

.iccp-consent-manager .iccp-cm-saved {
	margin: 0;
	font-size: 0.88em;
	font-weight: 600;
	color: var(--iccp-saved);
}

/* Saved notice inside a row: its own line, aligned with the description. */
.iccp-consent-manager .iccp-cm-row > .iccp-cm-saved {
	flex: 1 1 100%;
	margin: -8px 0 12px 1.35em;
}

/* ---- Legacy Save button (cached/filtered markup only; toggles auto-save). */

.iccp-consent-manager .iccp-cm-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-top: 18px;
}

.iccp-consent-manager button.iccp-cm-save,
.iccp-consent-manager button.iccp-cm-save:hover,
.iccp-consent-manager button.iccp-cm-save:focus {
	display: inline-block;
	width: auto;
	min-height: 0;
	margin: 0;
	padding: 10px 18px;
	border: 1px solid var(--iccp-accept-bg);
	border-radius: var(--iccp-btn-radius);
	background: var(--iccp-accept-bg);
	box-shadow: none;
	color: var(--iccp-accept-text);
	font: inherit;
	font-size: 0.94em;
	font-weight: 600;
	line-height: 1.25;
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.iccp-consent-manager button.iccp-cm-save:hover {
	opacity: 0.85;
}

/* ---- Inactive variant (banner switched off for this site) */

.iccp-consent-manager--inactive .iccp-cm-inactive {
	margin: 0;
	font-style: italic;
	opacity: 0.85;
}

.iccp-consent-manager--inactive .iccp-cm-admin-notice {
	margin: 12px 0 0;
	padding: 10px 12px;
	border-left: 4px solid #dba617;
	background: #fcf9e8;
	color: #1e1e1e;
	font-size: 0.9em;
	font-style: normal;
}

.iccp-consent-manager--inactive .iccp-cm-admin-notice a {
	color: #0a58ca;
}

/* `[hidden]` must win over the `display` values set above. */
.iccp-consent-manager [hidden] {
	display: none !important;
}

/* -------------------------------------------------------------- Cookie list */

.iccp-cookie-list {
	margin: 1.5em 0;
}

.iccp-cookie-list .iccp-cookie-list-empty {
	color: var(--iccp-doc-muted, #5c5f62);
	font-style: italic;
}

.iccp-cookie-list .iccp-cookie-group {
	margin: 1.6em 0 .6em;
	font-size: 1.05em;
	line-height: 1.3;
}

.iccp-cookie-list .iccp-cookie-group:first-child {
	margin-top: 0;
}

/* -------------------------------------------------------- Service accordion */

.iccp-cookie-list details.iccp-service {
	border: 1px solid var(--iccp-doc-border, #e0e0e0);
	border-radius: var(--iccp-doc-radius, 6px);
	margin: 0 0 8px;
	background: #fff;
}

.iccp-cookie-list details.iccp-service[open] {
	background: var(--iccp-doc-bg-soft, #f6f7f7);
}

.iccp-cookie-list details.iccp-service > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	cursor: pointer;
	list-style: none;
	font-weight: 600;
	line-height: 1.4;
}

/* Hide the native disclosure marker; the row itself is the affordance. */
.iccp-cookie-list details.iccp-service > summary::-webkit-details-marker {
	display: none;
}

.iccp-cookie-list details.iccp-service > summary::marker {
	content: "";
}

.iccp-cookie-list details.iccp-service > summary:hover {
	background: var(--iccp-doc-bg-soft, #f6f7f7);
	border-radius: var(--iccp-doc-radius, 6px);
}

.iccp-cookie-list details.iccp-service > summary:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: -2px;
}

.iccp-cookie-list .iccp-service-name {
	flex: 1 1 auto;
	min-width: 0;
	word-break: break-word;
}

.iccp-cookie-list .iccp-service-name::before {
	content: "\25B8";
	display: inline-block;
	margin-right: .5em;
	font-size: .85em;
	transition: transform .15s ease;
}

.iccp-cookie-list details.iccp-service[open] > summary .iccp-service-name::before {
	transform: rotate(90deg);
}

.iccp-cookie-list .iccp-service-body {
	padding: 0 14px 14px;
}

.iccp-cookie-list .iccp-service-desc,
.iccp-cookie-list .iccp-service-link,
.iccp-cookie-list .iccp-service-nocookies {
	margin: 0 0 .8em;
	font-size: .95em;
}

.iccp-cookie-list .iccp-service-nocookies {
	color: var(--iccp-doc-muted, #5c5f62);
}

/* ------------------------------------------------------------ Category chips */

.iccp-cookie-list .iccp-service-cat {
	flex: 0 0 auto;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	border: 1px solid transparent;
	font-size: .75em;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
	white-space: nowrap;
}

.iccp-cat-functional {
	background: #e8f3ec;
	border-color: #b6ddc4;
	color: #14562f;
}

.iccp-cat-preferences {
	background: #eaf1fb;
	border-color: #bcd3f2;
	color: #17406e;
}

.iccp-cat-statistics {
	background: #fdf3e3;
	border-color: #f0d5a6;
	color: #6b4a06;
}

.iccp-cat-marketing {
	background: #fcecec;
	border-color: #f2c2c2;
	color: #7a1f1f;
}

/* A heading chip is a heading, not a pill. */
h3.iccp-cookie-group {
	background: none;
	border: 0;
	color: inherit;
	padding: 0;
	text-transform: none;
	letter-spacing: normal;
}

/* ------------------------------------------------------------ Cookie table */

.iccp-cookie-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .9em;
	display: block;
	overflow-x: auto;
}

.iccp-cookie-table thead th {
	text-align: left;
	font-weight: 600;
	white-space: nowrap;
	border-bottom: 2px solid var(--iccp-doc-border, #e0e0e0);
	padding: 6px 10px 6px 0;
}

.iccp-cookie-table tbody td {
	vertical-align: top;
	border-bottom: 1px solid var(--iccp-doc-border, #e0e0e0);
	padding: 8px 10px 8px 0;
}

.iccp-cookie-table tbody tr:last-child td {
	border-bottom: 0;
}

.iccp-cookie-table .iccp-cookie-name code {
	font-size: .95em;
	word-break: break-all;
	background: none;
	padding: 0;
}

.iccp-cookie-table .iccp-cookie-expiry,
.iccp-cookie-table .iccp-cookie-type {
	white-space: nowrap;
	color: var(--iccp-doc-muted, #5c5f62);
}

/* ---------------------------------------------------- Unresolved variables */

.iccp-document mark.iccp-missing,
mark.iccp-missing {
	background: #fcf0f1;
	color: #b32d2e;
	padding: 0 4px;
	border-radius: 3px;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: .9em;
}

/* --------------------------------------------------------- Preferences link */

.iccp-document a.iccp-open-preferences {
	cursor: pointer;
}

/* ------------------------------------------------------------- Small screens */

@media screen and (max-width: 600px) {
	.iccp-cookie-list details.iccp-service > summary {
		flex-wrap: wrap;
		gap: 6px;
	}

	.iccp-cookie-list .iccp-service-cat {
		order: 2;
	}
}

@media (prefers-reduced-motion: reduce) {
	.iccp-cookie-list .iccp-service-name::before,
	.iccp-consent-manager .iccp-switch .iccp-slider,
	.iccp-consent-manager .iccp-switch .iccp-slider::before,
	.iccp-consent-manager button.iccp-cm-toggle-row::before {
		transition: none;
	}
}