/* Scoped storefront presentation: native Hummingbird controls stay outside this block. */
.bp-front, .bp-front * { box-sizing: border-box; }
.bp-front { --bp-accent: var(--bs-primary, #146b57); --bp-border: #dce2e7; --bp-muted: #526070; width: 100%; margin: 24px 0; padding: 24px; border: 1px solid var(--bp-border); border-radius: 12px; background: var(--bs-body-bg, #fff); color: var(--bs-body-color, #222); font-family: inherit; line-height: 1.5; }
.bp-front [hidden] { display: none !important; }
.bp-front .bp-intro h2 { font-size: 1.45rem; line-height: 1.25; margin: 0 0 12px; font-weight: 700; }
.bp-front .bp-intro p { margin: 0 0 10px; }
.bp-front .bp-help { color: var(--bp-muted); font-size: .875rem; }
.bp-front .bp-component { min-width: 0; padding: 0 0 18px; margin: 20px 0 0; border: 0; border-bottom: 1px solid var(--bp-border); }
.bp-front legend { width: 100%; float: none; font-size: 1.05rem; font-weight: 650; line-height: 1.4; margin: 0 0 12px; padding: 0; }
.bp-front .bp-required { font-size: .8rem; color: var(--bp-muted); font-weight: 400; }
.bp-front .bp-included-note { font-size: .875rem; padding: 10px 12px; background: #f3f7f5; border-left: 3px solid var(--bp-accent); border-radius: 4px; }
.bp-front .bp-component > p { margin: 0 0 12px; }
.bp-front .bp-options { display: grid; align-items: start; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 14px; }
.bp-front .bp-option { min-width: 0; border: 2px solid var(--bp-border); border-radius: 10px; background: var(--bs-body-bg, #fff); overflow-wrap: anywhere; }
.bp-front .bp-option.bp-selected { border-color: var(--bp-accent); box-shadow: none !important; }
.bp-front .bp-card { position: relative; display: flex; flex-direction: column; align-items: center; gap: 12px; width: 100%; margin: 0; padding: 18px 12px; cursor: pointer; border-radius: 9px; color: inherit; }
/* One product frame, including image and all configuration fields. */
.bp-front .bp-option > .bp-card, .bp-front .bp-card.bp-is-selected, .bp-front .bp-card:focus-within { border: 0 !important; outline: none !important; box-shadow: none !important; background: transparent !important; }
.bp-front .bp-card > [data-bp-choice]:focus-visible { outline: none !important; box-shadow: none !important; }
.bp-front .bp-option:has(.bp-card > [data-bp-choice]:focus-visible) { border-color: #146b57; border-style: dashed; }
.bp-front .bp-product-name { font-weight: 600; line-height: 1.35; }
.bp-front .bp-product-image { display: block; object-fit: contain; max-width: 100%; background: #fff; border-radius: 6px; }
.bp-front .bp-card img { width: 100%; height: 144px; }
.bp-front .bp-image-placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 144px; color: #65717c; background: #f3f5f7; border-radius: 6px; font-size: .8rem; text-align: center; }
.bp-front .bp-selected-marker { display: none; position: absolute; top: 8px; right: 8px; padding: 3px 8px; border-radius: 20px; color: #fff; background: #253b46; font-size: .72rem; font-weight: 600; pointer-events: none; z-index: 2; }
.bp-front [data-bp-selection=thumbnails] .bp-is-selected .bp-selected-marker { display: inline-block; }
/* Transparent full-card radio retains native keyboard semantics without a visible radio dot. */
.bp-front [data-bp-selection=thumbnails] .bp-card > [data-bp-choice] { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; margin: 0 !important; opacity: 0 !important; cursor: pointer; z-index: 1; }
.bp-front .bp-card:has([data-bp-choice]:disabled) { cursor: not-allowed; opacity: .55; }
.bp-front [data-bp-selection=radio] .bp-options, .bp-front .bp-dropdown-ready .bp-options { grid-template-columns: minmax(0, 1fr); }
.bp-front [data-bp-selection=radio] .bp-card { flex-direction: row; justify-content: flex-start; padding: 12px; gap: 12px; }
.bp-front [data-bp-selection=radio] .bp-card > [data-bp-choice] { position: static !important; width: 18px !important; height: 18px !important; opacity: 1 !important; clip-path: none !important; margin: 0 !important; flex: 0 0 18px; accent-color: var(--bp-accent); }
.bp-front [data-bp-selection=radio] .bp-card img, .bp-front [data-bp-selection=radio] .bp-card .bp-image-placeholder { width: 52px; height: 52px; flex: 0 0 52px; font-size: .65rem; }
.bp-front .bp-dropdown-ready .bp-option > .bp-card { display: none !important; }
.bp-front .bp-selected-product { display: none; }
.bp-front .bp-dropdown-ready .bp-selected-product { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 16px; padding: 16px; }
.bp-front .bp-selected-product img, .bp-front .bp-selected-product .bp-image-placeholder { width: 96px; height: 96px; }
.bp-front .bp-product-select-label, .bp-front .bp-variant-label, .bp-front .bp-quantity-label { display: block; font-weight: 600; font-size: .875rem; }
.bp-front .bp-product-select-label { margin: 0 0 14px; }
.bp-front .bp-variant-wrapper, .bp-front .bp-quantity-label { margin: 12px; }
.bp-front .bp-variant-label { margin: 0; }
.bp-front [data-bp-product-select], .bp-front .bp-variant-select, .bp-front input[type=number] { display: block; width: 100%; min-height: 44px; max-width: 100%; margin-top: 6px; padding: 9px 12px; border: 1px solid #87939e; border-radius: 6px; background: var(--bs-body-bg, #fff); color: inherit; font: inherit; font-weight: 400; }
.bp-front input[type=number] { width: 112px; }
.bp-front .bp-option > a { display: inline-block; margin: 0 12px 14px; text-decoration: underline; font-size: .875rem; }
.bp-front .bp-clear, .bp-front .bp-step-controls button, .bp-front .bp-requote { min-height: 42px; max-width: 100%; padding: 9px 14px; border: 1px solid #87939e; border-radius: 6px; background: var(--bs-body-bg, #fff); color: inherit; font: inherit; font-size: .875rem; cursor: pointer; overflow-wrap: anywhere; }
.bp-front .bp-clear { margin-top: 12px; }
.bp-front .bp-selection-status { font-size: .875rem; font-weight: 600; margin: 18px 0 12px; }
.bp-front .bp-summary-heading { margin: 20px 0 12px; font-size: 1.05rem; font-weight: 650; }
.bp-front .bp-summary { display: grid; gap: 10px; }
.bp-front .bp-summary-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 14px; background: #f5f7f9; border-radius: 8px; font-size: .875rem; overflow-wrap: anywhere; }
.bp-front .bp-summary-line > span { grid-column: 1 / -1; }
.bp-front .bp-summary-line > strong:last-child { grid-column: 2; grid-row: 1; text-align: end; }
.bp-front .bp-total { font-size: 1.2rem; font-weight: 700; margin: 16px 0 10px; }
.bp-front .bp-total:empty, .bp-front .bp-checkout-status:empty, .bp-front .bp-layout-status:empty { display: none; }
.bp-front .bp-error, .bp-front .bp-checkout-status { color: #a41414; }
.bp-front .bp-checkout-status { font-size: .875rem; }
.bp-front .bp-requote { margin-top: 8px; }
/* Numeric progress rail: visible titles stay in the active group only. */
.bp-front .bp-step-nav { display: flex; align-items: center; gap: 4px; width: 100%; margin: 16px 0 8px; }
.bp-front .bp-step-track { display: flex; flex: 1 1 auto; min-width: 0; overflow-x: auto; padding: 4px 0; scrollbar-width: thin; }
/* Strongly scoped resets keep theme button borders away from the circular indicators. */
.bp-front .bp-step-nav .bp-step-link { position: relative !important; display: grid !important; place-items: center !important; flex: 1 0 44px !important; width: auto !important; min-width: 44px !important; min-height: 44px !important; max-width: none !important; height: 44px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; font-size: .8rem; color: #60616a; cursor: pointer; }
.bp-front .bp-step-nav .bp-step-link:not(:last-child)::after { content: '' !important; position: absolute; top: 50%; left: calc(50% + 14px); width: calc(100% - 28px); height: 2px; background: #e5e4e9; }
.bp-front .bp-step-nav .bp-step-number { position: relative; z-index: 1; display: grid !important; place-items: center !important; box-sizing: border-box !important; width: 28px !important; height: 28px !important; min-width: 28px !important; max-width: 28px !important; min-height: 28px !important; padding: 0 !important; margin: 0 !important; border: 1px solid #dcdbe2 !important; border-radius: 50% !important; background: var(--bs-body-bg, #fff) !important; color: #60616a !important; font-size: 12px !important; font-weight: 400; line-height: 1 !important; }
.bp-front .bp-step-nav .bp-step-link[aria-current=step] .bp-step-number { color: var(--bp-step-accent, #6200ee) !important; border: 2px solid var(--bp-step-accent, #6200ee) !important; font-weight: 700; box-shadow: 0 0 0 3px #f0e7ff; }
.bp-front .bp-step-nav .bp-step-link.bp-step-complete .bp-step-number { background: var(--bp-step-accent, #6200ee) !important; color: #fff !important; border-color: var(--bp-step-accent, #6200ee) !important; }
.bp-front .bp-step-nav .bp-step-link.bp-step-complete::after { background: var(--bp-step-accent, #6200ee); }
.bp-front .bp-step-nav .bp-step-link:focus-visible { outline: none !important; }
.bp-front .bp-step-nav .bp-step-link:focus-visible .bp-step-number { outline: 2px solid var(--bp-step-accent, #6200ee); outline-offset: 3px; }
.bp-front .bp-step-nav .bp-step-previous, .bp-front .bp-step-nav .bp-step-next { display: grid !important; place-items: center; flex: 0 0 36px; width: 36px !important; min-width: 36px !important; height: 44px !important; min-height: 44px; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 6px !important; box-shadow: none !important; background: transparent !important; color: #45414e; font: inherit; font-size: 1.7rem; cursor: pointer; }
.bp-front .bp-step-previous:hover:not(:disabled), .bp-front .bp-step-next:hover:not(:disabled) { background: #f4effc; }
.bp-front button:disabled { opacity: .5; cursor: default; }
.bp-front button:focus-visible, .bp-front select:focus-visible, .bp-front input:focus-visible { outline: 2px solid #146b57; outline-offset: 3px; }
.bp-front .bp-layout-status { font-size: .8rem; color: var(--bp-muted); margin: 10px 0; }
.bp-front[data-bp-layout=accordion] .bp-component { border: 0; padding: 0; margin: 14px 0; }
.bp-front[data-bp-layout=accordion] legend { margin: 0; }
.bp-front .bp-accordion-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; padding: 13px 14px; background: var(--bs-body-bg, #fff); color: inherit; border: 1px solid var(--bp-border); border-radius: 8px; font: inherit; font-weight: 600; text-align: start; cursor: pointer; }
.bp-front .bp-accordion-toggle::after { content: '+'; font-size: 1.25rem; flex: 0 0 auto; }
.bp-front .bp-accordion-toggle[aria-expanded=true] { border-radius: 8px 8px 0 0; }
.bp-front .bp-accordion-toggle[aria-expanded=true]::after { content: '−'; }
.bp-front .bp-panel { padding: 14px; border: 1px solid var(--bp-border); border-top: 0; border-radius: 0 0 8px 8px; }
.bp-front .bp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 575px) {
 .bp-front { padding: 16px; margin: 18px 0; }
 .bp-front .bp-options { grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr)); gap: 10px; }
 .bp-front .bp-card img, .bp-front .bp-card .bp-image-placeholder { height: 112px; }
 .bp-front .bp-card { padding: 14px 10px; }
 .bp-front .bp-step-link { flex: 1 0 44px; font-size: .75rem; padding: 0; }
 .bp-front .bp-panel { padding: 10px; }
 .bp-front .bp-dropdown-ready .bp-selected-product { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
 .bp-front .bp-selected-product img, .bp-front .bp-selected-product .bp-image-placeholder { width: 72px; height: 72px; }
}