@layer components {
	.klt-consent-notice {
		position: relative;
		z-index: 100;
	}

	.klt-consent-notice__bar {
		position: fixed;
		z-index: 100;
		inset: auto 0 0;
		display: flex;
		gap: var(--klt-space-m);
		align-items: center;
		justify-content: space-between;
		max-block-size: min(80vh, 42rem);
		padding-block: var(--klt-space-m);
		overflow: auto;
		background: Canvas;
		color: CanvasText;
		transition:
			opacity var(--klt-duration-interactive) ease,
			transform var(--klt-duration-interactive) ease;
	}

	.klt-consent-notice[data-klt-consent-initial="settled"] .klt-consent-notice__bar {
		display: none;
	}

	.klt-consent-notice__bar.is-leaving {
		opacity: 0;
		transform: translateY(0.5rem);
	}

	.klt-consent-notice__copy {
		max-inline-size: 52rem;
	}

	.klt-consent-notice__title,
	.klt-consent-notice__message {
		margin-block: 0;
	}

	.klt-consent-notice__message {
		white-space: pre-line;
	}

	.klt-consent-notice__actions {
		display: flex;
		flex-wrap: wrap;
		gap: var(--klt-space-s);
		align-items: center;
	}

	.klt-consent-notice__bar > .klt-consent-notice__actions {
		flex-shrink: 0;
		flex-wrap: nowrap;
	}

	.klt-consent-notice__dialog {
		--klt-popup-width: 52rem;
	}

	.klt-consent-notice__form-surface {
		position: relative;
		max-height: 100%;
		overflow: auto;
	}

	.klt-consent-notice__form-surface .klt-fullscreen-popup__close {
		position: absolute;
		top: var(--klt-space-s);
		right: var(--klt-space-s);
	}

	.klt-consent-notice__form-surface .klt-fullscreen-popup__content {
		padding-block-start: var(--klt-space-l);
	}

	@media (max-width: 40rem) {
		.klt-consent-notice__dialog {
			--klt-popup-width: 100%;
			max-inline-size: min(100vw, var(--klt-popup-width));
		}
	}

	@media (min-width: 46rem) {
		.klt-consent-notice__categories {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	}

	.klt-consent-notice__form,
	.klt-consent-notice__categories {
		display: grid;
		gap: var(--klt-space-m);
	}

	.klt-consent-notice__dialog-header {
		display: flex;
		gap: var(--klt-space-m);
		align-items: start;
		justify-content: space-between;
	}

	.klt-consent-notice__dialog-header h2,
	.klt-consent-notice__form p {
		margin: 0;
	}

	.klt-consent-notice__categories {
		min-inline-size: 0;
		padding: 0;
		border: 0;
	}

	.klt-consent-notice__category {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		gap: var(--klt-space-s);
		align-items: start;
	}

	.klt-consent-notice__category small {
		display: block;
	}

	.klt-consent-notice__reopen,
	.klt-consent-link {
		display: inline-flex;
		gap: 0.5rem;
		align-items: center;
		opacity: 0;
		transform: translateY(0.25rem);
		transition:
			opacity var(--klt-duration-interactive) ease,
			transform var(--klt-duration-interactive) ease;
	}

	.klt-consent-control__icon {
		display: inline-flex;
		flex: 0 0 auto;
		inline-size: 1.125rem;
		block-size: 1.125rem;
	}

	.klt-consent-control__icon .klt-icon {
		display: block;
		inline-size: 100%;
		block-size: 100%;
	}

	.klt-consent-control--icon {
		justify-content: center;
		inline-size: 2.75rem;
		padding-inline: 0;
	}

	.klt-consent-notice__reopen {
		position: fixed;
		z-index: 99;
		inset: auto var(--klt-space-s) var(--klt-space-s) auto;
	}

	.klt-consent-notice__reopen.is-visible,
	.klt-consent-link.is-visible {
		opacity: 1;
		transform: none;
	}

	.klt-consent-notice__bar[hidden],
	.klt-consent-notice__reopen[hidden],
	.klt-consent-link[hidden] {
		display: none;
	}

	@media (max-width: 64rem) {
		.klt-consent-notice__bar,
		.klt-consent-notice__actions {
			align-items: stretch;
			flex-direction: column;
		}

		.klt-consent-notice__actions > * {
			inline-size: 100%;
		}

		.klt-consent-notice__bar > .klt-consent-notice__actions {
			flex-wrap: wrap;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.klt-consent-notice__bar,
		.klt-consent-notice__reopen,
		.klt-consent-link {
			transition-duration: 0s;
		}
	}
}
