/*
Theme Name: Astra Child - PersonalizeGifts
Theme URI: https://personalizegifts.in
Description: Custom child theme for PersonalizeGifts.in built on Astra
Author: PersonalizeGifts
Author URI: https://personalizegifts.in
Template: astra
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: personalizegifts
*/

/* ============================================
   1440px MAX-WIDTH CAP
   Prevents the site from stretching on
   ultra-wide monitors (1440p, 4K, ultrawide).
   ============================================ */

body {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.ast-container,
.ast-container-fluid,
.site-content .ast-container {
	max-width: 1440px;
}

.ast-hfb-header .site-header,
.site-header-primary-section-left,
.site-header-primary-section-right,
.ast-above-header-wrap .ast-builder-grid-row-container,
.ast-below-header-wrap .ast-builder-grid-row-container,
.ast-primary-header-bar .ast-builder-grid-row-container,
.site-footer .ast-builder-grid-row-container {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.ast-header-break-point .main-header-menu {
	max-width: 1440px;
}

.ast-full-width-layout .ast-container,
.ast-page-builder-template .ast-container,
.ast-plain-container .ast-container {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

/* Full-width sections (hero banners, WooCommerce) stay capped */
.woocommerce .ast-container,
.woocommerce-page .ast-container {
	max-width: 1440px;
}

/* Background stretches full but content stays capped */
.site-header,
.site-footer,
.ast-above-header-wrap,
.ast-below-header-wrap {
	width: 100%;
}

/* ============================================
   MOBILE OPTIMIZATIONS
   ============================================ */

/* --- Tablet (768px - 1024px) --- */
@media (max-width: 1024px) {
	.ast-container {
		padding-left: 16px;
		padding-right: 16px;
	}

	/* Product grid: 2 columns on tablet */
	.woocommerce ul.products[class*="columns-"] li.product {
		width: 48% !important;
		margin-right: 4% !important;
	}
	.woocommerce ul.products[class*="columns-"] li.product:nth-child(2n) {
		margin-right: 0 !important;
	}
}

/* --- Mobile (up to 768px) --- */
@media (max-width: 768px) {
	.ast-container {
		padding-left: 12px;
		padding-right: 12px;
	}

	/* Product grid: single column on mobile */
	.woocommerce ul.products[class*="columns-"] li.product {
		width: 100% !important;
		margin-right: 0 !important;
	}

	/* Product images: full width, maintain aspect ratio */
	.woocommerce ul.products li.product img,
	.woocommerce div.product div.images img {
		width: 100%;
		height: auto;
	}

	/* Product title: readable sizing */
	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 0.95rem;
		line-height: 1.3;
	}

	/* Price: don't overflow */
	.woocommerce ul.products li.product .price {
		font-size: 0.9rem;
	}

	/* Single product page: stack image + details */
	.woocommerce div.product div.images,
	.woocommerce div.product div.summary {
		width: 100% !important;
		float: none !important;
	}

	/* Cart table: make it scrollable */
	.woocommerce table.shop_table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* Buttons: full width on mobile */
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button,
	.woocommerce #respond input#submit {
		width: 100%;
		text-align: center;
		padding: 12px 16px;
	}

	/* Checkout fields: full width */
	.woocommerce form .form-row {
		width: 100% !important;
		float: none !important;
	}

	/* Header: prevent overflow */
	.site-header {
		overflow-x: hidden;
	}

	/* Typography: scale down for readability */
	.entry-content h2 {
		font-size: 1.4rem;
	}
	.entry-content h3 {
		font-size: 1.2rem;
	}

	/* Hide desktop-only elements on mobile */
	.ast-desktop-header-content {
		display: none;
	}

	/* Touch targets: minimum 44px */
	.woocommerce .quantity input[type="number"] {
		min-height: 44px;
		min-width: 44px;
		font-size: 16px;
	}
}

/* ============================================
   HERO BANNER — MOBILE FIX
   ============================================ */

@media (max-width: 768px) {
	/* Kill the 100px spacer above the hero on mobile */
	.home .entry-content > .wp-block-spacer:first-child {
		height: 0px !important;
		min-height: 0 !important;
	}

	/* Force the grid container to stack vertically */
	.home .uagb-layout-grid {
		display: block !important;
	}

	/* Cover block: reduce padding, ensure good height */
	.home .wp-block-cover.alignfull {
		min-height: 70vh !important;
		padding: 24px 20px !important;
		display: flex;
		align-items: center;
	}

	/* Text group inside cover: use full width, not 50% */
	.home .wp-block-cover .wp-block-group {
		max-width: 100% !important;
		width: 100% !important;
	}
	.home .wp-block-cover .wp-block-group .wp-block-group__inner-container,
	.home .wp-block-cover__inner-container {
		max-width: 100% !important;
	}

	/* Hero H1: readable, no wrapping issues */
	.home .wp-block-cover h1,
	.wp-block-uagb-container h1,
	.uagb-container-inner-blocks-wrap h1 {
		font-size: clamp(1.8rem, 8vw, 3rem) !important;
		line-height: 1.15 !important;
		word-break: normal !important;
		overflow-wrap: anywhere !important;
		hyphens: none !important;
		text-align: left !important;
	}

	/* Section headings below hero */
	.wp-block-uagb-container h2,
	.uagb-container-inner-blocks-wrap h2 {
		font-size: clamp(1.4rem, 6vw, 2rem) !important;
		line-height: 1.2 !important;
	}

	/* Kill the spacer inside the cover block */
	.home .wp-block-cover .wp-block-spacer {
		height: 12px !important;
	}

	/* CTA button: full width, tappable, override inline padding */
	.home .wp-block-cover .wp-block-button__link {
		padding: 16px 36px !important;
		font-size: 1rem !important;
		min-height: 48px;
		border-radius: 8px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	/* General UAGB buttons */
	.wp-block-uagb-container .wp-block-button__link,
	.wp-block-uagb-container .uagb-buttons-repeater {
		padding: 14px 32px !important;
		font-size: 1rem !important;
		min-height: 48px;
		border-radius: 8px;
	}
}

@media (max-width: 480px) {
	.home .wp-block-cover.alignfull {
		min-height: 60vh !important;
		padding: 20px 16px !important;
	}

	.home .wp-block-cover h1,
	.wp-block-uagb-container h1,
	.uagb-container-inner-blocks-wrap h1 {
		font-size: clamp(1.5rem, 9vw, 2.2rem) !important;
		line-height: 1.2 !important;
	}

	.home .wp-block-cover .wp-block-button__link {
		padding: 14px 28px !important;
		font-size: 0.95rem !important;
		width: 100%;
		text-align: center;
	}
}

/* ============================================
   FLOATING SOCIAL ICONS — MOBILE FIX
   Hide floating sidebar on mobile to prevent
   overlap with content. Show only bottom bar.
   ============================================ */

@media (max-width: 768px) {
	/* Hide the floating vertical social bar on mobile */
	.sfsi_widget,
	.norm_row.sfsi_wDiv,
	div[class*="sfsi_floater"] {
		display: none !important;
	}
}

/* On desktop, reduce social icon overlap with content */
.sfsi_widget,
.norm_row.sfsi_wDiv {
	z-index: 99;
}

/* ============================================
   WHATSAPP FLOATING BUTTON — BETTER POSITIONING
   ============================================ */

@media (max-width: 768px) {
	/* WhatsApp button: don't overlap navigation or content */
	.wa__btn_popup,
	.wa__popup_chat_window,
	a[href*="wa.me"],
	.whatsapp-button,
	div[class*="whatsapp"] {
		bottom: 16px !important;
		right: 16px !important;
		z-index: 999;
	}
}

/* --- Small phones (up to 480px) --- */
@media (max-width: 480px) {
	.ast-container {
		padding-left: 10px;
		padding-right: 10px;
	}

	/* Even tighter text for small screens */
	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 0.85rem;
	}

	/* Add to cart button: compact */
	.woocommerce a.button,
	.woocommerce button.button {
		font-size: 0.85rem;
		padding: 10px 12px;
	}

	/* Related products: single column */
	.woocommerce .related ul.products li.product,
	.woocommerce .upsells ul.products li.product {
		width: 100% !important;
	}
}