/* ===========================================================
   Bloom Flower — Single Product ("Vibrant Petal" produs mockup)
   =========================================================== */

/* ---------- Responsive artboard toggle (hide-only pattern —
   see shop.css for why we never force a visible `display` value) ---------- */
@media (max-width: 767px) {
	.bloom-product-desktop-only { display: none !important; }
}
@media (min-width: 768px) {
	.bloom-product-mobile-only { display: none !important; }
}

.bloom-product-page { padding-top: 2rem; padding-bottom: var(--space-section-gap); }
.bloom-breadcrumb-sep { font-size: 12px !important; vertical-align: middle; }
.woocommerce-breadcrumb a:hover { color: var(--color-primary); }

/* ---------- Desktop hero ---------- */
.bloom-product-hero {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-gutter);
	align-items: start;
	margin-top: 1.5rem;
}
@media (min-width: 1024px) {
	.bloom-product-hero { grid-template-columns: 7fr 5fr; }
}

.bloom-gallery-bento { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.bloom-gallery-bento__tile { position: relative; aspect-ratio: 1; border-radius: var(--radius-xl); overflow: hidden; cursor: pointer; }
.bloom-gallery-bento__tile--large { grid-column: span 2; aspect-ratio: 4/5; }
.bloom-gallery-bento__img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.bloom-gallery-bento__tile:hover .bloom-gallery-bento__img { transform: scale(1.05); }

.bloom-gallery-bento__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: none;
	border-radius: var(--radius-full);
	background: rgba(255, 255, 255, 0.85);
	color: var(--color-on-surface);
	box-shadow: var(--shadow-ambient-l1);
	opacity: 0;
	transition: opacity .2s ease, background-color .2s ease;
	z-index: 2;
}
.bloom-gallery-bento__tile:hover .bloom-gallery-bento__nav { opacity: 1; }
.bloom-gallery-bento__nav:hover { background: #fff; color: var(--color-primary); }
.bloom-gallery-bento__nav--prev { left: 0.75rem; }
.bloom-gallery-bento__nav--next { right: 0.75rem; }

.bloom-product-hero__info { display: flex; flex-direction: column; gap: 2rem; }
@media (min-width: 1024px) {
	.bloom-product-hero__info { position: sticky; top: 96px; }
}
.bloom-product-badges { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.bloom-product-title { color: var(--color-primary); margin-block: 0.5rem 0.25rem; }
.bloom-product-price { color: var(--color-secondary); }
.bloom-product-desc { color: var(--color-on-surface-variant); }
.bloom-product-desc p + p { margin-top: 1em; }

/* ---------- Size pills ---------- */
.bloom-add-to-cart-wrap { display: flex; flex-direction: column; gap: 1.5rem; }
.bloom-size-select__label,
.bloom-gift-message__label { display: block; margin-bottom: 0.75rem; color: var(--color-on-surface); }
.bloom-size-pills { display: flex; gap: 1rem; }
.bloom-size-pill {
	flex: 1;
	padding: 0.75rem 1rem;
	border-radius: var(--radius-lg);
	border: 1px solid var(--color-outline-variant);
	background: transparent;
	font-family: var(--font-body);
	font-weight: var(--text-label-lg-weight);
	font-size: var(--text-label-lg-size);
	color: var(--color-on-surface);
	transition: all .2s ease;
}
.bloom-size-pill:hover { border-color: var(--color-primary); }
.bloom-size-pill--active {
	border: 2px solid var(--color-primary);
	background: var(--color-primary-fixed);
	color: var(--color-on-primary-fixed);
	padding: calc(0.75rem - 1px) calc(1rem - 1px);
}

/* ---------- Native WooCommerce variation form: keep it functional,
   hide the parts we replaced visually, restyle what stays ---------- */
.bloom-native-variations table.variations,
.bloom-native-variations .woocommerce-variation-description,
.bloom-native-variations .reset_variations { display: none; }

.bloom-native-variations form.cart { display: flex; flex-direction: column; gap: 1rem; }
.bloom-native-variations .woocommerce-variation-price .price { color: var(--color-secondary); }
/* !important: WC's variation JS toggles this via inline style="display:block"
   when a variation resolves, which would otherwise win over a plain rule. */
.bloom-native-variations .quantity { display: none !important; }

.bloom-native-variations button.single_add_to_cart_button,
.bloom-native-variations a.single_add_to_cart_button {
	width: 100%;
	padding: 1.25rem;
	background: var(--color-primary);
	color: var(--color-on-primary);
	border: none;
	border-radius: var(--radius-lg);
	font-family: var(--font-body);
	font-weight: var(--text-label-lg-weight);
	font-size: var(--text-label-lg-size);
	box-shadow: var(--shadow-ambient-l1);
	transition: filter .2s ease, transform .15s ease;
}
.bloom-native-variations button.single_add_to_cart_button:hover { filter: brightness(1.08); }
.bloom-native-variations button.single_add_to_cart_button:active { transform: scale(0.98); }
.bloom-native-variations button.single_add_to_cart_button.disabled { opacity: 0.5; cursor: not-allowed; }
.bloom-native-variations button.single_add_to_cart_button::before {
	font-family: 'Material Symbols Outlined';
	content: 'shopping_bag';
	margin-right: 0.5rem;
	vertical-align: middle;
	font-variation-settings: 'FILL' 1;
}

.bloom-gift-message .bloom-textarea { min-height: 6rem; }

/* ---------- Meta row (shipping / share / wishlist) ---------- */
.bloom-product-meta-row { display: flex; justify-content: space-between; align-items: center; padding-inline: 0.25rem; }
.bloom-product-shipping { display: flex; align-items: center; gap: 0.35rem; color: var(--color-tertiary); }
.bloom-product-shipping .material-symbols-outlined { font-size: 20px; }
.bloom-product-share { display: flex; gap: 1rem; }
.bloom-icon-link { background: none; border: none; color: var(--color-secondary); transition: color .2s ease; }
.bloom-icon-link:hover { color: var(--color-primary); }
.bloom-icon-link.bloom-wishlist-btn.is-active { color: var(--color-primary); }
.bloom-icon-link.bloom-wishlist-btn.is-active .material-symbols-outlined { font-variation-settings: 'FILL' 1; }

/* ---------- Trust block ---------- */
.bloom-trust-block {
	display: flex; align-items: center; gap: 1rem;
	padding: 1.5rem; background: var(--color-surface-container); border-radius: var(--radius-xl);
}
.bloom-trust-block__avatars { display: flex; }
.bloom-trust-block__avatar { width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--color-surface); object-fit: cover; margin-left: -12px; }
.bloom-trust-block__avatar:first-child { margin-left: 0; }
.bloom-stars .material-symbols-outlined { font-size: 16px; color: var(--color-star); }

/* ---------- Care / substitution / delivery info cards ---------- */
.bloom-care-info { display: grid; grid-template-columns: 1fr; gap: var(--space-gutter); }
@media (min-width: 768px) { .bloom-care-info { grid-template-columns: repeat(3, 1fr); } }
.bloom-care-info__card {
	padding: 2rem;
	background: var(--color-surface-container-low);
	border-radius: var(--radius-xl);
	border: 1px solid var(--color-outline-variant);
}
.bloom-care-info__icon { font-size: 28px; color: var(--color-primary); display: block; margin-bottom: 1rem; }
.bloom-care-info__icon--muted { color: var(--color-secondary); }
.bloom-care-info__card h3 { margin-bottom: 1rem; }
.bloom-care-info__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.bloom-care-info__list li {
	position: relative;
	padding-left: 1.1rem;
	color: var(--color-on-surface-variant);
	font-size: var(--text-body-md-size);
}
.bloom-care-info__list li::before {
	content: '';
	position: absolute; left: 0; top: 0.55em;
	width: 5px; height: 5px; border-radius: 50%;
	background: var(--color-primary);
}
.bloom-care-info__card p { color: var(--color-on-surface-variant); }
.bloom-care-info__subhead { font-weight: 700; color: var(--color-on-surface); margin-top: 1rem; margin-bottom: 0.15rem; }
.bloom-care-info__subhead:first-of-type { margin-top: 0; }

/* ---------- "Completează Cadoul" gift add-ons ---------- */
/* Desktop: sits directly under the care-info cards as one visual group,
   so skip the section's own top padding there. Mobile: it's a standalone
   section after the description, so keep normal section spacing. */
@media (min-width: 768px) {
	.bloom-gift-addons-section { padding-top: 0; }
}
.bloom-gift-addons__heading { margin-bottom: 2rem; }
.bloom-gift-addons { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-gutter); }
@media (min-width: 640px) { .bloom-gift-addons { grid-template-columns: repeat(4, 1fr); } }
.bloom-gift-addon { display: flex; flex-direction: column; gap: 0.5rem; }
.bloom-gift-addon__media { display: block; aspect-ratio: 1; border-radius: var(--radius-lg); overflow: hidden; background: var(--color-surface-container-low); }
.bloom-gift-addon__img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.bloom-gift-addon__media:hover .bloom-gift-addon__img { transform: scale(1.05); }
.bloom-gift-addon__name { color: var(--color-on-surface); }
.bloom-gift-addon__price { color: var(--color-primary); font-weight: 700; }
/* Extra-specific selector (matches .woocommerce a.button's own specificity,
   and loads after components.css) so it reliably wins over the generic
   WooCommerce button styling instead of fighting it with !important.
   Note: WC's loop add-to-cart link renders as a <span> here (simple,
   non-ajax-eligible fallback markup), not an <a> — don't require a tag. */
.woocommerce .button.bloom-gift-addon__btn,
.bloom-gift-addons .bloom-gift-addon__btn {
	display: flex; align-items: center; justify-content: center;
	margin-top: 0.35rem;
	padding: 0.6rem 1rem;
	border: 1px solid var(--color-outline-variant);
	border-radius: var(--radius-lg);
	background: transparent;
	color: var(--color-on-surface) !important;
	font-family: var(--font-body);
	font-size: var(--text-label-md-size);
	font-weight: 600;
	transition: background-color .2s ease, border-color .2s ease;
}
.woocommerce .button.bloom-gift-addon__btn:hover,
.bloom-gift-addons .bloom-gift-addon__btn:hover { background: var(--color-primary); border-color: var(--color-primary); color: #fff !important; }

/* ---------- Reviews (masonry via CSS columns, restyling default WP/WC markup) ---------- */
.bloom-reviews-head { margin-bottom: 3rem; }
.bloom-reviews-lead { color: var(--color-on-surface-variant); }
.bloom-reviews-masonry .woocommerce-Reviews-title,
.bloom-reviews-masonry #reply-title { display: none; }
.bloom-reviews-masonry ol.commentlist {
	list-style: none; margin: 0; padding: 0;
	columns: 1; column-gap: var(--space-gutter);
}
@media (min-width: 768px) { .bloom-reviews-masonry ol.commentlist { columns: 2; } }
@media (min-width: 1024px) { .bloom-reviews-masonry ol.commentlist { columns: 3; } }
.bloom-reviews-masonry ol.commentlist li.review {
	break-inside: avoid;
	margin-bottom: var(--space-gutter);
	padding: 2rem;
	background: var(--color-surface-container-low);
	border-radius: var(--radius-xl);
	box-shadow: var(--shadow-ambient-l1);
	list-style: none;
}
.bloom-reviews-masonry .comment_container { display: flex; flex-direction: column; gap: 1rem; }

/* Classic clip-overlay star rating (WC's own sprite CSS is disabled
   along with the rest of its default stylesheet, so we provide our own
   using the same two-layer technique: a grey 5-star base, with a gold
   5-star layer clipped to the rating percentage on top). */
.bloom-reviews-masonry .star-rating,
.woocommerce .star-rating {
	position: relative;
	display: inline-block;
	width: 5.4em;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 2px;
	color: var(--color-outline-variant);
	font-family: sans-serif;
}
.bloom-reviews-masonry .star-rating::before,
.woocommerce .star-rating::before { content: '★★★★★'; display: block; }
.bloom-reviews-masonry .star-rating span,
.woocommerce .star-rating span {
	position: absolute; top: 0; left: 0;
	overflow: hidden; white-space: nowrap;
	color: var(--color-star);
}
.bloom-reviews-masonry .star-rating span::before,
.woocommerce .star-rating span::before { content: '★★★★★'; display: block; }
.bloom-reviews-masonry .description p { font-style: italic; color: var(--color-on-surface); }
.bloom-reviews-masonry .comment-text { display: flex; flex-direction: column; gap: 1rem; order: 2; }
.bloom-reviews-masonry .comment-author { display: flex; align-items: center; gap: 0.75rem; order: 3; }
.bloom-reviews-masonry .comment-author img { border-radius: 50%; }
.bloom-reviews-masonry .woocommerce-review__author { font-weight: 600; font-family: var(--font-body); font-style: normal; }
.bloom-reviews-masonry .woocommerce-review__verified { font-size: var(--text-label-md-size); color: var(--color-secondary); display: block; font-style: normal; }
.bloom-reviews-masonry .woocommerce-review__dash { display: none; }
.bloom-reviews-masonry #review_form_wrapper { break-inside: avoid; margin-top: var(--space-gutter); }
.bloom-reviews-masonry #commentform { display: flex; flex-direction: column; gap: 1rem; max-width: 40rem; }
.bloom-reviews-masonry #commentform p { margin: 0; }
.bloom-reviews-masonry #commentform textarea { width: 100%; }
.bloom-reviews-masonry .comment-reply-title { font-family: var(--font-display); font-size: var(--text-headline-sm-size); }

/* ============================================================
   MOBILE
   ============================================================ */

.bloom-swipe-gallery { position: relative; width: 100%; aspect-ratio: 4/5; overflow: hidden; background: var(--color-surface-container-low); }
.bloom-swipe-gallery__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; height: 100%; width: 100%; scrollbar-width: none; }
.bloom-swipe-gallery__track::-webkit-scrollbar { display: none; }
.bloom-swipe-gallery__slide { flex: 0 0 100%; scroll-snap-align: center; position: relative; height: 100%; cursor: pointer; }
.bloom-swipe-gallery__img { width: 100%; height: 100%; object-fit: cover; }
.bloom-swipe-gallery__dots { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.5rem; z-index: 2; }
.bloom-swipe-gallery__dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.5); }
.bloom-swipe-gallery__dot--active { background: var(--color-primary); }

.bloom-swipe-gallery__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: none;
	border-radius: var(--radius-full);
	background: rgba(255, 255, 255, 0.85);
	color: var(--color-on-surface);
	box-shadow: var(--shadow-ambient-l1);
	z-index: 2;
}
.bloom-swipe-gallery__nav--prev { left: 0.75rem; }
.bloom-swipe-gallery__nav--next { right: 0.75rem; }

/* ---------- Fullscreen lightbox ---------- */
.bloom-lightbox {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.92);
}
.bloom-lightbox[hidden] { display: none; }
.bloom-lightbox__figure {
	margin: 0;
	max-width: min(90vw, 900px);
	max-height: 85vh;
	display: flex;
}
.bloom-lightbox__img { max-width: 100%; max-height: 85vh; object-fit: contain; border-radius: var(--radius-lg); }
.bloom-lightbox__close,
.bloom-lightbox__nav {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: var(--radius-full);
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	transition: background-color .2s ease;
}
.bloom-lightbox__close:hover,
.bloom-lightbox__nav:hover { background: rgba(255, 255, 255, 0.25); }
.bloom-lightbox__close { top: 1.5rem; right: 1.5rem; width: 44px; height: 44px; }
.bloom-lightbox__nav { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; }
.bloom-lightbox__nav--prev { left: 1rem; }
.bloom-lightbox__nav--next { right: 1rem; }
.bloom-lightbox__counter {
	position: absolute;
	bottom: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.8);
	font-family: var(--font-body);
	font-size: var(--text-label-md-size);
}
@media (max-width: 600px) {
	.bloom-lightbox__nav { width: 44px; height: 44px; }
	.bloom-lightbox__nav--prev { left: 0.5rem; }
	.bloom-lightbox__nav--next { right: 0.5rem; }
	.bloom-lightbox__close { top: 1rem; right: 1rem; }
}

.bloom-product-mobile-info { padding-top: 2rem; display: flex; flex-direction: column; gap: 1.5rem; }
.bloom-product-mobile-info__head { display: flex; flex-direction: column; gap: 0.5rem; }
.bloom-product-mobile-info__rating { display: flex; align-items: center; gap: 0.5rem; color: var(--color-secondary); }
.bloom-product-mobile-info__price { color: var(--color-primary); }
.bloom-product-mobile-info__desc h3 { text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-on-surface-variant); margin-bottom: 0.75rem; }
.bloom-product-mobile-info__desc div { color: var(--color-on-surface-variant); opacity: 0.85; }

.bloom-tag-pills { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.bloom-tag-pill { padding: 0.4rem 0.85rem; background: var(--color-secondary-container); color: var(--color-on-secondary-container); border-radius: var(--radius-full); font-size: var(--text-label-md-size); }

.bloom-seen-wild { margin-top: 2rem; display: flex; flex-direction: column; gap: 1.5rem; }
.bloom-seen-wild__head { display: flex; justify-content: space-between; align-items: flex-end; padding-inline: var(--space-margin-mobile); }
.bloom-seen-wild__head p { color: var(--color-secondary); }
.bloom-seen-wild__strip { display: flex; gap: 1rem; overflow-x: auto; padding-inline: var(--space-margin-mobile); scrollbar-width: none; }
.bloom-seen-wild__strip::-webkit-scrollbar { display: none; }
.bloom-seen-wild__item { flex: 0 0 160px; aspect-ratio: 1; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-ambient-l1); }
.bloom-seen-wild__item img { width: 100%; height: 100%; object-fit: cover; }

.bloom-accordion { margin-top: 1rem; }

/* Sticky quick-buy bar */
.bloom-quick-buy {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
	background: rgba(252,249,248,0.92);
	backdrop-filter: blur(16px);
	border-top: 1px solid var(--color-outline-variant);
	box-shadow: var(--shadow-ambient-l2);
	padding-block: 1rem 1.5rem;
}
.bloom-quick-buy__inner { display: flex; align-items: center; gap: 1rem; }
.bloom-quick-buy__selected { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.bloom-quick-buy__selected .bloom-text-label-md { color: var(--color-secondary); }
.bloom-quick-buy__actions { display: flex; gap: 0.75rem; }
.bloom-quick-buy__wishlist {
	width: 56px; height: 56px; border-radius: var(--radius-lg);
	border: 2px solid var(--color-outline-variant); background: none;
	color: var(--color-on-surface); display: flex; align-items: center; justify-content: center;
	flex-shrink: 0;
}
.bloom-quick-buy__wishlist.is-active { border-color: var(--color-primary); color: var(--color-primary); }
.bloom-quick-buy__wishlist.is-active .material-symbols-outlined { font-variation-settings: 'FILL' 1; }
.bloom-quick-buy__cta { flex-grow: 1; min-width: 160px; height: 56px; box-shadow: 0 8px 20px -6px rgba(181,16,106,0.3); }