/* =============================== APCHIP PDP — Summary-area styles =============================== */

/* Hide the empty <p class="price"> element Salient outputs even on price-less products.
 * Specificity bumped + !important because Salient/WC core selectors like
 * .woocommerce div.product p.price (0,2,3) win over the simpler .summary > .price (0,2,1). */
body.single-product .product .summary > p.price:empty { display: none !important; }

/* Uniform .item .prefix .text styling for every product_meta row.
 * Salient's PDP CSS already styles .item, but we add a small rhythm tweak so the
 * rows stack with consistent spacing regardless of which meta row (Pack, Cut, SKU,
 * Categories, Tags) is being rendered. */
.product .product_meta.apchip-pdp-meta { display: block; margin: 0.5rem 0 1rem; }
.product .product_meta.apchip-pdp-meta .item.apchip-pdp-meta-item { display: block; margin: 0 0 0.35rem; line-height: 1.5; }
.product .product_meta.apchip-pdp-meta .item .prefix { font-weight: 600; opacity: 0.85; }
.product .product_meta.apchip-pdp-meta .item .text   { opacity: 0.95; }

/* Dietary marker line — sits between the meta block and the spec-sheet button. */
.product .apchip-pdp-dietary { margin: 0.75rem 0 1rem; }
.product .apchip-pdp-dietary p { margin: 0; line-height: 1.55; }
.product .apchip-pdp-dietary strong { font-weight: 600; }

/* Spec-sheet button (now hooked at priority 50, after meta + dietary). */
.apchip-pdp-summary-spec-sheet { margin: 0.75rem 0 1.25rem; }
.apchip-pdp-spec-sheet-link__suffix { margin-left: 0.4rem; opacity: 0.75; font-size: 0.85em; font-weight: 500; }

/* =============================== APCHIP PDP — Accordion (replaces WC tabs) =============================== */

/* Hide WC tabs entirely on apchip PDPs — accordion replaces them.
 * Salient already collapses tabs when there's no .price; this enforces it
 * so even if tabs ever bleed in (caching/hook-order edge cases) they stay
 * suppressed. The accordion is the single source of truth for these panels.
 */
body.product .woocommerce-tabs { display: none !important; }

.product .apchip-pdp-accordion { margin: 1.5rem 0 2rem; max-width: 100%; }

.product .apchip-pdp-accordion__panel {
	border-bottom: 1px solid rgba(0,0,0,0.12);
}
.product .apchip-pdp-accordion__panel:first-of-type {
	border-top: 1px solid rgba(0,0,0,0.12);
}

.product .apchip-pdp-accordion__summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding: 1rem 0.25rem;
	cursor: pointer;
	list-style: none;
	transition: color 0.2s ease;
}
.product .apchip-pdp-accordion__summary::-webkit-details-marker { display: none; }
.product .apchip-pdp-accordion__summary::marker { content: ''; }
.product .apchip-pdp-accordion__summary:hover .apchip-pdp-accordion__title { color: var(--accent-color, #fcb034); }
.product .apchip-pdp-accordion__summary:focus-visible {
	outline: 2px solid var(--accent-color, #fcb034);
	outline-offset: 4px;
	border-radius: 2px;
}

.product .apchip-pdp-accordion__title {
	margin: 0;
	font-size: 1.5rem;
	line-height: 1.3;
	font-weight: 600;
	letter-spacing: 0.01em;
	flex: 1;
	color: inherit;
}

.product .apchip-pdp-accordion__icon {
	flex: 0 0 1.25rem;
	width: 1.25rem;
	height: 1.25rem;
	position: relative;
	transition: transform 0.25s ease;
}
.product .apchip-pdp-accordion__icon::before,
.product .apchip-pdp-accordion__icon::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1rem;
	height: 2px;
	background: currentColor;
	transform: translate(-50%, -50%);
	transition: transform 0.25s ease, opacity 0.25s ease;
}
.product .apchip-pdp-accordion__icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
}
.product .apchip-pdp-accordion__panel[open] .apchip-pdp-accordion__icon::after {
	transform: translate(-50%, -50%) rotate(0deg);
	opacity: 0;
}

.product .apchip-pdp-accordion__content {
	padding: 0 0.25rem 1.25rem;
	font-size: 0.95rem;
	line-height: 1.6;
}
.product .apchip-pdp-accordion__content > div[itemprop="text"] > *:first-child { margin-top: 0; }
.product .apchip-pdp-accordion__content > div[itemprop="text"] > *:last-child { margin-bottom: 0; }

/* Inner table styling for prep + nutrition + attribute tables in the accordion */
.product .apchip-pdp-accordion__content table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1rem;
}
.product .apchip-pdp-accordion__content table:last-child { margin-bottom: 0; }
.product .apchip-pdp-accordion__content table thead th {
	text-align: left;
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	opacity: 0.75;
	border-bottom: 2px solid rgba(0,0,0,0.15);
	padding: 0.5rem 0.75rem;
}
.product .apchip-pdp-accordion__content table tbody th,
.product .apchip-pdp-accordion__content table tbody td {
	text-align: left;
	padding: 0.5rem 0.75rem;
	border-bottom: 1px solid rgba(0,0,0,0.08);
	vertical-align: top;
}
.product .apchip-pdp-accordion__content table tbody tr:last-child th,
.product .apchip-pdp-accordion__content table tbody tr:last-child td {
	border-bottom: 0;
}
.product .apchip-pdp-accordion__content table tbody th { font-weight: 600; }

/* Nutrition summary line + ingredients line spacing */
.product .apchip-nutrition-block .apchip-nutrition-summary { margin: 0 0 0.75rem; }
.product .apchip-nutrition-block .apchip-nutrition-summary strong { font-weight: 600; }
.product .apchip-nutrition-block .apchip-nutrition-ingredients { margin: 0.75rem 0 0; }
.product .apchip-nutrition-block .apchip-nutrition-footer { margin: 0.5rem 0 0; font-size: 0.85rem; opacity: 0.7; font-style: italic; }

/* Additional-info wrapper inherits .shop_attributes default padding */
.product .apchip-pdp-spec-table-wrap table.shop_attributes { width: 100%; }

/* =============================== APCHIP PDP — Product meta items (Pack Size / Cut Size before SKU) =============================== */

/* Each .item is rendered inline as "Prefix: Value" on its own visual line,
 * matching the source's product_meta layout. Salient's default product_meta
 * wraps SKU in .sku_wrapper > span.sku — we sit alongside that without
 * touching its structure. */
.product .product_meta .item.apchip-pdp-meta-item {
	display: block;
	margin: 0 0 0.35rem;
	font-size: 0.95rem;
}
.product .product_meta .item.apchip-pdp-meta-item .prefix { font-weight: 600; opacity: 0.85; }
.product .product_meta .item.apchip-pdp-meta-item .text { font-weight: 400; }

/* =============================== APCHIP PDP — Spec sheet button (visibility fix) =============================== */

/* The previous see-through-2 variant rendered as transparent-on-light, effectively
 * invisible on chipperbec's white summary background. Switching to the filled
 * accent variant (matches w9_form_button shortcode pattern, see functions.php).
 * No new selectors needed — Salient's .nectar-button.regular.accent-color already
 * paints the filled state correctly; we just stopped overriding it with see-through-2. */
.product .apchip-pdp-summary-spec-sheet { margin: 1rem 0 1.25rem; }
.product .apchip-pdp-spec-sheet-link { font-weight: 600; }
.product .apchip-pdp-spec-sheet-link__suffix {
	margin-left: 0.4rem;
	opacity: 0.85;
	font-size: 0.85em;
	font-weight: 500;
}

/* =============================== APCHIP PDP — Contact CTA =============================== */

.product .apchip-pdp-contact-cta-wrap {
	margin: 2rem 0 2.5rem;
	display: flex;
	/* R18 (2026-05-15) — left-align Contact button to match adjacent
	 * .apchip-pdp-summary-spec-sheet which sits in normal block flow at
	 * the summary column's left edge. Previous `justify-content: center`
	 * was inconsistent with the rest of the summary's left-aligned chrome. */
	justify-content: flex-start;
}
.product .apchip-pdp-contact-cta {
	min-width: min(100%, 280px);
	text-align: center;
	letter-spacing: 0.04em;
	font-weight: 700;
	text-transform: uppercase;
}
@media (max-width: 690px) {
	.product .apchip-pdp-contact-cta { width: 100%; }
}

/* =============================== ACCORDION WRAP (clearfix) ===============================
 * The accordion is hooked at woocommerce_after_single_product_summary priority 5,
 * which fires INSIDE Salient's .product flex container. Without this clearfix the
 * accordion lays out in the same flex row as .images and .summary, visually
 * "wrapping" beside the gallery. Forcing flex-basis 100% + clear:both moves it
 * to its own row below the gallery+summary row regardless of theme float/flex
 * configuration. Keeps the existing hook order with contact CTA (priority 10).
 */
.product .apchip-pdp-accordion-wrap {
	display: block;
	clear: both;
	flex-basis: 100%;
	width: 100%;
	margin-top: 2rem;
}

/* =============================== FAQ section (Phase 1.10, 2026-05-15) =================================
 * Mirrors allied-potato's FAQ block below the product summary. Section spans full
 * width of the .container.main-content (escapes .summary right-column). Native
 * <details> for keyboard a11y; aria-labelledby on section + Schema.org FAQPage
 * JSON-LD inline. */

.apchip-faq-section {
	margin: 3rem 0 2rem;
	padding: 2rem 0;
	border-top: 1px solid var(--color-neutral-subtle-border, #ececec);
}
.apchip-faq-section__inner {
	max-width: 880px;
	margin: 0 auto;
}
.apchip-faq-section__header {
	margin-bottom: 1.5rem;
	text-align: center;
}
.apchip-faq-section__title {
	font-family: "League Gothic", "Roboto Condensed", sans-serif;
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	font-size: clamp(1.6rem, 2.6vw, 2.2rem);
	margin: 0 0 0.5rem;
	color: var(--color-brand-neutral-dark, #333333);
}
.apchip-faq-section__intro {
	font-size: 0.95rem;
	line-height: 1.55;
	color: var(--color-neutral-gray-555, #555555);
	max-width: 720px;
	margin: 0 auto;
}
.apchip-faq-section__intro p { margin: 0; }

.apchip-faq-section__list {
	display: flex;
	flex-direction: column;
	gap: 0;
	border-top: 1px solid var(--color-neutral-subtle-border, #ececec);
}
.apchip-faq-item {
	border-bottom: 1px solid var(--color-neutral-subtle-border, #ececec);
}
.apchip-faq-item__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	cursor: pointer;
	padding: 1.1rem 0.25rem;
	list-style: none;
	/* R17 (2026-05-15) — match established PDP accordion title typography
	 * (.apchip-pdp-accordion__title is 24px League Gothic uppercase). The
	 * original 1.15rem (≈18.4px) created a visible size mismatch between
	 * the 3 existing accordions and this new FAQ accordion. */
	font-family: "League Gothic", "Roboto Condensed", sans-serif;
	font-weight: 400;
	font-size: 24px;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--color-brand-neutral-dark, #333333);
	transition: color 0.15s ease;
}
.apchip-faq-item__summary::-webkit-details-marker { display: none; }
.apchip-faq-item__summary::marker { content: ""; }
.apchip-faq-item__summary:hover,
.apchip-faq-item__summary:focus-visible {
	color: var(--color-brand-secondary, #fcb034);
	outline: none;
}
.apchip-faq-item__summary:focus-visible {
	box-shadow: 0 0 0 3px rgba(252, 176, 52, 0.3);
	border-radius: 2px;
}
.apchip-faq-item__question { flex: 1 1 auto; }
.apchip-faq-item__icon {
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	position: relative;
	transition: transform 0.2s ease;
}
.apchip-faq-item__icon::before,
.apchip-faq-item__icon::after {
	content: "";
	position: absolute;
	background: currentColor;
	transition: transform 0.2s ease;
}
.apchip-faq-item__icon::before {
	top: 50%; left: 25%; right: 25%; height: 2px; margin-top: -1px;
}
.apchip-faq-item__icon::after {
	left: 50%; top: 25%; bottom: 25%; width: 2px; margin-left: -1px;
}
.apchip-faq-item[open] .apchip-faq-item__icon::after {
	transform: rotate(90deg);
}

.apchip-faq-item__answer {
	padding: 0 0.25rem 1.25rem;
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--color-neutral-gray-555, #555555);
	max-width: 720px;
}
.apchip-faq-item__answer p { margin: 0 0 0.75rem; }
.apchip-faq-item__answer p:last-child { margin-bottom: 0; }
.apchip-faq-item__answer a {
	color: var(--color-brand-primary, #0d4c7d);
	text-decoration: underline;
}
.apchip-faq-item__answer a:hover,
.apchip-faq-item__answer a:focus-visible {
	color: var(--color-brand-secondary, #fcb034);
}

@media (max-width: 767px) {
	.apchip-faq-section { padding: 1.5rem 0; margin: 2rem 0 1.5rem; }
	/* Mobile scaling — keep within sensible reading range while preserving
	 * proportional relationship to the existing PDP accordion summaries. */
	.apchip-faq-item__summary { font-size: 20px; padding: 0.9rem 0.25rem; }
}