/*
 * Manage My Giving visual foundation. Every rule below is scoped under
 * body.hcfb-manage-giving-experience (added in functions.php only when
 * templates/template-manage-giving.html is the active page template —
 * see hcfb_is_manage_giving_template() there), so nothing here can
 * affect any other template. Enqueued only on that same template, after
 * hcfb-public-shell (functions.php dependency array).
 *
 * Unlike hcfb-partner-experience / hcfb-about-impact-experience, this
 * page does not go full-bleed — it's a single utility card, not a
 * marketing/editorial layout, so it stays inside the shared shell's
 * normal centered content width.
 *
 * Color usage follows docs/COLOR_USAGE_RULES.md: navy text on orange
 * (5.70:1) for the primary action, never white on orange. State
 * differences (resolved / gift services / error) are conveyed primarily
 * through the headline/message copy itself, not through color alone —
 * color here is a secondary reinforcement (a left border accent), never
 * the only signal.
 */

body.hcfb-manage-giving-experience .hcfb-manage-giving,
body.hcfb-manage-giving-experience .hcfb-manage-giving * {
	box-sizing: border-box;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving {
	max-width: 32rem;
	margin: 0 auto;
	padding: var(--wp--preset--spacing--hcfb-lg) 0;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__card {
	background: var(--wp--preset--color--hcfb-surface);
	border: 1px solid var(--wp--preset--color--hcfb-border);
	border-radius: 16px;
	padding: var(--wp--preset--spacing--hcfb-lg);
	box-shadow: 0 12px 28px rgba(10, 12, 40, 0.08);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__title {
	margin-top: 0;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__intro {
	color: var(--wp--preset--color--hcfb-text-muted);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__form {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--hcfb-xs);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__label {
	font-weight: 700;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__input {
	font: inherit;
	padding: 0.75rem 1rem;
	border: 1px solid var(--wp--preset--color--hcfb-border);
	border-radius: 8px;
	background: var(--wp--preset--color--hcfb-surface);
	color: var(--wp--preset--color--hcfb-text);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__input:focus-visible,
body.hcfb-manage-giving-experience .hcfb-manage-giving__secondary-action:focus-visible,
body.hcfb-manage-giving-experience .hcfb-manage-giving__result:focus-visible {
	outline: 3px solid var(--wp--preset--color--hcfb-navy);
	outline-offset: 3px;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__button,
body.hcfb-manage-giving-experience .hcfb-manage-giving__action {
	font: inherit;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	border: none;
	border-radius: 999px;
	padding: 0.75rem 1.5rem;
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
	background: var(--wp--preset--color--hcfb-orange);
	color: var(--wp--preset--color--hcfb-navy);
	margin-top: var(--wp--preset--spacing--hcfb-xs);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__button:hover,
body.hcfb-manage-giving-experience .hcfb-manage-giving__button:focus-visible,
body.hcfb-manage-giving-experience .hcfb-manage-giving__action:hover,
body.hcfb-manage-giving-experience .hcfb-manage-giving__action:focus-visible {
	background: var(--wp--preset--color--hcfb-navy);
	color: var(--wp--preset--color--hcfb-surface);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__button:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__secondary-action {
	background: none;
	border: none;
	font: inherit;
	color: var(--wp--preset--color--hcfb-navy);
	text-decoration: underline;
	cursor: pointer;
	padding: 0.5rem 0;
	align-self: flex-start;
}

/* Email-entry state (default): only the request-link form is visible. */
body.hcfb-manage-giving-experience .hcfb-manage-giving__form[hidden],
body.hcfb-manage-giving-experience .hcfb-manage-giving__alert[hidden],
body.hcfb-manage-giving-experience .hcfb-manage-giving__verifying[hidden],
body.hcfb-manage-giving-experience .hcfb-manage-giving__result[hidden] {
	display: none;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__confirm[hidden] {
	display: none;
}

/* Check-your-email confirmation / verifying — share the same alert box. */
body.hcfb-manage-giving-experience .hcfb-manage-giving__alert,
body.hcfb-manage-giving-experience .hcfb-manage-giving__verifying {
	border-left: 4px solid var(--wp--preset--color--hcfb-navy);
	background: var(--wp--preset--color--hcfb-cream);
	padding: 1rem 1.25rem;
	border-radius: 4px;
	margin: 0 0 var(--wp--preset--spacing--hcfb-sm) 0;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__alert[data-type="error"] {
	border-left-color: var(--wp--preset--color--hcfb-orange);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__alert p,
body.hcfb-manage-giving-experience .hcfb-manage-giving__verifying p {
	margin: 0;
}

/* Resolved / gift-services / error result states share one container;
   the left-border accent is a secondary reinforcement only — the
   headline copy itself always states the outcome in words. */
body.hcfb-manage-giving-experience .hcfb-manage-giving__result {
	border-left: 4px solid var(--wp--preset--color--hcfb-green);
	padding-left: 1.25rem;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__result[data-mg-status="gift_services"],
body.hcfb-manage-giving-experience .hcfb-manage-giving__result[data-mg-status="lookup_error"],
body.hcfb-manage-giving-experience .hcfb-manage-giving__result[data-mg-status="invalid_link"] {
	border-left-color: var(--wp--preset--color--hcfb-orange);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__result-title {
	margin-top: 0;
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: var(--wp--preset--spacing--hcfb-xs);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__support {
	color: var(--wp--preset--color--hcfb-text-muted);
	font-size: var(--wp--preset--font-size--small);
	margin-top: var(--wp--preset--spacing--hcfb-sm);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__unavailable {
	color: var(--wp--preset--color--hcfb-text-muted);
}

body.hcfb-manage-giving-experience .hcfb-manage-giving__confirm,
body.hcfb-manage-giving-experience .hcfb-manage-giving__no-js,
body.hcfb-manage-giving-experience .hcfb-manage-giving__unavailable {
	border-left: 4px solid var(--wp--preset--color--hcfb-orange);
	padding: 1rem 1.25rem;
	overflow-wrap: anywhere;
}

@media (max-width: 40rem) {
	body.hcfb-manage-giving-experience .hcfb-manage-giving {
		padding-inline: 1rem;
	}
	body.hcfb-manage-giving-experience .hcfb-manage-giving__card {
		padding: 1.25rem;
	}
	body.hcfb-manage-giving-experience .hcfb-manage-giving__button,
	body.hcfb-manage-giving-experience .hcfb-manage-giving__action {
		width: 100%;
		min-height: 44px;
	}
}

@media (forced-colors: active) {
	body.hcfb-manage-giving-experience .hcfb-manage-giving__card,
	body.hcfb-manage-giving-experience .hcfb-manage-giving__alert,
	body.hcfb-manage-giving-experience .hcfb-manage-giving__verifying,
	body.hcfb-manage-giving-experience .hcfb-manage-giving__result,
	body.hcfb-manage-giving-experience .hcfb-manage-giving__confirm {
		border: 1px solid CanvasText;
	}
	body.hcfb-manage-giving-experience .hcfb-manage-giving__button,
	body.hcfb-manage-giving-experience .hcfb-manage-giving__action {
		border: 2px solid ButtonText;
		forced-color-adjust: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.hcfb-manage-giving-experience .hcfb-manage-giving *,
	body.hcfb-manage-giving-experience .hcfb-manage-giving *::before,
	body.hcfb-manage-giving-experience .hcfb-manage-giving *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}
