/**
 * UV DTF components.
 *
 * Additive and scoped to .dvu* classes. Uses the DECOVINK tokens from the child
 * theme; no token is redefined and no existing selector is restyled.
 *
 * The order summary is never sticky over the configurator on small screens:
 * that mistake was made in the gang sheet builder and corrected in F.1, so it
 * is not repeated here. A slim action bar carries the subtotal instead.
 */

.dvu {
	--u-line: var(--dv-line, #E4E0DF);
	--u-ink: var(--dv-ink, #161616);
	--u-muted: var(--dv-ink-muted, #57514F);
	--u-accent: var(--dv-accent, #E30613);
	--u-surface: var(--dv-surface, #FAFAFA);
	font-family: var(--dv-font, system-ui, sans-serif);
	color: var(--u-ink);
}
.dvu *, .dvu *::before, .dvu *::after { box-sizing: border-box; }

.dvu-closed {
	padding: 32px; text-align: center;
	border: 1px dashed var(--dv-line, #E4E0DF); border-radius: 12px;
	background: var(--dv-surface, #FAFAFA); color: var(--dv-ink-muted, #57514F);
}
.dvu-devnotice {
	margin: 0 0 16px; padding: 10px 14px;
	border: 1px dashed var(--u-accent, #E30613); border-radius: 8px;
	background: var(--u-surface, #FAFAFA); font-size: .875rem; color: var(--u-muted, #57514F);
}
.dvu-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dvu-muted, .dvu-note, .dvu-fineprint { color: var(--u-muted); font-size: .8125rem; line-height: 1.6; }
.dvu-note { margin: 8px 0 0; }

.dvu-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 10px 18px;
	border: 1px solid var(--u-ink); border-radius: 999px; background: #fff;
	color: var(--u-ink); font: inherit; font-weight: 700; font-size: .875rem; cursor: pointer;
	transition: background .15s, color .15s;
}
.dvu-btn:hover:not(:disabled) { background: var(--u-ink); color: #fff; }
.dvu-btn:disabled { opacity: .45; cursor: not-allowed; }
.dvu-btn--primary { background: var(--u-accent); border-color: var(--u-accent); color: #fff; }
.dvu-btn--primary:hover:not(:disabled) { background: var(--dv-accent-hover, #C1050F); border-color: var(--dv-accent-hover, #C1050F); }
.dvu-btn--block { display: flex; width: 100%; }
.dvu-btn:focus-visible, .dvu-drop:focus-visible, .dvu input:focus-visible {
	outline: 2px solid var(--u-accent); outline-offset: 2px;
}

.dvu-error {
	margin: 12px 0 0; padding: 10px 12px;
	border-left: 3px solid var(--u-accent); background: #FDF2F3;
	color: #8A0510; font-size: .875rem; line-height: 1.5;
}

/* ----------------------------------------------------------- layout */

.dvu-grid { display: grid; gap: 16px; }
@media (min-width: 1000px) { .dvu-grid { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; } }
@media (max-width: 999px) { .dvu-grid { grid-template-columns: minmax(0, 1fr); } }

.dvu-main, .dvu-side {
	padding: 16px; border: 1px solid var(--u-line); border-radius: 12px; background: #fff;
}
.dvu-side__title { margin: 0 0 12px; font-size: 1rem; font-weight: 800; }

.dvu-step {
	display: flex; align-items: center; gap: 10px;
	margin: 20px 0 12px; font-size: 1rem; font-weight: 800;
}
.dvu-step:first-of-type { margin-top: 0; }
.dvu-step span {
	display: grid; place-items: center; width: 26px; height: 26px;
	border-radius: 999px; background: var(--u-accent); color: #fff;
	font-size: .8125rem; font-weight: 700;
}

/* ------------------------------------------------------------- drop */

.dvu-drop {
	display: flex; flex-direction: column; align-items: center; gap: 6px;
	padding: 26px 16px; text-align: center; cursor: pointer;
	border: 2px dashed var(--u-line); border-radius: 12px; background: var(--u-surface);
	transition: border-color .15s, background .15s;
}
.dvu-drop:hover, .dvu-drop.is-over { border-color: var(--u-accent); background: #fff; }
.dvu-drop__icon { font-size: 1.5rem; color: var(--u-accent); line-height: 1; }
.dvu-drop__text { font-weight: 700; font-size: .9375rem; }
.dvu-drop__note { font-size: .75rem; color: var(--u-muted); }

/* ------------------------------------------------------------- rows */

.dvu-rows { display: grid; gap: 10px; }
.dvu-row {
	display: grid; grid-template-columns: 64px minmax(0,1fr) 32px; gap: 12px; align-items: start;
	padding: 12px; border: 1px solid var(--u-line); border-radius: 10px;
}
.dvu-row__thumb {
	width: 64px; height: 64px; border-radius: 8px; overflow: hidden;
	display: grid; place-items: center;
	background:
		linear-gradient(45deg,#eee 25%,transparent 25%,transparent 75%,#eee 75%) 0 0/12px 12px,
		linear-gradient(45deg,#eee 25%,#fff 25%,#fff 75%,#eee 75%) 6px 6px/12px 12px;
}
.dvu-row__thumb img { max-width: 100%; max-height: 100%; display: block; }
.dvu-row__pdf { font-size: .6875rem; font-weight: 700; color: var(--u-muted); }
.dvu-row__name {
	margin: 0 0 8px; font-weight: 700; font-size: .875rem;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dvu-row__fields { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.dvu-row__fields label { display: block; font-size: .6875rem; color: var(--u-muted); }
.dvu-row__fields span { display: block; margin-bottom: 4px; }
.dvu-row__fields input {
	width: 100%; padding: 8px 10px; font: inherit; font-size: .875rem;
	border: 1px solid var(--u-line); border-radius: 8px; color: var(--u-ink);
}
.dvu-row__meta { margin: 8px 0 0; font-size: .75rem; color: var(--u-muted); }
.dvu-row__meta.is-low { color: #8A0510; }
.dvu-row__del {
	width: 32px; height: 32px; border: 1px solid var(--u-line); border-radius: 8px;
	background: #fff; color: var(--u-muted); font-size: 1.125rem; line-height: 1; cursor: pointer;
}
.dvu-row__del:hover { border-color: var(--u-accent); color: var(--u-accent); }
.dvu-empty { margin: 12px 0 0; color: var(--u-muted); font-size: .875rem; }

/* ---------------------------------------------------------- summary */

.dvu-sum { margin: 0; }
.dvu-sum__row {
	display: flex; justify-content: space-between; gap: 12px; align-items: baseline;
	padding: 8px 0; border-bottom: 1px solid var(--u-line); font-size: .875rem;
}
.dvu-sum__row dt { margin: 0; color: var(--u-muted); }
.dvu-sum__row dt span { display: block; font-size: .75rem; opacity: .8; }
.dvu-sum__row dd { margin: 0; font-weight: 700; text-align: right; white-space: nowrap; }
.dvu-sum__row--total { border-bottom: 0; padding-top: 12px; font-size: 1.125rem; }
.dvu-sum__row--total dt { color: var(--u-ink); font-weight: 800; }
.dvu-sum__row--total dd { color: var(--u-accent); font-weight: 800; }
.dvu-tip {
	margin: 10px 0 0; padding: 10px 12px; border-radius: 8px;
	background: #FFF8E6; color: #6B4E00; font-size: .8125rem; line-height: 1.55;
}
.dvu-check { display: flex; gap: 8px; align-items: flex-start; font-size: .8125rem; line-height: 1.5; }
.dvu-check input { margin-top: 2px; flex: none; }
.dvu-ack {
	margin: 12px 0; padding: 10px 12px;
	border: 1px solid var(--u-line); border-radius: 8px; background: var(--u-surface);
}

/* ------------------------------------------------- mobile action bar */

.dvu-mbar { display: none; }
@media (max-width: 999px) {
	.dvu-side { position: static; }
	.dvu-mbar {
		position: sticky; bottom: 0; z-index: 3;
		display: flex; align-items: center; gap: 12px;
		margin-top: 12px; padding: 10px 12px;
		border: 1px solid var(--u-line); border-radius: 12px;
		background: rgba(255,255,255,.97);
		backdrop-filter: saturate(140%) blur(6px);
		box-shadow: 0 -2px 10px rgba(0,0,0,.06);
	}
	.dvu-mbar__total { flex: 1 1 auto; min-width: 0; line-height: 1.25; }
	.dvu-mbar__label {
		display: block; font-size: .6875rem; text-transform: uppercase;
		letter-spacing: .04em; color: var(--u-muted);
	}
	.dvu-mbar__value { display: block; font-size: 1.125rem; font-weight: 800; }
	.dvu-mbar .dvu-btn { flex: 0 0 auto; }
}
@media (max-width: 430px) {
	.dvu-mbar { gap: 8px; padding: 8px 10px; }
	.dvu-mbar__value { font-size: 1rem; }
	.dvu-mbar .dvu-btn { padding: 10px 12px; font-size: .8125rem; }
}
@media (max-width: 360px) {
	.dvu-mbar__label { display: none; }
	.dvu-row { grid-template-columns: 48px minmax(0,1fr) 28px; gap: 8px; padding: 10px; }
	.dvu-row__thumb { width: 48px; height: 48px; }
	.dvu-row__fields { grid-template-columns: 1fr 1fr; }
	.dvu-main, .dvu-side { padding: 12px; }
}

/* -------------------------------------------------- content blocks */

.dvu-table-wrap {
	overflow-x: auto; -webkit-overflow-scrolling: touch;
	border: 1px solid var(--dv-line, #E4E0DF); border-radius: 12px; background: #fff;
}
.dvu-table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.dvu-table th, .dvu-table td {
	padding: 12px 16px; text-align: left;
	border-bottom: 1px solid var(--dv-line, #E4E0DF); white-space: nowrap;
}
.dvu-table thead th {
	background: var(--dv-surface, #FAFAFA); font-size: .75rem;
	letter-spacing: .04em; text-transform: uppercase; color: var(--dv-ink-muted, #57514F);
}
.dvu-table tbody tr:last-child th, .dvu-table tbody tr:last-child td { border-bottom: 0; }
.dvu-chip {
	display: inline-block; padding: 3px 10px; border-radius: 999px;
	background: var(--dv-accent, #E30613); color: #fff; font-size: .75rem; font-weight: 700;
}
.dvu-chip--plain { background: var(--dv-surface-alt, #F5F5F5); color: var(--dv-ink, #161616); font-weight: 500; }
.dvu-chip--warn { background: #FDF2F3; color: #8A0510; font-weight: 500; }
.dvu-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dvu-chips > li { margin: 0; }

@media (max-width: 599px) {
	.dvu-table--prices, .dvu-table--prices thead, .dvu-table--prices tbody,
	.dvu-table--prices tr, .dvu-table--prices th, .dvu-table--prices td { display: block; white-space: normal; }
	.dvu-table--prices thead { display: none; }
	.dvu-table--prices tbody tr { border-bottom: 1px solid var(--dv-line, #E4E0DF); padding: 6px 0; }
	.dvu-table--prices tbody th { border-bottom: 0; font-weight: 700; padding-bottom: 2px; }
	.dvu-table--prices tbody td {
		border-bottom: 0; display: flex; justify-content: space-between; gap: 12px; padding: 4px 16px;
	}
	.dvu-table--prices tbody td::before {
		content: attr(data-label); color: var(--dv-ink-muted, #57514F); font-size: .8125rem;
	}
}

.dvu-specs {
	margin: 0; border: 1px solid var(--dv-line, #E4E0DF); border-radius: 12px;
	overflow: hidden; background: #fff;
}
.dvu-specs__row {
	display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 12px 16px;
	border-bottom: 1px solid var(--dv-line, #E4E0DF);
}
.dvu-specs__row:last-child { border-bottom: 0; }
.dvu-specs dt {
	flex: 0 0 auto; min-width: 200px; margin: 0;
	font-size: .8125rem; color: var(--dv-ink-muted, #57514F);
}
.dvu-specs dd { flex: 1 1 220px; margin: 0; font-weight: 500; }

.dvu-surfaces { display: grid; gap: 24px; }
@media (min-width: 800px) { .dvu-surfaces { grid-template-columns: 1fr 1fr; } }
.dvu-surfaces__title { margin: 0 0 12px; font-size: 1rem; font-weight: 800; }
.dvu-caution {
	margin: 20px 0 0; padding: 12px 14px; border-radius: 8px;
	background: var(--dv-surface, #FAFAFA); color: var(--dv-ink-muted, #57514F);
	font-size: .8125rem; line-height: 1.6;
}

.dvu-faq {
	border: 1px solid var(--dv-line, #E4E0DF); border-radius: 12px;
	overflow: hidden; background: #fff;
}
.dvu-faq__item { border-bottom: 1px solid var(--dv-line, #E4E0DF); }
.dvu-faq__item:last-child { border-bottom: 0; }
.dvu-faq__q {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 16px; cursor: pointer; font-weight: 700; list-style: none;
	color: var(--dv-ink, #161616);
}
.dvu-faq__q::-webkit-details-marker { display: none; }
.dvu-faq__q::marker { content: ""; }
.dvu-faq__q::after { content: "+"; flex: none; font-size: 1.25rem; font-weight: 400; color: var(--dv-ink-muted, #57514F); }
.dvu-faq__item[open] .dvu-faq__q::after { content: "\2212"; color: var(--dv-accent, #E30613); }
.dvu-faq__q:hover { background: var(--dv-surface, #FAFAFA); }
.dvu-faq__a {
	padding: 0 16px 16px; max-width: 74ch;
	color: var(--dv-ink-muted, #57514F); line-height: 1.7;
}
.dvu-faq__a p { margin: 0 0 8px; }
.dvu-faq__a p:last-child { margin-bottom: 0; }

@media (prefers-reduced-motion: reduce) { .dvu-btn, .dvu-drop { transition: none; } }

/* ---------- Category hero visual ---------- */
.dvu-hero-figure{margin:0}
.dvu-hero-figure .dvu-hero__img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 18px 44px rgba(22,22,22,.16)}

/* ---------- Ordering routes ---------- */
.dvu-paths{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:1rem;margin-top:1.25rem}
.dvu-path{display:flex;flex-direction:column;border:1px solid #e4e4e4;border-radius:14px;background:#fff;padding:1.35rem 1.25rem}
.dvu-path.is-live{border-color:#E30613;box-shadow:0 10px 26px rgba(227,6,19,.09)}
.dvu-path.is-soon{background:#fafafa}
.dvu-path__flag{margin:0 0 .6rem;font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.dvu-path.is-live .dvu-path__flag{color:#E30613}
.dvu-path.is-soon .dvu-path__flag{color:#6a6a6a}
.dvu-path__title{margin:0 0 .5rem;font-size:1.12rem;line-height:1.25;color:#161616}
.dvu-path__desc{margin:0 0 .65rem;font-size:.92rem;line-height:1.55;color:#3d3d3d}
.dvu-path__best{margin:0 0 1.1rem;font-size:.84rem;line-height:1.5;color:#6a6a6a}
.dvu-path__cta{margin:auto 0 0}
.dvu-path__cta .dv-btn{width:100%;text-align:center}