.cb-cookie-settings-open {
	overflow: hidden;
}

.cb-cookie-consent {
	position: relative;
	z-index: 10000;

	[hidden] {
		display: none !important;
	}

	.cb-cookie-consent__banner {
		position: fixed;
		inset: auto var(--wp--preset--spacing--md) var(--wp--preset--spacing--md);
		display: flex;
		align-items: center;
		justify-content: space-between;
		max-width: var(--wp--custom--layout--max);
		box-sizing: border-box;
		padding: var(--wp--preset--spacing--lg);
		margin: 0 auto;
		gap: var(--wp--preset--spacing--lg);
		color: var(--wp--custom--color--text);
		background: var(--wp--custom--color--surface);
		border: 1px solid var(--wp--custom--color--line-strong);
		border-radius: var(--wp--custom--radius--panel);
		box-shadow: var(--wp--custom--shadow--lift);

		.cb-cookie-consent__copy {
			max-width: 52rem;

			h2 {
				font-family: var(--wp--preset--font-family--display);
				font-size: var(--wp--preset--font-size--large);
				margin: 0 0 var(--wp--preset--spacing--sm);
			}

			p {
				font-size: var(--wp--preset--font-size--small);
				margin: 0;
				color: var(--wp--custom--color--text-muted);
			}

			a {
				color: var(--wp--custom--color--action);
			}
		}

		.cb-cookie-consent__actions {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			flex-wrap: wrap;
			gap: var(--wp--preset--spacing--sm);
		}
	}

	.cb-cookie-consent__text-button,
	.cb-cookie-consent__manage,
	.cb-cookie-consent__close {
		font-family: var(--wp--preset--font-family--body);
		font-size: var(--wp--preset--font-size--caption);
		color: var(--wp--custom--color--action);
		background: transparent;
		border: 0;
		cursor: pointer;
		text-decoration: underline;

		&:focus-visible {
			outline: 3px solid var(--wp--custom--color--focus);
			outline-offset: 3px;
		}
	}

	.cb-cookie-consent__manage {
		position: fixed;
		right: var(--wp--preset--spacing--md);
		bottom: var(--wp--preset--spacing--sm);
		padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--sm);
		color: var(--wp--custom--color--text-muted);
		background: var(--wp--custom--color--surface-glass);
		border: 1px solid var(--wp--custom--color--line);
		border-radius: var(--wp--custom--radius--pill);
		text-decoration: none;
	}

	.cb-cookie-consent__backdrop {
		position: fixed;
		inset: 0;
		display: grid;
		place-items: center;
		padding: var(--wp--preset--spacing--md);
		background: var(--wp--custom--color--overlay);
	}

	.cb-cookie-consent__dialog {
		width: min(100%, 42rem);
		max-height: min(90vh, 48rem);
		overflow: auto;
		box-sizing: border-box;
		padding: var(--wp--preset--spacing--xl);
		color: var(--wp--custom--color--text);
		background: var(--wp--custom--color--surface);
		border: 1px solid var(--wp--custom--color--line-strong);
		border-radius: var(--wp--custom--radius--panel);
		box-shadow: var(--wp--custom--shadow--lift);

		&:focus {
			outline: none;
		}

		header {
			display: flex;
			align-items: flex-start;
			justify-content: space-between;
			gap: var(--wp--preset--spacing--md);
			margin: 0 0 var(--wp--preset--spacing--lg);

			h2 {
				font-family: var(--wp--preset--font-family--display);
				font-size: var(--wp--preset--font-size--modal-heading);
				margin: 0;
			}
		}

		.cb-cookie-consent__eyebrow {
			font-size: var(--wp--preset--font-size--caption);
			font-weight: 800;
			color: var(--wp--custom--color--action);
			margin: 0 0 var(--wp--preset--spacing--xs);
			text-transform: uppercase;
			letter-spacing: 0.08em;
		}

		.cb-cookie-consent__close {
			font-size: var(--wp--preset--font-size--modal-heading);
			line-height: 1;
			text-decoration: none;
		}
	}

	.cb-cookie-consent__choices {
		display: grid;
		gap: var(--wp--preset--spacing--sm);

		.cb-cookie-consent__choice {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: var(--wp--preset--spacing--lg);
			padding: var(--wp--preset--spacing--md);
			background: var(--wp--custom--color--surface-alt);
			border: 1px solid var(--wp--custom--color--line);
			border-radius: var(--wp--custom--radius--card);

			div {
				display: grid;
				gap: var(--wp--preset--spacing--xs);

				strong {
					font-size: var(--wp--preset--font-size--small);
				}

				span {
					font-size: var(--wp--preset--font-size--caption);
					color: var(--wp--custom--color--text-muted);
				}
			}

			input {
				inline-size: 1.5rem;
				block-size: 1.5rem;
				accent-color: var(--wp--custom--color--action);
			}

			.cb-cookie-consent__always {
				flex: none;
				font-size: var(--wp--preset--font-size--caption);
				font-weight: 800;
				color: var(--wp--custom--color--success);
			}
		}
	}

	.cb-cookie-consent__dialog-actions {
		display: flex;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--sm);
		margin: var(--wp--preset--spacing--lg) 0 0;
	}
}

@media (max-width: 700px) {
	.cb-cookie-consent {
		.cb-cookie-consent__banner {
			align-items: stretch;
			flex-direction: column;
			padding: var(--wp--preset--spacing--md);
			gap: var(--wp--preset--spacing--md);

			.cb-cookie-consent__actions {
				align-items: stretch;
				flex-direction: column;
			}
		}

		.cb-cookie-consent__dialog {
			padding: var(--wp--preset--spacing--lg);

			header {
				h2 {
					font-size: var(--wp--preset--font-size--modal-heading-mobile);
				}
			}
		}

		.cb-cookie-consent__dialog-actions {
			flex-direction: column;
		}
	}
}
