/* Single product page (Figma Product 459:2338). Cards in the More row come from shop.css. */

/* Breadcrumb */
.nf-crumbs { padding-block: 28px; font-size: 14px; line-height: 1.2; color: var(--nf-muted); }
.nf-crumbs__list { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; padding: 0; list-style: none; }
.nf-crumbs__item + .nf-crumbs__item::before { content: "/"; margin-right: 10px; }
.nf-crumbs a { color: inherit; text-decoration: none; }
.nf-crumbs a:hover { color: var(--nf-crust-dark); text-decoration: underline; }

/* Layout: gallery 720, buy panel 520 */
.nf-product { padding-bottom: 104px; }
.nf-product__inner { display: grid; grid-template-columns: minmax(0, 720fr) minmax(0, 520fr); column-gap: 72px; align-items: start; }
.nf-product__inner--solo { grid-template-columns: minmax(0, 720px); justify-content: center; }
.nf-product__panel { min-width: 0; }

/* Gallery */
.nf-gallery { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.nf-gallery__main { position: relative; overflow: hidden; border-radius: 6px; aspect-ratio: 1; }
.nf-gallery__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nf-gallery .nf-plate--ribbon { --nf-ribbon-size: 300px; }
.nf-gallery__thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.nf-gallery__thumb { display: block; height: 170px; border: 2px solid transparent; border-radius: var(--nf-radius); overflow: hidden; }
.nf-gallery__thumb[aria-current="true"] { border-color: var(--nf-olive); }
.nf-gallery__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Buy panel */
.nf-buy { display: flex; flex-direction: column; gap: 24px; }
@media (min-width: 1024px) { .nf-buy { position: sticky; top: calc(var(--nf-header-h) + 24px); } }
.nf-buy__brand { align-self: flex-start; margin-bottom: -12px; font-size: 14px; color: var(--nf-muted); text-decoration: underline; text-decoration-color: var(--nf-crust); text-underline-offset: 3px; }
.nf-buy__head { display: flex; flex-direction: column; gap: 10px; }
.nf-buy__title { margin: 0; font-size: 46px; line-height: 1.08; }
.nf-buy__price { margin: 0; font-size: 22px; font-weight: 600; line-height: 1.2; }
.nf-buy__desc { font-size: 18px; line-height: 1.6; color: var(--nf-muted); }
.nf-buy__desc > :last-child { margin-bottom: 0; }
.nf-buy__note { margin: 0; padding-left: 14px; border-left: 3px solid var(--nf-crust); font-size: 16px; line-height: 1.5; }

.nf-buy__form { margin: 0; display: flex; flex-direction: column; gap: 24px; }
.nf-buy__choice { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; border: 0; min-width: 0; }
.nf-buy__legend { display: flex; align-items: baseline; gap: 8px; padding: 0; float: none; width: auto; }
.nf-buy__legend-main { font-size: 15px; font-weight: 600; }
.nf-buy__legend-note { font-size: 14px; color: var(--nf-muted); }
.nf-seg--lg { border-radius: 6px; }
.nf-seg--lg .nf-seg__label { padding: 14px 8px; font-size: 16px; font-weight: 600; }

.nf-buy__actions { display: flex; gap: 12px; align-items: stretch; }
.nf-qty--lg { gap: 10px; padding: 0 8px; border-radius: 6px; font-size: 18px; }
.nf-qty--lg .nf-qty__btn { width: 32px; height: 44px; }
.nf-qty--lg .nf-qty__input { width: 2.4ch; height: 44px; line-height: 44px; }
.nf-buy__add { flex: 1; min-width: 0; min-height: 46px; padding: 12px 16px; border-radius: 6px; font-size: 16px; line-height: 1.2; letter-spacing: .04em; }
.nf-buy__added { margin: -8px 0 0; font-size: 15px; font-weight: 600; color: var(--nf-olive); }
.nf-buy__added a { text-decoration: underline; text-decoration-color: var(--nf-crust); text-underline-offset: 3px; text-decoration-thickness: 2px; }

.nf-buy__pickup { display: flex; flex-direction: column; gap: 4px; padding: 16px 20px; border-radius: 6px; background: var(--nf-paper-30); }
.nf-buy__pickup p { margin: 0; line-height: 1.25; }
.nf-buy__pickup-date { font-size: 16px; font-weight: 600; }
.nf-buy__pickup-text { font-size: 15px; color: var(--nf-muted); }

.nf-buy__notify { display: flex; flex-direction: column; gap: 16px; }
.nf-buy__status { margin: 0; font-size: 16px; line-height: 1.5; color: var(--nf-muted); }
.nf-buy__quote { display: flex; }

/* Also comes as a Mini */
.nf-mini {
	display: flex; align-items: center; gap: 16px; padding: 12px 20px 12px 12px; border: 1px solid var(--nf-rule); border-radius: 6px;
	color: inherit; text-decoration: none;
}
.nf-mini:hover { border-color: var(--nf-olive); }
.nf-mini__photo { flex: none; width: 64px; height: 64px; border-radius: var(--nf-radius); overflow: hidden; }
.nf-mini__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nf-mini__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; line-height: 1.25; }
.nf-mini__title { font-size: 16px; font-weight: 600; }
.nf-mini__sub { font-size: 15px; color: var(--nf-muted); }
.nf-mini__view { flex: none; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--nf-olive); }

/* Details rows */
.nf-details { border-bottom: 1px solid var(--nf-rule); }
.nf-details__row { border-top: 1px solid var(--nf-rule); }
.nf-details__summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; cursor: pointer; list-style: none; }
.nf-details__summary::-webkit-details-marker { display: none; }
.nf-details__title { font-family: var(--nf-font-display); font-size: 18px; font-weight: 700; line-height: 1.3; }
.nf-details__icon { flex: none; width: 14px; font-size: 20px; font-weight: 500; line-height: 1; text-align: center; color: var(--nf-olive); }
.nf-details__icon::before { content: "+"; }
.nf-details__row[open] .nf-details__icon::before { content: "\2013"; }
.nf-details__body { padding-bottom: 18px; font-size: 15px; line-height: 1.6; color: var(--nf-muted); }
.nf-details__body p { margin: 0 0 12px; }
.nf-details__body > :last-child { margin-bottom: 0; }
.nf-link-arrow--sm { font-size: 13px; padding-bottom: 5px; color: var(--nf-ink); }

/* Sourdough band */
.nf-band { padding-block: 56px; }
.nf-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.nf-band__title { margin: 0 0 8px; font-size: 32px; line-height: 1.25; }
.nf-band__line { margin: 0; font-size: 17px; line-height: 1.3; opacity: .85; }
.nf-band .nf-btn { flex: none; }

/* More from the group */
.nf-more { padding-block: 96px 112px; }
.nf-more__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.nf-more__title { margin: 0; font-size: 32px; line-height: 1.25; }
.nf-more__head .nf-link-arrow { flex: none; font-size: 14px; padding-bottom: 6px; }
.nf-more__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; align-items: start; }

/* Mobile bottom Add bar: appears once the buy panel's button has scrolled away. */
.nf-buybar { display: none; }

@media (max-width: 1023.98px) {
	.nf-product__inner { grid-template-columns: minmax(0, 1fr); row-gap: 40px; }
	.nf-product { padding-bottom: 72px; }
	.nf-buy__title { font-size: 40px; }
	.nf-more__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
	.nf-more { padding-block: 72px; }
}

@media (max-width: 767.98px) {
	.nf-crumbs { padding-block: 20px; }
	.nf-product { padding-bottom: 56px; }
	.nf-gallery__thumbs { gap: 8px; }
	.nf-gallery__thumb { height: auto; aspect-ratio: 1; }
	.nf-gallery .nf-plate--ribbon { --nf-ribbon-size: 60%; }
	.nf-buy__title { font-size: 34px; }
	.nf-buy__desc { font-size: 17px; }
	.nf-band { padding-block: 40px; }
	.nf-band__inner { flex-direction: column; align-items: flex-start; gap: 24px; }
	.nf-band__title { font-size: 26px; }
	.nf-more { padding-block: 56px; }
	.nf-more__head { flex-direction: column; align-items: flex-start; gap: 12px; }
	.nf-more__title { font-size: 28px; }
	.nf-more__grid { gap: 28px 14px; }
	.nf-mini__view { display: none; }

	.nf-buybar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: block;
		padding: 12px var(--nf-gutter) calc(12px + env(safe-area-inset-bottom)); background: var(--nf-white); border-top: 1px solid var(--nf-rule);
	}
	.nf-buybar[hidden] { display: none; }
	.nf-buybar__btn { width: 100%; }
}

/* A product with nothing to list after the band (a lone coming-soon item) still gets room before the footer. */
.nf-product-page > .nf-band:last-child { margin-bottom: 96px; }

/* In stores only: the "Find it on the shelf" panel (Figma 589:4680) replaces the buy controls. */
.nf-shelf { display: flex; flex-direction: column; gap: 16px; padding: 24px; border: 1px solid var(--nf-rule); border-radius: 8px; background: var(--nf-paper-30); }
.nf-shelf__head { display: flex; flex-direction: column; gap: 6px; }
.nf-shelf__title { margin: 0; font-size: 22px; line-height: 1.2; }
.nf-shelf__line { margin: 0; font-size: 15px; line-height: 1.5; color: var(--nf-muted); }
.nf-shelf__typical { margin: 0; font-size: 14px; line-height: 1.5; color: var(--nf-muted); }
.nf-shelf__stores { margin: 0; padding: 0; list-style: none; }
.nf-shelf__store { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 12px; border-top: 1px solid var(--nf-rule); }
.nf-shelf__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nf-shelf__name { font-size: 16px; font-weight: 600; line-height: 1.2; color: var(--nf-ink); }
.nf-shelf__address { font-size: 14px; line-height: 1.2; color: var(--nf-muted); }
.nf-shelf__week { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; padding-top: 4px; }
.nf-shelf__week-text { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--nf-crust-dark); }
.nf-shelf__link { flex: none; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; line-height: 1.2; color: var(--nf-olive); text-decoration: none; }
.nf-shelf__week .nf-shelf__link { gap: 6px; }
.nf-shelf__link:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 767.98px) {
	.nf-shelf { padding: 20px; }
	.nf-shelf__week { flex-direction: column; align-items: flex-start; gap: 8px; }
}

.nf-product-page > .nf-notices + .nf-crumbs { padding-top: 16px; }