/* ZP Konfigurátor – razítka. Vše scopované pod .zpr / .zpr-stage. */
.zpr, .zpr-stage {
	--zpr-ink: #16181d;
	--zpr-muted: #6b7079;
	--zpr-line: #e3e5e8;
	--zpr-soft: #f5f6f7;
	--zpr-accent: #e4002b;
	--zpr-ok: #1f8a4c;
	--zpr-r: 12px;
	--zpr-head: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
	--zpr-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
	color: var(--zpr-ink);
}
.zpr *, .zpr *::before, .zpr *::after, .zpr-stage * { box-sizing: border-box; }
.zpr [hidden] { display: none !important; }

/* Živý náhled */
.zpr-stage { margin: 0 0 6px; }
.zpr-stage--slot { position: sticky; top: 24px; }
.zpr-paper {
	display: flex; align-items: center; justify-content: center;
	height: clamp(180px, 32vw, 260px); padding: 20px 24px; overflow: hidden;
	border: 1px solid #ebe7dc; border-radius: 16px;
	background: radial-gradient(circle at 30% 20%, #fff 0, #f7f5ef 60%, #efece4 100%);
}
.zpr-stage--slot .zpr-paper { height: auto; aspect-ratio: 4 / 3; padding: 32px; }
.zpr-paper svg { width: 100%; height: 100%; overflow: visible; }
.zpr-paper.is-sample svg { opacity: .55; }
.zpr-stage-meta {
	display: flex; justify-content: space-between; gap: 12px; margin-top: 8px;
	font: 500 12px var(--zpr-mono); color: var(--zpr-muted);
}
@media (max-width: 900px) { .zpr-stage--slot { position: static; } }

/* Kroky */
.zpr-step { padding: 18px 0; border-top: 1px solid var(--zpr-line); }
.zpr-h { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.zpr-h b { font: 600 11px var(--zpr-mono); letter-spacing: .08em; color: var(--zpr-accent); }
.zpr-h h3 { margin: 0; font: 600 18px/1.2 var(--zpr-head); letter-spacing: -.01em; text-transform: none; }
.zpr-h em { margin-left: auto; font: 500 12px var(--zpr-mono); color: var(--zpr-muted); font-style: normal; }
.zpr-hint { margin: 10px 0 0; font-size: 13px; line-height: 1.45; color: var(--zpr-muted); }
.zpr-l { display: block; margin: 0 0 6px; font: 500 11px var(--zpr-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--zpr-muted); }
.zpr-note { margin: 0; padding: 12px 14px; border-radius: var(--zpr-r); background: var(--zpr-soft); font-size: 14px; line-height: 1.5; }

.zpr-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.zpr-tile {
	display: flex; flex-direction: column; gap: 3px; padding: 12px; text-align: left;
	border: 1.5px solid var(--zpr-line); border-radius: var(--zpr-r); background: #fff; color: var(--zpr-ink);
	cursor: pointer; text-transform: none; letter-spacing: normal; font: inherit; transition: border-color .15s;
}
.zpr-tile:hover { border-color: #b9bdc3; background: #fff; color: var(--zpr-ink); }
.zpr-tile[aria-checked="true"] { border-color: var(--zpr-ink); box-shadow: 0 0 0 1px var(--zpr-ink); }
.zpr-tile strong { font: 600 15px var(--zpr-head); }
.zpr-tile span { font-size: 12.5px; line-height: 1.35; color: var(--zpr-muted); }
.zpr-tile i { font: 500 11px var(--zpr-mono); font-style: normal; color: var(--zpr-ok); }

.zpr-lines { display: flex; flex-direction: column; gap: 6px; }
.zpr-lrow { display: flex; align-items: center; gap: 6px; }
.zpr-n { flex: 0 0 18px; text-align: right; font: 500 11px var(--zpr-mono); color: var(--zpr-muted); }
.zpr input[type=text], .zpr textarea {
	width: 100%; min-width: 0; margin: 0; border: 1.5px solid var(--zpr-line); border-radius: 10px; background: #fff;
	color: var(--zpr-ink); font: inherit; font-size: 15px; box-shadow: none;
}
.zpr input[type=text] { flex: 1; height: 40px; padding: 0 12px; }
.zpr textarea { min-height: 84px; padding: 10px 12px; resize: vertical; }
.zpr input[type=text]:focus, .zpr textarea:focus { outline: none; border-color: var(--zpr-ink); }
.zpr-tg {
	flex: 0 0 40px; width: 40px; height: 40px; padding: 0; border: 1.5px solid var(--zpr-line); border-radius: 10px;
	background: #fff; color: var(--zpr-ink); cursor: pointer; font: 700 14px var(--zpr-head); text-transform: none;
}
.zpr-tg--a { font-size: 12px; }
.zpr-tg[aria-pressed="true"] { background: var(--zpr-ink); border-color: var(--zpr-ink); color: #fff; }
.zpr-sub { margin: 6px 0 2px; font: 600 12px var(--zpr-mono); color: var(--zpr-muted); }
.zpr-sep { height: 1px; margin: 10px 0; background: var(--zpr-line); }

.zpr-row2 { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: end; margin-top: 14px; }
.zpr-row2--b { grid-template-columns: auto 1fr; }
.zpr-row2--b .zpr-hint { margin: 0; }
@media (max-width: 520px) { .zpr-row2, .zpr-row2--b { grid-template-columns: 1fr; } }
.zpr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.zpr-chip {
	padding: 8px 12px; border: 1.5px solid var(--zpr-line); border-radius: 999px; background: #fff; color: var(--zpr-ink);
	cursor: pointer; font-size: 14px; line-height: 1.1; text-transform: none; letter-spacing: normal;
}
.zpr-chip[aria-checked="true"] { border-color: var(--zpr-ink); box-shadow: 0 0 0 1px var(--zpr-ink); }
.zpr-seg { display: inline-flex; border: 1.5px solid var(--zpr-line); border-radius: 10px; overflow: hidden; }
.zpr-seg button { margin: 0; padding: 8px 11px; border: 0; border-radius: 0; background: #fff; color: var(--zpr-ink); cursor: pointer; font: 500 13px var(--zpr-mono); text-transform: none; }
.zpr-seg button + button { border-left: 1.5px solid var(--zpr-line); }
.zpr-seg button[aria-checked="true"] { background: var(--zpr-ink); color: #fff; }

.zpr-drop {
	display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 14px; text-align: center; cursor: pointer;
	border: 1.5px dashed #c9ccd1; border-radius: var(--zpr-r); background: var(--zpr-soft);
}
.zpr-drop:hover, .zpr-drop:focus, .zpr-drop.is-over { border-color: var(--zpr-ink); background: #eef0f2; outline: none; }
.zpr-drop strong { font: 600 15px var(--zpr-head); }
.zpr-drop span { font: 400 11px/1.4 var(--zpr-mono); color: var(--zpr-muted); }
.zpr-files { list-style: none; margin: 8px 0 0; padding: 0; }
.zpr-files li { display: flex; align-items: center; gap: 10px; margin: 6px 0 0; padding: 8px 10px; border: 1px solid var(--zpr-line); border-radius: 8px; font-size: 13px; }
.zpr-files li span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zpr-files li em { font: 400 11px var(--zpr-mono); font-style: normal; color: var(--zpr-muted); }
.zpr-files li.is-done em { color: var(--zpr-ok); }
.zpr-files li.is-error { border-color: #f1c0c7; background: #fdf2f4; }
.zpr-files li.is-error em { color: var(--zpr-accent); }
.zpr-x { padding: 0 2px; border: 0; background: none; color: var(--zpr-muted); cursor: pointer; font-size: 18px; line-height: 1; }

.zpr-sw { display: flex; flex-wrap: wrap; gap: 8px; }
.zpr-swb {
	position: relative; width: 34px; height: 34px; padding: 0; overflow: hidden; cursor: pointer;
	border: 1px solid rgba(0,0,0,.14); border-radius: 50%;
	box-shadow: inset 0 -6px 10px rgba(0,0,0,.12), inset 0 4px 6px rgba(255,255,255,.25); transition: transform .12s;
}
.zpr-swb:hover { transform: scale(1.08); }
.zpr-swb[aria-checked="true"] { outline: 2px solid var(--zpr-ink); outline-offset: 3px; }
.zpr-swb.tr {
	background-image: linear-gradient(45deg,#ddd 25%,transparent 25%,transparent 75%,#ddd 75%), linear-gradient(45deg,#ddd 25%,#fff 25%,#fff 75%,#ddd 75%) !important;
	background-size: 10px 10px !important; background-position: 0 0, 5px 5px !important;
}
.zpr-swb.tr::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--c); opacity: .72; }

.zpr-sum { margin: 4px 0 14px; padding: 14px 16px; border-radius: var(--zpr-r); background: var(--zpr-soft); }
.zpr-sum-r { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14px; }
.zpr-sum-r + .zpr-sum-r { margin-top: 6px; }
.zpr-sum-r strong { font: 600 14px var(--zpr-mono); }
.zpr-sum-t span { font: 600 16px var(--zpr-head); }
.zpr-sum-t small { margin-left: 4px; font: 400 11px var(--zpr-mono); color: var(--zpr-muted); }
.zpr-sum-t strong { font: 700 24px/1.1 var(--zpr-head); }
.zpr-err { margin: 10px 0 0; padding: 8px 10px; border-radius: 8px; background: #fdf2f4; color: var(--zpr-accent); font-size: 13px; }

/* Formulář WooCommerce / Elementor Add To Cart: konfigurátor přes celou šířku,
   pod ním řádek „Počet kusů“ + tlačítko. */
.zpr-active form.cart:not(.variations_form),
.zpr-active .variations_form .woocommerce-variation-add-to-cart {
	display: flex !important; flex-wrap: wrap !important; flex-direction: row !important; align-items: stretch !important; gap: 12px !important;
}
.zpr-active form.cart > .zpr,
.zpr-active .woocommerce-variation-add-to-cart > .zpr { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.zpr-active form.cart .quantity.zpr-qty {
	display: inline-flex !important; align-items: center; gap: 10px; flex: 0 0 auto !important; width: auto !important;
	margin: 0 !important; padding: 0 !important; background: none !important;
}
.zpr-active form.cart .quantity.zpr-qty input.qty {
	width: 72px !important; height: 52px; padding: 0 8px; border: 1.5px solid #e3e5e8; border-radius: 10px; background: #fff;
	font: 600 16px/1 "IBM Plex Mono", ui-monospace, monospace; text-align: center;
}
.zpr-active form.cart .single_add_to_cart_button { flex: 1 1 200px !important; width: auto !important; min-height: 52px; margin: 0 !important; border-radius: 12px; }
.zpr-qty-label { font: 500 11px/1.2 "IBM Plex Mono", ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; color: #6b7079; white-space: nowrap; }

/* Text jen pro čtečky obrazovky (nezávisle na motivu) */
.zpr .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Rozvržení kulatého razítka */
.zpr-seg--layout { margin: 0 0 12px; }
.zpr-seg--layout button { padding: 9px 18px; }
.zpr-arcs { margin-bottom: 4px; }
.zpr-arcs .zpr-lrow { margin-bottom: 8px; }

/* Motiv přidává tlačítkům za sebou odsazení (button + button) */
.zpr .zpr-swb, .zpr .zpr-tile, .zpr .zpr-chip, .zpr .zpr-tg { margin: 0 !important; }