/*
 * Buy form and gift-certificate product pages. Type is Poppins.
 *
 * Only the purchase button is green. The green is the child theme's
 * button hover #46bd4c, darkened so white text meets WCAG AA:
 *   --dehner-buy-button       #2c7c30   5.21:1 on white
 *   --dehner-buy-button-hover #1b5420   8.99:1 on white
 * Dropdowns, value pills, and inputs are white with dark text and a
 * light gray border. A selected pill uses a dark outline.
 */

#top #main .dehner-buy,
.dehner-buy {
	--dehner-buy-button: #2c7c30;
	--dehner-buy-button-hover: #1b5420;
	--dehner-buy-button-text: #ffffff;
	--dehner-buy-focus: #1b5420;
	max-width: 640px;
	margin: 0 auto 20px;
	font-family: "Poppins", sans-serif;
	position: relative;
}

.dehner-buy fieldset {
	border: none;
	margin: 0;
	padding: 0;
}

.dehner-buy legend {
	color: #5f4436;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.2;
	padding: 0;
	margin: 0 0 12px;
}

.dehner-buy-blurb,
.dehner-buy-note,
.dehner-buy-amount {
	margin: 0 0 15px;
	color: #333;
	font-size: 15px;
}

.dehner-buy-amount {
	font-weight: 600;
	color: #5f4436;
}

.dehner-buy-field {
	margin: 0 0 15px;
}

.dehner-buy label {
	display: block;
	color: #5f4436;
	font-size: 17px;
	font-weight: 500;
	margin: 0 0 7px;
}

.dehner-buy-hint {
	font-size: 13px;
	font-weight: 400;
}

.dehner-buy input[type="text"],
.dehner-buy input[type="email"],
.dehner-buy input[type="date"],
.dehner-buy textarea,
.dehner-buy select {
	width: 100%;
	box-sizing: border-box;
	background: #f5f5f5;
	border: none;
	border-radius: 0;
	color: #333;
	font-family: "Poppins", sans-serif;
	font-size: 15px;
	padding: 15px;
	height: 50px;
	margin: 0;
}

#top #main .dehner-buy select,
.dehner-buy select {
	background: #ffffff;
	color: #1a1a1a;
	border: 1px solid #d5d5d5;
	accent-color: #1a1a1a;
}

#top #main .dehner-buy select:hover,
.dehner-buy select:hover {
	background: #ffffff;
	border-color: #1a1a1a;
	color: #1a1a1a;
}

#top #main .dehner-buy select option,
.dehner-buy select option {
	background: #ffffff;
	color: #333333;
}

.dehner-buy textarea {
	height: auto;
	min-height: 110px;
	resize: vertical;
}

#top #main .dehner-buy .dehner-buy-email-toggle,
.dehner-buy .dehner-buy-email-toggle {
	width: 1.15rem;
	height: 1.15rem;
	margin: 0 8px 12px 0;
	accent-color: #1a1a1a;
	vertical-align: middle;
}

.dehner-buy label.dehner-buy-check-label {
	display: inline;
	vertical-align: middle;
}

.dehner-buy-email-fields {
	margin: 0 0 8px;
	padding-top: 4px;
	border-top: 1px solid #e6e6e6;
}

/* Unchecked stays hidden without JavaScript. The checkbox is an earlier sibling. */
.dehner-buy-form .dehner-buy-email-toggle:not(:checked) ~ .dehner-buy-email-fields {
	display: none !important;
}

#top #main .dehner-buy input:focus,
#top #main .dehner-buy textarea:focus,
#top #main .dehner-buy select:focus,
.dehner-buy input:focus,
.dehner-buy textarea:focus,
.dehner-buy select:focus {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

#top #main .dehner-buy button:focus,
.dehner-buy button:focus {
	outline: 2px solid var(--dehner-buy-focus);
	outline-offset: 2px;
}

.dehner-buy-submit {
	margin-top: 5px;
}

#top #main .dehner-buy button,
.dehner-buy button {
	background: var(--dehner-buy-button);
	color: var(--dehner-buy-button-text);
	font-family: "Poppins", sans-serif;
	font-size: 17px;
	font-weight: 600;
	text-transform: uppercase;
	line-height: 1;
	border: none;
	border-radius: 5px;
	padding: 17px 35px;
	cursor: pointer;
}

#top #main .dehner-buy button:hover,
#top #main .dehner-buy button:focus,
.dehner-buy button:hover,
.dehner-buy button:focus {
	background: var(--dehner-buy-button-hover);
	color: var(--dehner-buy-button-text);
}

.dehner-buy-error {
	border-top: 2px solid #5f0304;
	border-bottom: 2px solid #5f0304;
	padding: 12px 0;
	margin: 0 0 15px;
	color: #5f0304;
}

.dehner-buy-unavailable {
	color: #5f4436;
	margin: 0 0 15px;
}

.dehner-buy-admin-note {
	font-size: 14px;
	background: #fff8e8;
	padding: 10px 12px;
	border-left: 4px solid #a3642e;
	margin: 0 0 15px;
}

.dehner-buy [hidden] {
	display: none !important;
}

/* Honeypot. Off-screen rather than display:none so it stays in the form tree. */
.dehner-buy-hp {
	position: absolute !important;
	left: -9999px !important;
	height: 0;
	width: 0;
	overflow: hidden;
}

/*
 * Gift-certificate product page. Two columns on desktop, one on mobile.
 * Only .dehner-gc-buy is green. Everything else stays neutral.
 */
.dehner-gc {
	--dehner-buy-button: #2c7c30;
	--dehner-buy-button-hover: #1b5420;
	--dehner-buy-button-text: #ffffff;
	--dehner-buy-focus: #1b5420;
	max-width: 1120px;
	margin: 0 auto 48px;
	font-family: "Poppins", sans-serif;
	color: #1a1a1a;
	position: relative;
}

.dehner-gc-grid {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-areas:
		"gallery"
		"info"
		"story";
	gap: 28px;
	align-items: start;
}

.dehner-gc-gallery {
	grid-area: gallery;
	min-width: 0;
}

.dehner-gc-info {
	grid-area: info;
	min-width: 0;
}

.dehner-gc-stage {
	margin: 0;
}

.dehner-gc-photo {
	display: block;
	width: 100%;
	height: auto;
	background: #f7f7f7;
}

#top #main .dehner-gc button.dehner-gc-zoom,
.dehner-gc button.dehner-gc-zoom {
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	box-shadow: none;
	text-transform: none;
	font-weight: 400;
	line-height: 0;
	cursor: zoom-in;
}

#top #main .dehner-gc button.dehner-gc-zoom:hover,
#top #main .dehner-gc button.dehner-gc-zoom:focus,
.dehner-gc button.dehner-gc-zoom:hover,
.dehner-gc button.dehner-gc-zoom:focus {
	background: transparent;
	color: inherit;
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

#top #main .dehner-gc dialog.dehner-gc-lightbox,
.dehner-gc dialog.dehner-gc-lightbox {
	border: none;
	padding: 16px;
	max-width: min(960px, calc(100vw - 32px));
	width: 100%;
	background: #ffffff;
	color: #1a1a1a;
	border-radius: 4px;
}

#top #main .dehner-gc dialog.dehner-gc-lightbox::backdrop,
.dehner-gc dialog.dehner-gc-lightbox::backdrop {
	background: rgba(0, 0, 0, 0.72);
}

#top #main .dehner-gc button.dehner-gc-lightbox-close,
.dehner-gc button.dehner-gc-lightbox-close {
	display: block;
	margin: 0 0 12px auto;
	padding: 8px 14px;
	background: #ffffff;
	color: #1a1a1a;
	border: 1px solid #d5d5d5;
	border-radius: 999px;
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-transform: none;
	line-height: 1.2;
	cursor: pointer;
	box-shadow: none;
}

#top #main .dehner-gc button.dehner-gc-lightbox-close:hover,
#top #main .dehner-gc button.dehner-gc-lightbox-close:focus,
.dehner-gc button.dehner-gc-lightbox-close:hover,
.dehner-gc button.dehner-gc-lightbox-close:focus {
	background: #f3f3f3;
	color: #1a1a1a;
	border-color: #1a1a1a;
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

.dehner-gc-lightbox-photo {
	display: block;
	width: 100%;
	height: auto;
	background: #f7f7f7;
}

#top #main .dehner-gc .dehner-gc-caption,
#top #main .dehner-gc .dehner-gc-lightbox-caption,
.dehner-gc .dehner-gc-caption,
.dehner-gc .dehner-gc-lightbox-caption {
	display: block;
	margin: 8px 0 0;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
	color: #6b6b6b;
}

#top #main .dehner-gc .dehner-gc-caption[hidden],
#top #main .dehner-gc .dehner-gc-lightbox-caption[hidden],
.dehner-gc .dehner-gc-caption[hidden],
.dehner-gc .dehner-gc-lightbox-caption[hidden] {
	display: none !important;
}

.dehner-gc-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
}

#top #main .dehner-gc button.dehner-gc-thumb,
.dehner-gc button.dehner-gc-thumb {
	width: 76px;
	height: 76px;
	padding: 0;
	margin: 0;
	background: #ffffff;
	color: #1a1a1a;
	border: 1px solid #d5d5d5;
	border-radius: 2px;
	text-transform: none;
	font-weight: 400;
	line-height: 0;
	cursor: pointer;
	overflow: hidden;
}

#top #main .dehner-gc button.dehner-gc-thumb[aria-current="true"],
.dehner-gc button.dehner-gc-thumb[aria-current="true"] {
	border-color: #1a1a1a;
	box-shadow: inset 0 0 0 1px #1a1a1a;
	background: #ffffff;
}

.dehner-gc-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.dehner-gc-title {
	margin: 0 0 8px;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.2;
	color: #1a1a1a;
}

.dehner-gc-price {
	margin: 0 0 8px;
	font-size: 1.35rem;
	font-weight: 500;
}

.dehner-gc-split,
.dehner-gc-hint {
	margin: 0 0 18px;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.45;
	color: #333333;
}

#top #main .dehner-gc .dehner-gc-split strong,
.dehner-gc .dehner-gc-split strong {
	font-weight: 700;
}

.dehner-gc-values {
	border: none;
	margin: 0 0 18px;
	padding: 0;
}

.dehner-gc-values legend {
	padding: 0;
	margin: 0 0 10px;
	font-size: 15px;
	font-weight: 600;
	color: #1a1a1a;
}

.dehner-gc-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.dehner-gc-delivery-pills {
	flex-wrap: nowrap;
}

.dehner-gc-delivery-pills .dehner-gc-pill {
	flex: 1 1 0;
}

.dehner-gc-delivery-pills .dehner-gc-pill span {
	display: block;
	width: 100%;
}

.dehner-gc-pill {
	position: relative;
	margin: 0;
}

.dehner-gc-pill input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
}

.dehner-gc-pill span {
	display: inline-block;
	min-width: 4.5rem;
	padding: 10px 14px;
	border: 1px solid #d5d5d5;
	border-radius: 999px;
	background: #ffffff;
	color: #1a1a1a;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	line-height: 1.2;
	cursor: pointer;
}

.dehner-gc-pill input:checked + span {
	border: 2px solid #1a1a1a;
	background: #f3f3f3;
	padding: 9px 13px;
}

.dehner-gc-pill input:focus + span,
.dehner-gc-pill input:focus-visible + span {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

.dehner-gc-field {
	margin: 0 0 12px;
}

.dehner-gc-field label:not(.dehner-gc-sr) {
	display: block;
	margin: 0 0 6px;
	font-size: 15px;
	font-weight: 600;
	color: #1a1a1a;
}

.dehner-gc-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

#top #main .dehner-gc input[type="text"],
#top #main .dehner-gc input[type="email"],
#top #main .dehner-gc input[type="date"],
#top #main .dehner-gc textarea,
#top #main .dehner-gc select,
.dehner-gc input[type="text"],
.dehner-gc input[type="email"],
.dehner-gc input[type="date"],
.dehner-gc textarea,
.dehner-gc select {
	width: 100%;
	box-sizing: border-box;
	background: #ffffff;
	color: #1a1a1a;
	border: 1px solid #d5d5d5;
	border-radius: 4px;
	font-family: "Poppins", sans-serif;
	font-size: 15px;
	padding: 12px 14px;
	height: 48px;
	margin: 0;
	accent-color: #1a1a1a;
}

#top #main .dehner-gc textarea,
.dehner-gc textarea {
	height: auto;
	min-height: 110px;
	resize: vertical;
}

#top #main .dehner-gc input:not([type="radio"]):focus,
#top #main .dehner-gc textarea:focus,
#top #main .dehner-gc select:focus,
.dehner-gc input:not([type="radio"]):focus,
.dehner-gc textarea:focus,
.dehner-gc select:focus {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

#top #main .dehner-gc label.dehner-gc-keepsake,
.dehner-gc label.dehner-gc-keepsake {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 8px 0 18px;
	font-size: 1em;
	font-weight: 700;
	line-height: 1.3;
	color: #1a1a1a;
	cursor: pointer;
}

#top #main .dehner-gc label.dehner-gc-keepsake span,
.dehner-gc label.dehner-gc-keepsake span {
	font-size: 1.2em;
	font-weight: 700;
	line-height: 1.3;
	color: #1a1a1a;
}

#top #main .dehner-gc label.dehner-gc-keepsake input,
.dehner-gc label.dehner-gc-keepsake input {
	width: 1.15rem;
	height: 1.15rem;
	margin: 0;
	flex: 0 0 auto;
	accent-color: #1a1a1a;
}

#top #main .dehner-gc label.dehner-gc-keepsake input:focus,
.dehner-gc label.dehner-gc-keepsake input:focus {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

.dehner-gc-submit {
	margin-top: 8px;
}

#top #main .dehner-gc button.dehner-gc-buy,
.dehner-gc button.dehner-gc-buy {
	width: 100%;
	background: var(--dehner-buy-button);
	color: var(--dehner-buy-button-text);
	font-family: "Poppins", sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-transform: none;
	line-height: 1;
	border: none;
	border-radius: 4px;
	padding: 16px 24px;
	cursor: pointer;
}

#top #main .dehner-gc button.dehner-gc-buy:hover,
#top #main .dehner-gc button.dehner-gc-buy:focus,
.dehner-gc button.dehner-gc-buy:hover,
.dehner-gc button.dehner-gc-buy:focus {
	background: var(--dehner-buy-button-hover);
	color: var(--dehner-buy-button-text);
	outline: 2px solid var(--dehner-buy-focus);
	outline-offset: 2px;
}

.dehner-gc-description {
	grid-area: story;
	margin: 0;
	max-width: none;
	min-width: 0;
	font-size: 16px;
	line-height: 1.6;
}

.dehner-gc-description ul {
	margin: 0 0 1em;
	padding-left: 1.2em;
}

.dehner-gc [hidden] {
	display: none !important;
}

@media (min-width: 900px) {
	.dehner-gc-grid {
		grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
		grid-template-areas:
			"gallery info"
			"story info";
		column-gap: 56px;
		row-gap: 28px;
	}

	.dehner-gc-info {
		position: sticky;
		top: 24px;
		align-self: start;
		background: #ffffff;
	}

	/* Matches Enfold's fixed header offset on this site (main padding-top: 200px). */
	.html_header_sticky #top .dehner-gc-info {
		top: 200px;
	}
}

/*
 * Gift certificate promo marquee inside #header_meta.
 * Desktop: the track sits in the empty left side and stops 24px before
 * the phone line. Mobile: its own full-width row above the phone.
 * The loop is one CSS animation. One copy is about 913px in Poppins,
 * so 18.3s is about 50px/s. Hover and keyboard focus pause it.
 */
#top #header_meta .container:has(.dehner-marquee) {
	position: relative;
}

#top #header_meta nav.sub_menu:has(.dehner-marquee) {
	position: static;
	top: 0;
	float: none;
	margin: 0;
	padding: 0;
	line-height: 0;
	font-size: 0;
	min-height: 0;
	background: transparent;
	border: 0;
}

.dehner-marquee {
	position: absolute;
	top: 0;
	left: 0;
	height: 45px;
	overflow: hidden;
	color: #fff;
	font-size: 13px;
	line-height: 45px;
	font-weight: 400;
	z-index: 3;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
}

.dehner-marquee .track {
	display: flex;
	width: max-content;
	animation: dehner-marquee-scroll 18.3s linear infinite;
}

.dehner-marquee:hover .track,
.dehner-marquee:focus-within .track {
	animation-play-state: paused;
}

.dehner-marquee .copy1,
.dehner-marquee .copy2 {
	display: flex;
}

.dehner-marquee .seg {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-right: 10px;
	white-space: nowrap;
}

.dehner-marquee .pill {
	background: #c62828;
	color: #fff;
	font-weight: 700;
	font-size: 10px;
	letter-spacing: 0.08em;
	line-height: 1;
	padding: 4px 7px;
	border-radius: 999px;
}

#top #header_meta .dehner-marquee a {
	color: #fff !important;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.dehner-marquee .gift {
	width: 14px;
	height: 14px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 7.8C8.6 6.9 4.6 5 5 2.6 5.3.4 8.8 0 11.4 2.8 11.8 4.5 12 6.4 12 7.8z'/%3E%3Cpath fill='%23fff' d='M12 7.8c3.4-.9 7.4-2.8 7-5.2-.3-2.2-3.8-2.6-6.4.2C12.2 4.5 12 6.4 12 7.8z'/%3E%3Cpath fill='%23fff' d='M10.1 5.2h3.8V8.5h-3.8z'/%3E%3Cpath fill='%23fff' d='M.6 8.2h9.5v3.4H.6zm13.3 0H23.4v3.4H13.9zM1.5 11.6h8.6V23.2H1.5zm12.4 0H22.5V23.2h-8.6z'/%3E%3C/svg%3E") center / contain no-repeat;
	display: inline-block;
	flex: 0 0 14px;
}

.dehner-marquee .sep {
	opacity: 0.5;
	padding: 0 14px;
}

@keyframes dehner-marquee-scroll {
	to {
		transform: translateX(-50%);
	}
}

@media (min-width: 768px) {
	#top #header_meta .container:has(.dehner-marquee) {
		display: flex;
		align-items: stretch;
		min-height: 45px;
	}

	#top #header_meta .container:has(.dehner-marquee) > .social_bookmarks {
		order: 3;
		flex: 0 0 auto;
		height: 45px;
	}

	#top #header_meta .container:has(.dehner-marquee) > .phone-info {
		order: 2;
		flex: 0 0 auto;
		width: auto;
		float: none;
		clear: none;
		line-height: 45px;
	}

	/* -50px pulls the track through the container's 50px padding so it
	   starts at the left edge of the bar. 24px stays clear of the phone. */
	#top #header_meta nav.sub_menu:has(.dehner-marquee) {
		order: 1;
		position: relative;
		flex: 1 1 auto;
		min-width: 0;
		height: 45px;
		width: auto;
		margin: 0 24px 0 -50px;
		line-height: 45px;
		font-size: 13px;
		z-index: 3;
	}

	#top #header_meta .dehner-marquee {
		position: relative;
		left: auto;
		width: 100%;
		height: 45px;
	}
}

@media (max-width: 767px) {
	#top #header_meta .container:has(.dehner-marquee) {
		position: static;
		padding-top: 34px;
	}

	#top #header_meta nav.sub_menu:has(.dehner-marquee) {
		height: 0;
		width: 0;
		overflow: visible;
	}

	#top #header_meta .dehner-marquee {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: auto;
		height: 34px;
		line-height: 34px;
		border-bottom: 1px solid #333;
		font-size: 12px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.dehner-marquee {
		-webkit-mask-image: none;
		mask-image: none;
	}

	.dehner-marquee .track {
		animation: none;
		width: auto;
		justify-content: center;
	}

	.dehner-marquee .copy2,
	.dehner-marquee .seg ~ .seg {
		display: none;
	}

	/* The only visible sentence is the first segment. Its bullet only
	   separates copies while the loop is moving. */
	.dehner-marquee .copy1 > .seg:first-child .sep {
		display: none;
	}
}