/* ==========================================================================
   Dritella Core — UI components
   Uses theme tokens with fallbacks so it degrades without the theme.
   ========================================================================== */

.dtp, .dtd, .dt-recipients, .dt-pairs, .dt-newsletter, .dt-tiers, .dt-parcel, .dt-assurances {
	--c-ink: var(--wp--preset--color--ink, #2D2522);
	--c-soft: var(--wp--preset--color--ink-soft, #6B5F57);
	--c-paper: var(--wp--preset--color--paper, #FBF7F1);
	--c-card: var(--wp--preset--color--card, #fff);
	--c-line: var(--wp--preset--color--line, #E8DED2);
	--c-honey: var(--wp--preset--color--honey, #94621F);
	--c-honey-l: var(--wp--preset--color--honey-light, #F4DDB0);
	--c-rose: var(--wp--preset--color--rose, #B45E6C);
	--c-blush: var(--wp--preset--color--blush, #F7E4E2);
	--c-petrol: var(--wp--preset--color--petrol, #3D6B77);
	--f-display: var(--wp--preset--font-family--display, Georgia, serif);
	--r-s: var(--wp--custom--radius--small, 8px);
	--r-m: var(--wp--custom--radius--medium, 14px);
	--r-l: var(--wp--custom--radius--large, 22px);
}

.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* --------------------------------------------------------------------------
   Personalisation panel — a gift tag
   -------------------------------------------------------------------------- */

.dtp {
	background: var(--c-card);
	border: 1.5px solid var(--c-honey-l);
	border-radius: var(--r-l);
	flex: 1 1 100%;
	margin: 0 0 1.25rem;
	padding: 1.5rem 1.5rem 1.25rem;
	position: relative;
	width: 100%;
}
.dtp::before {
	background: var(--c-paper);
	border: 1.5px solid var(--c-honey-l);
	border-radius: 50%;
	content: "";
	height: 12px;
	position: absolute;
	right: 22px;
	top: 20px;
	width: 12px;
}
.dtp__editing {
	background: var(--c-blush);
	border-radius: var(--r-s);
	color: var(--c-rose);
	font-size: 0.85rem;
	margin: 0 0 1rem;
	padding: 0.5rem 0.75rem;
}
.dtp__step { border: 0; margin: 0; min-width: 0; padding: 0; }
.dtp__step + .dtp__step {
	border-top: 1.5px dashed var(--c-line);
	margin-top: 1.25rem;
	padding-top: 1.25rem;
}
/* Legend floats so it sits below the dashed divider instead of on it. */
.dtp__step::after { clear: both; content: ""; display: table; }
.dtp__step > :not(.dtp__legend) { clear: both; }
.dtp__legend {
	align-items: baseline;
	display: flex;
	float: left;
	width: 100%;
	font-family: var(--f-display);
	font-size: 1.35rem;
	gap: 0.6rem;
	line-height: 1.2;
	margin-bottom: 0.9rem;
	padding: 0;
}
.dtp__num { color: var(--c-honey); font-style: italic; font-size: 1.1rem; }

.dtp__field { margin-top: 0.9rem; }
.dtp__field:first-of-type { margin-top: 0; }
.dtp__field[hidden] { display: none; }
.dtp__labelrow { align-items: baseline; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 0.35rem; }
.dtp__label { display: block; font-size: 0.9rem; font-weight: 600; margin: 0 0 0.35rem; }
.dtp__labelrow .dtp__label { margin: 0; }
.dtp__req { color: var(--c-rose); }
.dtp__count { color: var(--c-soft); font-size: 0.78rem; font-variant-numeric: tabular-nums; }
.dtp__count.is-near { color: var(--c-rose); }
.dtp__help { color: var(--c-soft); font-size: 0.8rem; margin: 0.35rem 0 0; }
.dtp__current { color: var(--c-soft); font-weight: 400; }
.dtp__notice { color: var(--c-soft); font-size: 0.8rem; font-style: italic; margin: 1rem 0 0; }

.dtp__field input[type="text"],
.dtp__field textarea,
.dtp__field input[type="date"] { box-sizing: border-box; font-size: 1rem; max-width: 100%; width: 100%; }

/* Chips (choice) */
.dtp__chips, .dtp__swatches { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.dtp__radio { opacity: 0; pointer-events: none; position: absolute; }
.dtp__chips label {
	background: var(--c-card);
	border: 1.5px solid var(--c-line);
	border-radius: 999px;
	cursor: pointer;
	font-size: 0.9rem;
	padding: 0.5rem 1rem;
	transition: border-color 150ms, background 150ms;
}
.dtp__chips label:hover { border-color: var(--c-honey-l); }
.dtp__chips .dtp__radio:checked + label { background: var(--c-paper); border-color: var(--c-honey); color: var(--c-ink); font-weight: 600; }
.dtp__radio:focus-visible + label { outline: 2px solid var(--c-honey); outline-offset: 2px; }

/* Swatches (color) */
.dtp__swatches label {
	background: var(--sw);
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,.12);
	cursor: pointer;
	height: 34px;
	position: relative;
	width: 34px;
}
.dtp__swatches .dtp__radio:checked + label { box-shadow: 0 0 0 2px var(--c-card), 0 0 0 4px var(--c-honey); }

/* Checkbox with fee */
.dtp__check { align-items: flex-start; cursor: pointer; display: flex; font-size: 0.95rem; gap: 0.6rem; }
.dtp__check input { accent-color: var(--c-honey); height: 1.15rem; margin-top: 0.2rem; width: 1.15rem; }
.dtp__fee { color: var(--c-honey); font-weight: 600; white-space: nowrap; }

/* Upload */
.dtp__file { height: 1px; opacity: 0; position: absolute; width: 1px; }
.dtp__drop {
	align-items: center;
	background: var(--c-paper);
	border: 1.5px dashed var(--c-honey-l);
	border-radius: var(--r-m);
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 1.1rem;
	text-align: center;
	transition: border-color 150ms, background 150ms;
}
.dtp__drop:hover, .dtp__upload.is-over .dtp__drop { background: #fff; border-color: var(--c-honey); }
.dtp__file:focus-visible + .dtp__drop { outline: 2px solid var(--c-honey); outline-offset: 2px; }
.dtp__drop-title { font-weight: 600; }
.dtp__drop-meta { color: var(--c-soft); font-size: 0.78rem; }
.dtp__upload.is-busy .dtp__drop { opacity: 0.6; pointer-events: none; }
.dtp__preview { align-items: center; display: none; gap: 0.75rem; }
.dtp__upload.has-file .dtp__drop { display: none; }
.dtp__upload.has-file .dtp__preview { display: flex; }
.dtp__preview img { border: 1px solid var(--c-line); border-radius: var(--r-s); height: 72px; object-fit: cover; width: 72px; }
.dtp__preview-name { flex: 1; font-size: 0.85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dtp__remove { background: none; border: 0; color: var(--c-rose); cursor: pointer; font: inherit; font-size: 0.85rem; text-decoration: underline; }
.dtp__status { font-size: 0.8rem; margin: 0.35rem 0 0; min-height: 1em; }
.dtp__status[data-kind="error"] { color: var(--c-rose); }
.dtp__status[data-kind="warn"] { color: #8a5a00; }
.dtp__status[data-kind="ok"] { color: var(--c-petrol); }

/* Date picker (dd.mm.yyyy) */
.dtp-date { position: relative; }
.dtp-date__input { padding-right: 3rem !important; }
.dtp-date__toggle {
	background: none;
	border: 0;
	border-radius: var(--r-s);
	color: var(--c-honey);
	cursor: pointer;
	height: 40px;
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
}
.dtp-date__toggle::before {
	background: currentColor;
	content: "";
	inset: 0;
	margin: auto;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E") center / 20px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E") center / 20px no-repeat;
	position: absolute;
}
.dtp-date__toggle:hover, .dtp-date__toggle[aria-expanded="true"] { background: var(--c-paper); }
.dtp-cal {
	background: var(--c-card);
	border: 1px solid var(--c-line);
	border-radius: var(--r-m);
	box-shadow: 0 18px 40px -18px rgba(45, 37, 34, 0.35);
	left: 0;
	margin-top: 6px;
	padding: 0.75rem;
	position: absolute;
	top: 100%;
	width: min(320px, 100%);
	z-index: 20;
}
.dtp-cal[hidden] { display: none; }
.dtp-cal__head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 0.4rem; }
.dtp-cal__title { font-family: var(--f-display); font-size: 1.2rem; margin: 0; text-transform: capitalize; }
.dtp-cal__nav {
	background: none; border: 0; border-radius: 50%; color: var(--c-ink); cursor: pointer; height: 34px; position: relative; width: 34px;
}
.dtp-cal__nav::before {
	border-left: 1.5px solid currentColor; border-top: 1.5px solid currentColor; content: "";
	height: 8px; left: 50%; position: absolute; top: 50%; width: 8px;
	transform: translate(-30%, -50%) rotate(-45deg);
}
.dtp-cal__nav[data-step="1"]::before { transform: translate(-70%, -50%) rotate(135deg); }
.dtp-cal__nav:hover:not(:disabled) { background: var(--c-paper); }
.dtp-cal__nav:disabled { opacity: 0.3; cursor: default; }
.dtp-cal__grid { border-collapse: collapse; width: 100%; }
.dtp-cal__grid th { color: var(--c-soft); font-size: 0.72rem; font-weight: 600; padding: 0.25rem 0; text-align: center; }
.dtp-cal__grid td { padding: 1px; text-align: center; }
.dtp-cal__day {
	aspect-ratio: 1;
	background: none;
	border: 0;
	border-radius: 50%;
	color: var(--c-ink);
	cursor: pointer;
	font: inherit;
	font-size: 0.85rem;
	font-variant-numeric: tabular-nums;
	max-width: 40px;
	width: 100%;
}
.dtp-cal__day.is-weekend { color: var(--c-soft); }
.dtp-cal__day:hover:not(:disabled) { background: var(--c-paper); }
.dtp-cal__day[aria-pressed="true"] { background: var(--c-honey); color: var(--c-card); font-weight: 600; }
.dtp-cal__day:focus-visible { outline: 2px solid var(--c-honey); outline-offset: 1px; }
.dtp-cal__day:disabled { color: #cfc5b8; cursor: not-allowed; text-decoration: line-through; text-decoration-color: transparent; }

/* Errors */
.dtp__field.has-error input, .dtp__field.has-error textarea, .dtp__field.has-error .dtp__drop { border-color: var(--c-rose); }
.dtp__error { color: var(--c-rose); font-size: 0.8rem; margin: 0.35rem 0 0; }

/* Price note + assurances */
.dt-price-note { color: var(--wp--preset--color--ink-soft, #6B5F57); display: block; font-family: var(--wp--preset--font-family--body, Georgia, serif); font-size: 0.8rem; font-style: italic; }
.dt-assurances { list-style: none; margin: 1.25rem 0 0; padding: 0; }
.dt-assurances li { color: var(--c-soft); font-size: 0.85rem; padding: 0.2rem 0 0.2rem 1.5rem; position: relative; }
.dt-assurances li::before { color: var(--c-honey); content: "✓"; left: 0.2rem; position: absolute; }

/* Cart: edit link */
.dtp-edit { font-size: 0.8rem; margin-left: 0.5rem; white-space: nowrap; }

/* --------------------------------------------------------------------------
   Design picker
   -------------------------------------------------------------------------- */

.dtd { margin-bottom: 1.25rem; }
.dtd__label { font-weight: 600; margin: 0 0 0.6rem; }
.dtd__current { color: var(--c-honey); font-family: var(--f-display); font-size: 1.15rem; font-style: italic; font-weight: 400; margin-left: 0.35rem; }
.dtd__grid {
	display: grid;
	gap: 0.6rem;
	grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
	max-height: 420px;
	overflow-y: auto;
	padding: 4px;
	scrollbar-width: thin;
}
.dtd__opt {
	background: var(--c-card);
	border: 1.5px solid var(--c-line);
	border-radius: var(--r-m);
	cursor: pointer;
	display: flex;
	flex-direction: column;
	font: inherit;
	gap: 0.3rem;
	padding: 0.35rem;
	transition: border-color 150ms, transform 150ms;
}
.dtd__opt img { aspect-ratio: 1; border-radius: calc(var(--r-m) - 5px); display: block; object-fit: cover; width: 100%; }
.dtd__opt span { color: var(--c-soft); font-size: 0.72rem; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dtd__opt:hover { border-color: var(--c-honey-l); }
.dtd__opt.is-active { border-color: var(--c-honey); box-shadow: 0 0 0 3px rgba(148, 98, 31, 0.12); }
.dtd__opt.is-active span { color: var(--c-ink); font-weight: 600; }
.dtd__opt:disabled { cursor: not-allowed; opacity: 0.35; }
.dtd__opt:focus-visible { outline: 2px solid var(--c-honey); outline-offset: 2px; }
tr.dtd-native { display: none; }

/* --------------------------------------------------------------------------
   Tiers
   -------------------------------------------------------------------------- */

.dt-tiers { border-collapse: collapse; font-size: 0.9rem; margin: 0 0 1.25rem; width: 100%; }
.dt-tiers caption { font-weight: 600; margin-bottom: 0.4rem; text-align: left; }
.dt-tiers th, .dt-tiers td { border-bottom: 1px solid var(--c-line); padding: 0.45rem 0.25rem; text-align: left; }
.dt-tiers th { color: var(--c-soft); font-size: 0.78rem; font-weight: 500; }
.dt-tiers tr.is-active td { color: var(--c-honey); font-weight: 600; }

/* --------------------------------------------------------------------------
   Checkout: parcel locker row
   -------------------------------------------------------------------------- */

.dt-parcel th, .dt-parcel td { vertical-align: top; }
.dt-parcel__select { width: 100%; }
.dt-parcel__empty { color: var(--c-rose); font-size: 0.85rem; margin: 0; }
.dt-parcel .select2-container .select2-selection--single { border-color: var(--c-line); border-radius: var(--r-s); height: 44px; }
.dt-parcel .select2-container .select2-selection--single .select2-selection__rendered { line-height: 42px; }
.dt-parcel .select2-container .select2-selection--single .select2-selection__arrow { height: 42px; }
.dt-parcel-summary { margin-top: 1rem; }

/* --------------------------------------------------------------------------
   Recipient row ("Kellele kingid?") — polaroid cards, horizontal scroll
   -------------------------------------------------------------------------- */

.dt-rrow {
	--c-ink: var(--wp--preset--color--ink, #2D2522);
	--c-soft: var(--wp--preset--color--ink-soft, #6B5F57);
	--c-line: var(--wp--preset--color--line, #E8DED2);
	--c-honey: var(--wp--preset--color--honey, #94621F);
	--f-display: var(--wp--preset--font-family--display, Georgia, serif);
	position: relative;
}
.dt-rrow__track {
	display: grid;
	gap: clamp(0.9rem, 2vw, 1.5rem);
	grid-auto-columns: clamp(170px, 17vw, 220px);
	grid-auto-flow: column;
	list-style: none;
	margin: 0;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	padding: 0.75rem 0.25rem 1.25rem;
	scroll-padding-inline: 0.25rem;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
.dt-rrow__track::-webkit-scrollbar { display: none; }
.dt-rrow.has-overflow:not(.at-end) .dt-rrow__track { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.dt-rrow.has-overflow.at-end:not(.at-start) .dt-rrow__track { -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%); mask-image: linear-gradient(90deg, transparent, #000 15%); }
.dt-rrow.has-overflow:not(.at-start):not(.at-end) .dt-rrow__track { -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }

.dt-rcard { --tilt: -1.2deg; scroll-snap-align: start; }
.dt-rcard--1 { --tilt: 1deg; }
.dt-rcard--2 { --tilt: -0.5deg; }
.dt-rcard--3 { --tilt: 1.4deg; }
.dt-rcard__link {
	background: #fff;
	border-radius: 4px;
	box-shadow: 0 2px 4px rgba(74, 52, 33, 0.06), 0 14px 30px -18px rgba(74, 52, 33, 0.35);
	color: var(--c-ink);
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 10px 10px 14px;
	text-decoration: none;
	transform: rotate(var(--tilt));
	transition: transform 220ms cubic-bezier(.2,.7,.3,1), box-shadow 220ms;
}
.dt-rcard__link:hover, .dt-rcard__link:focus-visible {
	box-shadow: 0 2px 4px rgba(74, 52, 33, 0.08), 0 22px 40px -18px rgba(74, 52, 33, 0.45);
	color: var(--c-ink);
	text-decoration: none;
	transform: rotate(0deg) translateY(-4px);
}
.dt-rcard__media {
	aspect-ratio: 1;
	background: var(--wp--preset--color--linen, #F3EADF);
	border-radius: 2px;
	display: grid;
	overflow: hidden;
	place-items: center;
}
.dt-rcard--1 .dt-rcard__media { background: var(--wp--preset--color--blush, #F7E4E2); }
.dt-rcard--2 .dt-rcard__media { background: var(--wp--preset--color--honey-light, #F4DDB0); }
.dt-rcard--3 .dt-rcard__media { background: #E4EEEF; }
.dt-rcard__img { display: block; height: 100%; object-fit: cover; transition: transform 400ms ease; width: 100%; }
.dt-rcard__link:hover .dt-rcard__img { transform: scale(1.04); }
.dt-rcard__initial { color: var(--c-honey); font-family: var(--f-display); font-size: 4.5rem; font-style: italic; line-height: 1; opacity: 0.8; }
.dt-rcard__name { font-family: var(--f-display); font-size: 1.45rem; line-height: 1.1; margin-top: 0.7rem; padding: 0 0.15rem; }
.dt-rcard__meta { color: var(--c-soft); font-size: 0.78rem; margin-top: 0.2rem; padding: 0 0.15rem; }

.dt-rrow__nav {
	align-items: center;
	background: #fff;
	border: 1px solid var(--c-line);
	border-radius: 50%;
	box-shadow: 0 8px 20px -12px rgba(74, 52, 33, 0.45);
	color: var(--c-ink);
	cursor: pointer;
	display: flex;
	height: 44px;
	justify-content: center;
	position: absolute;
	top: calc(50% - 32px);
	transition: opacity 150ms, transform 150ms;
	width: 44px;
	z-index: 2;
}
.dt-rrow__nav[hidden] { display: none; }
.dt-rrow__nav::before { border-right: 1.5px solid currentColor; border-top: 1.5px solid currentColor; content: ""; height: 9px; width: 9px; }
.dt-rrow__nav--prev { left: -14px; }
.dt-rrow__nav--prev::before { margin-left: 4px; transform: rotate(-135deg); }
.dt-rrow__nav--next { right: -14px; }
.dt-rrow__nav--next::before { margin-right: 4px; transform: rotate(45deg); }
.dt-rrow__nav:disabled { opacity: 0; pointer-events: none; }
.dt-rrow__nav:hover { transform: scale(1.06); }
@media (hover: none), (max-width: 781px) { .dt-rrow__nav { display: none; } }
@media (max-width: 600px) {
	.dt-rrow__track { grid-auto-columns: 58%; margin-inline: calc(-1 * clamp(1rem, 4vw, 2rem)); padding-inline: clamp(1rem, 4vw, 2rem); scroll-padding-inline: clamp(1rem, 4vw, 2rem); }
	.dt-rrow.has-overflow .dt-rrow__track { -webkit-mask-image: none; mask-image: none; }
}
@media (prefers-reduced-motion: reduce) { .dt-rcard__link { transform: none !important; } }

/* --------------------------------------------------------------------------
   Pairs
   -------------------------------------------------------------------------- */

.dt-pairs { margin-top: var(--wp--preset--spacing--60, 4rem); }
.dt-pairs__title { margin-bottom: 1.25rem; }
.dt-pairs__grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dt-card--static { display: flex; flex-direction: column; }
.dt-card--static .dt-card__foot { align-items: center; display: flex; gap: 0.75rem; justify-content: space-between; }
.dt-card--static .dt-card__title { font-family: var(--f-display); font-weight: 500; }
@media (max-width: 781px) {
	.dt-pairs__grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
	.dt-pairs__grid > * { flex: 0 0 72%; scroll-snap-align: start; }
}

/* --------------------------------------------------------------------------
   Newsletter
   -------------------------------------------------------------------------- */

.dt-newsletter__title { color: var(--c-honey); font-family: var(--f-display); font-size: 1.25rem; font-style: italic; margin: 0 0 0.5rem; }
.dt-newsletter__text { color: var(--c-soft); font-size: 0.9rem; margin: 0 0 0.75rem; }
.dt-newsletter__form { display: flex; gap: 0.5rem; }
.dt-newsletter__form input[type="email"] { flex: 1; min-width: 0; }
.dt-newsletter__form button {
	background: var(--c-ink);
	border: 0;
	border-radius: 999px;
	color: var(--c-paper);
	cursor: pointer;
	font: inherit;
	font-size: 0.9rem;
	padding: 0 1.25rem;
}
.dt-newsletter__form button:hover { background: var(--c-honey); }
.dt-newsletter__form button:disabled { opacity: 0.6; }
.dt-newsletter__status { font-size: 0.85rem; margin: 0.5rem 0 0; min-height: 1.2em; }
.dt-newsletter__status[data-kind="ok"] { color: var(--c-petrol); }
.dt-newsletter__status[data-kind="error"] { color: var(--c-rose); }
.dt-hp { height: 1px; left: -9999px; opacity: 0; position: absolute; width: 1px; }

.dt-admin-hint { border: 1px dashed #c3b8a8; border-radius: 8px; color: #6B5F57; font-size: 0.85rem; padding: 0.75rem 1rem; }

/* --------------------------------------------------------------------------
   Kingiabi (gift finder)
   -------------------------------------------------------------------------- */

.dgf {
	--c-ink: var(--wp--preset--color--ink, #2D2522);
	--c-soft: var(--wp--preset--color--ink-soft, #6B5F57);
	--c-paper: var(--wp--preset--color--paper, #FBF7F1);
	--c-card: var(--wp--preset--color--card, #fff);
	--c-line: var(--wp--preset--color--line, #E8DED2);
	--c-honey: var(--wp--preset--color--honey, #94621F);
	--c-honey-l: var(--wp--preset--color--honey-light, #F4DDB0);
	--c-rose: var(--wp--preset--color--rose, #B45E6C);
	--c-blush: var(--wp--preset--color--blush, #F7E4E2);
	--f-display: var(--wp--preset--font-family--display, Georgia, serif);
}
.dgf__form {
	background: var(--c-card);
	border: 1.5px solid var(--c-honey-l);
	border-radius: var(--wp--custom--radius--large, 22px);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.dgf__step { border: 0; margin: 0; min-width: 0; padding: 0; }
.dgf__step + .dgf__step { border-top: 1.5px dashed var(--c-line); margin-top: 1.25rem; padding-top: 1.25rem; }
.dgf__legend { align-items: baseline; display: flex; font-family: var(--f-display); font-size: 1.5rem; gap: 0.6rem; margin-bottom: 0.75rem; padding: 0; }
.dgf__num { color: var(--c-honey); font-size: 1.15rem; font-style: italic; }
.dgf__chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.dgf__radio { opacity: 0; pointer-events: none; position: absolute; }
.dgf__chip {
	background: var(--c-card);
	border: 1.5px solid var(--c-line);
	border-radius: 999px;
	cursor: pointer;
	font-size: 0.95rem;
	padding: 0.5rem 1.05rem;
	transition: border-color 150ms, background 150ms, transform 150ms;
	user-select: none;
}
.dgf__chip:hover { border-color: var(--c-honey-l); }
.dgf__chip--any { color: var(--c-soft); font-style: italic; }
.dgf__radio:checked + .dgf__chip { background: var(--c-paper); border-color: var(--c-honey); color: var(--c-ink); font-style: normal; font-weight: 600; }
.dgf__radio:checked + .dgf__chip:not(.dgf__chip--any) { background: var(--c-blush); border-color: var(--c-rose); }
.dgf__radio:focus-visible + .dgf__chip { outline: 2px solid var(--c-honey); outline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) {
	.dgf__radio:checked + .dgf__chip:not(.dgf__chip--any) { transform: rotate(-1.5deg); }
}
.dgf__actions { align-items: center; display: flex; gap: 1.25rem; margin-top: 1.5rem; }
.dgf--js .dgf__submit { display: none; }
.dgf--js .dgf__actions { margin-top: 1rem; }
.dgf__reset { font-size: 0.9rem; }

.dgf__results { margin-top: var(--wp--preset--spacing--50, 2.5rem); scroll-margin-top: 120px; transition: opacity 150ms; }
.dgf[aria-busy="true"] .dgf__results { opacity: 0.45; }
.dgf__summary { margin-bottom: 1.25rem; }
.dgf__count { color: var(--c-soft); font-size: 0.9rem; margin: 0; }
.dgf__relaxed {
	background: var(--c-blush);
	border-radius: var(--wp--custom--radius--small, 8px);
	color: var(--c-ink);
	font-size: 0.9rem;
	margin: 0 0 0.75rem;
	padding: 0.65rem 0.9rem;
}
.dgf__grid { display: grid; gap: clamp(1rem, 2vw, 1.5rem); grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1080px) { .dgf__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 781px) { .dgf__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .dgf__grid { grid-template-columns: 1fr; } }
.dgf__grid .dt-card__foot { align-items: center; display: flex; gap: 0.75rem; justify-content: space-between; }
.dgf__grid .dt-card__title { font-family: var(--f-display); font-weight: 500; }
.dgf__more { margin-top: 1.75rem; text-align: center; }
.dgf__more [aria-disabled="true"] { opacity: 0.5; pointer-events: none; }
.dgf__empty { color: var(--c-soft); }

/* --------------------------------------------------------------------------
   Shop filters
   -------------------------------------------------------------------------- */

.dsf {
	--c-ink: var(--wp--preset--color--ink, #2D2522);
	--c-soft: var(--wp--preset--color--ink-soft, #6B5F57);
	--c-paper: var(--wp--preset--color--paper, #FBF7F1);
	--c-card: var(--wp--preset--color--card, #fff);
	--c-line: var(--wp--preset--color--line, #E8DED2);
	--c-honey: var(--wp--preset--color--honey, #94621F);
	--c-honey-l: var(--wp--preset--color--honey-light, #F4DDB0);
	--c-blush: var(--wp--preset--color--blush, #F7E4E2);
	--c-rose: var(--wp--preset--color--rose, #B45E6C);
	font-size: 0.92rem;
}
.dsf__open, .dsf__head, .dsf__foot, .dsf__scrim { display: none; }
.dsf__panel { position: sticky; top: calc(var(--dt-admin-h, 0px) + var(--dt-header-h, 76px) + 1.5rem); }

.dsf__group + .dsf__group { border-top: 1px solid var(--c-line); margin-top: 1rem; padding-top: 1rem; }
.dsf__title {
	color: var(--c-honey);
	font-family: var(--wp--preset--font-family--display, Georgia, serif);
	font-size: 1.2rem;
	font-style: italic;
	margin: 0 0 0.4rem;
}
.dsf__list { list-style: none; margin: 0; padding: 0; }
.dsf__opt {
	align-items: center;
	border-radius: var(--wp--custom--radius--small, 8px);
	color: var(--c-ink);
	display: flex;
	gap: 0.6rem;
	margin: 0 -0.4rem;
	padding: 0.32rem 0.4rem;
	text-decoration: none;
}
.dsf__opt:hover { background: var(--c-card); color: var(--c-ink); text-decoration: none; }
.dsf__box {
	background: var(--c-card);
	border: 1.5px solid #cdbfae;
	border-radius: 4px;
	flex: 0 0 auto;
	height: 16px;
	position: relative;
	transition: background 120ms, border-color 120ms;
	width: 16px;
}
.dsf__list--single .dsf__box { border-radius: 50%; }
.dsf__opt.is-active .dsf__box { background: var(--c-honey); border-color: var(--c-honey); }
.dsf__opt.is-active .dsf__box::after {
	border-bottom: 2px solid #fff; border-right: 2px solid #fff; content: "";
	height: 8px; left: 4.5px; position: absolute; top: 1.5px; transform: rotate(45deg); width: 4.5px;
}
.dsf__list--single .dsf__opt.is-active .dsf__box::after { background: #fff; border: 0; border-radius: 50%; height: 6px; left: 3.5px; top: 3.5px; transform: none; width: 6px; }
.dsf__label { flex: 1; }
.dsf__opt.is-active .dsf__label { font-weight: 600; }
.dsf__count { color: var(--c-soft); font-size: 0.78rem; font-variant-numeric: tabular-nums; }

.dsf__active { margin-bottom: 1.25rem; }
.dsf__active ul { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; margin: 0 0 0.5rem; padding: 0; }
.dsf__pill {
	align-items: center;
	background: var(--c-blush);
	border-radius: 999px;
	color: var(--c-ink);
	display: inline-flex;
	font-size: 0.82rem;
	gap: 0.4rem;
	padding: 0.3rem 0.75rem;
	text-decoration: none;
}
.dsf__pill::after { color: var(--c-rose); content: "×"; font-size: 1rem; line-height: 1; }
.dsf__pill:hover { background: #f1d3d0; text-decoration: none; }
.dsf__clear { font-size: 0.82rem; }

@media (max-width: 960px) {
	.dsf__open {
		align-items: center;
		background: var(--c-card);
		border: 1.5px solid var(--c-line);
		border-radius: 999px;
		color: var(--c-ink);
		cursor: pointer;
		display: inline-flex;
		font: inherit;
		font-weight: 600;
		gap: 0.5rem;
		padding: 0.55rem 1.1rem;
	}
	.dsf__badge {
		background: var(--c-honey); border-radius: 999px; color: #fff; font-size: 0.72rem;
		line-height: 1; min-width: 1.4em; padding: 0.25em 0.45em; text-align: center;
	}
	.dsf__panel {
		background: var(--c-paper);
		bottom: 0;
		display: flex;
		flex-direction: column;
		overflow-y: auto;
		padding: calc(var(--dt-admin-h, 0px) + 1rem) 1.25rem 0;
		position: fixed;
		right: 0;
		top: 0;
		transform: translateX(102%);
		transition: transform 240ms cubic-bezier(.2,.7,.3,1);
		width: min(88vw, 380px);
		z-index: 95;
	}
	.dsf.is-open .dsf__panel { transform: none; }
	.dsf__scrim { background: rgba(45, 37, 34, 0.35); display: block; inset: 0; position: fixed; z-index: 90; }
	.dsf__scrim[hidden] { display: none; }
	.dsf__head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 1rem; }
	.dsf__heading { font-family: var(--wp--preset--font-family--display, Georgia, serif); font-size: 1.6rem; margin: 0; }
	.dsf__close { background: none; border: 0; cursor: pointer; height: 40px; position: relative; width: 40px; }
	.dsf__close::before, .dsf__close::after {
		background: var(--c-ink); content: ""; height: 1.5px; left: 50%; position: absolute; top: 50%; width: 18px;
	}
	.dsf__close::before { transform: translate(-50%, -50%) rotate(45deg); }
	.dsf__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
	.dsf__opt { padding: 0.55rem 0.4rem; }
	.dsf__foot {
		background: var(--c-paper);
		bottom: 0;
		display: block;
		margin: auto -1.25rem 0;
		padding: 0.9rem 1.25rem calc(0.9rem + env(safe-area-inset-bottom));
		position: sticky;
		border-top: 1px solid var(--c-line);
	}
	.dsf__apply {
		background: var(--c-ink); border: 0; border-radius: 999px; color: var(--c-paper); cursor: pointer;
		font: inherit; font-weight: 600; padding: 0.85rem; width: 100%;
	}
	body.dsf-locked { overflow: hidden; }
}