/**
 * Alerts + WhatsApp subject grid (T20.4).
 */

.po-alerts {
	min-width: 0;
}

.po-alerts__intro,
.po-alerts__manage,
.po-alerts__newsletter,
.po-alerts--pdp {
	min-width: 0;
}

.po-alerts__intro {
	display: grid;
	gap: 0.75rem;
	margin-block-end: var(--po-space-inset, 2.5rem);
}

.po-alerts__chip {
	margin: 0;
	color: var(--po-color-cyan);
	font-size: 0.75rem;
	font-weight: var(--po-font-weight-ui-extrabold, 800);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.po-alerts__title {
	margin: 0;
	max-width: min(18ch, 100%);
	color: var(--po-color-text);
	font-family: var(--po-font-display);
	font-size: clamp(2rem, 6vw, 3.5rem);
	font-weight: var(--po-font-weight-display);
	letter-spacing: -0.05em;
	line-height: 1.05;
	text-transform: uppercase;
	overflow-wrap: anywhere;
}

.po-alerts__lead,
.po-alerts__hint,
.po-alerts__purpose,
.po-alerts__legal,
.po-alerts__item-meta {
	margin: 0;
	color: var(--po-color-muted);
	overflow-wrap: anywhere;
}

.po-alerts__provider,
.po-alerts__flash,
.po-alerts__status {
	margin: 0;
	padding: 0.85rem 1rem;
	border: 1px solid var(--po-color-border);
	background: var(--po-color-surface);
	overflow-wrap: anywhere;
}

.po-alerts__flash,
.po-alerts__status.is-success {
	border-color: var(--po-color-success);
	color: var(--po-color-success);
}

.po-alerts__status.is-error {
	border-color: var(--po-color-error);
	color: var(--po-color-error);
}

.po-alerts__form,
.po-alerts__manage,
.po-alerts__newsletter {
	display: grid;
	gap: 1.15rem;
	max-width: 40rem;
	min-width: 0;
}

.po-alerts__form-title,
.po-alerts__section-title,
.po-support-topics__title {
	margin: 0;
	font-family: var(--po-font-display);
	font-size: 1.35rem;
	letter-spacing: -0.03em;
	line-height: 1.2;
}

.po-alerts__types,
.po-alerts__channel {
	display: grid;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.po-alerts__legend {
	padding: 0;
	margin: 0 0 0.35rem;
	color: var(--po-color-text);
	font-weight: var(--po-font-weight-ui-extrabold, 800);
}

.po-alerts__check,
.po-alerts__radio {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.65rem;
	align-items: start;
	margin: 0;
}

.po-alerts__check input,
.po-alerts__radio input {
	margin-block-start: 0.2rem;
	width: 1.15rem;
	height: 1.15rem;
	accent-color: var(--po-color-cyan);
}

.po-alerts__check span {
	display: grid;
	gap: 0.2rem;
}

.po-alerts__check em {
	font-style: normal;
	color: var(--po-color-cyan);
	font-size: 0.8rem;
}

.po-alerts__field {
	display: grid;
	gap: 0.35rem;
	margin: 0;
	min-width: 0;
}

.po-alerts__field input {
	min-height: 2.75rem;
	max-width: 100%;
	font-size: 1rem;
}

.po-alerts__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.po-alerts__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.po-alerts__list {
	display: grid;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.po-alerts__item {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.75rem;
	align-items: center;
	padding: 0.9rem 1rem;
	border: 1px solid var(--po-color-border);
	background: var(--po-color-surface);
	min-width: 0;
}

.po-alerts__item.is-inactive {
	opacity: 0.72;
}

.po-alerts__item-copy {
	display: grid;
	gap: 0.2rem;
	min-width: 0;
}

.po-alerts__item-type,
.po-alerts__item-product {
	margin: 0;
	overflow-wrap: anywhere;
}

.po-alerts--pdp {
	margin-block: 1rem 0;
	padding: 1rem;
	border: 1px solid var(--po-color-border);
	background: color-mix(in srgb, var(--po-color-surface) 88%, transparent);
}

.po-alerts--pdp[hidden] {
	display: none;
}

.po-alerts__manage-link {
	margin: 0.25rem 0 0;
}

.po-product__notify {
	cursor: pointer;
	opacity: 1;
}

.po-product__notify[aria-expanded="true"] {
	color: var(--po-color-cyan);
}

.po-support-topics {
	display: grid;
	gap: 0.85rem;
	margin-block: 2rem 0;
	min-width: 0;
}

.po-support-topics__lead {
	margin: 0;
	max-width: 40rem;
	color: var(--po-color-muted);
}

.po-support-topics__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.po-support-topics__card {
	display: grid;
	gap: 0.35rem;
	min-height: 6.5rem;
	padding: 1rem 1.1rem;
	border: 1px solid var(--po-color-border);
	background: var(--po-color-surface);
	color: inherit;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.po-support-topics__card:hover,
.po-support-topics__card:focus-visible {
	border-color: var(--po-color-cyan);
	color: var(--po-color-text);
}

.po-support-topics__index {
	color: var(--po-color-cyan);
	font-size: 0.75rem;
	font-weight: var(--po-font-weight-ui-extrabold, 800);
	letter-spacing: 0.08em;
}

.po-support-topics__label {
	font-weight: 700;
}

.po-support-topics__hint {
	color: var(--po-color-muted);
	font-size: 0.85rem;
}

.po-support-topics--pdp,
.po-support-topics--order {
	margin-block-start: 1.25rem;
}

@media (max-width: 640px) {
	.po-alerts__item {
		grid-template-columns: 1fr;
	}

	.po-alerts__title {
		font-size: clamp(1.75rem, 12vw, 2.2rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.po-alerts,
	.po-support-topics {
		scroll-margin: 0;
	}
}
