/* Bundle Offers Pro: product page widget */
body.bop-hide-native div.product form.cart:not(.bop-keep),
body.bop-hide-native .wp-block-add-to-cart-form form.cart { display: none !important; }
form.bop-native-hidden { display: none !important; }
/* Keep the theme's swatches, hide only its quantity + Add to cart button. */
body.bop-keep-swatches div.product form.cart:not(.variations_form):not(.bop-keep),
body.bop-keep-swatches div.product form.variations_form .woocommerce-variation-add-to-cart,
form.bop-native-partial .woocommerce-variation-add-to-cart,
form.bop-native-partial .single_add_to_cart_button,
form.bop-native-partial div.quantity { display: none !important; }

.bop, .bop-modal {
	--bop-text: #111; --bop-border: #111; --bop-card: #eee; --bop-active: #fff;
	--bop-badge-bg: #111; --bop-badge-text: #fff; --bop-btn-bg: #111; --bop-btn-text: #fff;
	--bop-buy-bg: #fff; --bop-buy-text: #111; --bop-free: #1a7f37; --bop-radius: 12px; --bop-bw: 2px;
	--bop-muted: #555; --bop-plus: #2f3a8f;
	font-family: var(--bop-font, inherit);
}
.bop {
	color: var(--bop-text);
	margin: 0 0 1.5em;
	width: 100%;
	font-size: 16px;
	line-height: 1.25;
	-webkit-tap-highlight-color: transparent;
}
.bop *, .bop *::before, .bop *::after { box-sizing: border-box; }
.bop [hidden] { display: none !important; }

/* Heading with rule */
.bop-heading { display: flex; align-items: center; gap: 14px; margin: 0 0 18px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; font-size: 15px; }
.bop-heading::after { content: ""; flex: 1; height: 2px; background: var(--bop-border); }

/* Tier cards */
.bop-tiers { display: flex; flex-direction: column; gap: 22px; }
.bop-tier {
	position: relative;
	background: var(--bop-card);
	border: var(--bop-bw) solid var(--bop-border);
	border-radius: var(--bop-radius);
	padding: 18px 22px;
	cursor: pointer;
	transition: background-color .15s ease, box-shadow .15s ease;
	outline: none;
}
.bop-tier.has-badge { margin-top: 4px; }
.bop-tier.is-active { background: var(--bop-active); box-shadow: 0 0 0 1px var(--bop-border); cursor: default; }
.bop-tier:focus-visible { box-shadow: 0 0 0 1px var(--bop-border), 0 0 0 4px rgba(47, 58, 143, .35); }
.bop-tier:not(.is-active):hover { background: color-mix(in srgb, var(--bop-card) 70%, #fff); }

/* Badge (tab on the top border) */
.bop-badge {
	position: absolute;
	top: 0;
	right: 44px;
	transform: translateY(-58%);
	background: var(--bop-badge-bg);
	color: var(--bop-badge-text);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: .02em;
	text-transform: uppercase;
	line-height: 1;
	padding: 7px 22px 6px;
	white-space: nowrap;
	border-radius: 4px 4px 6px 6px;
	clip-path: polygon(0 100%, 12px 0, calc(100% - 12px) 0, 100% 100%);
	pointer-events: none;
}
.bop-badge--timer { text-transform: none; font-size: 14px; }
.bop-badge--timer .bop-timer { font-weight: 800; margin-left: 8px; font-variant-numeric: tabular-nums; }

/* Header row */
.bop-tier__head { display: flex; align-items: center; gap: 16px; min-height: 48px; }
.bop-radio {
	flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%;
	border: 2px solid #9a9a9a; background: #fff; position: relative;
}
.bop-tier.is-active .bop-radio { border-color: var(--bop-border); }
.bop-tier.is-active .bop-radio::after {
	content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--bop-accent, var(--bop-border));
}
.bop-thumb { position: relative; flex: 0 0 auto; width: 84px; height: 84px; border-radius: 12px; background: #fff; }
.bop-thumb img { width: 100%; height: 100%; object-fit: contain; border-radius: 12px; display: block; }
.bop-thumb__qty {
	position: absolute; left: -6px; bottom: -8px; background: #111; color: #fff;
	font-size: 16px; line-height: 1; padding: 6px 7px; border-radius: 6px; font-weight: 500;
}
.bop-tier__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 auto; }
.bop-tier__title { font-family: var(--global-heading-font-family, inherit); font-weight: 800; font-size: 28px; line-height: 1.1; letter-spacing: -.01em; }
.bop-tier__sub { font-style: italic; color: var(--bop-muted); font-size: 20px; }
.bop-tier__price { display: flex; flex-direction: column; align-items: flex-end; margin-left: auto; text-align: right; flex: 0 0 auto; }
.bop-now { font-weight: 800; font-size: 30px; line-height: 1.1; white-space: nowrap; }
.bop-was { color: var(--bop-muted); font-style: italic; font-size: 17px; white-space: nowrap; }

/* Body */
.bop-tier__body { display: none; cursor: default; }
.bop-tier.is-active .bop-tier__body:not(:empty) { display: block; margin-top: 18px; }

.bop-optbox { border: 2px solid #3a3a3a; padding: 8px 8px 8px; margin: 0 -2px; }

.bop-slots { display: flex; flex-direction: column; gap: 22px; }
.bop-slot { display: grid; grid-template-columns: 44px 84px minmax(0, 1fr) auto; align-items: start; column-gap: 14px; }
.bop-slot__arrow { width: 44px; height: 44px; color: #666; margin-top: 10px; }
.bop-slot__img { width: 84px; height: 84px; object-fit: contain; border-radius: 8px; background: #fff; }
.bop-slot__plus {
	width: 80px; height: 80px; border: 2px solid #111; border-radius: 12px; background: #fff;
	display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--bop-plus); padding: 0;
}
.bop-slot__plus svg { width: 40px; height: 40px; }
.bop-slot__main { min-width: 0; }
.bop-slot__name { font-size: 20px; font-weight: 500; text-transform: none; margin: 0 0 8px; line-height: 1.2; }
.bop-slot__label { font-size: 20px; font-weight: 500; color: #333; margin: 0 0 8px; }
.bop-slot__price { text-align: right; font-weight: 700; font-size: 18px; white-space: nowrap; padding-top: 40px; }
.bop-slot__price del { display: block; font-weight: 400; color: var(--bop-muted); font-size: 14px; }
.bop-slot__price .bop-free { color: var(--bop-free); font-weight: 800; }
.bop-slot__change { background: none; border: 0; padding: 0; margin: 6px 0 0; font-size: 13px; text-decoration: underline; color: var(--bop-muted); cursor: pointer; }
.bop-slot.is-missing .bop-slot__plus { border-color: #c62828; box-shadow: 0 0 0 3px rgba(198, 40, 40, .18); }
.bop-slot__warn { color: #c62828; font-size: 13px; margin-top: 6px; }

.bop-choose {
	background: #111; color: #fff; border: 0; border-radius: 6px; padding: 11px 20px;
	font-weight: 700; font-size: 19px; cursor: pointer; line-height: 1.1;
}
.bop .bop-choose { background: var(--bop-dark, #111); color: #fff; border-radius: var(--bop-btn-radius, 6px); font-family: inherit; }
.bop .bop-choose:hover { background: var(--bop-accent, #333); color: #fff; }
.bop-slot__plus { color: var(--bop-accent, var(--bop-plus)); }

/* Attribute fields */
.bop-fields { display: flex; flex-wrap: wrap; gap: 10px; }
.bop-field { display: flex; flex-direction: column; gap: 6px; }
.bop-field__label { font-size: 15px; color: #222; }
.bop-select { position: relative; display: inline-flex; align-items: center; }
.bop-select select {
	-webkit-appearance: none; appearance: none; background: #fff; color: #111;
	border: 1.5px solid #ddd; border-radius: 5px; font-size: 18px; line-height: 1.2;
	height: 48px; padding: 0 44px 0 16px; min-width: 108px; cursor: pointer; margin: 0; box-shadow: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M0 0h12L6 8z' fill='%23111'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 14px center; background-size: 14px 9px;
}
.bop-select select:focus { border-color: #111; outline: none; }
.bop-select.has-dot select { padding-left: 56px; min-width: 160px; }
.bop-select__dot {
	position: absolute; left: 14px; width: 28px; height: 28px; border-radius: 50%;
	border: 1.5px solid #d0d0d0; background: #fff; pointer-events: none;
}

/* Swatches (mirrors Kadence Shop Kit: colour circles, size buttons) */
.bop-fields.is-stacked { flex-direction: column; flex-wrap: nowrap; gap: 14px; }
.bop-field--sw { gap: 10px; }
.bop-field--sw .bop-field__label { font-size: 16px; color: #333; }
.bop-field__val { margin-left: 10px; color: #555; }
.bop-sws { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
:is(.bop, .bop-modal) .bop-sw {
	-webkit-appearance: none; appearance: none; position: relative; margin: 0; padding: 0; cursor: pointer;
	font: inherit; line-height: 1; letter-spacing: 0; text-transform: none; text-decoration: none;
	color: #111; background: #fff; box-shadow: none; outline: none; min-height: 0;
	display: inline-flex; align-items: center; justify-content: center; transition: border-color .15s, background-color .15s, color .15s;
}
:is(.bop, .bop-modal) .bop-sw--button {
	min-width: 46px; height: 46px; padding: 0 14px; border: var(--bop-sw-bw, 1px) solid var(--bop-sw-border, #dcdcdc);
	border-radius: var(--bop-sw-radius, 12px); font-size: 15px; font-weight: 400;
}
:is(.bop, .bop-modal) .bop-sw--button:hover { border-color: #111; background: #fff; color: #111; }
:is(.bop, .bop-modal) .bop-sw--button.is-on,
:is(.bop, .bop-modal) .bop-sw--button.is-on:hover { background: var(--bop-sw-on, #000); border-color: var(--bop-sw-on, #000); color: var(--bop-sw-on-text, #fff); }
:is(.bop, .bop-modal) .bop-sw--color {
	width: 42px; height: 42px; border-radius: 50%; border: 2px solid transparent; background: transparent;
}
:is(.bop, .bop-modal) .bop-sw--color:hover { border-color: #bbb; background: transparent; }
:is(.bop, .bop-modal) .bop-sw--color.is-on { border-color: var(--bop-sw-on, #333); }
.bop-sw__c { display: block; width: 32px; height: 32px; border-radius: 50%; border: 1px solid #d6d6d6; background: #fff; }
:is(.bop, .bop-modal) .bop-sw--image { width: 50px; height: 50px; border-radius: 10px; border: 1px solid #dcdcdc; overflow: hidden; background: #fff; }
:is(.bop, .bop-modal) .bop-sw--image img { width: 100%; height: 100%; object-fit: cover; display: block; }
:is(.bop, .bop-modal) .bop-sw--image.is-on { border: 2px solid #111; }
:is(.bop, .bop-modal) .bop-sw.is-na { opacity: .45; }
:is(.bop, .bop-modal) .bop-sw.is-na::after {
	content: ""; position: absolute; left: 12%; right: 12%; top: 50%; border-top: 1.5px solid #777; transform: rotate(-35deg); pointer-events: none;
}
:is(.bop, .bop-modal) .bop-sw:focus-visible { outline: 2px solid #2f3a8f; outline-offset: 2px; }
.bop-pi__variants .bop-fields { width: 100%; }

/* Notice + buttons */
.bop-notice { margin: 14px 0 0; padding: 12px 14px; border-radius: 8px; font-size: 15px; background: #fdecea; color: #8a1c1c; }
.bop-notice.is-ok { background: #e8f5ec; color: #14532d; }
.bop-notice a { color: inherit; font-weight: 700; margin-left: 8px; }
.bop-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.bop-btn {
	width: 100%; min-height: 56px; border-radius: 8px; font-size: 18px; font-weight: 800; cursor: pointer;
	letter-spacing: .01em; border: 2px solid var(--bop-btn-bg); background: var(--bop-btn-bg); color: var(--bop-btn-text);
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; transition: opacity .15s;
}
.bop .bop-btn { border-radius: var(--bop-btn-radius, 8px); font-weight: var(--bop-btn-weight, 800); text-transform: var(--bop-btn-transform, none); letter-spacing: var(--bop-btn-ls, .01em); font-family: inherit; box-shadow: none; }
.bop .bop-btn--atc:hover:not([disabled]) { background: var(--bop-btn-hover, var(--bop-btn-bg)); border-color: var(--bop-btn-hover, var(--bop-btn-bg)); color: var(--bop-btn-text-hover, var(--bop-btn-text)); }
.bop .bop-btn--buy { background: var(--bop-buy-bg); color: var(--bop-buy-text); border-color: var(--bop-border); }
.bop .bop-btn--buy:hover:not([disabled]) { background: var(--bop-buy-text); color: var(--bop-active, #fff); border-color: var(--bop-buy-text); }
.bop-btn[disabled] { opacity: .55; cursor: not-allowed; }
.bop-btn.is-loading::after {
	content: ""; width: 18px; height: 18px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent;
	animation: bop-spin .7s linear infinite;
}
@keyframes bop-spin { to { transform: rotate(360deg); } }

/* ---------------------------------------------------------------- Product picker (sheet) */
.bop-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; }
.bop-modal[hidden] { display: none; }
.bop-modal__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); opacity: 0; transition: opacity .2s ease; }
.bop-modal.is-open .bop-modal__backdrop { opacity: 1; }
.bop-modal__panel {
	position: relative; background: #fff; color: var(--bop-text, #111); width: min(720px, 94vw); height: min(760px, 88vh);
	border-radius: 16px; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
	font-size: 16px; transform: translateY(12px); opacity: 0; transition: transform .22s ease, opacity .22s ease;
}
.bop-modal.is-open .bop-modal__panel { transform: none; opacity: 1; }
.bop-modal__panel.is-flash { animation: bop-flash .45s ease; }
@keyframes bop-flash { 0% { box-shadow: 0 0 0 0 rgba(26, 127, 55, .0); } 30% { box-shadow: 0 0 0 4px rgba(26, 127, 55, .35); } 100% { box-shadow: 0 20px 60px rgba(0, 0, 0, .3); } }
.bop-modal__grab { display: none; }
.bop-modal__head { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; align-items: center; padding: 10px 8px; border-bottom: 1px solid #eee; flex: 0 0 auto; }
.bop-modal__titles { text-align: center; min-width: 0; }
.bop-modal__title {
	margin: 0; font-size: 19px; font-weight: 800; line-height: 1.25; font-family: inherit; color: inherit;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.bop-modal__sub { font-size: 13px; color: var(--bop-muted, #666); margin-top: 2px; }
.bop-modal__sub[hidden] { display: none; }
.bop-modal .bop-modal__close, .bop-modal .bop-modal__back {
	width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; padding: 0;
	font-size: 30px; line-height: 1; cursor: pointer; color: var(--bop-text, #333); border-radius: 50%; box-shadow: none; min-height: 0;
}
.bop-modal .bop-modal__close { grid-column: 3; }
.bop-modal .bop-modal__back { grid-column: 1; grid-row: 1; }
.bop-modal .bop-modal__back[hidden] { display: none; }
.bop-modal__titles { grid-column: 2; grid-row: 1; }
.bop-modal .bop-modal__close:hover, .bop-modal .bop-modal__back:hover { background: #f2f2f2; color: var(--bop-text, #111); }
.bop-modal__search { padding: 12px 16px; border-bottom: 1px solid #eee; flex: 0 0 auto; }
.bop-modal__search[hidden] { display: none; }
.bop-modal__search input {
	width: 100%; height: 46px; border: 1.5px solid #ddd; border-radius: 10px; padding: 0 14px; margin: 0;
	font-size: 16px; /* 16px stops iPhone from zooming in */ font-family: inherit; background: #fff; color: inherit; box-shadow: none;
}
.bop-modal__body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.bop-modal__list { padding: 0 16px; }
.bop-modal__foot { padding: 12px 16px 16px; text-align: center; }
.bop-modal__foot:empty { display: none; }
.bop-modal__state { text-align: center; color: #666; padding: 28px 0; }
.bop-modal button { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

/* Step 1: product list - the whole row is the button */
.bop-modal .bop-pi {
	display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 14px; align-items: center; width: 100%;
	padding: 14px 0; margin: 0; border: 0; border-bottom: 1px solid #eee; border-radius: 0; background: none; color: inherit;
	text-align: left; font: inherit; cursor: pointer; box-shadow: none; min-height: 0; text-transform: none; letter-spacing: 0;
}
.bop-modal .bop-pi:hover:not([disabled]) { background: #fafafa; color: inherit; }
.bop-modal .bop-pi[disabled] { opacity: .5; cursor: not-allowed; }
.bop-modal .bop-pi.is-current { background: color-mix(in srgb, var(--bop-accent, #111) 6%, #fff); }
.bop-pi__img { width: 76px; height: 76px; object-fit: contain; border-radius: 8px; background: #f6f6f6; display: block; }
.bop-pi__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bop-pi__name { font-size: 16px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bop-pi__price { font-weight: 700; font-size: 16px; }
.bop-pi__price del { font-weight: 400; color: #777; margin-right: 6px; }
.bop-pi__price ins { text-decoration: none; }
.bop-pi__cta {
	display: inline-flex; align-items: center; gap: 4px; background: var(--bop-dark, #111); color: #fff; border-radius: var(--bop-btn-radius, 8px);
	padding: 10px 14px; font-weight: 700; font-size: 14px; white-space: nowrap;
}
.bop-modal .bop-pi:hover:not([disabled]) .bop-pi__cta { background: var(--bop-accent, #333); }
.bop-modal .bop-pi[disabled] .bop-pi__cta { background: #bbb; }
.bop-pi--skel { cursor: default; }
.bop-skel { display: block; background: linear-gradient(90deg, #f0f0f0 25%, #e6e6e6 37%, #f0f0f0 63%); background-size: 400% 100%; animation: bop-shimmer 1.2s ease infinite; border-radius: 6px; }
.bop-skel--line { height: 14px; width: 80%; margin-bottom: 8px; }
.bop-skel--short { height: 14px; width: 35%; }
@keyframes bop-shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
.bop-pi__btn { background: var(--bop-dark, #111); color: #fff; border: 0; border-radius: var(--bop-btn-radius, 8px); font-family: inherit; padding: 11px 18px; font-weight: 700; font-size: 15px; cursor: pointer; white-space: nowrap; }
.bop-modal .bop-pi__btn:hover:not([disabled]) { background: var(--bop-accent, #333); color: #fff; }
.bop-pi__btn[disabled] { background: #bbb; cursor: not-allowed; }
.bop-pi__variants { background: #f7f7f7; border-radius: 10px; padding: 14px; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.bop-pi__variants .bop-pi__confirm { margin-left: auto; }
.bop-pi__vprice { font-weight: 700; align-self: center; }
.bop-pi__vwarn { width: 100%; color: #c62828; font-size: 13px; }

/* Step 2: variant cards */
.bop-chips { display: flex; gap: 8px; overflow-x: auto; padding: 14px 0 4px; scrollbar-width: none; position: sticky; top: 0; background: #fff; z-index: 2; }
.bop-chips::-webkit-scrollbar { display: none; }
.bop-modal .bop-chip {
	flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: 999px;
	border: 1.5px solid #ddd; background: #fff; color: var(--bop-text, #111); font: inherit; font-size: 14px; cursor: pointer; box-shadow: none; min-height: 0;
}
.bop-modal .bop-chip.is-on, .bop-modal .bop-chip.is-on:hover { background: var(--bop-sw-on, #111); border-color: var(--bop-sw-on, #111); color: #fff; }
.bop-modal .bop-chip:hover { border-color: #111; background: #fff; color: var(--bop-text, #111); }
.bop-chip__dot { width: 16px; height: 16px; border-radius: 50%; border: 1px solid #ccc; background: #fff; }
.bop-vgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 12px 0 18px; }
.bop-modal .bop-vc {
	display: flex; flex-direction: column; align-items: stretch; text-align: left; padding: 0 0 10px; margin: 0; min-height: 0;
	border: 1.5px solid #e2e2e2; border-radius: 12px; background: #fff; color: inherit; font: inherit; cursor: pointer; overflow: hidden;
	box-shadow: none; text-transform: none; letter-spacing: 0; transition: border-color .15s, box-shadow .15s;
}
.bop-modal .bop-vc:hover:not([disabled]) { border-color: var(--bop-text, #111); background: #fff; color: inherit; }
.bop-modal .bop-vc.is-on { border-color: var(--bop-accent, #111); box-shadow: 0 0 0 2px var(--bop-accent, #111); }
.bop-modal .bop-vc[disabled] { cursor: not-allowed; opacity: .55; }
.bop-vc__img { display: block; aspect-ratio: 1 / 1; background: #f7f7f7; }
.bop-vc__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bop-vc__label { display: block; padding: 10px 10px 2px; font-size: 14px; color: var(--bop-muted, #555); line-height: 1.25; }
.bop-vc__price { display: block; padding: 2px 10px 0; font-weight: 800; font-size: 16px; }
.bop-vc__price del { font-weight: 400; font-size: 13px; color: #888; }
.bop-vc__price ins { text-decoration: none; }
.bop-vc__na { color: #c62828; font-size: 13px; font-weight: 700; }

html.bop-modal-open, html.bop-modal-open body { overflow: hidden !important; }

/* ---------------------------------------------------------------- Compact bundle rows (phones) */
.bop-rows { display: flex; flex-direction: column; gap: 10px; }
.bop .bop-row {
	display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%;
	padding: 8px 10px 8px 8px; margin: 0; border: 1.5px solid #e4e4e4; border-radius: 12px; background: #fff; color: inherit;
	font: inherit; text-align: left; cursor: pointer; box-shadow: none; min-height: 0; text-transform: none; letter-spacing: 0;
	-webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: border-color .15s, background-color .3s;
}
.bop .bop-row:hover { border-color: var(--bop-text, #111); background: #fff; color: inherit; }
.bop .bop-row.is-bad { border-color: #e0a3a3; }
.bop .bop-row.is-updated { background: color-mix(in srgb, var(--bop-accent, #1a7f37) 10%, #fff); }
.bop-row__img { width: 56px; height: 56px; object-fit: cover; border-radius: 8px; background: #f6f6f6; display: block; }
.bop-row__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bop-row__name { font-size: 15px; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bop-row__var { font-size: 14px; font-weight: 700; }
.bop-row__side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; }
.bop-row__price { font-weight: 700; font-size: 15px; white-space: nowrap; }
.bop-row__price del { display: block; font-weight: 400; font-size: 12px; color: var(--bop-muted, #777); }
.bop-row__price .bop-free { color: var(--bop-free); font-weight: 800; }
.bop-row__edit { display: inline-flex; align-items: center; gap: 2px; font-size: 13px; text-decoration: underline; color: var(--bop-muted, #555); }
.bop-row__edit svg { width: 14px; height: 14px; }
.bop .bop-row--empty {
	grid-template-columns: 44px minmax(0, 1fr) auto; min-height: 60px; border-style: dashed; border-color: #bdbdbd; background: #fcfcfc;
}
.bop .bop-row--empty .bop-row__name { font-weight: 700; font-size: 16px; }
.bop-row__plus { width: 44px; height: 44px; border-radius: 10px; border: 1.5px solid currentColor; display: flex; align-items: center; justify-content: center; color: var(--bop-accent, #111); }
.bop-row__plus svg { width: 22px; height: 22px; }
.bop .bop-row.is-missing { border-color: #c62828; box-shadow: 0 0 0 3px rgba(198, 40, 40, .15); }
.bop .bop-row--single { grid-template-columns: minmax(0, 1fr) auto; padding: 12px 14px; }
.bop-slot__price del, .bop-slot__price .bop-now-line { display: block; }

.bop-btn.is-incomplete { font-weight: 700; }
.bop .bop-btn, .bop .bop-choose, .bop .bop-tier { touch-action: manipulation; }

/* ---------------------------------------------------------------- Phones */
@media (max-width: 640px) {
	.bop-tier { padding: 14px 12px; }
	.bop-tiers { gap: 18px; }
	.bop-tier__head { gap: 10px; min-height: 44px; }
	.bop-radio { width: 24px; height: 24px; }
	.bop-tier.is-active .bop-radio::after { inset: 5px; }
	.bop-thumb { width: 56px; height: 56px; }
	.bop-thumb__qty { font-size: 12px; padding: 3px 5px; }
	.bop-tier__title { font-size: 18px; }
	.bop-tier__sub { font-size: 14px; }
	.bop-now { font-size: 19px; }
	.bop-was { font-size: 13px; }
	.bop-badge { right: 14px; font-size: 11px; padding: 6px 14px 5px; }
	.bop-badge--timer { font-size: 11px; }
	.bop-tier.is-active .bop-tier__body:not(:empty) { margin-top: 12px; }
	.bop-slot { grid-template-columns: 28px 56px minmax(0, 1fr); row-gap: 6px; column-gap: 10px; }
	.bop-slot__arrow { width: 28px; height: 28px; margin-top: 6px; }
	.bop-slot__img { width: 56px; height: 56px; }
	.bop-slot__plus { width: 56px; height: 56px; border-radius: 10px; }
	.bop-slot__plus svg { width: 28px; height: 28px; }
	.bop-slot__price { grid-column: 3; text-align: left; padding-top: 0; font-size: 15px; }
	.bop-slot__name, .bop-slot__label { font-size: 15px; }
	.bop-choose { font-size: 15px; padding: 9px 16px; }
	.bop-fields { gap: 8px; }
	.bop-select select { height: 42px; font-size: 16px; padding: 0 30px 0 10px; min-width: 70px; background-position: right 10px center; background-size: 11px 7px; }
	.bop-select.has-dot select { padding-left: 40px; min-width: 118px; }
	.bop-select__dot { left: 10px; width: 22px; height: 22px; }
	.bop-field__label { font-size: 13px; }
	:is(.bop, .bop-modal) .bop-sw--button { min-width: 44px; height: 44px; padding: 0 11px; font-size: 14px; border-radius: var(--bop-sw-radius, 10px); }
	.bop-sws { gap: 8px; }
	.bop-btn { min-height: 54px; font-size: 17px; }

	/* Bottom sheet */
	.bop-modal { align-items: flex-end; }
	.bop-modal__panel {
		width: 100vw; height: auto; max-height: 92vh; max-height: 92dvh; min-height: 60vh; border-radius: 18px 18px 0 0;
		transform: translateY(100%); opacity: 1; transition: transform .26s cubic-bezier(.2, .8, .2, 1);
		padding-bottom: env(safe-area-inset-bottom, 0);
	}
	.bop-modal.is-open .bop-modal__panel { transform: none; }
	.bop-modal__grab { display: block; width: 40px; height: 5px; border-radius: 3px; background: #d6d6d6; margin: 8px auto 0; flex: 0 0 auto; }
	.bop-modal__head { padding: 4px 4px 8px; }
	.bop-modal__title { font-size: 17px; }
	.bop-modal__list { padding: 0 14px; }
	.bop-modal .bop-pi { grid-template-columns: 64px minmax(0, 1fr) auto; gap: 12px; padding: 12px 0; }
	.bop-pi__img { width: 64px; height: 64px; }
	.bop-pi__name { font-size: 15px; }
	.bop-pi__price { font-size: 15px; }
	.bop-pi__cta { padding: 0; background: none !important; color: var(--bop-text, #111); font-size: 0; }
	.bop-pi__cta svg { width: 22px; height: 22px; }
	.bop-modal .bop-pi[disabled] .bop-pi__cta { font-size: 12px; color: #c62828; }
	.bop-vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.bop-vc__label { font-size: 14px; }
}
@media (min-width: 641px) and (max-width: 900px) {
	.bop-vgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
	.bop-modal__panel, .bop-modal__backdrop { transition: none; }
	.bop-skel { animation: none; }
}

/* Kadence Pro sticky add to cart bar while the bundle is being added */
.kadence-sticky-add-to-cart .is-loading { opacity: .7; pointer-events: none; cursor: progress; }