/* Midibaby — termékoldali lépéses választó (a natív Woo legördülők helyett) */

.mbv { margin: 20px 0 8px; }

/* az eredeti legördülőket elrejtjük, de a formban maradnak */
.mbv-aktiv table.variations,
.mbv-aktiv .variations { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mbv-aktiv .woocommerce-variation-price { display: none; }

.mbv__lepes { margin-bottom: 18px; }
.mbv__lepes:last-child { margin-bottom: 0; }

.mbv__cimke {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 13px;
	font-weight: 700;
	color: #2c2318;
	letter-spacing: .01em;
}
.mbv__cimke small { font-size: 11px; font-weight: 400; color: #8a7a6a; }

/* --- általános gombsor --- */
.mbv__sor { display: flex; flex-wrap: wrap; gap: 8px; }

.mbv__gomb {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 42px;
	padding: 8px 16px;
	border: 2px solid #e8dfd0;
	border-radius: 10px;
	background: #fffef9;
	color: #3a2e24;
	font: inherit;
	font-size: 14px;
	line-height: 1.2;
	cursor: pointer;
	transition: border-color .15s, background .15s, color .15s;
	-webkit-appearance: none;
	appearance: none;
}
.mbv__gomb:hover:not([disabled]) { border-color: #c4b49a; }
.mbv__gomb.is-on { border-color: #5a7a5e; background: #eef4ef; color: #3d5a40; font-weight: 700; }
.mbv__gomb[disabled] { opacity: .32; cursor: not-allowed; }
/* Valaszthato, de a mostani valasztassal nem fer ossze: halvany, megis kattinthato. */
.mbv__gomb--mas { opacity: .45; }
.mbv__gomb--mas:hover { opacity: 1; border-color: #c4b49a; }
.mbv__gomb:focus-visible { outline: 2px solid #5a7a5e; outline-offset: 2px; }

/* --- forma: ikonos kártya --- */
.mbv__forma { display: flex; gap: 10px; flex-wrap: wrap; }
.mbv__forma .mbv__gomb {
	flex: 1 1 150px;
	flex-direction: column;
	gap: 4px;
	padding: 14px 12px;
	min-height: 96px;
}
.mbv__ikon { width: 34px; height: 34px; display: block; color: #8a7a6a; }
.mbv__gomb.is-on .mbv__ikon { color: #5a7a5e; }
.mbv__forma-nev { font-size: 14px; font-weight: 700; }
.mbv__forma-sub { font-size: 11px; color: #8a7a6a; font-weight: 400; }
.mbv__gomb.is-on .mbv__forma-sub { color: #5a7a5e; }

/* --- egyértékű attribútum: nem gomb, csak jelzés --- */
.mbv__fix {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	border-radius: 999px;
	background: #f0ebe3;
	font-size: 13px;
	color: #5a4e42;
}
.mbv__fix::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #c4b49a; }

/* --- labdával / labda nélkül --- */
.mbv__kieg { display: flex; gap: 10px; flex-wrap: wrap; }
.mbv__kieg .mbv__gomb {
	flex: 1 1 180px;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
	padding: 13px 16px;
	text-align: left;
}
.mbv__kieg-nev { font-size: 14px; font-weight: 700; }
.mbv__kieg-ar { font-size: 13px; color: #8a7a6a; font-weight: 400; }
.mbv__gomb.is-on .mbv__kieg-ar { color: #5a7a5e; }

/* --- árkijelző --- */
.mbv__ar {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 10px;
	margin: 18px 0 4px;
	padding: 14px 16px;
	border-radius: 12px;
	background: #f0ebe3;
}
.mbv__ar-cimke { font-size: 13px; color: #8a7a6a; }
.mbv__ar-ertek {
	font-size: 26px;
	font-weight: 700;
	color: #2c2318;
	font-family: var(--font-display, 'Libre Baskerville', Georgia, serif);
	line-height: 1.1;
}
.mbv__ar-megj { font-size: 12px; color: #8a7a6a; width: 100%; }
.mbv__ar--vart .mbv__ar-ertek { font-size: 20px; color: #8a7a6a; }

@media (max-width: 480px) {
	.mbv__gomb { font-size: 13px; padding: 8px 12px; }
	.mbv__forma .mbv__gomb { flex-basis: 100%; }
	.mbv__ar-ertek { font-size: 22px; }
}

/* A téma nem rejti el a képernyőolvasónak szánt szöveget, ezért az „Ártartomány: …”
   duplán, láthatóan jelent meg az ár mellett. Csak az árnál javítjuk. */
.price .screen-reader-text,
.mb-sticky-cta__price .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* --- mennyiség + kosárba gomb egy sorban --- */
/* A téma nem rejti el a képernyőolvasónak szánt feliratokat, ezért a
   „<terméknév> mennyiség” címke láthatóan kiült a mennyiségmező mellé. */
form.cart .screen-reader-text,
.woocommerce-variation-add-to-cart .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}
/* a labdaválasztó teljes szélességben, a sor fölé */
.woocommerce-variation-add-to-cart .mblv { flex: 1 0 100%; margin-bottom: 0; }

.woocommerce-variation-add-to-cart .quantity { flex: 0 0 auto; margin: 0; }
.woocommerce-variation-add-to-cart .single_add_to_cart_button { flex: 1 1 200px; margin: 0; }

@media (max-width: 480px) {
	.woocommerce-variation-add-to-cart .single_add_to_cart_button { flex-basis: 100%; }
}