/* Club alerts: invitation card and [vmc_alerts] panel. Colours come from the --vmc-* variables. */
@keyframes vmc-push-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.vmc-push {
	position: fixed;
	z-index: 100000;
	right: 16px;
	bottom: 16px;
	width: min(380px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	overflow: auto;
	box-sizing: border-box;
	padding: 20px 22px 18px;
	background: var(--vmc-paper, #fff);
	color: var(--vmc-heading, #111);
	border: 2px solid var(--vmc-heading, #111);
	border-radius: var(--vmc-radius, 0);
	box-shadow: 8px 8px 0 var(--vmc-highlight, #ff5a1f);
	font-size: .95rem;
	line-height: 1.5;
	animation: vmc-push-in .3s cubic-bezier(.2, .7, .2, 1) both;
}
.vmc-push.is-leaving { opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease; }
@media (prefers-reduced-motion: reduce) { .vmc-push { animation: none; } .vmc-push.is-leaving { transition: none; } }
.vmc-push__head { display: flex; align-items: center; gap: 12px; margin: 0 30px .6em 0; }
.vmc-push__icon { width: 44px; height: 44px; flex: none; }
.vmc-push__title { margin: 0 !important; font-size: 1.2rem !important; line-height: 1.2 !important; font-weight: 800 !important; letter-spacing: -.01em; color: inherit !important; }
.vmc-push__text { margin: 0 0 .4em; }
.vmc-push__steps { margin: .5em 0 .2em; padding-left: 1.3em; }
.vmc-push__steps li { margin: 0 0 .4em; }
.vmc-push__status { margin: .6em 0 0; font-size: .88rem; color: var(--vmc-muted, #5c5c5c); }
.vmc-push__status:empty, .vmc-push__actions:empty { display: none; }
.vmc-push__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.vmc-push__btn {
	flex: 1 1 120px;
	min-height: 46px;
	padding: .6em 1.2em;
	border: 2px solid var(--vmc-heading, #111);
	border-radius: var(--vmc-radius, 0);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}
.vmc-push__btn--yes { background: var(--vmc-heading, #111) !important; color: var(--vmc-paper, #fff) !important; }
.vmc-push__btn--no, .vmc-push__x { background: transparent; color: var(--vmc-heading, #111); }
.vmc-push__btn[disabled] { opacity: .6; cursor: progress; }
.vmc-push__x { position: absolute; top: 8px; right: 8px; width: 40px; height: 40px; padding: 0; border: 0; font-size: 1.6rem; line-height: 1; cursor: pointer; }
.vmc-push__x:hover { background: var(--vmc-surface, #f4f4f4); }
@media (max-width: 689.98px) { .vmc-push { left: 12px; right: 12px; bottom: 12px; width: auto; } }

.vmc-alerts {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: clamp(24px, 4vw, 56px);
	padding: clamp(24px, 4vw, 40px);
	border: 2px solid var(--vmc-heading, #111);
	border-radius: var(--vmc-radius, 0);
	background: var(--vmc-paper, #fff);
	color: var(--vmc-heading, #111);
}
.vmc-alerts__intro { display: flex; gap: 18px; align-items: flex-start; }
.vmc-alerts__icon { flex: none; display: grid; place-items: center; width: 56px; height: 56px; background: var(--vmc-highlight, #ff5a1f); color: #111; }
.vmc-alerts__kicker { margin: 0 0 .35em; font-family: var(--vmc-mono, ui-monospace, monospace); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.vmc-alerts__title { margin: 0 0 .5em; font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.05; letter-spacing: -.03em; }
.vmc-alerts__lead { margin: 0; color: var(--vmc-muted, #5c5c5c); }
.vmc-alerts__panel { min-height: 6em; }
.vmc-alerts__status { display: flex; gap: .6em; align-items: baseline; margin: 0 0 1em; font-weight: 700; }
.vmc-alerts__dot { flex: none; width: .7em; height: .7em; border-radius: 50%; background: #9a9a9a; }
.vmc-alerts__status--on .vmc-alerts__dot { background: #1f7a45; box-shadow: 0 0 0 4px rgba(31, 122, 69, .18); }
.vmc-alerts__status--blocked .vmc-alerts__dot { background: #b3261e; box-shadow: 0 0 0 4px rgba(179, 38, 30, .16); }
.vmc-alerts__actions { margin: 0 0 1.4em; }
.vmc-alerts__how { margin: 0 0 .7em; font-size: .95rem; text-transform: uppercase; letter-spacing: .04em; }
.vmc-alerts__how span { font-family: var(--vmc-mono, ui-monospace, monospace); font-weight: 400; text-transform: none; color: var(--vmc-muted, #5c5c5c); }
.vmc-alerts__steps { margin: 0 0 1.2em; padding: 0; list-style: none; counter-reset: vmc-step; }
.vmc-alerts__steps li { position: relative; margin: 0 0 .7em; padding-left: 2.4em; counter-increment: vmc-step; }
.vmc-alerts__steps li::before { content: counter(vmc-step); position: absolute; left: 0; top: .05em; display: grid; place-items: center; width: 1.6em; height: 1.6em; background: var(--vmc-heading, #111); color: var(--vmc-paper, #fff); font-size: .85em; font-weight: 700; }
.vmc-alerts__tips { margin: 0 0 1em; padding: .9em 1.1em; background: var(--vmc-surface, #f4f4f4); font-size: .93em; }
.vmc-alerts__tips p { margin: 0 0 .3em; }
.vmc-alerts__tips ul { margin: 0; padding-left: 1.1em; }
.vmc-alerts__note, .vmc-alerts__privacy { margin: 0; color: var(--vmc-muted, #5c5c5c); }
.vmc-alerts__privacy { grid-column: 1 / -1; padding-top: 1em; border-top: 1px solid var(--vmc-border, #e3e3e3); font-size: .85rem; }
@media (max-width: 899.98px) { .vmc-alerts { grid-template-columns: 1fr; } }
@media (max-width: 499.98px) { .vmc-alerts__intro { flex-direction: column; gap: 14px; } }
