/**
 * die FotoB.O.x — WooCommerce-Feinschliff.
 * Deckt sowohl klassische (.woocommerce-*) als auch Block-Store-Klassen (.wc-block-*) ab.
 * Buttons werden zentral über theme.json (elements.button) gestylt.
 */

/* Produkt-Titel in der Headline-Schrift */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-components-product-name,
.woocommerce div.product .product_title {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--ink);
}

/* Preise in der Headline-Schrift, dunkel */
.woocommerce-Price-amount,
.wc-block-components-product-price,
.wc-block-formatted-money-amount,
.woocommerce div.product p.price,
.woocommerce ul.products li.product .price {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	color: var(--wp--preset--color--ink);
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--wp--preset--color--brand);
}

/* Produktbilder mit weichen Ecken */
.woocommerce ul.products li.product img,
.wc-block-grid__product-image img,
.wc-block-components-product-image img,
.woocommerce div.product div.images img {
	border-radius: 14px;
}

/* „Sale"-Badge im Markenrot als Pill */
.woocommerce span.onsale,
.wc-block-components-product-sale-badge {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--base);
	border-radius: 980px;
	font-weight: 700;
	min-height: auto;
	padding: 4px 12px;
}

/* Sternebewertungen in Gold */
.woocommerce .star-rating span::before,
.woocommerce p.stars a::before,
.wc-block-components-product-rating .stars {
	color: var(--wp--preset--color--gold);
}

/* Hinweis-/Erfolgsboxen im Markenlook */
.woocommerce-message,
.woocommerce-info,
.wc-block-components-notice-banner {
	border-radius: var(--fb-radius-input);
	border-top: none;
}
.woocommerce-message,
.wc-block-components-notice-banner.is-success {
	border-left: 4px solid var(--wp--preset--color--brand);
}

/* Formularfelder in Warenkorb/Kasse an das Marken-Design angleichen */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wc-block-components-text-input input,
.wc-block-components-quantity-selector input {
	border: 1px solid var(--wp--preset--color--input-border);
	border-radius: var(--fb-radius-input);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--body);
}

/* Karten-Optik für Warenkorb-Summen & Bestellübersicht */
.woocommerce .cart_totals,
.woocommerce-checkout #order_review,
.wc-block-components-totals-wrapper {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--fb-radius-card);
	padding: 8px 20px;
}

/* Tab-Titel & Abschnittsüberschriften in Headline-Schrift */
.woocommerce div.product .woocommerce-tabs ul.tabs li a,
.woocommerce h2,
.wc-block-components-title {
	font-family: var(--wp--preset--font-family--heading);
}

/* -------------------------------------------------------------------------
 * Mein Konto / Login
 * ---------------------------------------------------------------------- */

/* Konto/Warenkorb/Kasse: Inhalt zentriert halten statt randabfallend
   (verhindert horizontalen Überlauf durch alignfull-Negativränder auf Mobil) */
.woocommerce-account .entry-content.alignfull,
.woocommerce-cart .entry-content.alignfull,
.woocommerce-checkout .entry-content.alignfull {
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Login-Formular als zentrierte Marken-Karte (Registrierung ist bewusst aus) */
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-form-login,
.woocommerce .woocommerce-form-login {
	max-width: 460px;
	margin: 0 auto;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--fb-radius-card-lg);
	box-shadow: var(--fb-shadow-card);
	padding: 36px 32px;
}
.woocommerce-form-login .woocommerce-form-login__submit {
	width: 100%;
}
.woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 8px; }
.woocommerce-account .woocommerce form .form-row label { font-weight: 600; color: var(--wp--preset--color--muted); }

/* Dashboard: Navigation (links) + Inhalt (rechts) */
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.woocommerce-MyAccount-navigation ul li {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}
.woocommerce-MyAccount-navigation-link a {
	display: block;
	padding: 12px 16px;
	border-radius: 12px;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-weight: 500;
}
.woocommerce-MyAccount-navigation-link a:hover {
	background: var(--wp--preset--color--surface-warm);
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.woocommerce-MyAccount-navigation-link.is-active a,
.woocommerce-MyAccount-navigation-link--active a {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--base);
}

/* Bestell-Tabelle & Konto-Tabellen */
.woocommerce-account .woocommerce table.shop_table,
.woocommerce table.woocommerce-orders-table,
.woocommerce table.account-orders-table {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--fb-radius-card);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.woocommerce-account .woocommerce table.shop_table thead th {
	background: var(--wp--preset--color--surface-warm);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	color: var(--wp--preset--color--ink);
}

/* Adress-Karten */
.woocommerce-Addresses .woocommerce-Address address,
.woocommerce-Address address {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--fb-radius-card);
	padding: 20px 22px;
	font-style: normal;
	line-height: 1.6;
}

/* Info-/Dashboard-Text */
.woocommerce-MyAccount-content { line-height: 1.6; }

/* Mobil: Navigation über den Inhalt stapeln */
@media (max-width: 700px) {
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		float: none;
		width: 100%;
	}
	.woocommerce-MyAccount-navigation { margin-bottom: 24px; }
	.woocommerce-MyAccount-navigation ul { flex-direction: column; }
}