/* Wrapper around the design when used as the single-product template. */
.npp-single-wrap {
	padding: 40px 20px 80px;
}

.npp {
	--npp-swatch-active: #1d1d1f;
	--npp-storage-active-bg: #f5f5f7;
	--npp-border: #d2d2d7;
	--npp-muted: #6e6e73;
	max-width: 1200px;
	margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: #1d1d1f;
}

.npp--placeholder {
	padding: 40px;
	text-align: center;
	color: #6e6e73;
	border: 1px dashed #d2d2d7;
	border-radius: 12px;
}

/* Breadcrumb */
.npp__breadcrumb {
	font-size: 13px;
	color: var(--npp-muted);
	margin-bottom: 20px;
}

.npp__breadcrumb a {
	color: var(--npp-muted);
	text-decoration: none;
}

.npp__breadcrumb a:hover {
	color: #1d1d1f;
}

.npp__sep {
	margin: 0 6px;
	opacity: 0.6;
}

/* Grid */
.npp__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: start;
}

/* Gallery */
.npp__stage {
	position: relative;
	background: #f5f5f7;
	border-radius: 18px;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.npp__stage-img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: opacity 0.2s ease;
}

.npp__badge {
	position: absolute;
	top: 16px;
	left: 16px;
	background: #1d1d1f;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	padding: 4px 12px;
	border-radius: 999px;
	z-index: 2;
}

.npp__thumbs {
	display: flex;
	gap: 10px;
	margin-top: 14px;
}

.npp__thumb {
	width: 64px;
	height: 64px;
	border: 1px solid var(--npp-border);
	border-radius: 8px;
	background: #f5f5f7;
	cursor: pointer;
	overflow: hidden;
	padding: 4px;
	transition: border-color 0.15s ease;
}

.npp__thumb.is-active {
	border-color: #1d1d1f;
	border-width: 2px;
}

.npp__thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Summary */
.npp__eyebrow {
	font-size: 13px;
	color: var(--npp-muted);
	margin-bottom: 6px;
}

.npp__finance {
	font-size: 14px;
	color: var(--npp-muted);
	margin-bottom: 8px;
}

.npp__title {
	font-size: 34px;
	line-height: 1.1;
	font-weight: 600;
	letter-spacing: -0.01em;
	margin: 0 0 12px;
}

.npp__rating {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	font-size: 13px;
	color: var(--npp-muted);
	margin-bottom: 20px;
}

.npp__rating .star-rating {
	color: #f5a623;
}

/* SKU line under the title */
.npp__sku-line {
	font-size: 13px;
	color: var(--npp-muted);
	margin: -4px 0 16px;
}

.npp__sku-line span {
	color: #1d1d1f;
}

.npp__price-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 0;
	border-top: 1px solid var(--npp-border);
	flex-wrap: wrap;
}

.npp__price {
	font-size: 26px;
	font-weight: 600;
}

.npp__price del {
	color: var(--npp-muted);
	font-weight: 400;
	font-size: 0.8em;
	margin-right: 8px;
}

.npp__stock {
	font-size: 13px;
}

.npp__stock.is-in {
	color: #1d1d1f;
}

.npp__stock.is-out {
	color: #b32d2e;
}

.npp__short {
	font-size: 15px;
	line-height: 1.5;
	color: #333;
	margin-bottom: 24px;
}

/* Options */
.npp__option {
	padding: 18px 0;
	border-top: 1px solid var(--npp-border);
}

.npp__option-label {
	display: block;
	font-size: 13px;
	color: var(--npp-muted);
	margin-bottom: 12px;
}

.npp__swatches {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.npp__swatch {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 1px solid rgba( 0, 0, 0, 0.15 );
	padding: 0;
	background: transparent;
	cursor: pointer;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: box-shadow 0.15s ease;
}

.npp__swatch-dot {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: var(--npp-swatch-color, #ccc);
	border: 2px solid #fff;
	box-sizing: border-box;
}

.npp__swatch.is-active {
	box-shadow: 0 0 0 2px var(--npp-swatch-active);
}

/* Storage */
.npp__storage-list {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.npp__storage-btn {
	min-width: 64px;
	padding: 8px 16px;
	border: 1px solid var(--npp-border);
	border-radius: 999px;
	background: #fff;
	font-size: 14px;
	cursor: pointer;
	transition: all 0.15s ease;
}

.npp__storage-btn:hover {
	border-color: #86868b;
}

.npp__storage-btn.is-active {
	border-color: #1d1d1f;
	background: var(--npp-storage-active-bg);
	font-weight: 600;
}

/* Cart row */
.npp__cart-row {
	display: flex;
	gap: 12px;
	margin: 24px 0 12px;
	align-items: stretch;
}

.npp__qty {
	display: flex;
	align-items: center;
	border: 1px solid var(--npp-border);
	border-radius: 10px;
	overflow: hidden;
	height: 52px;
	flex: 0 0 auto;
}

.npp__qty-btn {
	width: 44px;
	height: 100%;
	border: none;
	background: transparent;
	font-size: 18px;
	cursor: pointer;
	color: #1d1d1f;
	display: flex;
	align-items: center;
	justify-content: center;
}

.npp__qty-input {
	width: 44px;
	height: 100%;
	border: none;
	text-align: center;
	font-size: 15px;
	-moz-appearance: textfield;
}

.npp__qty-input::-webkit-outer-spin-button,
.npp__qty-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Buttons */
.npp__btn {
	border: none;
	border-radius: 10px;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	padding: 0 24px;
	height: 52px;
	transition: opacity 0.15s ease, background 0.15s ease;
}

.npp__btn--cart {
	flex: 1;
	background: #1d1d1f;
	color: #fff;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.npp__btn--cart:hover {
	background: #000;
}

.npp__btn--buy {
	width: 100%;
	background: #e8e8ed;
	color: #1d1d1f;
	margin-bottom: 16px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.npp__btn--buy:hover {
	background: #dcdce1;
}

.npp__btn.is-loading {
	opacity: 0.6;
	pointer-events: none;
}

/* Success / error notice */
.npp__notice {
	display: none;
	margin: 4px 0 16px;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.4;
}

.npp__notice.is-visible {
	display: block;
}

.npp__notice--success {
	background: #e7f6ec;
	color: #1a7f3c;
	border: 1px solid #b7e4c7;
}

.npp__notice--error {
	background: #fdecea;
	color: #b32d2e;
	border: 1px solid #f5c2c0;
}

.npp__notice a {
	color: inherit;
	font-weight: 600;
	text-decoration: underline;
	margin-left: 6px;
}

/* Payments */
.npp__payments {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 8px;
}

.npp__express {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.npp__express:empty {
	display: none;
}

.npp__pay-row {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	border-radius: 8px;
	background: #f5f5f7;
	color: #1d1d1f;
	font-size: 15px;
	text-decoration: none;
	padding: 12px;
}

.npp__pay-row--sepa:hover {
	background: #ececf0;
}

.npp__pay-row--paypal:empty {
	display: none;
}

/*
 * Safety net: the element renders its own styled quantity, swatches, storage
 * and cart/buy buttons. If the theme or a WooCommerce hook injects the native
 * single-product add-to-cart form (variation dropdowns + a second add-to-cart)
 * anywhere inside our element, hide it — scoped strictly to .npp so the real
 * cart/checkout pages are never affected.
 */
.npp .variations_form,
.npp form.cart.variations_form,
.npp .npp__wc-form {
	display: none !important;
}

/* Bottom info */
.npp__info {
	margin-top: 72px;
}

.npp__info-title {
	font-size: 28px;
	font-weight: 600;
	letter-spacing: -0.01em;
	margin: 0 0 24px;
}

.npp__description,
.npp__specs,
.npp__highlights {
	padding: 40px 0;
	border-top: 1px solid var(--npp-border);
}

.npp__description-body {
	font-size: 16px;
	line-height: 1.6;
	color: #333;
	max-width: 760px;
}

/* Specs table */
.npp__specs-table {
	width: 100%;
	border-collapse: collapse;
	max-width: 760px;
}

.npp__specs-table th,
.npp__specs-table td {
	text-align: left;
	padding: 14px 16px;
	border-bottom: 1px solid var(--npp-border);
	font-size: 15px;
	vertical-align: top;
}

.npp__specs-table th {
	width: 34%;
	color: var(--npp-muted);
	font-weight: 500;
}

/* Highlights */
.npp__highlights-grid {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) );
	gap: 24px;
}

.npp__highlight {
	background: #f5f5f7;
	border-radius: 14px;
	padding: 24px;
}

.npp__highlight-icon {
	font-size: 28px;
	display: block;
	margin-bottom: 12px;
}

.npp__highlight-title {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 8px;
}

.npp__highlight-text {
	font-size: 14px;
	line-height: 1.5;
	color: var(--npp-muted);
	margin: 0;
}

/* Responsive */

/* =========================================================================
   Marktplatz-Blöcke (portiert aus „Marktplatz Produktseite")
   Präfix: .npp-mkt-  ·  gerendert von includes/render-marktplatz.php
   ========================================================================= */
.npp {
	--npp-mkt-panel: #f5f5f7;
	--npp-mkt-text: #1d1d1f;
	--npp-mkt-green: #1b7a3d;
}

/* Topbar: Breadcrumb links, Teilen rechts */
.npp__topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}
.npp__topbar .npp__breadcrumb {
	margin-bottom: 0;
}

/* Teilen */
.npp-mkt-share {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--npp-muted);
}
.npp-mkt-share-label { font-size: 13px; }
.npp-mkt-share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--npp-mkt-panel);
	color: var(--npp-mkt-text);
	text-decoration: none;
	transition: background .15s;
}
.npp-mkt-share-btn:hover { background: #e8e8ed; }

/* Finanzierung */
.npp-mkt-finance {
	font-size: 14px;
	color: var(--npp-muted);
	margin: 4px 0 16px;
}
.npp-mkt-finance strong { color: var(--npp-mkt-text); }
.npp-mkt-finance a { color: var(--npp-mkt-text); text-decoration: underline; }

/* Icon-Bilder generisch */
.npp-mkt-ico-img { width: 24px; height: 24px; object-fit: contain; display: inline-block; }

/* Lieferzeit-Kasten */
.npp-mkt-ship-est {
	border: 1px solid var(--npp-border);
	border-radius: 14px;
	padding: 8px 16px;
	margin-top: 16px;
	background: #fff;
}
.npp-mkt-ship-row {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 0;
}
.npp-mkt-ship-row + .npp-mkt-ship-row { border-top: 1px solid #eee; }
.npp-mkt-ship-ico {
	width: 42px;
	height: 42px;
	min-width: 42px;
	border-radius: 50%;
	background: var(--npp-mkt-panel);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	overflow: hidden;
	flex: 0 0 auto;
}
.npp-mkt-ship-ico .npp-mkt-ico-img { width: 26px; height: 26px; }
.npp-mkt-ship-info { flex: 1; min-width: 0; }
.npp-mkt-ship-name { font-weight: 700; font-size: 15px; color: var(--npp-mkt-text); }
.npp-mkt-ship-eta { font-size: 13px; color: var(--npp-muted); margin-top: 2px; }
.npp-mkt-ship-eta strong { color: var(--npp-mkt-text); font-weight: 700; }
.npp-mkt-ship-note { font-size: 12px; color: var(--npp-mkt-green); font-weight: 600; margin-top: 3px; }
.npp-mkt-ship-cost { font-weight: 700; font-size: 14px; white-space: nowrap; color: var(--npp-mkt-text); }

/* Blockrahmen (Lieferung / Schutzpaket / Versprechen / Zahlung) */
.npp-mkt-delivery,
.npp-mkt-protection,
.npp-mkt-promise,
.npp-mkt-payments {
	border-top: 1px solid var(--npp-border);
	padding-top: 22px;
	margin-top: 22px;
}

/* Lieferung / Abholung */
.npp-mkt-delivery-grid {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 12px;
	align-items: start;
	text-align: center;
}
.npp-mkt-delivery-opt {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	font-size: 14px;
}
.npp-mkt-delivery-ico {
	font-size: 22px;
	background: var(--npp-mkt-panel);
	width: 48px;
	height: 48px;
	min-width: 48px;
	min-height: 48px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 4px;
	overflow: hidden;
	flex: 0 0 auto;
}
.npp-mkt-delivery-ico .npp-mkt-ico-img { width: 30px; height: 30px; min-width: 30px; min-height: 30px; object-fit: contain; display: block; }
.npp-mkt-delivery-sub { color: var(--npp-muted); font-size: 13px; line-height: 1.35; }
.npp-mkt-delivery-sep { color: var(--npp-muted); font-size: 13px; align-self: center; padding-top: 24px; }
.npp-mkt-delivery-off { opacity: .7; }
.npp-mkt-ship-price s { color: var(--npp-muted); margin-right: 6px; }
.npp-mkt-ship-price b { color: var(--npp-mkt-green); }

/* Überschriften der Blöcke */
.npp-mkt-h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--npp-mkt-text); }

/* Schutzpaket */
.npp-mkt-protection-sub { color: var(--npp-muted); font-size: 14px; margin: 0 0 14px; }
.npp-mkt-plan {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 0;
	border-top: 1px solid #eee;
	font-size: 14px;
	cursor: pointer;
}
.npp-mkt-plan:first-of-type { border-top: none; }
.npp-mkt-plan-check { width: 18px; height: 18px; flex: 0 0 auto; }
.npp-mkt-plan-label { flex: 1; }
.npp-mkt-plan-price { font-weight: 700; white-space: nowrap; }

/* Unser Versprechen (Akkordeon) */
.npp-mkt-acc { border-bottom: 1px solid var(--npp-border); }
.npp-mkt-acc-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	background: none;
	border: none;
	padding: 16px 0;
	font-size: 15px;
	font-weight: 600;
	color: var(--npp-mkt-text);
	cursor: pointer;
	text-align: left;
}
.npp-mkt-acc-ico { transition: transform .2s; font-size: 18px; color: var(--npp-muted); }
.npp-mkt-acc.is-open .npp-mkt-acc-ico { transform: rotate(180deg); }
.npp-mkt-acc-body {
	padding: 0 0 18px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--npp-mkt-text);
	display: none;
}
.npp-mkt-acc.is-open .npp-mkt-acc-body { display: block; }

/* Wir akzeptieren */
.npp-mkt-pay-row {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	align-items: center;
	gap: 6px;
	width: 100%;
}
.npp-mkt-pay-item {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
}
.npp-mkt-pay-item img {
	height: auto;
	width: 100%;
	max-width: 100%;
	max-height: 22px;
	object-fit: contain;
	display: block;
}

/* Mobil */
@media (max-width: 600px) {
	.npp-mkt-delivery-grid { gap: 8px; }
	.npp-mkt-delivery-opt { font-size: 13px; }
	.npp-mkt-delivery-ico { width: 40px; height: 40px; min-width: 40px; min-height: 40px; }
	.npp-mkt-delivery-ico .npp-mkt-ico-img { width: 24px; height: 24px; min-width: 24px; min-height: 24px; }
	.npp-mkt-delivery-sub { font-size: 12px; }
	.npp-mkt-delivery-sep { padding-top: 20px; }
}

/* =========================================================================
   Marktplatz: Kurzbeschreibung links + Bewertungen (portiert aus MPP)
   ========================================================================= */
.npp {
	--npp-mkt-star: #f5a623;
	--npp-mkt-cart-bg: #1d1d1f;
	--npp-mkt-cart-text: #fff;
	--npp-mkt-selected: #1d1d1f;
}

/* Kurzbeschreibung unter dem Lieferzeit-Kasten (linke Spalte) */
.npp__mkt--short-desc {
	margin-top: 18px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--npp-mkt-text);
}
.npp__mkt--short-desc p { margin: 0 0 10px; }
.npp__mkt--short-desc ul { margin: 0 0 10px; padding-left: 20px; }

/* Der Lieferzeit-Kasten sitzt jetzt links: oberer Abstand zur Galerie */
.npp__gallery .npp__mkt--ship { margin-top: 4px; }

/* Sterne-Overlay */
.npp-mkt-stars {
	position: relative;
	display: inline-block;
	white-space: nowrap;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 1px;
}
.npp-mkt-stars-empty { color: #dcdce1; }
.npp-mkt-stars-full { position: absolute; left: 0; top: 0; overflow: hidden; color: var(--npp-mkt-star); }

/* Bewertungsbereich */
.npp-mkt-h2 { font-size: 22px; font-weight: 700; margin: 0; color: var(--npp-mkt-text); }
.npp-mkt-muted { color: var(--npp-muted); }
.npp__mkt--reviews {
	margin-top: 40px;
	padding-top: 32px;
	border-top: 1px solid var(--npp-border);
}
.npp-mkt-reviews-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.npp-mkt-reviews-head-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.npp-mkt-collect { color: var(--npp-mkt-text); text-decoration: underline; font-size: 14px; }
.npp-mkt-review-add-btn {
	border: 1px solid var(--npp-mkt-selected);
	background: #fff;
	color: var(--npp-mkt-text);
	border-radius: 8px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.npp-mkt-review-add-btn:hover { background: var(--npp-mkt-panel); }
.npp-mkt-reviews-summary {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 14px 0 22px;
	font-size: 16px;
}
.npp-mkt-review-list { display: flex; flex-direction: column; gap: 26px; }
.npp-mkt-review-hidden { display: none; }
.npp-mkt-review-top { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.npp-mkt-avatar { border-radius: 50%; }
.npp-mkt-review-author { font-weight: 700; font-size: 15px; }
.npp-mkt-review-date { color: var(--npp-muted); font-size: 13px; }
.npp-mkt-review-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.npp-mkt-verified { color: var(--npp-mkt-star); font-size: 13px; font-weight: 600; }
.npp-mkt-review-text { font-size: 14px; line-height: 1.6; }
.npp-mkt-review-images { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.npp-mkt-review-img {
	display: block;
	width: 72px;
	height: 72px;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid var(--npp-border);
}
.npp-mkt-review-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.npp-mkt-reviews-more-wrap { text-align: center; margin-top: 28px; }
.npp-mkt-reviews-more {
	border: 1px solid var(--npp-border);
	background: #fff;
	border-radius: 8px;
	padding: 12px 28px;
	font-size: 14px;
	cursor: pointer;
	color: var(--npp-mkt-text);
}
.npp-mkt-reviews-more:hover { border-color: #999; }
.npp-mkt-no-reviews { margin-top: 8px; }

/* Bewertungsformular */
.npp-mkt-review-form {
	border: 1px solid var(--npp-border);
	border-radius: 12px;
	padding: 20px;
	margin: 18px 0 8px;
	background: var(--npp-mkt-panel);
}
.npp-mkt-rf-row { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.npp-mkt-rf-row label { font-size: 13px; font-weight: 600; color: var(--npp-mkt-text); }
.npp-mkt-rf-row input[type=text],
.npp-mkt-rf-row input[type=email],
.npp-mkt-rf-row textarea {
	border: 1px solid var(--npp-border);
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 14px;
	font-family: inherit;
	background: #fff;
	width: 100%;
	box-sizing: border-box;
}
.npp-mkt-rf-row input[readonly] { background: #f0f0f2; color: var(--npp-muted); }
.npp-mkt-rf-stars { display: flex; gap: 4px; }
.npp-mkt-rf-star {
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	color: #dcdce1;
	cursor: pointer;
	padding: 0;
}
.npp-mkt-rf-star.is-on { color: var(--npp-mkt-star); }
.npp-mkt-rf-previews { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.npp-mkt-rf-preview { width: 60px; height: 60px; object-fit: cover; border-radius: 8px; border: 1px solid var(--npp-border); }
.npp-mkt-rf-submit {
	background: var(--npp-mkt-cart-bg);
	color: var(--npp-mkt-cart-text);
	border: none;
	border-radius: 8px;
	padding: 13px 24px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}
.npp-mkt-rf-submit:hover { opacity: .9; }
.npp-mkt-rf-submit.is-loading { opacity: .6; pointer-events: none; }
.npp-mkt-rf-note { font-size: 12px; color: var(--npp-muted); margin: 10px 0 0; }
.npp-mkt-rf-msg {
	padding: 12px 14px;
	border-radius: 8px;
	font-size: 14px;
	margin-bottom: 14px;
	background: #e7f6ec;
	color: #1b7a3d;
	border: 1px solid #bfe6cd;
}
.npp-mkt-rf-msg.is-error { background: #fdecec; color: #b3261e; border-color: #f3c2c0; }
.npp-mkt-h3 { font-size: 17px; font-weight: 700; margin: 0 0 10px; color: var(--npp-mkt-text); }

/* =========================================================================
   JoyBuy-Preisblock + Bewertungssterne oben
   ========================================================================= */
.npp__price-block {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin: 4px 0 2px;
}
.npp__price-main {
	font-size: 30px;
	font-weight: 700;
	color: #1d1d1f;
	line-height: 1.1;
	text-decoration: none;
}
.npp__price-main .amount,
.npp__price-main bdi { font-weight: 700; }
/* Falls WooCommerce-HTML als Fallback landet: nur den aktuellen Preis zeigen,
   nicht unterstreichen/durchstreichen. */
.npp__price-main ins { text-decoration: none; }
.npp__price-main del { display: none; }
.npp__price-uvp {
	font-size: 14px;
	color: var(--npp-muted);
}
.npp__price-uvp s { color: var(--npp-muted); }
.npp__price-discount {
	font-size: 14px;
	font-weight: 600;
	color: #1d1d1f;
}

/* Bewertungszeile oben (Sterne + Schnitt + Anzahl) */
.npp__rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 6px 0 10px;
	font-size: 14px;
}
.npp__rating-avg { font-weight: 700; color: #1d1d1f; }
.npp__rating .npp__review-count {
	color: var(--npp-muted);
	text-decoration: none;
}
.npp__rating .npp__review-count:hover { text-decoration: underline; }
/* Sterne-Overlay auch oben in der Rating-Zeile nutzbar */
.npp__rating .npp-mkt-stars { font-size: 16px; }

/* =========================================================================
   Zusatzoption-Produkte (Cross-Sell-Karten) + Toast
   ========================================================================= */
.npp__mkt--cross { margin-top: 22px; }
.npp-mkt-addons {
	border-top: 1px solid var(--npp-border);
	padding-top: 22px;
	margin-top: 22px;
}
.npp-mkt-addons-grid {
	display: grid;
	grid-template-columns: repeat(var(--npp-ac-d, 3), minmax(0, 1fr));
	gap: 16px;
}
.npp-mkt-addon-card {
	position: relative;
	border: 1px solid var(--npp-border);
	border-radius: 14px;
	padding: 12px;
	background: #fff;
	display: flex;
	flex-direction: column;
}
.npp-mkt-addon-media {
	display: block;
	background: var(--npp-mkt-panel);
	border-radius: 10px;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	margin-bottom: 10px;
}
.npp-mkt-addon-media img { width: 100%; height: 100%; object-fit: contain; display: block; }
.npp-mkt-addon-add {
	position: absolute;
	right: 18px;
	bottom: 16px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid var(--npp-border);
	background: #fff;
	color: var(--npp-mkt-text);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
	transition: background .15s;
}
.npp-mkt-addon-add:hover { background: var(--npp-mkt-panel); }
.npp-mkt-addon-add.is-loading { opacity: .5; pointer-events: none; }
.npp-mkt-addon-add.is-done { background: #1b7a3d; border-color: #1b7a3d; color: transparent; position: relative; }
.npp-mkt-addon-add.is-done::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 46%;
	width: 8px;
	height: 14px;
	border: solid #fff;
	border-width: 0 2.5px 2.5px 0;
	transform: translate(-50%, -50%) rotate(45deg);
}
.npp-mkt-addon-brand { font-weight: 700; font-size: 13px; color: var(--npp-mkt-text); margin-bottom: 2px; }
.npp-mkt-addon-title {
	display: -webkit-box;
	font-size: 14px;
	line-height: 1.35;
	color: var(--npp-mkt-text);
	text-decoration: none;
	margin-bottom: 8px;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.7em;
}
.npp-mkt-addon-title:hover { text-decoration: underline; }
.npp-mkt-addon-rating { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--npp-muted); margin-bottom: 8px; flex-wrap: wrap; }
.npp-mkt-addon-rnum { color: var(--npp-mkt-text); font-weight: 600; }
.npp-mkt-addon-price { margin-top: auto; }
.npp-mkt-addon-now { color: var(--npp-mkt-star); font-size: 18px; font-weight: 800; }
.npp-mkt-addon-now .amount, .npp-mkt-addon-now bdi { color: #1d1d1f; }
.npp-mkt-addon-uvp { font-size: 12px; color: var(--npp-muted); margin-top: 2px; }
.npp-mkt-addon-uvp s { margin-right: 6px; }
.npp-mkt-addon-disc { color: var(--npp-mkt-text); font-weight: 600; }

/* Tablet: eigene Spaltenzahl */
@media (max-width: 900px) {
	.npp-mkt-addons-grid { grid-template-columns: repeat(var(--npp-ac-t, 2), minmax(0, 1fr)); }
}
/* Mobil: horizontal scrollbar (scroll) oder Raster (mgrid) */
@media (max-width: 600px) {
	.npp-mkt-addons--mgrid .npp-mkt-addons-grid { grid-template-columns: repeat(var(--npp-ac-m, 2), minmax(0, 1fr)); }
	.npp-mkt-addons--mscroll .npp-mkt-addons-grid {
		display: flex;
		overflow-x: auto;
		gap: 12px;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 6px;
	}
	.npp-mkt-addons--mscroll .npp-mkt-addon-card { flex: 0 0 var(--npp-ac-mw, 78%); scroll-snap-align: start; }
}

/* Toast (Cross-Sell in den Warenkorb) */
.npp-mkt-toast {
	position: fixed;
	top: 20px;
	right: 20px;
	z-index: 9999;
	background: #1b7a3d;
	color: #fff;
	padding: 14px 18px;
	border-radius: 10px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .2);
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 14px;
	opacity: 0;
	transform: translateY(-12px);
	transition: opacity .3s, transform .3s;
	max-width: 92vw;
}
.npp-mkt-toast.is-in { opacity: 1; transform: translateY(0); }
.npp-mkt-toast a { color: #fff; text-decoration: underline; white-space: nowrap; }
@media (max-width: 600px) {
	.npp-mkt-toast { top: auto; bottom: 16px; left: 16px; right: 16px; }
}

/* =========================================================================
   MOBILE / TABLET (bis 1024px) – ans Dateiende verschoben, damit die
   Overrides in der Kaskade nach allen Basisregeln gewinnen (kein !important).
   ========================================================================= */
@media ( max-width: 1024px ) {
	/* Root wird zum einspaltigen Flex-Container; grid + Spalten transparent,
	   damit ALLE Blöcke (inkl. Zusatzprodukte, die außerhalb des Grids liegen)
	   frei per order sortiert werden können. */
	.npp {
		display: flex;
		flex-direction: column;
		gap: 20px;
		/* An die verfügbare Containerbreite anpassen – KEIN 100vw/negativer
		   Margin (das kann selbst Überlauf/Versatz erzeugen). Gleiche
		   Außenabstände über symmetrisches Padding. */
		width: 100%;
		max-width: 100%;
		margin: 0;
		padding-left: 16px;
		padding-right: 16px;
		box-sizing: border-box;
	}
	/* Kein doppeltes Padding, falls über das Auto-Template gerendert. */
	.npp-single-wrap {
		padding-left: 0;
		padding-right: 0;
	}
	/* Nichts darf breiter als der Bildschirm werden (Kinder, nicht der Root). */
	.npp > *,
	.npp * {
		min-width: 0;
		max-width: 100%;
	}
	.npp img {
		max-width: 100%;
		height: auto;
	}
	/* Lange Produktnamen / Texte sauber an Wortgrenzen umbrechen. */
	.npp__title,
	.npp__eyebrow,
	.npp__breadcrumb,
	.npp__short,
	.npp__mkt--short-desc,
	.npp-mkt-addon-title {
		overflow-wrap: break-word;
		word-wrap: break-word;
	}
	.npp__grid,
	.npp__gallery,
	.npp__summary {
		display: contents;
	}

	/* Fallback: jedes direkte Kind ans Ende, spezifische Regeln überschreiben.
	   Verhindert, dass unbekannte/externe Blöcke (order:0) nach oben rutschen. */
	.npp > * { order: 19; }

	/* Gewünschte Reihenfolge auf Mobile/Tablet */
	.npp__topbar              { order: 1; }  /* Breadcrumb + Teilen ganz oben */
	.npp__gallery-media       { order: 2; }  /* Hauptbild + Galerie */
	.npp__head                { order: 3; }  /* Produktname + Bewertung */
	.npp__price-row           { order: 4; }  /* Preis + Auf Lager */
	.npp__mkt--finance        { order: 5; }  /* monatliche Zahlung */
	.npp__options-wrap        { order: 6; }  /* Farbe + Speicher + weitere */
	.npp__actions             { order: 7; }  /* Menge + Warenkorb + Jetzt kaufen */
	.npp__mkt--ship           { order: 8; }  /* Standard + Express Versand */
	.npp__mkt--short-desc     { order: 9; }  /* Kurzbeschreibung */
	.npp__mkt--delivery       { order: 10; } /* Lieferung / Abholung */
	.npp__mkt--cross          { order: 11; } /* Zusatzprodukte */
	.npp__mkt--protection     { order: 12; } /* Schutzpaket */
	.npp__mkt--promise        { order: 13; } /* Unser Versprechen */
	.npp__mkt--payments       { order: 14; } /* Wir akzeptieren */
	.npp__info                { order: 15; } /* Beschreibung / Specs */
	.npp__mkt--reviews        { order: 16; } /* Bewertungen */
	.npp__sections,
	.nps-sections             { order: 17; } /* Marketing-Sektionen */

	/* Abstände vereinheitlichen (gap übernimmt den Abstand) */
	.npp__m-order { margin-top: 0; margin-bottom: 0; }
	.npp__mkt--delivery,
	.npp__mkt--protection,
	.npp__mkt--promise,
	.npp__mkt--payments,
	.npp__mkt--cross {
		margin-top: 0;
		padding-top: 20px;
	}
	.npp__mkt--delivery .npp-mkt-delivery,
	.npp__mkt--protection .npp-mkt-protection,
	.npp__mkt--promise .npp-mkt-promise,
	.npp__mkt--payments .npp-mkt-payments,
	.npp__mkt--cross .npp-mkt-addons {
		margin-top: 0;
		padding-top: 0;
		border-top: none;
	}

	/* Kompaktere Kopf-/Preis-/Options-Abstände */
	.npp__head { margin-bottom: 0; }
	.npp__eyebrow { margin-bottom: 4px; }
	.npp__title { margin: 0 0 6px; font-size: 26px; }
	.npp__rating { margin: 6px 0 0; }
	.npp__price-row {
		margin: 0;
		border-top: none;
		padding: 0;
		justify-content: flex-start;
		align-items: baseline;
		gap: 6px 10px;
	}
	/* Preis + UVP + Rabatt nebeneinander (bei Bedarf sauberer Umbruch),
	   „Auf Lager" darunter in eigener linksbündiger Zeile. */
	.npp__price-block {
		flex: 1 1 100%;
		margin: 0;
	}
	.npp__price-main { font-size: 28px; }
	.npp__stock {
		flex: 1 1 100%;
		text-align: left;
		margin-top: 4px;
	}
	.npp__mkt--finance { margin: 0; }
	.npp__options-wrap { display: flex; flex-direction: column; gap: 16px; }
	.npp__option { margin: 0; }

	/* Kaufbereich: saubere Touch-Flächen, kein Überlauf */
	.npp__actions { width: 100%; }
	.npp__cart-row { display: flex; gap: 10px; align-items: stretch; margin: 0 0 10px; }
	.npp__qty { height: 50px; }
	.npp__qty-btn { width: 46px; }
	.npp__qty-input { width: 40px; }
	.npp__btn { height: 50px; font-size: 15px; }
	.npp__btn--cart { flex: 1; min-width: 0; }
	.npp__btn--buy { width: 100%; margin-bottom: 0; }

	.npp__gallery .npp__mkt--ship { margin-top: 0; }

	/* Teilen-Zeile oben neben der Breadcrumb */
	.npp__topbar {
		flex-wrap: nowrap;
		gap: 8px;
		margin-bottom: 0;
	}
	.npp__topbar .npp__breadcrumb {
		flex: 1 1 auto;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 12px;
	}
	.npp-mkt-share { flex: 0 0 auto; gap: 8px; }
	.npp-mkt-share-label { display: none; }
	.npp-mkt-share-btn { width: 34px; height: 34px; }

	.npp__info {
		margin-top: 0;
	}
}