/**
 * Mobile UX: one-row header, compact cookie strip, sticky add-to-cart.
 * Scoped to phone / small tablet. Desktop Elementor layout is unchanged.
 */

:root {
	--miobio-cookie-h: 0px;
	--miobio-brand: #94B1A6;
	--miobio-brand-dark: #7a9a8e;
}

/* -------------------------------------------------------------------------
   1. Sticky add-to-cart (phones)
   ------------------------------------------------------------------------- */
.miobio-sticky-atc {
	display: none;
}

@media (max-width: 767px) {
	.miobio-sticky-atc {
		display: flex;
		align-items: center;
		gap: 12px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: var(--miobio-cookie-h, 0px);
		z-index: 99990;
		box-sizing: border-box;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
		background: #fff;
		border-top: 1px solid #e6e6e6;
		box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.12);
		transform: translateY(110%);
		transition: transform 0.22s ease;
		pointer-events: none;
	}

	.miobio-sticky-atc.is-visible {
		transform: translateY(0);
		pointer-events: auto;
	}

	.miobio-sticky-atc__price {
		flex: 0 1 auto;
		min-width: 0;
		font-size: 16px;
		font-weight: 600;
		line-height: 1.2;
		color: #111;
	}

	.miobio-sticky-atc__price del,
	.miobio-sticky-atc__price .screen-reader-text {
		display: none;
	}

	.miobio-sticky-atc__price ins {
		text-decoration: none;
		background: none;
	}

	.miobio-sticky-atc__btn {
		flex: 1 1 auto;
		min-height: 48px;
		padding: 12px 16px;
		border: 0;
		border-radius: 4px;
		background: var(--miobio-brand);
		color: #fff;
		font-size: 15px;
		font-weight: 600;
		line-height: 1.2;
		text-transform: none;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.miobio-sticky-atc__btn:disabled,
	.miobio-sticky-atc__btn.is-disabled {
		background: #cccccc;
		color: #666;
		cursor: not-allowed;
	}

	.miobio-sticky-atc__btn.loading {
		opacity: 0.7;
		pointer-events: none;
	}

	body.single-product.miobio-sticky-atc-visible {
		padding-bottom: calc(72px + var(--miobio-cookie-h, 0px) + env(safe-area-inset-bottom, 0px));
	}

	body.single-product.miobio-sticky-atc-visible #back-to-top {
		bottom: calc(84px + var(--miobio-cookie-h, 0px) + env(safe-area-inset-bottom, 0px));
	}

	#back-to-top {
		bottom: calc(20px + var(--miobio-cookie-h, 0px));
	}
}

/* -------------------------------------------------------------------------
   2. Compact cookie banner
   ------------------------------------------------------------------------- */
@media (max-width: 992px) {
	html.modal-cacsp-open:not(.miobio-cookie-settings-open) {
		overflow: auto !important;
		height: auto !important;
	}

	body.modal-cacsp-open:not(.miobio-cookie-settings-open) .modal-cacsp-backdrop {
		display: none !important;
		opacity: 0 !important;
		pointer-events: none !important;
	}

	body.modal-cacsp-open:not(.miobio-cookie-settings-open) .modal-cacsp-position {
		height: auto !important;
		width: 100% !important;
		top: auto !important;
		right: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		padding: 0 !important;
		overflow: visible !important;
		align-items: flex-end !important;
		justify-content: stretch !important;
		pointer-events: none;
	}

	body.modal-cacsp-open:not(.miobio-cookie-settings-open) .modal-cacsp-position .modal-cacsp-box {
		pointer-events: auto;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom.modal-cacsp-box-show {
		flex-direction: column !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
		gap: 8px;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
		box-sizing: border-box;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom .modal-cacsp-box-header {
		display: none !important;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom .modal-cacsp-box-content {
		width: 100% !important;
		max-width: 100% !important;
		flex: 0 0 auto;
		padding: 0 !important;
		font-size: 12px !important;
		line-height: 1.35 !important;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom .modal-cacsp-box-content a {
		display: none !important;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom .modal-cacsp-btns {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: stretch;
		gap: 8px;
		width: 100% !important;
		padding: 0 !important;
		border: 0 !important;
		white-space: normal !important;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom .modal-cacsp-btns .modal-cacsp-btn {
		flex: 1 1 0;
		width: auto !important;
		max-width: none !important;
		margin: 0 !important;
		min-height: 44px;
		padding: 10px 12px !important;
		font-size: 13px !important;
		line-height: 1.2 !important;
		white-space: nowrap;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
	}

	.modal-cacsp-position .modal-cacsp-box.modal-cacsp-box-info.modal-cacsp-box-bottom .modal-cacsp-btn-accept {
		background-color: var(--miobio-brand) !important;
		border-color: var(--miobio-brand) !important;
		color: #fff !important;
	}
}

/* -------------------------------------------------------------------------
   3. Compact mobile header: hamburger + logo + icons on one row
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.ts-header,
	.elementor-location-header {
		min-height: 52px !important;
	}

	.elementor-64848 .elementor-element.elementor-element-274b375 {
		--flex-direction: row;
		--flex-wrap-mobile: nowrap;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		min-height: 52px;
	}

	.elementor-64848 .elementor-element.elementor-element-274b375 > .e-con-inner {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		width: 100%;
	}

	.elementor-64848 .elementor-element.elementor-element-1412c4f {
		display: none !important;
	}

	.elementor-64848 .elementor-element.elementor-element-b358712 {
		--flex-wrap-mobile: nowrap;
		flex-wrap: nowrap !important;
		flex-direction: row !important;
		align-items: center !important;
		order: 2 !important;
		flex: 1 1 auto !important;
		min-width: 0;
		width: auto !important;
		--width: auto !important;
	}

	.elementor-64848 .elementor-element.elementor-element-b358712 > .e-con {
		--width: auto !important;
		width: auto !important;
		max-width: none !important;
		flex-basis: auto !important;
	}

	/* Hamburger — sibling of the logo/icons row */
	.elementor-64848 .elementor-element.elementor-element-4a35660 {
		order: 1 !important;
		--order: 1;
		flex: 0 0 auto !important;
		width: auto !important;
		--width: auto !important;
		max-width: 32px !important;
		height: 32px !important;
		padding: 0 !important;
		margin: 0 !important;
		align-self: center !important;
	}

	.elementor-64848 .elementor-element.elementor-element-1357f88 {
		width: 32px !important;
		max-width: 32px !important;
		height: 32px !important;
		min-height: 32px !important;
		margin: 0 !important;
		align-self: center !important;
	}

	.elementor-64848 .elementor-element.elementor-element-1357f88 .elementor-menu-toggle {
		width: 32px;
		height: 32px;
		min-width: 32px;
		min-height: 32px;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
		margin: 0;
	}

	/* Logo */
	.elementor-64848 .elementor-element.elementor-element-c73f62a {
		order: 2 !important;
		--order: 2;
		flex: 1 1 auto !important;
		width: auto !important;
		--width: auto !important;
		min-width: 0;
		justify-content: center !important;
	}

	.elementor-64848 .elementor-element.elementor-element-2ec32b6 {
		text-align: center;
	}

	.elementor-64848 .elementor-element.elementor-element-2ec32b6 img {
		width: auto !important;
		max-width: 120px !important;
		height: 32px !important;
		object-fit: contain;
	}

	/* Search / account / wishlist / cart */
	.elementor-64848 .elementor-element.elementor-element-d52e5be {
		order: 3 !important;
		--order: 3 !important;
		flex: 0 0 auto !important;
		width: auto !important;
		--width: auto !important;
		--justify-content: flex-end;
		justify-content: flex-end !important;
		align-items: center !important;
		align-self: center !important;
		height: 32px !important;
		min-height: 32px !important;
		max-height: 32px !important;
		padding: 0 !important;
		--padding: 0px !important;
		--padding-top: 0px !important;
		--padding-right: 0px !important;
		--padding-bottom: 0px !important;
		--padding-left: 0px !important;
		--gap: 4px 4px;
		--row-gap: 4px;
		--column-gap: 4px;
		gap: 4px !important;
	}

	.elementor-64848 .elementor-element.elementor-element-d52e5be .elementor-icon-wrapper {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		height: 32px !important;
		max-height: 32px !important;
		line-height: 0 !important;
		margin: 0 !important;
	}

	.elementor-64848 .elementor-element.elementor-element-d52e5be .elementor-icon {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 32px !important;
		height: 32px !important;
		padding: 0 !important;
		margin: 0 !important;
		line-height: 0 !important;
		box-sizing: border-box !important;
	}

	.elementor-64848 .elementor-element.elementor-element-d52e5be .elementor-icon svg {
		width: 15px !important;
		height: 15px !important;
	}

	.elementor-64848 .elementor-element.elementor-element-d52e5be > .elementor-element {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		align-self: center !important;
		height: 32px !important;
		min-height: 32px !important;
		max-height: 32px !important;
		margin: 0 !important;
	}

	.elementor-64848 .elementor-element.elementor-element-1141bb7 .elementor-item {
		width: 32px !important;
		height: 32px !important;
		min-width: 32px !important;
		min-height: 32px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	.elementor-64848 .elementor-element.elementor-element-0336422,
	.elementor-location-header .elementor-widget-woocommerce-menu-cart {
		align-self: center !important;
		height: 32px !important;
		min-height: 32px !important;
		max-height: 32px !important;
		margin: 0 !important;
		overflow: visible !important;
	}

	.elementor-location-header .elementor-menu-cart__wrapper,
	.elementor-location-header .elementor-menu-cart__toggle_wrapper {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		height: 32px !important;
		max-height: 32px !important;
		line-height: 0 !important;
		margin: 0 !important;
	}

	.elementor-location-header .elementor-menu-cart__container {
		position: fixed !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		height: 32px !important;
		line-height: 0 !important;
		vertical-align: middle !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle .elementor-button-text {
		display: none !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle .elementor-button-icon-qty[data-counter="0"] {
		display: none !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle_button.elementor-button {
		position: relative !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		align-self: center !important;
		width: 32px !important;
		height: 32px !important;
		min-width: 32px !important;
		min-height: 32px !important;
		max-width: 32px !important;
		max-height: 32px !important;
		padding: 0 !important;
		margin: 0 !important;
		gap: 0 !important;
		box-sizing: border-box !important;
		border: 1px solid #69727d !important;
		border-radius: 50% !important;
		background: transparent !important;
		box-shadow: none !important;
		color: #69727d !important;
		font-size: 0 !important;
		line-height: 0 !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle .elementor-button-icon {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		top: 0 !important;
		bottom: 0 !important;
		display: block !important;
		width: 32px !important;
		height: 32px !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle .elementor-button-icon svg,
	.elementor-location-header .elementor-menu-cart__toggle .elementor-button-icon i {
		display: none !important;
	}

	.elementor-location-header .elementor-menu-cart__toggle .elementor-button-icon::after {
		content: "" !important;
		position: absolute !important;
		left: 50% !important;
		top: 50% !important;
		width: 15px !important;
		height: 15px !important;
		transform: translate(-50%, -50%) !important;
		background-color: #69727d !important;
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E") !important;
		-webkit-mask-size: contain !important;
		-webkit-mask-repeat: no-repeat !important;
		-webkit-mask-position: center !important;
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E") !important;
		mask-size: contain !important;
		mask-repeat: no-repeat !important;
		mask-position: center !important;
	}
}