/* DMOG Gift Cards: giftcard-form.css (UI owner: CC). */
#giftvoucher-template .dmog-currency-field .dmog-currency-label {
	display: block;
	margin: 0 0 8px;
	font-size: 14px;
	font-weight: 400;
	opacity: .75;
}

#giftvoucher-template .dmog-currency-field .dmog-segmented {
	display: inline-flex;
	max-width: 100%;
	padding: 3px;
	border: 1px solid var(--wpgv-accent, #999);
	border-radius: 999px;
}

#giftvoucher-template .dmog-currency-field .dmog-segmented input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

#giftvoucher-template .dmog-currency-field .dmog-segmented label {
	margin: 0;
	padding: 8px 20px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	border-radius: 999px;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
	transition: background-color .15s, color .15s;
}

#giftvoucher-template .dmog-currency-field .dmog-segmented input:checked + label {
	background: var(--wpgv-accent, #333);
	color: #fff;
}

#giftvoucher-template .dmog-currency-field .dmog-segmented input:focus-visible + label {
	outline: 2px solid var(--wpgv-accent, #333);
	outline-offset: 2px;
}

/* The symbol "A$" is wider than "£". Make room for it in the amount field. */
#giftvoucher-template .price-template-voucher .currencySymbol {
	font-size: 16px;
	line-height: 1;
	top: 50%;
	transform: translateY(-50%);
}

#giftvoucher-template .price-template-voucher #voucher_price_value {
	padding-left: 46px !important;
}

#giftvoucher-template .dmog-tz-note {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.4;
	opacity: .75;
}

#giftvoucher-template .dmog-msg-count {
	margin: 4px 0 0;
	font-size: 12px;
	text-align: right;
	opacity: .65;
}

#giftvoucher-template .item-voucher-template {
	position: relative;
}

#giftvoucher-template .wrap-format-category-voucher .dmog-currency-field {
	margin: 0;
}

@media (max-width: 568px) {
	#giftvoucher-template .wrap-format-category-voucher .dmog-currency-field {
		width: 100%;
		margin: 0;
	}

	#giftvoucher-template .dmog-currency-field .dmog-currency-label {
		margin-bottom: 15px;
		font-size: 12px;
		line-height: 14px;
		font-weight: 500;
		opacity: .67;
	}

	#giftvoucher-template .dmog-currency-field .dmog-segmented {
		display: flex;
		gap: 10px;
		padding: 0;
		border: 0;
	}

	#giftvoucher-template .dmog-currency-field .dmog-segmented label {
		flex: 1;
		min-height: 46px;
		justify-content: center;
		padding-inline: 8px;
		border: 1px solid var(--wpgv-border);
		border-radius: var(--wpgv-radius-sm);
		background: var(--wpgv-surface);
	}

	#giftvoucher-template .dmog-currency-field .dmog-segmented input:checked + label {
		border-color: var(--wpgv-accent);
		color: var(--wpgv-accent-contrast);
		box-shadow: var(--wpgv-ring);
	}

	#giftvoucher-template .dmog-currency-field .dmog-segmented input:focus-visible + label {
		outline-color: var(--wpgv-panel-ink);
	}
}

/* Example text on a template thumbnail. Sizes scale with the thumbnail width. */
#giftvoucher-template .dmog-sample {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	container-type: inline-size;
	font-family: Poppins, sans-serif;
	line-height: 1.15;
	pointer-events: none;
	--dmog-main: #11292e;
	--dmog-label: #7a7d7e;
	--dmog-kicker: #b58686;
	--dmog-msg: #424242;
}

#giftvoucher-template .dmog-sample[data-tone="man"] {
	--dmog-main: #f4efe9;
	--dmog-label: #9fb1b3;
	--dmog-kicker: #dbc2c2;
	--dmog-msg: #d9dfdf;
}

#giftvoucher-template .dmog-sample span {
	position: absolute;
	overflow: hidden;
	white-space: nowrap;
	color: var(--dmog-main);
}

#giftvoucher-template .dmog-s-brand { left: 56%; top: 9.9%; width: 38.8%; font-size: 1.9cqw; font-weight: 600; }
#giftvoucher-template .dmog-s-kicker { left: 49.2%; top: 19.8%; font-size: 1.8cqw; color: var(--dmog-kicker); }
#giftvoucher-template .dmog-s-value { left: 49.2%; top: 24.5%; width: 45.6%; font-size: 8cqw; }
#giftvoucher-template .dmog-s-label { font-size: 1.5cqw; color: var(--dmog-label); }
#giftvoucher-template .dmog-s-to-l { left: 49.2%; top: 41.4%; }
#giftvoucher-template .dmog-s-from-l { left: 49.2%; top: 46.6%; }
#giftvoucher-template .dmog-s-name { left: 57.2%; width: 37.6%; font-size: 2.1cqw; }
#giftvoucher-template .dmog-s-to { top: 40.8%; }
#giftvoucher-template .dmog-s-from { top: 46%; }
#giftvoucher-template .dmog-s-msg { left: 49.2%; top: 53.6%; width: 45.6%; font-size: 1.8cqw; white-space: normal; color: var(--dmog-msg); }
#giftvoucher-template .dmog-s-code-l { left: 49.2%; top: 84.6%; font-size: 1.4cqw; }
#giftvoucher-template .dmog-s-strong { left: 57.2%; width: 22%; font-size: 1.7cqw; font-weight: 600; }
#giftvoucher-template .dmog-s-code { top: 84.3%; }

#giftvoucher-template .dmog-s-qr {
	left: 79.8%;
	top: 66.5%;
	width: 15%;
	height: 21.9%;
	border: 1px solid var(--dmog-label);
	border-radius: 2px;
	opacity: .7;
	background: repeating-conic-gradient(var(--dmog-main) 0 25%, transparent 0 50%) 0 0 / 14% 14%;
}

/* Hide the template Format and Category pickers: the store has one format and one category.
   Keep the wrapper itself, because the currency control is appended inside it. */
#giftvoucher-template .wrap-format-category-voucher > .format-category-voucher-template,
#giftvoucher-template .wrap-format-category-voucher > .voucher-category-selection-wrap {
	display: none !important;
}
