/* ==========================================================================
   Shop – Ergänzungen zur Records-Kopie
   Karussell, Karten, Messring und Seitenübergänge kommen unverändert aus
   blocks/vinyl-carousel, assets/css/base.css (.g-card) und blocks/song-* .
   Hier steht nur, was der Shop zusätzlich braucht: das Kaufpanel in der Info-Spalte,
   die Kaufbox der Detailseite (Samples, Presets) und ein schlichter Fallback für
   WooCommerce-Seiten ohne Bereich (Suche, Schlagwörter).
   ========================================================================== */

/* ---------- Kaufpanel (Info-Spalte) und Kaufbox (Detailseite) ---------- */
.g-records__buy {
	margin-top: var(--wp--preset--spacing--30);
	user-select: text;
	-webkit-user-select: text;
}
.g-records__buy:empty { display: none; }

:is(.g-records__buy, .g-buy__form) .woocommerce { margin: 0; }
:is(.g-records__buy, .g-buy__form) form.cart {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: var(--wp--preset--spacing--10);
	margin: 0;
}
:is(.g-records__buy, .g-buy__form) .variations_form.cart { display: block; }
:is(.g-records__buy, .g-buy__form) .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wp--preset--spacing--10); }
:is(.g-records__buy, .g-buy__form) .stock,
:is(.g-records__buy, .g-buy__form) .woocommerce-variation-availability { display: none; }

/* Varianten: Hairline-Zeilen im Stil der Meta-Tabelle */
:is(.g-records__buy, .g-buy__form) table.variations { width: 100%; margin: 0 0 var(--wp--preset--spacing--20); border-collapse: collapse; }
:is(.g-records__buy, .g-buy__form) table.variations :is(tbody, tr, th, td) { display: block; padding: 0; border: 0; background: none; }
:is(.g-records__buy, .g-buy__form) table.variations tr { padding-block: var(--wp--preset--spacing--10); border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 35%, transparent); }
:is(.g-records__buy, .g-buy__form) table.variations th.label {
	margin-bottom: .35rem;
	font: 400 var(--wp--preset--font-size--s)/1.2 var(--wp--preset--font-family--mono);
	text-transform: uppercase; letter-spacing: .14em;
	color: var(--wp--preset--color--contrast-2);
}
:is(.g-records__buy, .g-buy__form) :is(select, .qty) {
	min-height: 2.75rem;
	padding: .5rem .8rem;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 30%, transparent);
	border-radius: 0;
	background: transparent;
	color: inherit;
	font: 400 var(--wp--preset--font-size--s)/1.2 var(--wp--preset--font-family--mono);
	letter-spacing: .08em;
}
:is(.g-records__buy, .g-buy__form) select { width: 100%; }
:is(.g-records__buy, .g-buy__form) select option { background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
:is(.g-records__buy, .g-buy__form) .qty { width: 4.5rem; text-align: center; }
:is(.g-records__buy, .g-buy__form) :is(select, .qty):focus-visible { outline: 0; border-color: var(--song-accent); }
:is(.g-records__buy, .g-buy__form) .reset_variations {
	display: inline-block; margin-top: .4rem;
	font: 400 var(--wp--preset--font-size--s)/1.2 var(--wp--preset--font-family--mono);
	letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--contrast-2);
}
:is(.g-records__buy, .g-buy__form) .woocommerce-variation-price { margin-bottom: var(--wp--preset--spacing--10); font-size: var(--wp--preset--font-size--m); }

/* Warenkorb-Button = gefüllter .g-btn */
:is(.g-records__buy, .g-buy__form) .single_add_to_cart_button {
	display: inline-flex; align-items: center; gap: .6em;
	min-height: 2.75rem; padding: .85em 1.5em;
	border: 1px solid var(--wp--preset--color--accent); border-radius: 999px;
	background: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent-ink);
	font: 400 var(--wp--preset--font-size--s)/1.2 var(--wp--preset--font-family--mono);
	text-transform: uppercase; letter-spacing: .08em; text-decoration: none; cursor: pointer;
	transition: background-color var(--g-fast) var(--g-ease), color var(--g-fast) var(--g-ease), border-color var(--g-fast) var(--g-ease);
}
:is(.g-records__buy, .g-buy__form) .single_add_to_cart_button:hover,
:is(.g-records__buy, .g-buy__form) .single_add_to_cart_button:focus-visible { background: transparent; color: var(--wp--preset--color--accent); outline: 0; }
:is(.g-records__buy, .g-buy__form) .single_add_to_cart_button.disabled { opacity: .4; cursor: not-allowed; }

/* Hinweise nach dem Kauf („… wurde deinem Warenkorb hinzugefügt“) – Hairline statt Woo-Box */
:is(.g-records__notices, .g-buy__notices) { margin-top: var(--wp--preset--spacing--20); }
:is(.g-records__notices, .g-buy__notices) :is(.wc-block-components-notice-banner, .woocommerce-message, .woocommerce-info, .woocommerce-error) {
	display: flex; flex-wrap: wrap; align-items: center; gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	margin: 0 0 var(--wp--preset--spacing--10); padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 30%, transparent); border-radius: 0;
	background: transparent; color: inherit; list-style: none;
	font: 400 var(--wp--preset--font-size--s)/1.4 var(--wp--preset--font-family--mono); letter-spacing: .06em;
}
:is(.g-records__notices, .g-buy__notices) .wc-block-components-notice-banner > svg { flex: none; border-radius: 50%; background: var(--song-accent); fill: var(--song-ink); }
:is(.g-records__notices, .g-buy__notices) .wc-block-components-notice-banner.is-error { border-color: var(--song-accent); }
:is(.g-records__notices, .g-buy__notices) :is(.wc-block-components-notice-banner__content, .wc-block-components-notice-banner__content > *) { margin: 0; color: inherit; }
:is(.g-records__notices, .g-buy__notices) a {
	color: inherit; text-transform: uppercase; text-underline-offset: .25em;
}
:is(.g-records__notices, .g-buy__notices) a:hover { color: var(--song-accent); }
:is(.g-records__notices, .g-buy__notices) a.button { padding: 0; border: 0; background: transparent; font: inherit; }

/* Mobil: Buy-Panel bleibt sichtbar (Records blendet nur Zeilen ab der dritten aus) */
@media (max-width: 781px) {
	.g-records__buy { margin-top: var(--wp--preset--spacing--20); }
}

.g-product-deck__empty {
	min-height: 85svh;
	padding: calc(var(--g-header-h) + clamp(3rem, 12vh, 8rem)) var(--g-gutter) 4rem;
}
.g-product-deck__empty .g-records__title { height: auto; white-space: normal; }

/* ---------- Detailseite (Samples, Presets) ---------- */
.g-product-detail {
	display: grid;
	gap: var(--wp--preset--spacing--60);
	padding-bottom: var(--wp--preset--spacing--60);
}
.g-product-detail > :is(.g-buy, .g-song-story) {
	width: min(1100px, calc(100% - 2 * var(--g-gutter)));
	margin-inline: auto;
}
.g-buy { scroll-margin-top: calc(var(--g-header-h) + var(--wp--preset--spacing--40)); }
.g-buy__heading {
	display: flex; align-items: baseline; flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--display);
}
.g-buy__count { font: 400 var(--wp--preset--font-size--s)/1 var(--wp--preset--font-family--mono); letter-spacing: .1em; color: var(--song-accent); }
.g-buy__box {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start;
	gap: var(--wp--preset--spacing--40);
	padding-top: var(--wp--preset--spacing--30);
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 25%, transparent);
}
.g-buy__rows { margin: 0; }
/* Story-Listen: eckige Marker statt runder Standard-Bullets, passend zur Hairline-Tabelle */
.g-product-detail .g-song-story ul { margin: 1.1rem 0 0; padding: 0; list-style: none; }
.g-product-detail .g-song-story ul li { position: relative; margin: 0; padding: .5rem 0 .5rem 1.6rem; font-size: var(--wp--preset--font-size--m); line-height: 1.45; }
.g-product-detail .g-song-story ul li::before {
	content: ''; position: absolute; inset-inline-start: .15rem; top: calc(.5rem + .725em - .2rem);
	width: .4rem; aspect-ratio: 1; background: var(--wp--preset--color--contrast-2);
}
@media (max-width: 781px) {
	.g-buy__box { grid-template-columns: minmax(0, 1fr); gap: var(--wp--preset--spacing--30); }
}

/* ---------- Fallback: WooCommerce-Seiten ohne Bereich (Suche, Schlagwörter) ---------- */
body:not(.g-has-deck) .g-shop-main {
	padding: calc(var(--g-header-h) + var(--wp--preset--spacing--50)) var(--g-gutter) var(--wp--preset--spacing--60) !important;
}
.g-shop-main ul.products {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
	gap: var(--wp--preset--spacing--30); margin: 0; padding: 0; list-style: none;
}
.g-shop-main ul.products li.product { margin: 0; }
.g-shop-main ul.products img { display: block; width: 100%; height: auto; }