.bqb-wizard {
	/* Full-bleed: breaks out of whatever width-constrained content column the
	   theme wraps page content in, then re-centers its own contents below via
	   max-width + padding, so the wizard reads as a full-width app section
	   regardless of the active theme's page template. */
	position: relative;
	left: 50%;
	right: 50%;
	width: 100vw;
	margin-left: -50vw;
	margin-right: -50vw;
	box-sizing: border-box;
	padding: 32px clamp(12px, 2vw, 32px) 64px;
	background: #f8f9fa;

	--bqb-accent: #e63946;
	--bqb-accent-hover: #d62828;
	--bqb-accent-soft: rgba(230, 57, 70, 0.12);
	--bqb-text: #333333;
	--bqb-text-muted: #6b7075;
	--bqb-border: #e1e3e5;
	--bqb-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

	font-family: var(--bqb-font);
	color: var(--bqb-text);
}

.bqb-wizard *,
.bqb-wizard *::before,
.bqb-wizard *::after {
	box-sizing: border-box;
}

/* Many themes set `display` on generic elements (section, div, etc.) with
   enough specificity to silently defeat the browser's default [hidden]
   { display: none } rule — since author stylesheets always win over the
   UA stylesheet. Without this, JS setting .hidden = true on a step panel
   or the category sidebar can leave it fully visible while the grid
   layout still reflows around it, breaking the whole page. */
.bqb-wizard [hidden] {
	display: none !important;
}

.bqb-wizard-inner {
	width: 100%;
}

.bqb-wizard-steps {
	display: flex;
	justify-content: center;
	align-items: center;
	list-style: none;
	margin: 0 0 32px;
	padding: 0;
	gap: 8px;
}

.bqb-wizard-step {
	display: flex;
	align-items: center;
	gap: 8px;
	color: #9aa0a6;
	cursor: default;
}

.bqb-wizard-step:not(:last-child)::after {
	content: '';
	display: inline-block;
	width: 48px;
	height: 1px;
	background: #d7d9db;
	margin: 0 8px;
}

.bqb-wizard-step-num {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #e4e6e8;
	color: #6b7075;
	font-size: 13px;
	font-weight: 600;
}

.bqb-wizard-step.is-active,
.bqb-wizard-step.is-complete {
	color: #1d1d1f;
	cursor: pointer;
}

.bqb-wizard-step.is-active .bqb-wizard-step-num,
.bqb-wizard-step.is-complete .bqb-wizard-step-num {
	background: var(--bqb-accent);
	color: #fff;
}

.bqb-wizard-body {
	display: grid;
	/* Left (category filter) and right (selected products) sidebars share
	   the same width — a narrower left column previously caused category
	   names to wrap awkwardly onto two lines. */
	grid-template-columns: 280px minmax(0, 1fr) 280px;
	gap: 32px;
	align-items: start;
}

.bqb-wizard-body.bqb-no-categories {
	grid-template-columns: minmax(0, 1fr) 280px;
}

@media (max-width: 980px) {
	.bqb-wizard-body,
	.bqb-wizard-body.bqb-no-categories {
		grid-template-columns: 1fr 280px;
	}

	.bqb-wizard-categories {
		grid-column: 1 / -1;
	}
}

@media (max-width: 782px) {
	.bqb-wizard-body,
	.bqb-wizard-body.bqb-no-categories {
		grid-template-columns: 1fr;
	}
}

.bqb-wizard-categories {
	background: #ffffff;
	padding: 1.5rem;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	position: sticky;
	top: 16px;
}

.bqb-wizard-main {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.bqb-wizard-section {
	background: #ffffff;
	padding: 32px;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.bqb-wizard-section:empty {
	display: none;
}

.bqb-section-heading {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 6px;
	font-size: 1.4rem;
	color: #111111;
}

.bqb-section-num {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--bqb-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

.bqb-step-help,
.bqb-field-help {
	color: var(--bqb-text-muted);
	font-size: 13px;
	margin-top: -6px;
}

/* Step 1: Products */
.bqb-search-wrap {
	margin-bottom: 16px;
}

.bqb-search-input {
	width: 100%;
	max-width: 480px;
	padding: 0.75rem;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-size: 0.95rem;
	transition: border-color 0.2s;
}

.bqb-search-input:focus {
	outline: none;
	border-color: var(--bqb-accent);
}

.bqb-category-heading {
	margin: 0 0 10px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #9aa0a6;
}

.bqb-category-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bqb-price-filter {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid #eceded;
}

.bqb-price-filter-row {
	display: flex;
	gap: 6px;
	margin-bottom: 8px;
}

.bqb-price-filter-row input {
	width: 0;
	flex: 1 1 0%;
	padding: 6px 8px;
	border: 1px solid #cccccc;
	border-radius: 4px;
	font-size: 13px;
}

.bqb-price-filter .bqb-btn {
	width: 100%;
}

.bqb-category-item {
	padding: 9px 12px;
	margin-bottom: 2px;
	cursor: pointer;
	border-radius: 4px;
	font-size: 14px;
	line-height: 1.3;
	transition: background 0.1s ease, color 0.1s ease;
}

.bqb-category-item:hover {
	background: #f2f3f4;
}

.bqb-category-item.is-active {
	background: var(--bqb-accent);
	color: #fff;
	font-weight: 600;
}

.bqb-category-item--child {
	font-size: 13px;
	color: var(--bqb-text-muted);
}

.bqb-category-item--child.is-active {
	color: #fff;
}

.bqb-category-back {
	display: flex;
	align-items: center;
	gap: 4px;
	width: 100%;
	margin-bottom: 14px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	color: var(--bqb-text-muted);
	text-align: left;
}

.bqb-category-back:hover {
	color: var(--bqb-accent);
}

.bqb-category-tiles-heading {
	margin: 0 0 16px;
	font-size: 1.1rem;
	color: #111111;
}

.bqb-category-tiles {
	display: grid;
	grid-template-columns: repeat(var(--bqb-tiles-per-row, 5), 1fr);
	gap: 20px;
}

.bqb-category-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	font-family: inherit;
	text-align: center;
}

.bqb-category-tile-img-wrap {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 8px;
	background: #f2f3f4;
	overflow: hidden;
	transition: box-shadow 0.15s ease;
}

.bqb-category-tile:hover .bqb-category-tile-img-wrap {
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

.bqb-category-tile-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.bqb-category-tile-name {
	font-size: 14px;
	font-weight: 600;
	color: #111111;
}

.bqb-product-grid {
	display: grid;
	grid-template-columns: repeat(var(--bqb-products-per-row, 5), 1fr);
	gap: 20px;
}

/* Fixed column counts (above) are admin-set and don't reflow on their own
   at narrow widths like the previous auto-fill did — these overrides keep
   the grids usable on tablet/mobile regardless of that setting. */
@media (max-width: 900px) {
	.bqb-category-tiles,
	.bqb-product-grid {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

@media (max-width: 560px) {
	.bqb-category-tiles,
	.bqb-product-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

.bqb-product-card {
	border: 1px solid #e4e6e8;
	border-radius: 8px;
	padding: 12px;
	text-align: left;
	transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.bqb-product-card:hover {
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

.bqb-product-card.is-added {
	border-color: var(--bqb-accent);
}

.bqb-product-img-wrap {
	position: relative;
	margin-bottom: 10px;
}

.bqb-product-thumb {
	width: 100%;
	height: 120px;
	object-fit: contain;
	display: block;
	background: #f5f6f7;
	border-radius: 4px;
}

.bqb-product-add-circle {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: none;
	background: var(--bqb-accent);
	color: #fff;
	font-size: 18px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	transition: background-color 0.15s ease, transform 0.1s ease;
}

.bqb-product-add-circle:hover {
	background: var(--bqb-accent-hover);
	transform: scale(1.08);
}

.bqb-product-add-circle.is-added {
	background: #2e7d32;
	cursor: default;
	transform: none;
}

.bqb-product-name {
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 4px;
}

.bqb-product-price {
	font-size: 14px;
	font-weight: 700;
	color: #2e7d32;
	margin-bottom: 2px;
}

.bqb-product-price .amount {
	color: #2e7d32;
}

.bqb-product-min-qty {
	font-size: 12px;
	color: var(--bqb-text-muted);
}

.bqb-btn {
	display: inline-block;
	padding: 8px 16px;
	border: 1px solid #d7d9db;
	border-radius: 5px;
	background: #fff;
	cursor: pointer;
	font-size: 13px;
	font-family: inherit;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.bqb-btn:hover {
	border-color: var(--bqb-accent);
	color: var(--bqb-accent);
}

.bqb-btn:disabled {
	opacity: 0.6;
	cursor: default;
	border-color: #d7d9db;
	color: inherit;
}

.bqb-btn-primary,
.bqb-submit-btn {
	display: block;
	width: 100%;
	margin-top: 20px;
	padding: 1rem;
	background: var(--bqb-accent);
	color: #fff;
	border: none;
	border-radius: 5px;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s;
}

.bqb-btn-primary:hover,
.bqb-submit-btn:hover {
	background: var(--bqb-accent-hover);
	color: #fff;
	border-color: transparent;
}

.bqb-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 20px;
}

.bqb-loading,
.bqb-no-results {
	color: var(--bqb-text-muted);
	padding: 24px 0;
}

/* Per-size quantity boxes, rendered on their own step (Step 2) for any
   added product with a detected size attribute. */

.bqb-qty-box {
	border: 1px solid #e4e6e8;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 16px;
}

.bqb-qty-box-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.bqb-qty-box-thumb {
	width: 40px;
	height: 40px;
	object-fit: contain;
	background: #f5f6f7;
	border-radius: 4px;
	flex-shrink: 0;
}

.bqb-qty-box-name {
	font-weight: 600;
	font-size: 14px;
}

.bqb-qty-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
	gap: 12px;
}

.bqb-qty-cell label {
	display: block;
	font-size: 13px;
	font-weight: 500;
	margin-bottom: 4px;
}

.bqb-qty-cell input {
	width: 100%;
	padding: 0.6rem;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-size: 0.9rem;
	text-align: center;
}

.bqb-qty-cell input:focus {
	outline: none;
	border-color: var(--bqb-accent);
}

.bqb-qty-estimate-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
}

.bqb-qty-estimate-row label {
	font-size: 13px;
	font-weight: 500;
	flex-shrink: 0;
}

.bqb-qty-estimate-row input {
	width: 110px;
	padding: 0.5rem;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-size: 0.9rem;
}

.bqb-qty-or {
	margin: 0 0 10px;
	font-size: 12px;
	color: var(--bqb-text-muted);
}

/* Custom Branding add-ons (Design step) */
.bqb-branding-section {
	margin-bottom: 28px;
	padding-bottom: 24px;
	border-bottom: 1px solid #eceded;
}

.bqb-branding-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 16px;
	margin-top: 12px;
}

.bqb-branding-option {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 12px;
	border: 1px solid #e4e6e8;
	border-radius: 8px;
	cursor: pointer;
	transition: border-color 0.15s ease;
}

.bqb-branding-option:has(input:checked) {
	border-color: var(--bqb-accent);
}

.bqb-branding-option-img {
	width: 100%;
	height: 90px;
	object-fit: contain;
	background: #f5f6f7;
	border-radius: 4px;
}

.bqb-branding-option-label {
	font-size: 13px;
	font-weight: 600;
}

.bqb-branding-option-price {
	font-size: 12px;
	color: var(--bqb-text-muted);
}

/* Sidebar */
.bqb-wizard-sidebar {
	background: #ffffff;
	padding: 1.5rem;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	position: sticky;
	top: 16px;
}

.bqb-wizard-sidebar h3 {
	font-size: 1.1rem;
	margin: 0 0 1rem;
	border-bottom: 2px solid #eeeeee;
	padding-bottom: 0.5rem;
}

.bqb-sidebar-item {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem 0;
	border-bottom: 1px solid #f0f1f2;
}

.bqb-sidebar-thumb {
	width: 60px;
	height: 60px;
	object-fit: contain;
	flex-shrink: 0;
	background: #f5f6f7;
	border-radius: 6px;
}

.bqb-sidebar-info {
	flex-grow: 1;
	min-width: 0;
}

.bqb-sidebar-name {
	font-size: 0.95rem;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bqb-sidebar-qty-row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 4px;
}

.bqb-product-qty-total {
	margin-top: 4px;
	font-size: 12px;
	font-weight: 600;
	color: var(--bqb-text);
}

.bqb-product-price-total {
	margin-top: 2px;
	font-size: 12px;
	font-weight: 600;
	color: #2e7d32;
}

.bqb-qty-btn {
	width: 22px;
	height: 22px;
	border: 1px solid #d7d9db;
	background: #fff;
	border-radius: 3px;
	cursor: pointer;
}

.bqb-qty-btn:hover {
	border-color: var(--bqb-accent);
	color: var(--bqb-accent);
}

.bqb-qty-value {
	min-width: 18px;
	text-align: center;
	font-size: 13px;
}

.bqb-sidebar-remove {
	border: none;
	background: none;
	font-size: 18px;
	color: #9aa0a6;
	cursor: pointer;
	flex-shrink: 0;
}

.bqb-sidebar-remove:hover {
	color: var(--bqb-accent);
}

.bqb-sidebar-count {
	margin-top: 12px;
	padding: 8px;
	background: #f5f6f7;
	border-radius: 4px;
	font-size: 13px;
	text-align: center;
}

.bqb-sidebar-grand-total {
	margin-top: 8px;
	padding: 10px 8px;
	background: #edf7ed;
	border: 1px solid #cfe8cf;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 700;
	color: #2e7d32;
	text-align: center;
}

.bqb-sidebar-shipping {
	margin-top: 8px;
	padding: 10px 8px;
	background: #eef4fb;
	border: 1px solid #cfe0f2;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 700;
	color: #1a5a96;
	text-align: center;
}

.bqb-sample-toggle {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
	font-size: 12px;
	color: var(--bqb-text-muted);
	cursor: pointer;
}

.bqb-sidebar-empty {
	color: var(--bqb-text-muted);
	font-size: 13px;
}

.bqb-sidebar-support {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid #f0f1f2;
	font-size: 13px;
}

/* Step 2: Contact */
.bqb-contact-grid,
.bqb-design-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 1rem;
}

@media (max-width: 600px) {
	.bqb-contact-grid,
	.bqb-design-grid {
		grid-template-columns: 1fr;
	}
}

.bqb-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-bottom: 1.25rem;
}

.bqb-field label {
	font-weight: 500;
	font-size: 0.9rem;
}

.bqb-field input[type="text"],
.bqb-field input[type="email"],
.bqb-field input[type="tel"],
.bqb-field textarea {
	padding: 0.75rem;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-size: 0.95rem;
	font-family: inherit;
	width: 100%;
	box-sizing: border-box;
	transition: border-color 0.2s;
}

.bqb-field input:focus,
.bqb-field textarea:focus {
	outline: none;
	border-color: var(--bqb-accent);
}

.bqb-field textarea {
	resize: vertical;
	min-height: 100px;
}

.bqb-phone-wrap {
	display: flex;
	align-items: stretch;
	gap: 8px;
}

.bqb-country-code {
	flex: 0 0 108px;
	width: 108px;
	padding: 0.75rem 6px;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-size: 13px;
	font-family: inherit;
}

.bqb-phone-wrap input[type="tel"] {
	flex: 1 1 0%;
	min-width: 0;
}

.bqb-field-error {
	color: #d63638;
	font-size: 12px;
}

/* Invalid-field highlight, added alongside the .bqb-field-error text by
   setFieldError()/validateProducts() — a missing-required-field message is
   easy to miss on its own in a dense multi-column layout, so the field
   itself (or its enclosing group, for radios/swatches/checkboxes) also
   gets a visible red border. */
.bqb-field.is-invalid input,
.bqb-field.is-invalid select,
.bqb-field.is-invalid textarea {
	border-color: #d63638;
}

.bqb-guideline.is-invalid,
.bqb-color-col.is-invalid,
.bqb-priority-products.is-invalid {
	outline: 2px solid #d63638;
	outline-offset: 6px;
	border-radius: 6px;
}

.bqb-qty-box.is-invalid {
	border-color: #d63638;
}

.bqb-wizard-section.is-invalid {
	border: 1px solid #d63638;
}

.bqb-honeypot {
	position: absolute;
	left: -9999px;
}

.bqb-form-message {
	color: #d63638;
	font-size: 13px;
	margin: 8px 0;
}

/* Step 3: Design */
.bqb-color-columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-bottom: 20px;
}

@media (max-width: 600px) {
	.bqb-color-columns {
		grid-template-columns: 1fr;
	}
}

.bqb-color-col label {
	font-weight: 500;
	font-size: 0.9rem;
}

.bqb-color-grid {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 6px;
	margin-top: 8px;
	max-width: 320px;
}

.bqb-swatch {
	position: relative;
	width: 28px;
	height: 28px;
	border: 2px solid transparent;
	border-radius: 4px;
	cursor: pointer;
	padding: 0;
}

.bqb-swatch.is-selected {
	border-color: var(--bqb-accent);
	box-shadow: 0 0 0 2px #fff inset;
}

.bqb-swatch-check {
	position: absolute;
	top: -6px;
	right: -6px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--bqb-accent);
	color: #fff;
	font-size: 10px;
	line-height: 16px;
	display: none;
}

.bqb-swatch.is-selected .bqb-swatch-check {
	display: block;
}

.bqb-color-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 10px;
}

.bqb-color-chips:empty {
	margin-bottom: 0;
}

.bqb-color-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 6px 4px 10px;
	border-radius: 14px;
	font-size: 12px;
	font-weight: 600;
}

.bqb-color-chip button {
	border: none;
	background: rgba(255, 255, 255, 0.25);
	color: inherit;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	cursor: pointer;
	font-size: 12px;
	line-height: 1;
}

.bqb-radio-row {
	display: flex;
	gap: 1.5rem;
	align-items: center;
	margin-top: 0.5rem;
}

.bqb-radio-label,
.bqb-checkbox-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	cursor: pointer;
}

.bqb-collapsible {
	border: 1px solid var(--bqb-border);
	border-radius: 6px;
	padding: 12px 16px;
	margin-bottom: 14px;
}

.bqb-collapsible summary {
	font-weight: 600;
	cursor: pointer;
}

.bqb-collapsible textarea {
	width: 100%;
	box-sizing: border-box;
	margin-top: 10px;
	padding: 0.75rem;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-family: inherit;
	resize: vertical;
	transition: border-color 0.2s;
}

.bqb-collapsible textarea:focus {
	outline: none;
	border-color: var(--bqb-accent);
}

.bqb-font-style-section {
	margin-top: 16px;
}

.bqb-font-style-section > label {
	display: block;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 2px;
}

.bqb-font-style-scroller {
	display: flex;
	gap: 12px;
	overflow-x: auto;
	padding: 4px 4px 10px;
	margin-top: 8px;
}

.bqb-font-style-card {
	position: relative;
	flex: 0 0 auto;
	width: 150px;
	border: 2px solid #e4e6e8;
	border-radius: 6px;
	padding: 12px;
	text-align: center;
	cursor: pointer;
	background: #fff;
	transition: border-color 0.15s ease;
}

.bqb-font-style-card:hover {
	border-color: var(--bqb-accent);
}

.bqb-font-style-card.is-selected {
	border-color: var(--bqb-accent);
}

.bqb-font-style-img {
	width: 100%;
	height: 44px;
	object-fit: contain;
	margin-bottom: 8px;
}

.bqb-font-style-label {
	font-size: 13px;
	font-weight: 600;
}

.bqb-font-style-check {
	position: absolute;
	top: -8px;
	right: -8px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--bqb-accent);
	color: #fff;
	font-size: 12px;
	display: none;
	align-items: center;
	justify-content: center;
}

.bqb-font-style-card.is-selected .bqb-font-style-check {
	display: flex;
}

.bqb-upload-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-bottom: 20px;
}

@media (max-width: 600px) {
	.bqb-upload-grid {
		grid-template-columns: 1fr;
	}
}

.bqb-dropzone {
	margin-top: 8px;
	padding: 1.5rem;
	border: 2px dashed #cccccc;
	border-radius: 6px;
	text-align: center;
	cursor: pointer;
	background: #fafafa;
	transition: border-color 0.2s;
}

.bqb-dropzone:hover,
.bqb-dropzone.is-dragover {
	border-color: var(--bqb-accent);
}

.bqb-dropzone.is-dragover {
	background: var(--bqb-accent-soft);
}

.bqb-dropzone-prompt {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	color: var(--bqb-text-muted);
	font-size: 13px;
}

.bqb-dropzone-icon {
	font-size: 20px;
}

.bqb-dropzone-chips {
	margin-top: 10px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
}

.bqb-file-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	border: 1px solid #d7d9db;
	border-radius: 3px;
	padding: 4px 8px;
	font-size: 12px;
}

.bqb-file-chip button {
	border: none;
	background: none;
	cursor: pointer;
	color: #9aa0a6;
	font-size: 14px;
}

.bqb-wizard-success {
	max-width: 600px;
	margin: 40px auto;
	padding: 24px;
	background: #edf7ed;
	border: 1px solid #b7d9b7;
	border-radius: 8px;
	text-align: center;
	font-family: var(--bqb-font, inherit);
}

/* Placed last so it wins the cascade over the earlier (equal-specificity)
   .bqb-wizard-categories / .bqb-wizard-sidebar sticky declarations. Sticky
   only makes sense in the multi-column desktop layout — once
   .bqb-wizard-body collapses to one flow column below 782px, a sticky
   element pins to the viewport top and overlaps whatever scrolls beneath it. */
@media (max-width: 782px) {
	.bqb-wizard-categories,
	.bqb-wizard-sidebar {
		position: static;
	}
}