/* HFD Copy Contact - centred confirmation modal.
 *
 * z-index: the age gate sits at 999999 and Elementor popups climb high too, so
 * the modal is appended to <body> (no ancestor stacking context can trap it)
 * and uses a value above anything on this site.
 */
.hfd-copy-modal {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	box-sizing: border-box;
	opacity: 0;
	transition: opacity .18s ease;
}

.hfd-copy-modal.is-open { opacity: 1; }
.hfd-copy-modal[hidden] { display: none !important; }

.hfd-copy-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
}

/* The live theme imposes `text-transform: capitalize` on some containers -
 * the same trap that turned "To Be Announced" into title case in the restock
 * plugin (CLAUDE.md 8a). On an e-mail address it is actively wrong: it renders
 * "Sales@Higherfiredirect.Cc". Normal casing is forced on every text node in
 * the panel. This does NOT reproduce on staging - keep the rule. */
.hfd-copy-modal,
.hfd-copy-modal * {
	text-transform: none !important;
	letter-spacing: normal;
}

.hfd-copy-modal__panel {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: 360px;
	padding: 26px 22px 22px;
	border-radius: 14px;
	background: #fff;
	color: #2A0035;
	text-align: center;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
	transform: translateY(8px) scale(.98);
	transition: transform .18s ease;
}

.hfd-copy-modal.is-open .hfd-copy-modal__panel { transform: none; }

.hfd-copy-modal__check {
	color: #2e7d32;
	line-height: 0;
	margin-bottom: 10px;
}

.hfd-copy-modal__panel.is-error .hfd-copy-modal__check { color: #b3261e; }

.hfd-copy-modal__title {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: inherit;
}

/* The address or number itself - the thing the customer needs to read.
 * `anywhere` so a long address cannot widen the panel past a 320px screen. */
.hfd-copy-modal__value {
	margin: 10px 0 0;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.35;
	word-break: break-word;
	overflow-wrap: anywhere;
	color: inherit;
}

.hfd-copy-modal__hint {
	margin: 10px 0 0;
	font-size: 13px;
	line-height: 1.4;
	opacity: .75;
	color: inherit;
}

.hfd-copy-modal .hfd-copy-modal__panel .hfd-copy-modal__ok {
	appearance: none;
	-webkit-appearance: none;
	background-image: none;
	box-shadow: none;
	text-decoration: none;
	margin-top: 18px;
	padding: 11px 34px;
	min-width: 120px;
	min-height: 44px;            /* a real touch target */
	border: 0;
	border-radius: 8px;
	background: #2A0035;
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
}

.hfd-copy-modal .hfd-copy-modal__panel .hfd-copy-modal__ok:hover { opacity: .92; background: #2A0035; }

.hfd-copy-modal .hfd-copy-modal__panel .hfd-copy-modal__ok:focus-visible {
	outline: 3px solid #7647A9;
	outline-offset: 2px;
}

@media ( max-width: 360px ) {
	.hfd-copy-modal { padding: 12px; }
	.hfd-copy-modal__panel { padding: 22px 16px 18px; border-radius: 12px; }
	.hfd-copy-modal__title { font-size: 16px; }
	.hfd-copy-modal__value { font-size: 17px; }
	.hfd-copy-modal .hfd-copy-modal__panel .hfd-copy-modal__ok { width: 100%; padding: 11px 16px; }
}

@media ( prefers-reduced-motion: reduce ) {
	.hfd-copy-modal,
	.hfd-copy-modal__panel {
		transition: none;
	}
	.hfd-copy-modal__panel { transform: none; }
}

a.hfd-copy-email { cursor: pointer; }
