/* Cura Speed & Mobile — phone layout fixes. Everything is limited to phones (max-width: 767px). */

@media (max-width: 767px) {

	/* --- 1. Elementor Grid: rows only as tall as their content (stops big empty gaps
	          when a short item shares a grid with a tall one, e.g. a heading + the cart). --- */
	body.csm-mobile-fix .e-con.e-grid {
		grid-auto-rows: auto !important;
		grid-template-rows: none !important;
		align-content: start !important;
	}

	/* --- 2. Nothing wider than the screen. "clip" (not "hidden") keeps sticky headers working. --- */
	body.csm-mobile-fix { overflow-x: clip; }
	body.csm-mobile-fix .elementor img,
	body.csm-mobile-fix .elementor video,
	body.csm-mobile-fix .elementor iframe { max-width: 100%; height: auto; }

	/* --- 3. iPhones zoom into any field smaller than 16px. Keep fields at 16px. --- */
	body.csm-mobile-fix input[type="text"],
	body.csm-mobile-fix input[type="email"],
	body.csm-mobile-fix input[type="tel"],
	body.csm-mobile-fix input[type="number"],
	body.csm-mobile-fix input[type="search"],
	body.csm-mobile-fix input[type="password"],
	body.csm-mobile-fix select,
	body.csm-mobile-fix textarea { font-size: 16px !important; }

	/* --- 4. Comfortable tap targets for cart quantities. --- */
	body.csm-mobile-fix.woocommerce-cart .quantity .qty { min-height: 40px; }

	/* --- 5. Cart page: "Proceed to checkout" always in reach. --- */
	body.csm-sticky-checkout.woocommerce-cart .wc-proceed-to-checkout {
		position: fixed !important; left: 0; right: 0; bottom: 0; z-index: 990;
		margin: 0 !important; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)) !important;
		background: #fff; box-shadow: 0 -6px 20px rgba(0, 0, 0, .08);
	}
	body.csm-sticky-checkout.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
		display: block; width: 100%; margin: 0 !important; text-align: center;
	}
	body.csm-sticky-checkout.woocommerce-cart { padding-bottom: 84px; }

	/* --- 6. Sticky add-to-cart bar (product pages). --- */
	.csm-bar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 995;
		background: #fff; box-shadow: 0 -6px 22px rgba(0, 0, 0, .10);
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		transform: translateY(110%); transition: transform .25s ease;
		font-size: 14px; line-height: 1.25;
	}
	.csm-bar.is-visible { transform: translateY(0); }
	body.csm-bar-on { padding-bottom: 78px; }
	.csm-bar__inner { display: flex; align-items: center; gap: 10px; }
	.csm-bar .csm-bar__img { width: 46px; height: 46px; object-fit: cover; border-radius: 6px; flex: 0 0 46px; margin: 0; }
	.csm-bar__info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
	.csm-bar__name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.csm-bar__price { font-size: 13px; }
	.csm-bar__price del { opacity: .55; margin-right: 4px; }
	.csm-bar .csm-bar__btn,
	.csm-bar .csm-bar__btn:hover,
	.csm-bar .csm-bar__btn:focus {
		flex: 0 0 auto; min-height: 46px; margin: 0; padding: 0 18px;
		border: 0 !important; border-radius: 8px !important; box-shadow: none !important;
		background: var(--csm-brand, #E4202A) !important; color: #fff !important;
		font: inherit; font-size: 13px !important; font-weight: 700 !important;
		letter-spacing: .03em; text-transform: uppercase; cursor: pointer; white-space: nowrap;
	}
}

/* The bar never shows on larger screens. */
@media (min-width: 768px) {
	.csm-bar { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
	.csm-bar { transition: none; }
}
