/* Fenêtres de confirmation aux couleurs du site (site + administration). */
.zd-dlg {
	--dlg-fond: #1b1724;
	--dlg-ligne: #2a2436;
	--dlg-ink: #f4efe6;
	--dlg-muted: #a39caf;
	--dlg-accent: #ff2e93;
	--dlg-accent-h: #ff5aa9;
	--dlg-on: #100d16;
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	display: grid;
	place-items: center;
	padding: 16px;
	background: rgba(8, 6, 12, .62);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	transition: opacity .18s ease;
	font-family: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
}
.zd-dlg.is-danger { --dlg-accent: #ff5a4e; --dlg-accent-h: #ff7b70; }
.zd-dlg.is-ouvert { opacity: 1; }
.zd-dlg__carte {
	position: relative;
	width: min(420px, 100%);
	box-sizing: border-box;
	padding: 28px 24px 20px;
	border-radius: 20px;
	background:
		radial-gradient(120% 70% at 50% -10%, color-mix(in srgb, var(--dlg-accent) 16%, transparent), transparent 60%),
		var(--dlg-fond);
	border: 1px solid var(--dlg-ligne);
	box-shadow: 0 24px 60px rgba(0, 0, 0, .6), 0 0 0 1px rgba(255, 255, 255, .02) inset;
	color: var(--dlg-ink);
	text-align: center;
	transform: translateY(10px) scale(.97);
	transition: transform .2s cubic-bezier(.2, .9, .3, 1.2);
}
.zd-dlg.is-ouvert .zd-dlg__carte { transform: none; }
.zd-dlg__ico {
	display: inline-grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin-bottom: 14px;
	border-radius: 50%;
	color: var(--dlg-accent);
	background: color-mix(in srgb, var(--dlg-accent) 14%, transparent);
	box-shadow: 0 0 0 6px color-mix(in srgb, var(--dlg-accent) 6%, transparent);
}
.zd-dlg__ico svg { width: 26px; height: 26px; }
.zd-dlg__titre {
	margin: 0 0 8px;
	padding: 0;
	font-family: "Bricolage Grotesque", "Instrument Sans", system-ui, sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.01em;
	color: var(--dlg-ink);
}
.zd-dlg__texte {
	margin: 0 auto;
	max-width: 34ch;
	font-size: 15px;
	line-height: 1.5;
	color: var(--dlg-muted);
	white-space: pre-line;
}
.zd-dlg__actions {
	display: flex;
	gap: 10px;
	margin-top: 22px;
}
.zd-dlg__btn {
	flex: 1;
	min-height: 46px;
	padding: 0 18px;
	border-radius: 999px;
	border: 1px solid transparent;
	font: inherit;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background-color .15s, border-color .15s, color .15s, transform .1s;
}
.zd-dlg__btn:active { transform: scale(.98); }
.zd-dlg__btn:focus-visible { outline: 2px solid var(--dlg-accent); outline-offset: 3px; }
.zd-dlg__btn--oui { background: var(--dlg-accent); color: var(--dlg-on); }
.zd-dlg__btn--oui:hover { background: var(--dlg-accent-h); }
.zd-dlg__btn--non { background: transparent; color: var(--dlg-ink); border-color: #4a4258; }
.zd-dlg__btn--non:hover { border-color: #6e6580; background: rgba(255, 255, 255, .04); }
html.zd-dlg-actif { overflow: hidden; }

@media (max-width: 480px) {
	.zd-dlg { align-items: end; padding: 12px; }
	.zd-dlg__carte { border-radius: 20px; padding-bottom: 16px; }
	.zd-dlg__actions { flex-direction: column-reverse; }
}
@media (prefers-reduced-motion: reduce) {
	.zd-dlg, .zd-dlg__carte { transition: none; }
}
