/**
 * Theme Name: Weinkontor Keßler (Astra)
 * Description: Child Theme von "Astra" für Weinkontor Keßler
 * Author: Tobias A. Rau (TAR-IT)
 * Author URI: https://tar-it.com
 * Template: astra
 * Version: 1.0
 */

/* ============================================
Header
============================================ */
.site-header {
	z-index: 999 !important;
}

/* ============================================
Product cards
============================================ */

/* Background for product cards */
.woocommerce ul.products li.product {
	background-color: #EEECE5;
	border-radius: 12px;
	overflow: hidden;
	padding: 16px;
}

/* Text area becomes a flex container itself and fills the remaining space */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

/* Product title: consistent minimum height over 3 lines, longer names get truncated with "…" after 3 lines */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.4em;
	min-height: calc(1.4em * 3);
}

/* Button always at the very bottom, regardless of how many additional info lines are present */
.woocommerce ul.products li.product .astra-shop-summary-wrap a.button {
	margin-top: auto;
	text-align: center;
}

/* A bit more spacing between additional info and the button */
.woocommerce ul.products li.product .wc-gzd-additional-info:last-of-type {
	margin-bottom: 12px;
}

/* ============================================
Product detail pages
============================================ */

/* Spacing between paragraphs in the product description */
.woocommerce-Tabs-panel--description p {
	margin: 0 0 10px 0; /* only bottom spacing of 10px */
}

/* Last paragraph without bottom spacing */
.woocommerce-Tabs-panel--description p:last-child {
	margin-bottom: 0;
}

/* Cleaner, lighter product title */
.single-product .product_title {
	font-size: 25px !important;
	line-height: 1.25 !important;
	font-weight: 400 !important;
	letter-spacing: 0.02em;
	margin-bottom: 14px !important;
}

/* Make the price stand out more */
.single-product .summary .price {
	font-size: 24px !important;
	font-weight: 500 !important;
	margin-bottom: 8px !important;
}

/* More breathing room in the right-hand product column */
.single-product .summary {
	padding-left: 25px;
}

/* Thin divider line above the short description */
.single-product .woocommerce-product-details__short-description {
	border-top: 1px solid #b8b1a7;
	padding-top: 20px;
	margin-top: 20px;
}

/* Add-to-cart row: quantity field on the left, button on the right */
.single-product form.cart {
	display: flex !important;
	align-items: stretch !important;
	gap: 14px !important;
	width: 100% !important;
}

/* Quantity field */
.single-product form.cart .quantity {
	width: 150px !important;
	margin: 0 !important;
}

.single-product form.cart .quantity input.qty {
	width: 100% !important;
	height: 52px !important;
	border: 1px solid #c8c2b8 !important;
	border-radius: 0 !important;
	background: transparent !important;
	text-align: center !important;
}

/* Add-to-cart button */
.single-product form.cart .single_add_to_cart_button {
	flex: 1 !important;
	width: auto !important;
	height: 52px !important;

	background: #9f9a8e !important;
	color: #fff !important;
	border: none !important;
	border-radius: 0 !important;

	font-size: 13px !important;
	font-weight: 400 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
}

/* Add-to-cart button hover state */
.single-product form.cart .single_add_to_cart_button:hover {
	background: #7a6f63 !important;
}

/* Background for the main product image, matching the product card style */
.single-product .woocommerce-product-gallery__wrapper {
	background-color: #EEECE5;
	border-radius: 12px;
	overflow: hidden;
	padding: 16px;
}

/* ============================================
Custom attribute icons
============================================ */

/* Spacing above/below the whole icon block + thick divider line above it */
.custom-product-attributes {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin: 24px 0;
	padding-top: 24px;
	border-top: 3px solid #D9D6CC;
}

/* Each attribute: icon on top, value centered below it */
.custom-product-attributes .custom-product-attribute {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 8px;
	margin: 0;
	flex: 1;
	min-width: 0;
	padding: 0 16px;
	position: relative;
	overflow-wrap: break-word;
	font-size: clamp(12px, 3vw, 16px);
}

/* Divider bar between attributes (not after the last one) */
.custom-product-attributes .custom-product-attribute:not(:last-child)::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 40px;
	background-color: #D9D6CC;
}

/* Icon sits on a round background, sized relative to its column */
.custom-product-attributes .custom-product-attribute__icon {
	width: 40%;
	max-width: 64px;
	aspect-ratio: 1 / 1;
	background-color: #EEECE5;
	border-radius: 50%;
	padding: 8px;
	box-sizing: border-box;
	box-shadow: none;
}

/* Last row without bottom spacing */
.custom-product-attributes .custom-product-attribute:last-child {
	margin-bottom: 0;
}