/* =========================================================================
   Redtales DTF – WooCommerce-Feinschliff
   Angebots-Optik statt klassischem Shop. Nur harmonisierend, nicht destruktiv.
   ========================================================================= */

.wc-page { padding-block: 2rem 3rem; }

/* ---- Icons ---- */
.dtf-icon { flex: 0 0 auto; }

/* ---- Prominente Info-Note ---- */
.wc-page__note {
	display: flex;
	gap: var(--space-4, 1rem);
	align-items: flex-start;
	background: var(--color-surface-tint, #fbefe9);
	border: 1px solid var(--color-border, #ead9ce);
	border-left: 5px solid var(--color-primary, #c62630);
	border-radius: var(--radius-md, 12px);
	padding: var(--space-4, 1rem) var(--space-5, 1.5rem);
	margin-bottom: var(--space-6, 2rem);
	box-shadow: var(--shadow-soft, 0 3px 12px rgba(120,60,40,.08));
}
.wc-page__note-icon { color: var(--color-primary, #c62630); margin-top: 2px; }
.wc-page__note-text strong { display: block; font-size: 1.05rem; margin-bottom: .2rem; color: var(--color-text, #2a211e); }
.wc-page__note-text p { margin: 0; color: var(--color-muted-dark, #6d635e); }

/* ---- Produkt-Zusammenfassung: professioneller, weniger „Shop" ---- */
.woocommerce div.product .product_title { font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem); }
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--color-primary-dark, #9c1c25);
	font-weight: 800;
	font-size: 1.5rem;
}
/* „ab"-Startpreis kennzeichnen */
.woocommerce div.product p.price::before,
.related.products ul.products li.product .price::before {
	content: "ab ";
	font-size: .7em;
	font-weight: 600;
	color: var(--color-muted-dark, #6d635e);
	text-transform: uppercase;
	letter-spacing: .04em;
}

/* ---- Vertrauens-Badges (mit Icons) ---- */
.dtf-trust-badges {
	list-style: none;
	margin: var(--space-4, 1rem) 0 var(--space-2, .5rem);
	padding: 0;
	display: grid;
	gap: var(--space-2, .5rem);
}
.dtf-trust-badge {
	display: flex;
	align-items: center;
	gap: var(--space-3, .75rem);
	padding: var(--space-2, .5rem) var(--space-3, .75rem);
	background: var(--color-surface, #fff);
	border: 1px solid var(--color-border-light, #ece2db);
	border-radius: 999px;
	color: var(--color-text, #2a211e);
	font-size: .95rem;
	font-weight: 500;
}
.dtf-trust-badge .dtf-icon { color: var(--color-primary, #c62630); }

/* ---- Primärer Wizard-CTA (aus inc/WooCommerce.php) ---- */
.redtales-package-cta { margin-top: var(--space-4, 1rem); margin-bottom: 0; }
.redtales-package-cta .redtales-btn { min-height: 52px; width: 100%; max-width: 420px; }

/* ---- Saubere Beschreibungssektion statt veralteter Tabs ---- */
.woocommerce-tabs { display: none; } /* Fallback, falls Tabs doch gerendert werden */
.dtf-product-desc {
	margin-top: var(--space-6, 2rem);
	padding-top: var(--space-6, 2rem);
	border-top: 1px solid var(--color-border-light, #ece2db);
}
.dtf-product-desc__title {
	display: flex;
	align-items: center;
	gap: var(--space-3, .75rem);
	font-size: 1.3rem;
	margin-bottom: var(--space-4, 1rem);
}
.dtf-product-desc__title .dtf-icon { color: var(--color-primary, #c62630); }
.dtf-product-desc__body { max-width: 68ch; color: var(--color-text, #2a211e); }
.dtf-product-desc__body p { margin: 0 0 var(--space-4, 1rem); }

/* ---- Ähnliche Produkte: wie die Paket-Kacheln ---- */
.related.products { margin-top: var(--space-7, 3rem); }
.related.products > h2 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); margin-bottom: var(--space-5, 1.5rem); }
.woocommerce ul.products,
.related.products ul.products {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-5, 1.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 640px) {
	.woocommerce ul.products,
	.related.products ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
	.woocommerce ul.products,
	.related.products ul.products { grid-template-columns: repeat(3, 1fr); }
}
.woocommerce ul.products li.product,
.related.products ul.products li.product {
	background: var(--color-surface, #fff);
	border: 1px solid var(--color-border-light, #ece2db);
	border-radius: var(--radius-lg, 20px);
	padding: 0;
	margin: 0 !important;
	width: auto !important;
	float: none !important;
	overflow: hidden;
	box-shadow: var(--shadow-soft, 0 3px 12px rgba(120,60,40,.08));
	display: flex;
	flex-direction: column;
	transition: transform .15s ease, box-shadow .15s ease;
}
.woocommerce ul.products li.product:hover,
.related.products ul.products li.product:hover {
	transform: translateY(-3px);
	box-shadow: var(--shadow-card, 0 10px 30px rgba(120,60,40,.10));
}
.woocommerce ul.products li.product a img,
.related.products ul.products li.product a img {
	margin: 0 0 var(--space-3, .75rem);
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.related.products ul.products li.product .woocommerce-loop-product__title {
	font-size: 1.15rem;
	font-weight: 700;
	padding: 0 var(--space-4, 1rem);
	color: var(--color-text, #2a211e);
}
.woocommerce ul.products li.product .price,
.related.products ul.products li.product .price {
	color: var(--color-primary-dark, #9c1c25) !important;
	font-weight: 800;
	padding: var(--space-2, .5rem) var(--space-4, 1rem) var(--space-4, 1rem);
	display: block;
	margin: auto 0 0;
}

/* ---- Buttons an Theme angleichen ---- */
.woocommerce a.button, .woocommerce button.button, .woocommerce .button, .woocommerce #respond input#submit {
	background: var(--color-primary, #c62630); color: #fff; border-radius: var(--radius-md, 12px); font-weight: 600;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce .button:hover {
	background: var(--color-primary-dark, #9c1c25);
}