/**
 * EB Schmuck — WooCommerce im CD
 * Tokens aus theme.json. Nur auf Shop-/Produkt-/Cart-/Checkout-Seiten geladen.
 */

/* =========================================================================
   Shop-Kopf: Breadcrumbs, Ergebniszahl, Sortierung — ruhig & klein
   ========================================================================= */
.ebs-shop .wp-block-woocommerce-breadcrumbs,
.ebs-product .wp-block-woocommerce-breadcrumbs,
.woocommerce .woocommerce-breadcrumb {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink-soft); /* ink-faint fiel im Kontrast-Check durch */
}
.woocommerce .woocommerce-breadcrumb a {
	color: var(--wp--preset--color--ink-soft);
	text-decoration: none;
}
.woocommerce .woocommerce-breadcrumb a:hover,
.woocommerce .woocommerce-breadcrumb a:focus-visible { color: var(--wp--preset--color--accent-deep); }
.ebs-shop .wp-block-woocommerce-breadcrumbs a,
.ebs-product .wp-block-woocommerce-breadcrumbs a {
	color: var(--wp--preset--color--ink-soft);
	text-decoration: none;
}
.ebs-shop .wp-block-woocommerce-breadcrumbs a:hover { color: var(--wp--preset--color--accent-deep); }

.ebs-shop__bar {
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding-block: var(--wp--preset--spacing--sm);
	align-items: center;
	color: var(--wp--preset--color--ink-soft);
}
.ebs-shop__bar .wc-block-product-results-count { margin: 0; }
.ebs-shop__bar select,
.ebs-product select {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--card);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	padding: 0.5em 2.2em 0.5em 1em;
}

/* =========================================================================
   Produkt-Raster (Shop + Kategorie) — Grid erzwingen, Karten wie Home
   ========================================================================= */
.ebs-shop .wp-block-woocommerce-product-template {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}
/* Karten-internes Styling gilt für Shop-Grid UND Related (unscoped unter .wc-block-product) */
.wc-block-product {
	display: flex;
	flex-direction: column;
	margin: 0 !important;
	padding: 0;
	text-align: left;
}

/* Produktbild: 4:5, Radius, Hover-Zoom */
.wc-block-product .wp-block-woocommerce-product-image {
	margin: 0;
	border-radius: var(--wp--custom--radius--img);
	overflow: hidden;
	background: var(--wp--preset--color--accent-soft);
	aspect-ratio: 4 / 5;
}
.wc-block-product .wp-block-woocommerce-product-image a,
.wc-block-product .wp-block-woocommerce-product-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.wc-block-product .wp-block-woocommerce-product-image img {
	transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.wc-block-product:hover .wp-block-woocommerce-product-image img {
	transform: scale(1.04);
}

/* Titel */
.wc-block-product .wp-block-post-title {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.3;
}
.wc-block-product .wp-block-post-title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	/* Ziel-Größe (WCAG 2.2 · 2.5.8): Tap-Fläche des Titel-Links ≥24px hoch. */
	display: inline-block;
	padding-block: 3px;
}
.wc-block-product .wp-block-post-title a:hover { color: var(--wp--preset--color--accent-deep); }

/* Preis — halbfett wie die Buttons: klar auffindbar, ohne Diskonter-Optik.
   (Die Verankerung am Kartenfuß übernimmt .ebs-tile-foot in quickview.css.) */
.wc-block-product .wp-block-woocommerce-product-price {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}
.wc-block-product .ebs-price-suffix { display: none; } /* Teaser: kurzer Preis, voller Hinweis auf Produktseite */

/* „In den Warenkorb"-Button als dunkle Pille */
.ebs-shop .wc-block-components-product-button .wp-block-button__link,
.ebs-product .single_add_to_cart_button,
.wc-block-components-button.wc-block-components-product-button__button {
	background: var(--wp--preset--color--ink) !important;
	color: var(--wp--preset--color--paper) !important;
	border: 1px solid var(--wp--preset--color--ink) !important;
	border-radius: var(--wp--custom--radius--btn) !important;
	font-weight: 600;
	padding: 0.7em 1.4em;
	transition: background 0.2s, border-color 0.2s, transform 0.15s;
	text-decoration: none;
}
/* Hinweis: Die Position des „In den Warenkorb"-Buttons in den Produkt-Grids
   regelt jetzt ebs-core/assets/css/quickview.css (Hover-Overlay auf dem Bild,
   konsistent mit dem Startseiten-Karussell). */
.ebs-shop .wc-block-components-product-button .wp-block-button__link:hover,
.ebs-product .single_add_to_cart_button:hover {
	background: var(--wp--preset--color--accent-deep) !important;
	border-color: var(--wp--preset--color--accent-deep) !important;
	transform: translateY(-1px);
}

/* „Ausverkauft"/„Ansehen"-Zustand dezent */
.ebs-shop .add_to_cart_button.added { opacity: 0.7; }

@media (max-width: 1024px) {
	.ebs-shop .wp-block-woocommerce-product-template { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
	.ebs-shop .wp-block-woocommerce-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========================================================================
   Produktdetailseite
   ========================================================================= */
/* Galerie */
.ebs-product .wp-block-woocommerce-product-image-gallery img,
.ebs-product .woocommerce-product-gallery img {
	border-radius: var(--wp--custom--radius--img);
}
/* Abstand Hauptbild → Thumbnails (WooCommerce-Default hat hohe Spezifität). */
.ebs-product .woocommerce-product-gallery .flex-control-thumbs,
.ebs-product .flex-control-thumbs { gap: 10px; display: flex; flex-wrap: wrap; margin-top: var(--wp--preset--spacing--md) !important; padding: 0; }
.ebs-product .flex-control-thumbs li { list-style: none; }
.ebs-product .flex-control-thumbs img { border-radius: 8px; }

/* Titel/Preis */
.ebs-product h1.wp-block-post-title {
	font-size: clamp(1.9rem, 3vw, 2.6rem);
	line-height: 1.1;
}
.ebs-product .wp-block-woocommerce-product-price {
	font-weight: 500;
	color: var(--wp--preset--color--ink);
}
.ebs-product .ebs-price-suffix { color: var(--wp--preset--color--ink-soft); } /* WCAG-AA-Kontrast (≥4,5:1) */

/* Produkt-Tabs (Beschreibung / Zusätzliche Information): inaktive Tab-Links
   auf AA-konformen Kontrast anheben (WooCommerce-Default #736f69 = 4,47:1)
   und zugleich sichtbar vom aktiven Tab abheben. Attribut-Selektor für die
   nötige Spezifität gegen die WooCommerce-Defaults. */
.ebs-product .woocommerce-tabs ul.tabs li a[aria-selected="false"] {
	color: var(--wp--preset--color--ink-soft) !important; /* 5,97:1 – AA, aber heller als aktiv */
	opacity: 1 !important; /* „is-style-minimal" dimmt inaktive Tabs → würde Kontrast unter AA drücken */
}
.ebs-product .woocommerce-tabs ul.tabs li:not(.active) { opacity: 1 !important; }
.ebs-product .woocommerce-tabs ul.tabs li a[aria-selected="false"]:hover {
	color: var(--wp--preset--color--ink) !important;
}

/* Add-to-Cart-Formular: Menge + Button */
.ebs-product form.cart {
	display: flex;
	gap: var(--wp--preset--spacing--sm);
	align-items: stretch;
	margin: var(--wp--preset--spacing--md) 0 0;
	flex-wrap: wrap;
}
.ebs-product .quantity input.qty {
	width: 4.5em;
	height: 100%;
	min-height: 46px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--btn);
	background: var(--wp--preset--color--card);
	text-align: center;
	font-family: var(--wp--preset--font-family--sans);
	color: var(--wp--preset--color--ink);
}
/* Einzelstücke (max 1): WooCommerce rendert die Menge als verstecktes Feld,
   der leere .quantity-Wrapper + Flex-Gap + Padding schoben den Button nach
   rechts. Bei verborgener Menge Wrapper ausblenden und Gap/Padding entfernen
   → Button sitzt linksbündig zum Text darüber. Mehrfach-Mengen (z. B.
   Gutscheine) behalten die sichtbare Auswahl. */
.ebs-product form.cart:has( .quantity input.qty[type="hidden"] ) {
	gap: 0;
	padding-left: 0;
}
.ebs-product form.cart .quantity:has( input.qty[type="hidden"] ) {
	display: none;
}
.ebs-product .single_add_to_cart_button {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.95rem;
}

/* Meta */
.ebs-product .ebs-product__meta { color: var(--wp--preset--color--ink-soft); gap: 1.2rem; }
.ebs-product .ebs-product__meta a { color: var(--wp--preset--color--accent-deep); text-decoration: none; }
.ebs-product .ebs-product__trust p { margin: 0; }

/* Detail-Tabs (Beschreibung, weitere Infos) — minimal */
.ebs-product .wp-block-woocommerce-product-details .wc-tabs {
	display: flex;
	gap: 1.5rem;
	padding: 0;
	margin: 0 0 var(--wp--preset--spacing--md);
	border-bottom: 1px solid var(--wp--preset--color--line);
	list-style: none;
}
.ebs-product .wp-block-woocommerce-product-details .wc-tabs li {
	margin: 0;
	list-style: none;
}
.ebs-product .wp-block-woocommerce-product-details .wc-tabs li a {
	display: inline-block;
	padding: 0.6em 0;
	color: var(--wp--preset--color--ink-soft);
	text-decoration: none;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	border-bottom: 2px solid transparent;
}
.ebs-product .wp-block-woocommerce-product-details .wc-tabs li.active a {
	color: var(--wp--preset--color--ink);
	border-bottom-color: var(--wp--preset--color--accent);
}
.ebs-product .woocommerce-Tabs-panel { line-height: 1.7; }
.ebs-product .woocommerce-Tabs-panel h2 { display: none; } /* redundante „Beschreibung"-Überschrift */

/* =========================================================================
   Warenkorb & Kasse (Block-Cart/-Checkout) im CD
   ========================================================================= */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	font-family: var(--wp--preset--font-family--sans);
}
/* Primäre Aktions-Buttons (Zur Kasse, Bestellung abschließen) als dunkle Pille */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-cart .wc-block-components-button.contained,
.wp-block-woocommerce-checkout .wc-block-components-button.contained {
	background: var(--wp--preset--color--ink) !important;
	color: var(--wp--preset--color--paper) !important;
	border-radius: var(--wp--custom--radius--btn) !important;
	font-weight: 600;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-cart .wc-block-components-button.contained:hover,
.wp-block-woocommerce-checkout .wc-block-components-button.contained:hover {
	background: var(--wp--preset--color--accent-deep) !important;
}
/* Sekundäre/Text-Buttons in Bronze */
.wc-block-components-button.outlined {
	border-radius: var(--wp--custom--radius--btn) !important;
	border-color: var(--wp--preset--color--ink) !important;
	color: var(--wp--preset--color--ink) !important;
}
/* Formularfelder im CD */
.wp-block-woocommerce-checkout .wc-block-components-text-input input,
.wp-block-woocommerce-checkout select,
.wp-block-woocommerce-cart .wc-block-components-text-input input {
	border-radius: 10px;
	border-color: var(--wp--preset--color--line);
	background: var(--wp--preset--color--card);
}
.wp-block-woocommerce-checkout .wc-block-components-text-input input:focus {
	border-color: var(--wp--preset--color--accent);
}
/* Produktbilder im Warenkorb rund */
.wc-block-cart-item__image img { border-radius: 8px; }
/* „Leerer Warenkorb"-Zustand mittig, ruhig */
.wc-block-cart__empty-cart__title,
.is-large.wc-block-cart .wp-block-woocommerce-cart-order-summary-block { color: var(--wp--preset--color--ink); }
/* Trennlinien & Panels an CD-Farben */
.wc-block-components-totals-wrapper { border-color: var(--wp--preset--color--line) !important; }

/* Related products — Grid wie Shop */
.ebs-product .wp-block-woocommerce-related-products .wp-block-woocommerce-product-template,
.ebs-product .related.products ul.products {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px;
	list-style: none;
	margin: 0;
	padding: 0;
}
@media (max-width: 1024px) {
	.ebs-product .wp-block-woocommerce-related-products .wp-block-woocommerce-product-template,
	.ebs-product .related.products ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
	.ebs-product .wp-block-woocommerce-related-products .wp-block-woocommerce-product-template,
	.ebs-product .related.products ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Kasse: Options-Boxen (Versand, Zahlung) und Bestellübersicht im CD */
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option,
.wp-block-woocommerce-checkout .wc-block-components-radio-control__option {
	border-color: var(--wp--preset--color--line) !important;
}
.wp-block-woocommerce-checkout input[type="radio"],
.wp-block-woocommerce-checkout input[type="checkbox"],
.wp-block-woocommerce-cart input[type="checkbox"] {
	accent-color: var(--wp--preset--color--accent-deep);
}
.wp-block-woocommerce-checkout .wc-block-components-radio-control__input:checked {
	border-color: var(--wp--preset--color--accent-deep);
	background: var(--wp--preset--color--accent-deep);
}
.wp-block-woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block {
	background: var(--wp--preset--color--card);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--card, 16px);
}
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__heading,
.wp-block-woocommerce-checkout .wc-block-components-title {
	font-family: var(--wp--preset--font-family--sans);
}