/* Beurre Atelier — single product: variation pills + mobile sticky add-to-basket.
   Ported from bite-child/assets/css/woocommerce-mobile.css (1.0.3) and re-tokenised.
   assets/js/woocommerce-mobile.js builds the pills and the bar; without this file the
   original <select> stays visible under the pills and the pills stagger. */

/* ---------- Variations as pills ---------- */
.beurre-variations-as-buttons table.variations,
.beurre-variations-as-buttons table.variations tbody,
.beurre-variations-as-buttons table.variations tr,
.beurre-variations-as-buttons table.variations td,
.beurre-variations-as-buttons table.variations th { display: block; width: 100%; margin: 0; padding: 0; border: 0; }
.beurre-variations-as-buttons table.variations tr + tr { margin-top: 16px; }
.beurre-variations-as-buttons table.variations select,
.beurre-variations-as-buttons .reset_variations,
.beurre-variation-label { display: none !important; } /* the script's label duplicates the table's own <th> */

.beurre-variation-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; align-items: stretch; justify-content: flex-start; }
.woocommerce div.product form.cart .variations td .beurre-variation-button,
.beurre-variation-button {
	flex: 0 0 auto; margin: 0 !important; min-width: 0 !important; width: auto !important;
	min-height: 44px; padding: 10px 18px !important; line-height: 1.3;
	border-radius: var(--bp-radius-pill); border: 1px solid var(--bp-gold);
	background: var(--bp-white); color: var(--bp-ink);
	font-family: var(--bp-font-head); font-size: 13px; font-weight: 500; cursor: pointer;
	transition: background .15s, color .15s, border-color .15s;
}
.beurre-variation-button:hover { border-color: var(--bp-ink); }
.beurre-variation-button[aria-pressed="true"] { background: var(--bp-ink); border-color: var(--bp-ink); color: var(--bp-bg); }
.beurre-variation-button:disabled { opacity: .4; cursor: not-allowed; }
.beurre-variation-button:focus-visible { outline: 2px solid var(--bp-ink); outline-offset: 2px; }

/* ---------- Sticky add-to-basket bar (phones only) ---------- */
.beurre-mobile-atc {
	position: fixed; left: 0; right: 0; bottom: -120px; z-index: 55;
	display: flex; align-items: center; gap: 12px;
	padding: 12px var(--bp-gutter) max(12px, env(safe-area-inset-bottom));
	background: var(--bp-white); border-top: 1px solid var(--bp-border);
	box-shadow: 0 -4px 16px rgba(37, 26, 23, .08);
	transition: bottom .25s ease-out; font-family: var(--bp-font-body);
}
.beurre-mobile-atc--visible { bottom: 0; }
.beurre-mobile-atc__title { flex: 1; min-width: 0; font-family: var(--bp-font-head); font-size: 14px; font-weight: 500; color: var(--bp-ink); line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.beurre-mobile-atc__price { display: block; font-family: var(--bp-font-body); font-size: 13px; font-weight: 400; color: var(--bp-meta); margin-top: 2px; }
.beurre-mobile-atc__btn { flex: none; min-height: 44px; padding: 12px 22px; border: 0; border-radius: var(--bp-radius-pill); background: var(--bp-pink); color: var(--bp-on-pink); font-family: var(--bp-font-head); font-size: 14px; font-weight: 500; white-space: nowrap; cursor: pointer; }
.beurre-mobile-atc__btn:disabled { background: var(--bp-border); color: var(--bp-meta); cursor: not-allowed; }
.beurre-mobile-atc__btn:active { transform: scale(.98); }
body.single-product main { padding-bottom: 96px; } /* room for the bar */
@media (min-width: 769px) /* matches MOBILE_BREAKPOINT in the script */ {
	.beurre-mobile-atc { display: none !important; }
	body.single-product main { padding-bottom: 0; }
}
[data-bp-theme="dark"] .beurre-mobile-atc { background: var(--bp-bg); }