/*
Theme Name: Hello Biz Child
Theme URI: https://kankan-handmade.eu/
Description: Child theme for the Kankan Handmade WooCommerce storefront.
Author: Codex
Template: hello-biz
Version: 1.0.0
Text Domain: hello-biz-child
*/

.ut-icon-row-shortcode {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 12px;
	line-height: 1.6;
}

.ut-icon-row-shortcode img {
	display: block;
	flex: 0 0 auto;
}

.ut-icon-row-shortcode > span {
	flex: 1 1 auto;
}

/* ============================================================
   Mobile hamburger menu fixes (max-width: 1024px)
   ============================================================ */

@media (max-width: 1024px) {

  /* 1. Right-align the hamburger toggle.
        Default was margin:0 auto (centered inside a full-width nav container). */
  .elementor-40 .elementor-element.elementor-element-3023b77 .elementor-menu-toggle {
    margin: 0 0 0 auto;
  }

  /* 2. Nav container: shrink to just the toggle button width (instead of 100%)
        and move it to the far right with order:2 so the visual order becomes
        Logo | Icons | Hamburger instead of Logo | Hamburger | Icons. */
  .elementor-40 .elementor-element.elementor-element-d3fafb7 {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: unset !important;
    order: 2 !important;
  }

  /* 3. Dropdown: position absolute so it is taken out of the flex flow.
        Without this, opening the menu makes the widget grow, and
        align-items:center on the parent row re-centers the taller widget —
        pushing the first menu items above the viewport (invisible).
        The containing block is d3fafb7 (.e-con = position:relative by default).
        top:100% places the dropdown just below the nav container (= just below
        the toggle button). right:0 aligns it to the right edge of the screen. */
  .elementor-40 .elementor-element.elementor-element-3023b77
    .elementor-nav-menu__container.elementor-nav-menu--dropdown {
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: auto !important;
    width: min(280px, calc(100vw - 32px)) !important;
    margin-top: 4px !important;
    z-index: 9998 !important;
  }

  /* 4. Allow the dropdown to overflow parent containers without being clipped. */
  .elementor-40 .elementor-element.elementor-element-1777990,
  .elementor-40 .elementor-element.elementor-element-7a733bd,
  .elementor-40 .elementor-element.elementor-element-d3fafb7 {
    overflow: visible !important;
  }
}


/* Mobile safeguards for the global Elementor header, home and footer. */
@media (max-width: 767px) {
	.elementor-78 .elementor-element.elementor-element-9d8da94,
	.elementor-78 .elementor-element.elementor-element-f19ef74 {
		--padding-left: 20px;
		--padding-right: 20px;
	}

	.elementor-78 .elementor-element.elementor-element-81f9e6d {
		--flex-wrap: wrap;
		flex-wrap: wrap !important;
		justify-content: center;
		gap: 10px 16px;
	}

	.elementor-70 .elementor-element.elementor-element-97c7bc2 {
		width: 100% !important;
		max-width: 100% !important;
	}

	.elementor-70 .elementor-element.elementor-element-5147cd2 .elementor-heading-title {
		font-size: clamp(36px, 12vw, 44px);
		line-height: 1.08;
		overflow-wrap: anywhere;
		hyphens: auto;
	}

	.elementor-40 .elementor-element.elementor-element-cc4a69d {
		min-width: 0 !important;
		flex: 1 1 auto !important;
	}

	.elementor-40 .elementor-element.elementor-element-05d4c2a {
		flex: 0 0 auto !important;
		--gap: 6px 6px;
	}
}

@media (max-width: 767px) {
	.ut-fs-floater {
		display: none !important;
	}
}

@media (max-width: 380px) {
	.elementor-40 .elementor-element.elementor-element-78ee34d {
		display: none !important;
	}

	.elementor-40 .elementor-element.elementor-element-e04b431 .elementor-heading-title {
		font-size: 20px !important;
	}
}


/* Hide the shipping floater while the cookie banner is open. */
@supports selector(body:has(.cmplz-cookiebanner.cmplz-show)) {
	body:has(.cmplz-cookiebanner.cmplz-show) .ut-fs-floater {
		display: none !important;
	}
}