/* Tivoni product redesign pilot — scoped to .tivoni-pd only */

.tivoni-pd {
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 16px 48px;
	color: #2b2b2b;
	font-size: 16px;
	line-height: 1.65;
}

html[dir="rtl"] .tivoni-pd { text-align: right; }

/* ---------- Hero ---------- */
.tivoni-pd-hero {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	padding: 24px 0 8px;
}

/* the theme's base stylesheet hides WooCommerce's native gallery sitewide
   (display:none) because the old design used a separate manual thumbnail
   instead; override it here, scoped to this template only */
.tivoni-pd .woocommerce-product-gallery { display: block !important; }
.tivoni-pd-gallery img { border-radius: 8px; }

.tivoni-pd-title {
	font-size: 1.8rem;
	font-weight: 700;
	margin: 0;
	color: #1a1a1a;
	line-height: 1.3;
}

.tivoni-pd-buybox {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tivoni-pd-shortdesc {
	font-size: 1.05rem;
	color: #4a4a4a;
	margin: 0;
}

.tivoni-pd-buybox .price {
	font-size: 1.6rem;
	font-weight: 700;
	color: #1f5f4a;
	margin: 0;
}

.tivoni-pd-stock .in-stock { color: #1f7a3d; font-weight: 600; }
.tivoni-pd-stock .out-of-stock { color: #a33; font-weight: 600; }

.tivoni-pd-buybox form.cart {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 4px;
}

.tivoni-pd-buybox .single_add_to_cart_button {
	background: #1f5f4a;
	color: #fff;
	border: 0;
	border-radius: 6px;
	padding: 14px 32px;
	font-size: 1.05rem;
	font-weight: 600;
	cursor: pointer;
}
.tivoni-pd-buybox .single_add_to_cart_button:hover { background: #17493a; }

@media (min-width: 900px) {
	.tivoni-pd-hero {
		grid-template-columns: 1.1fr 1fr;
		align-items: start;
		gap: 48px;
		padding-top: 32px;
	}
}

/* ---------- Section nav ---------- */
.tivoni-pd-nav {
	position: sticky;
	top: 0;
	z-index: 5;
	display: flex;
	gap: 20px;
	overflow-x: auto;
	background: #fff;
	border-bottom: 1px solid #e6e6e6;
	padding: 12px 4px;
	margin: 8px 0 32px;
	scrollbar-width: none;
}
.tivoni-pd-nav::-webkit-scrollbar { display: none; }

.tivoni-pd-nav a {
	white-space: nowrap;
	text-decoration: none;
	color: #555;
	font-size: 0.95rem;
	font-weight: 600;
	padding-bottom: 6px;
	border-bottom: 2px solid transparent;
}
.tivoni-pd-nav a:hover { color: #1f5f4a; border-bottom-color: #1f5f4a; }

html { scroll-behavior: smooth; }
.tivoni-pd-section { scroll-margin-top: 64px; }

/* ---------- Sections ---------- */
.tivoni-pd-section { padding: 28px 0; border-top: 1px solid #eee; }
.tivoni-pd-section:first-of-type { border-top: 0; }

.tivoni-pd-heading {
	font-size: 1.3rem;
	font-weight: 700;
	margin: 0 0 16px;
	color: #1a1a1a;
}

.tivoni-pd-prose { max-width: 68ch; }
.tivoni-pd-prose p { margin: 0 0 14px; }

.tivoni-pd-subheading {
	font-size: 1.05rem;
	font-weight: 700;
	color: #333;
	margin: 24px 0 10px;
}
.tivoni-pd-research .tivoni-pd-subheading:first-child { margin-top: 0; }

/* oEmbeds (e.g. a YouTube video in the description) carry hardcoded
   width/height attributes that overflow narrow viewports; constrain them */
.tivoni-pd-prose iframe {
	max-width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
}

.tivoni-pd-muted { color: #5a5a5a; font-size: 0.95rem; }
.tivoni-pd-research { background: #fafaf8; border-radius: 10px; padding: 24px; border-top: 0; }

/* ---------- Quick facts ---------- */
.tivoni-pd-chips {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
@media (min-width: 640px) {
	.tivoni-pd-chips { grid-template-columns: repeat(3, 1fr); }
}

.tivoni-pd-chip {
	background: #f5f7f5;
	border-radius: 8px;
	padding: 12px 14px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.tivoni-pd-chip-label { font-size: 0.78rem; color: #7a7a7a; }
.tivoni-pd-chip-value { font-size: 0.95rem; font-weight: 600; color: #222; }

/* ---------- FAQ ---------- */
.tivoni-pd-faq-item {
	border-bottom: 1px solid #eee;
	padding: 14px 0;
}
.tivoni-pd-faq-item summary {
	cursor: pointer;
	font-weight: 600;
	list-style: none;
}
.tivoni-pd-faq-item summary::-webkit-details-marker { display: none; }
.tivoni-pd-faq-item summary::after {
	content: "+";
	float: left;
	font-weight: 400;
	color: #999;
}
.tivoni-pd-faq-item[open] summary::after { content: "–"; }
.tivoni-pd-faq-item p { margin: 10px 0 0; color: #4a4a4a; }

/* ---------- Related products ---------- */
.tivoni-pd-related ul.products {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
	list-style: none;
	margin: 0;
	padding: 0;
}
@media (min-width: 640px) {
	.tivoni-pd-related ul.products { grid-template-columns: repeat(4, 1fr); }
}
.tivoni-pd-related ul.products li.product {
	/* WooCommerce's classic float-grid layout (float + percentage width) still
	   applies to <li> even inside our CSS-grid container; neutralize it */
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
	border: 1px solid #eee;
	border-radius: 8px;
	padding: 12px;
	text-align: center;
}
