/**
 * File customizer.js.
 *
 * Theme Customizer enhancements for a better user experience.
 *
 * Contains handlers to make Theme Customizer preview reload changes asynchronously.
 */

( function ( $ ) {


	/**
	 * Live preview updates for responsive range controls
	 */

	// Logo Size
	wp.customize('pawfect_logo_size', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.site-logo img, .custom-logo, .site-branding img, .pawfect-logo-link img, .header-titles-wrapper .site-logo img { max-width: ' + values.desktop + 'px !important; width: ' + values.desktop + 'px !important; height: auto !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .site-logo img, .custom-logo, .site-branding img, .pawfect-logo-link img, .header-titles-wrapper .site-logo img { max-width: ' + values.tablet + 'px !important; width: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .site-logo img, .custom-logo, .site-branding img, .pawfect-logo-link img, .header-titles-wrapper .site-logo img { max-width: ' + values.mobile + 'px !important; width: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-logo-size');
		});
	});

	// Site Title Size
	wp.customize('pawfect_site_title_size', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.site-title, .site-title a, .site-branding .site-title, h1.site-title, .header-titles-wrapper .site-title, .header-titles-wrapper h1.site-title { font-size: ' + values.desktop + 'px !important; line-height: 1.2 !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .site-title, .site-title a, .site-branding .site-title, h1.site-title, .header-titles-wrapper .site-title, .header-titles-wrapper h1.site-title { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .site-title, .site-title a, .site-branding .site-title, h1.site-title, .header-titles-wrapper .site-title, .header-titles-wrapper h1.site-title { font-size: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-site-title-size');
		});
	});

	// Site Tagline Size
	wp.customize('pawfect_site_tagline_size', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.site-description, .site-branding .site-description, p.site-description, .header-titles-wrapper .site-description, .header-titles-wrapper p.site-description { font-size: ' + values.desktop + 'px !important; line-height: 1.4 !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .site-description, .site-branding .site-description, p.site-description, .header-titles-wrapper .site-description, .header-titles-wrapper p.site-description { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .site-description, .site-branding .site-description, p.site-description, .header-titles-wrapper .site-description, .header-titles-wrapper p.site-description { font-size: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-site-tagline-size');
		});
	});

	// Sticky Logo Width
	wp.customize('pawfect_sticky_logo_width', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.pawfect-header.pawfect-sticky-scrolled .pawfect-logo-link img, .pawfect-header.pawfect-sticky-scrolled .site-logo img { max-width: ' + values.desktop + 'px !important; width: ' + values.desktop + 'px !important; height: auto !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .pawfect-header.pawfect-sticky-scrolled .pawfect-logo-link img, .pawfect-header.pawfect-sticky-scrolled .site-logo img { max-width: ' + values.tablet + 'px !important; width: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .pawfect-header.pawfect-sticky-scrolled .pawfect-logo-link img, .pawfect-header.pawfect-sticky-scrolled .site-logo img { max-width: ' + values.mobile + 'px !important; width: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-sticky-logo-width');
		});
	});

	// Body Font Size - Responsive
	wp.customize('pawfect_body_font_size', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += 'body, body.pawfect-body, body.wp-customizer { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { body, body.pawfect-body, body.wp-customizer { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { body, body.pawfect-body, body.wp-customizer { font-size: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-body-font-size');
		});
	});

	// Body Line Height - Responsive
	wp.customize('pawfect_body_line_height', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += 'body, body.pawfect-body, body.wp-customizer { line-height: ' + values.desktop + ' !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { body, body.pawfect-body, body.wp-customizer { line-height: ' + values.tablet + ' !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { body, body.pawfect-body, body.wp-customizer { line-height: ' + values.mobile + ' !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-body-line-height');
		});
	});

	// Page Title Font Size - Responsive
	wp.customize('pawfect_page_title_font_size', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.pawfect-page-title, .page-title, .entry-title, h1.page-title, h1.entry-title { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .pawfect-page-title, .page-title, .entry-title, h1.page-title, h1.entry-title { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .pawfect-page-title, .page-title, .entry-title, h1.page-title, h1.entry-title { font-size: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-page-title-font-size');
		});
	});

	// Page Content Font Size - Responsive
	wp.customize('pawfect_page_content_font_size', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.pawfect-page-content, .page-content, .entry-content, .pawfect-content p { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .pawfect-page-content, .page-content, .entry-content, .pawfect-content p { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .pawfect-page-content, .page-content, .entry-content, .pawfect-content p { font-size: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-page-content-font-size');
		});
	});

	// Button Font Size - Responsive
	wp.customize('pawfect_button_font_size', function (value) {
		value.bind(function (newval) {

			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}


			var css = '';
			var buttonSelectors = '.pawfect-btn, .btn, button, input[type="submit"], input[type="button"], .wp-block-button__link, .woocommerce button, .woocommerce .button, .woocommerce input.button, a.button, .button, .pawfect-cta-button, .pawfect-hero-button, .pawfect-primary-button, .pawfect-hero-slider .pawfect-btn, .pawfect-hero-slider button, .pawfect-hero-slider a.button';

			// Add a test selector to see if CSS injection is working at all
			css += '/* Button Font Size Test - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += buttonSelectors + ' { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { ' + buttonSelectors + ' { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { ' + buttonSelectors + ' { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-button-font-size');
		});
	});

	// Blog Title Font Size - Responsive
	wp.customize('pawfect_blog_title_font_size', function (value) {
		value.bind(function (newval) {

			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}


			var css = '';
			var blogTitleSelectors = '.pawfect-post-title, .pawfect-blog-post .pawfect-post-title, .pawfect-blog-post h2, .pawfect-post-card h2, .pawfect-post-card h3, .entry-title, .post-title, .blog .entry-title, .archive .entry-title, article h1, article h2, .post h1, .post h2, .blog-post-title, .pawfect-page-title-heading, h1, h2';

			// Add a test selector to see if CSS injection is working at all
			css += '/* Blog Title Font Size Test - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += blogTitleSelectors + ' { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { ' + blogTitleSelectors + ' { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { ' + blogTitleSelectors + ' { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-blog-title-font-size');
		});
	});

	// Individual H1-H6 Font Size Controls - Responsive

	// H1 Font Size - Responsive
	wp.customize('pawfect_h1_font_size', function (value) {
		value.bind(function (newval) {

			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			css += '/* H1 Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += 'h1:not(.pawfect-hero-title) { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { h1:not(.pawfect-hero-title) { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { h1:not(.pawfect-hero-title) { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-h1-font-size');
		});
	});

	// H2 Font Size - Responsive
	wp.customize('pawfect_h2_font_size', function (value) {
		value.bind(function (newval) {

			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			css += '/* H2 Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += 'h2:not(.pawfect-hero-title) { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { h2:not(.pawfect-hero-title) { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { h2:not(.pawfect-hero-title) { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-h2-font-size');
		});
	});

	// H3 Font Size - Responsive
	wp.customize('pawfect_h3_font_size', function (value) {
		value.bind(function (newval) {

			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			css += '/* H3 Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += 'h3:not(.pawfect-hero-title) { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { h3:not(.pawfect-hero-title) { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { h3:not(.pawfect-hero-title) { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-h3-font-size');
		});
	});

	// H4 Font Size - Responsive
	wp.customize('pawfect_h4_font_size', function (value) {
		value.bind(function (newval) {

			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			css += '/* H4 Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += 'h4:not(.pawfect-hero-title) { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { h4:not(.pawfect-hero-title) { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { h4:not(.pawfect-hero-title) { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-h4-font-size');
		});
	});

	// H5 Font Size - Responsive
	wp.customize('pawfect_h5_font_size', function (value) {
		value.bind(function (newval) {

			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			css += '/* H5 Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += 'h5:not(.pawfect-hero-title) { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { h5:not(.pawfect-hero-title) { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { h5:not(.pawfect-hero-title) { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-h5-font-size');
		});
	});

	// H6 Font Size - Responsive
	wp.customize('pawfect_h6_font_size', function (value) {
		value.bind(function (newval) {

			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			css += '/* H6 Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += 'h6:not(.pawfect-hero-title) { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { h6:not(.pawfect-hero-title) { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { h6:not(.pawfect-hero-title) { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-h6-font-size');
		});
	});

	// Individual H1-H6 Typography Controls (Non-Responsive) - Live Preview

	// H1 Typography Controls
	wp.customize('pawfect_h1_font_family', function(value) {
		value.bind(function(newval) {
			pawfectInjectCSS('h1:not(.pawfect-hero-title) { font-family: "' + newval + '" !important; }', 'pawfect-h1-font-family');
		});
	});
	wp.customize('pawfect_h1_font_weight', function(value) {
		value.bind(function(newval) {
			pawfectInjectCSS('h1:not(.pawfect-hero-title) { font-weight: ' + newval + ' !important; }', 'pawfect-h1-font-weight');
		});
	});
	wp.customize('pawfect_h1_letter_spacing', function(value) {
		value.bind(function(newval) {
			if (newval && newval !== '0em') {
				pawfectInjectCSS('h1:not(.pawfect-hero-title) { letter-spacing: ' + newval + ' !important; }', 'pawfect-h1-letter-spacing');
			}
		});
	});
	wp.customize('pawfect_h1_text_transform', function(value) {
		value.bind(function(newval) {
			if (newval && newval !== 'none') {
				pawfectInjectCSS('h1:not(.pawfect-hero-title) { text-transform: ' + newval + ' !important; }', 'pawfect-h1-text-transform');
			}
		});
	});

	// H1 Line Height - Responsive
	wp.customize('pawfect_h1_line_height', function (value) {
		value.bind(function (newval) {
			var values = (typeof newval === 'string') ? JSON.parse(newval) : newval;
			var css = '';
			if (values.desktop) { css += 'h1:not(.pawfect-hero-title) { line-height: ' + values.desktop + ' !important; }'; }
			if (values.tablet) { css += '@media (max-width: 1024px) { h1:not(.pawfect-hero-title) { line-height: ' + values.tablet + ' !important; } }'; }
			if (values.mobile) { css += '@media (max-width: 768px) { h1:not(.pawfect-hero-title) { line-height: ' + values.mobile + ' !important; } }'; }
			pawfectInjectCSS(css, 'pawfect-h1-line-height');
		});
	});

	// H2 Typography Controls
	wp.customize('pawfect_h2_font_family', function(value) {
		value.bind(function(newval) {
			pawfectInjectCSS('h2:not(.pawfect-hero-title) { font-family: "' + newval + '" !important; }', 'pawfect-h2-font-family');
		});
	});
	wp.customize('pawfect_h2_font_weight', function(value) {
		value.bind(function(newval) {
			pawfectInjectCSS('h2:not(.pawfect-hero-title) { font-weight: ' + newval + ' !important; }', 'pawfect-h2-font-weight');
		});
	});
	wp.customize('pawfect_h2_letter_spacing', function(value) {
		value.bind(function(newval) {
			if (newval && newval !== '0em') {
				pawfectInjectCSS('h2:not(.pawfect-hero-title) { letter-spacing: ' + newval + ' !important; }', 'pawfect-h2-letter-spacing');
			}
		});
	});
	wp.customize('pawfect_h2_text_transform', function(value) {
		value.bind(function(newval) {
			if (newval && newval !== 'none') {
				pawfectInjectCSS('h2:not(.pawfect-hero-title) { text-transform: ' + newval + ' !important; }', 'pawfect-h2-text-transform');
			}
		});
	});

	// H2 Line Height - Responsive
	wp.customize('pawfect_h2_line_height', function (value) {
		value.bind(function (newval) {
			var values = (typeof newval === 'string') ? JSON.parse(newval) : newval;
			var css = '';
			if (values.desktop) { css += 'h2:not(.pawfect-hero-title) { line-height: ' + values.desktop + ' !important; }'; }
			if (values.tablet) { css += '@media (max-width: 1024px) { h2:not(.pawfect-hero-title) { line-height: ' + values.tablet + ' !important; } }'; }
			if (values.mobile) { css += '@media (max-width: 768px) { h2:not(.pawfect-hero-title) { line-height: ' + values.mobile + ' !important; } }'; }
			pawfectInjectCSS(css, 'pawfect-h2-line-height');
		});
	});

	// H3 Typography Controls
	wp.customize('pawfect_h3_font_family', function(value) {
		value.bind(function(newval) {
			pawfectInjectCSS('h3:not(.pawfect-hero-title) { font-family: "' + newval + '" !important; }', 'pawfect-h3-font-family');
		});
	});
	wp.customize('pawfect_h3_font_weight', function(value) {
		value.bind(function(newval) {
			pawfectInjectCSS('h3:not(.pawfect-hero-title) { font-weight: ' + newval + ' !important; }', 'pawfect-h3-font-weight');
		});
	});
	wp.customize('pawfect_h3_letter_spacing', function(value) {
		value.bind(function(newval) {
			if (newval && newval !== '0em') {
				pawfectInjectCSS('h3:not(.pawfect-hero-title) { letter-spacing: ' + newval + ' !important; }', 'pawfect-h3-letter-spacing');
			}
		});
	});
	wp.customize('pawfect_h3_text_transform', function(value) {
		value.bind(function(newval) {
			if (newval && newval !== 'none') {
				pawfectInjectCSS('h3:not(.pawfect-hero-title) { text-transform: ' + newval + ' !important; }', 'pawfect-h3-text-transform');
			}
		});
	});

	// H3 Line Height - Responsive
	wp.customize('pawfect_h3_line_height', function (value) {
		value.bind(function (newval) {
			var values = (typeof newval === 'string') ? JSON.parse(newval) : newval;
			var css = '';
			if (values.desktop) { css += 'h3:not(.pawfect-hero-title) { line-height: ' + values.desktop + ' !important; }'; }
			if (values.tablet) { css += '@media (max-width: 1024px) { h3:not(.pawfect-hero-title) { line-height: ' + values.tablet + ' !important; } }'; }
			if (values.mobile) { css += '@media (max-width: 768px) { h3:not(.pawfect-hero-title) { line-height: ' + values.mobile + ' !important; } }'; }
			pawfectInjectCSS(css, 'pawfect-h3-line-height');
		});
	});

	// H4-H6 Typography Controls (Compact)
	['h4', 'h5', 'h6'].forEach(function(heading) {
		var prefix = 'pawfect_' + heading + '_';
		wp.customize(prefix + 'font_family', function(value) {
			value.bind(function(newval) {
				pawfectInjectCSS(heading + ':not(.pawfect-hero-title) { font-family: "' + newval + '" !important; }', prefix + 'font-family');
			});
		});
		wp.customize(prefix + 'font_weight', function(value) {
			value.bind(function(newval) {
				pawfectInjectCSS(heading + ':not(.pawfect-hero-title) { font-weight: ' + newval + ' !important; }', prefix + 'font-weight');
			});
		});
		wp.customize(prefix + 'letter_spacing', function(value) {
			value.bind(function(newval) {
				if (newval && newval !== '0em') {
					pawfectInjectCSS(heading + ':not(.pawfect-hero-title) { letter-spacing: ' + newval + ' !important; }', prefix + 'letter-spacing');
				}
			});
		});
		wp.customize(prefix + 'text_transform', function(value) {
			value.bind(function(newval) {
				if (newval && newval !== 'none') {
					pawfectInjectCSS(heading + ':not(.pawfect-hero-title) { text-transform: ' + newval + ' !important; }', prefix + 'text-transform');
				}
			});
		});
		wp.customize(prefix + 'line_height', function (value) {
			value.bind(function (newval) {
				var values = (typeof newval === 'string') ? JSON.parse(newval) : newval;
				var css = '';
				if (values.desktop) { css += heading + ':not(.pawfect-hero-title) { line-height: ' + values.desktop + ' !important; }'; }
				if (values.tablet) { css += '@media (max-width: 1024px) { ' + heading + ':not(.pawfect-hero-title) { line-height: ' + values.tablet + ' !important; } }'; }
				if (values.mobile) { css += '@media (max-width: 768px) { ' + heading + ':not(.pawfect-hero-title) { line-height: ' + values.mobile + ' !important; } }'; }
				pawfectInjectCSS(css, prefix + 'line-height');
			});
		});
	});

	// Hero Slider Title Font Size - Responsive (Enhanced)
	wp.customize('pawfect_main_slider_title_font_size', function (value) {
		value.bind(function (newval) {

			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}


			var css = '';
			var heroSelectors = '.pawfect-hero-slider .pawfect-hero-title, .pawfect-main-slider .pawfect-hero-title';

			// Add CSS comment for debugging
			css += '/* Hero Slider Title Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += heroSelectors + ' { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { ' + heroSelectors + ' { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { ' + heroSelectors + ' { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-hero-title-font-size');
		});
	});

	// Press Mentions Logo Size - Responsive
	wp.customize('pawfect_press_mentions_logo_height', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.pawfect-press-mentions img, .pawfect-press-mentions-container img { height: ' + values.desktop + 'px !important; width: auto !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .pawfect-press-mentions img, .pawfect-press-mentions-container img { height: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .pawfect-press-mentions img, .pawfect-press-mentions-container img { height: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-press-logo-size');
		});
	});

	// Press Mentions Logo Gap - Responsive
	wp.customize('pawfect_press_mentions_gap', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.pawfect-press-mentions-container, .pawfect-press-mentions { gap: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .pawfect-press-mentions-container, .pawfect-press-mentions { gap: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .pawfect-press-mentions-container, .pawfect-press-mentions { gap: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-press-logo-gap');
		});
	});

	// Page Header Height - Responsive
	wp.customize('pawfect_page_header_height', function (value) {
		value.bind(function (newval) {
			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}

			var css = '';
			if (values.desktop && values.desktop > 0) {
				css += '.pawfect-page-header { min-height: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { .pawfect-page-header { min-height: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { .pawfect-page-header { min-height: ' + values.mobile + 'px !important; } }';
			}
			pawfectInjectCSS(css, 'pawfect-page-header-height');
		});
	});



	// Helper function to inject CSS (consolidated version)
	function pawfectInjectCSS(css, id) {
		var styleId = 'pawfect-customizer-' + id;

		// Remove existing style tag
		var existingStyle = document.getElementById(styleId);
		if (existingStyle) {
			existingStyle.remove();
		}

		// Create new style tag
		var style = document.createElement('style');
		style.id = styleId;
		style.innerHTML = css;
		document.head.appendChild(style);

	}

	// Make pawfectInjectCSS globally available
	window.pawfectInjectCSS = pawfectInjectCSS;

	// Typography settings now use default transport behavior
	wp.customize.bind('ready', function() {

		// Force postMessage transport for live preview
		var typographySettings = [
			'pawfect_heading_font_family',
			'pawfect_body_font_family',
			'pawfect_menu_font_family',
			'pawfect_body_font_weight',
			'pawfect_menu_font_weight',
			'pawfect_menu_font_size',
			'pawfect_menu_text_transform',
			// Button Typography
			'pawfect_button_font_family',
			'pawfect_button_font_size',
			'pawfect_button_font_weight',
			'pawfect_button_letter_spacing',
			'pawfect_button_text_transform',
			// Blog Post Typography
			'pawfect_blog_title_font_family',
			'pawfect_blog_title_font_size',
			'pawfect_blog_title_font_weight',
			'pawfect_blog_meta_font_size',
			'pawfect_blog_meta_text_transform',
			'pawfect_blog_meta_letter_spacing'
		];

		typographySettings.forEach(function(settingId) {
			var setting = wp.customize(settingId);
			if (setting) {
				setting.transport = 'postMessage';
			}
		});
	});

	// Site title and description.
	/* wp.customize( 'blogname', function ( value ) {
		value.bind( function ( to ) {
			$( '.site-title' ).text( to );
		} );
	} );
	wp.customize( 'blogdescription', function ( value ) {
		value.bind( function ( to ) {
			$( '.site-description' ).text( to );
		} );
	} ); */
	
	// Service title
	wp.customize(
		'pawfect_service_area_title', function( value ) {
			value.bind(
				function( newval ) {
					$( '.service .section-title' ).text( newval );
				}
			);
		}
	);
	
	// Service description
	wp.customize(
		'pawfect_service_area_des', function( value ) {
			value.bind(
				function( newval ) {
					$( '.service .section-header p' ).text( newval );
				}
			);
		}
	);
	// Service Section
	wp.customize(
		'pawfect_service_content', function( value ) {
			value.bind(
				function( newval ) {
					$( '.service .container-full' ).text( newval );
				}
			);
		}
	);
	
	// Project title
	wp.customize(
		'pawfect_project_area_title', function( value ) {
			value.bind(
				function( newval ) {
					$( '.portfolio_selector .section-header .section-title' ).text( newval );
				}
			);
		}
	);
	
	// Project description
	wp.customize(
		'pawfect_project_area_des', function( value ) {
			value.bind(
				function( newval ) {
					$( '.portfolio_selector .section-header p' ).text( newval );
				}
			);
		}
	);
	
	
	// Testimonial title
	wp.customize(
		'pawfect_testimonial_area_title', function( value ) {
			value.bind(
				function( newval ) {
					$( '.testimonial .section-header h1' ).text( newval );
				}
			);
		}
	);
	
	// Testimonial description
	wp.customize(
		'pawfect_testimonial_area_des', function( value ) {
			value.bind(
				function( newval ) {
					$( '.testimonial .section-header p' ).text( newval );
				}
			);
		}
	);
	
	// Call to action title
	wp.customize(
		'pawfect_cta_area_title', function( value ) {
			value.bind(
				function( newval ) {
					$( '.callout-to-action .title' ).text( newval );
				}
			);
		}
	);
	
	// Call to action subtitle
	wp.customize(
		'pawfect_cta_area_subtitle', function( value ) {
			value.bind(
				function( newval ) {
					$( '.callout-to-action .subtitle' ).text( newval );
				}
			);
		}
	);
	
	// Call to action description
	wp.customize(
		'pawfect_cta_area_des', function( value ) {
			value.bind(
				function( newval ) {
					$( '.callout-to-action .m-top-40 .callout-button' ).text( newval );
				}
			);
		}
	);
	
	// Call to action button text
	wp.customize(
		'pawfect_cta_button_text', function( value ) {
			value.bind(
				function( newval ) {
					$( '.theme-cta .btn-small' ).text( newval );
				}
			);
		}
	);
	
	
	// Blog title
	wp.customize(
		'pawfect_blog_area_title', function( value ) {
			value.bind(
				function( newval ) {
					$( '.home-news .section-title' ).text( newval );
				}
			);
		}
	);
	
	// Blog description
	wp.customize(
		'pawfect_blog_area_des', function( value ) {
			value.bind(
				function( newval ) {
					$( '.home-news .section-subtitle' ).text( newval );
				}
			);
		}
	);
	
	
	// footer copyright text
	wp.customize(
		'pawfect_footer_copyright_text', function( value ) {
			value.bind(
				function( newval ) {
					$( '.footer-copyrights' ).text( newval );
				}
			);
		}
	);

	// Typography Live Preview (Enhanced like Formula theme)
	// Body Font Family (using CSS injection)
	wp.customize(
		'pawfect_body_font_family', function( value ) {
			value.bind(
				function( newval ) {

					// Load the font dynamically
					pawfectLoadGoogleFont(newval);

					// Inject CSS for body font
					var css = 'body, body.pawfect-body { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
					pawfectInjectCSS(css, 'pawfect-body-font');
				}
			);
		}
	);

	// Body Font Weight
	wp.customize(
		'pawfect_body_font_weight', function( value ) {
			value.bind(
				function( newval ) {
					$( 'body, body.pawfect-body' ).css( 'font-weight', newval );
				}
			);
		}
	);

	// Body Font Size
	wp.customize(
		'pawfect_body_font_size', function( value ) {
			value.bind(
				function( newval ) {
					$( 'body, body.pawfect-body' ).css( 'font-size', newval + 'px' );
				}
			);
		}
	);

	// Body Line Height
	wp.customize(
		'pawfect_body_line_height', function( value ) {
			value.bind(
				function( newval ) {
					$( 'body, body.pawfect-body' ).css( 'line-height', newval );
				}
			);
		}
	);

	// Heading Font Family (using CSS injection)
	wp.customize(
		'pawfect_heading_font_family', function( value ) {
			value.bind(
				function( newval ) {

					// Load the font dynamically
					pawfectLoadGoogleFont(newval);

					// Inject CSS for heading font
					var css = 'h1, h2, h3, h4, h5, h6, .pawfect-heading, .entry-title, .post-title, .page-title { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
					pawfectInjectCSS(css, 'pawfect-heading-font');
				}
			);
		}
	);

	// Heading Font Weight
	wp.customize(
		'pawfect_heading_font_weight', function( value ) {
			value.bind(
				function( newval ) {
					$( 'h1, h2, h3, h4, h5, h6, .pawfect-heading, .entry-title, .post-title, .page-title' ).css( 'font-weight', newval );
				}
			);
		}
	);

	// Heading Text Transform
	wp.customize(
		'pawfect_heading_text_transform', function( value ) {
			value.bind(
				function( newval ) {
					$( 'h1, h2, h3, h4, h5, h6, .pawfect-heading, .entry-title, .post-title, .page-title' ).css( 'text-transform', newval );
				}
			);
		}
	);

	// Menu Font Family (using CSS injection)
	wp.customize(
		'pawfect_menu_font_family', function( value ) {
			value.bind(
				function( newval ) {

					// Load the font dynamically
					pawfectLoadGoogleFont(newval);

					// Comprehensive menu selectors
					var menuSelectors = [
						'.pawfect-header nav a',
						'.pawfect-header nav ul li a',
						'.pawfect-sticky-header nav a',
						'.pawfect-sticky-scrolled-layout nav a',
						'#pawfect-mobile-drawer nav a',
						'#pawfect-mobile-drawer a',
						'.pawfect-nav a',
						'.pawfect-menu a',
						'.main-navigation a',
						'.site-navigation a',
						'.primary-navigation a',
						'.menu a',
						'.nav-menu a',
						'.primary-menu a',
						'.pawfect-nav-link'
					].join(', ');

					// Inject CSS for menu font
					var css = menuSelectors + ' { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
					pawfectInjectCSS(css, 'pawfect-menu-font');
				}
			);
		}
	);

	// Menu Font Weight (using CSS injection)
	wp.customize(
		'pawfect_menu_font_weight', function( value ) {
			value.bind(
				function( newval ) {

					var menuSelectors = [
						'.pawfect-header nav a',
						'.pawfect-header nav ul li a',
						'.pawfect-sticky-header nav a',
						'.pawfect-sticky-scrolled-layout nav a',
						'#pawfect-mobile-drawer nav a',
						'#pawfect-mobile-drawer a',
						'.pawfect-nav a',
						'.pawfect-menu a',
						'.main-navigation a',
						'.site-navigation a',
						'.primary-navigation a',
						'.menu a',
						'.nav-menu a',
						'.primary-menu a',
						'.pawfect-nav-link'
					].join(', ');

					var css = menuSelectors + ' { font-weight: ' + newval + ' !important; }';
					pawfectInjectCSS(css, 'pawfect-menu-weight');
				}
			);
		}
	);

	// Menu Font Size - Responsive (Enhanced)
	wp.customize('pawfect_menu_font_size', function (value) {
		value.bind(function (newval) {

			// Parse JSON string if needed
			var values = newval;
			if (typeof newval === 'string') {
				try {
					values = JSON.parse(newval);
				} catch (e) {
					return;
				}
			}


			var css = '';
			var menuSelectors = '.pawfect-primary-nav-menu a, .pawfect-nav-menu a, .primary-navigation a, .main-navigation a, .pawfect-header nav a, .pawfect-header nav ul li a, .pawfect-sticky-header nav a, .site-navigation a, .menu a, .nav-menu a, .primary-menu a, .pawfect-nav-link';

			// Add CSS comment for debugging
			css += '/* Menu Font Size - Desktop: ' + (values.desktop || 'none') + 'px */ ';

			if (values.desktop && values.desktop > 0) {
				css += menuSelectors + ' { font-size: ' + values.desktop + 'px !important; }';
			}
			if (values.tablet && values.tablet > 0) {
				css += '@media (max-width: 1024px) { ' + menuSelectors + ' { font-size: ' + values.tablet + 'px !important; } }';
			}
			if (values.mobile && values.mobile > 0) {
				css += '@media (max-width: 768px) { ' + menuSelectors + ' { font-size: ' + values.mobile + 'px !important; } }';
			}

			pawfectInjectCSS(css, 'pawfect-menu-font-size');
		});
	});

	// Menu Text Transform (using CSS injection)
	wp.customize(
		'pawfect_menu_text_transform', function( value ) {
			value.bind(
				function( newval ) {

					var menuSelectors = [
						'.pawfect-header nav a',
						'.pawfect-header nav ul li a',
						'.pawfect-sticky-header nav a',
						'.pawfect-sticky-scrolled-layout nav a',
						'#pawfect-mobile-drawer nav a',
						'#pawfect-mobile-drawer a',
						'.pawfect-nav a',
						'.pawfect-menu a',
						'.main-navigation a',
						'.site-navigation a',
						'.primary-navigation a',
						'.menu a',
						'.nav-menu a',
						'.primary-menu a',
						'.pawfect-nav-link'
					].join(', ');

					var css = menuSelectors + ' { text-transform: ' + newval + ' !important; }';
					pawfectInjectCSS(css, 'pawfect-menu-transform');
				}
			);
		}
	);

	// Menu Font Weight
	wp.customize(
		'pawfect_menu_font_weight', function( value ) {
			value.bind(
				function( newval ) {
					$( '.pawfect-nav a, .pawfect-menu a, .main-navigation a, .site-navigation a, .primary-navigation a' ).css( 'font-weight', newval );
				}
			);
		}
	);

	// OLD Menu Font Size implementation removed - using responsive version above

	// Menu Text Transform
	wp.customize(
		'pawfect_menu_text_transform', function( value ) {
			value.bind(
				function( newval ) {
					$( '.pawfect-nav a, .pawfect-menu a, .main-navigation a, .site-navigation a, .primary-navigation a' ).css( 'text-transform', newval );
				}
			);
		}
	);

	// Function to dynamically load Google Fonts (improved)
	var loadedFonts = {}; // Track loaded fonts

	function pawfectLoadGoogleFont(fontFamily) {
		if (!fontFamily || fontFamily === 'inherit' || fontFamily === 'default') {
			return;
		}

		// Check if font is already loaded
		if (loadedFonts[fontFamily]) {
			return;
		}

		var fontId = 'pawfect-dynamic-font-' + fontFamily.replace(/\s+/g, '-').toLowerCase();

		// Remove existing font link if it exists
		var existingLink = document.getElementById(fontId);
		if (existingLink) {
			existingLink.remove();
		}

		// Use WPTT local font proxy via AJAX to maintain GDPR compliance.
		// Falls back to refresh transport which loads fonts server-side via WPTT.
		if (typeof wp !== 'undefined' && wp.customize && wp.ajax) {
			wp.ajax.post('pawfect_get_local_font_url', {
				font_family: fontFamily,
				_wpnonce: (typeof pawfectCustomizer !== 'undefined' && pawfectCustomizer.nonce) ? pawfectCustomizer.nonce : ''
			}).done(function(response) {
				if (response && response.url) {
					var link = document.createElement('link');
					link.id = fontId;
					link.rel = 'stylesheet';
					link.href = response.url;
					link.onload = function() {
						loadedFonts[fontFamily] = true;
					};
					document.head.appendChild(link);
				}
			}).fail(function() {
				// Fallback: trigger a customizer refresh so fonts load server-side via WPTT
				loadedFonts[fontFamily] = true;
			});
		} else {
			// Outside customizer context, mark as loaded (fonts handled server-side)
			loadedFonts[fontFamily] = true;
		}
	}

	// Duplicate function removed - using consolidated version above

	// Manual test controls removed - real typography system is working

	// Real typography settings (replacing class-based approach)
	wp.customize('pawfect_heading_font_family', function(value) {
		value.bind(function(newval) {

			// Load the font dynamically
			pawfectLoadGoogleFont(newval);

			// Inject CSS for heading font
			var css = 'h1, h2, h3, h4, h5, h6, .pawfect-heading, .entry-title, .post-title, .page-title { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
			pawfectInjectCSS(css, 'pawfect-real-heading-font');
		});
	});

	wp.customize('pawfect_body_font_family', function(value) {
		value.bind(function(newval) {

			// Load the font dynamically
			pawfectLoadGoogleFont(newval);

			// Inject CSS for body font
			var css = 'body, body.pawfect-body { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
			pawfectInjectCSS(css, 'pawfect-real-body-font');
		});
	});

	wp.customize('pawfect_menu_font_family', function(value) {
		value.bind(function(newval) {

			// Load the font dynamically
			pawfectLoadGoogleFont(newval);

			// Comprehensive menu selectors
			var menuSelectors = [
				'.pawfect-header nav a',
				'.pawfect-header nav ul li a',
				'.pawfect-sticky-header nav a',
				'.pawfect-sticky-scrolled-layout nav a',
				'#pawfect-mobile-drawer nav a',
				'#pawfect-mobile-drawer a',
				'.pawfect-nav a',
				'.pawfect-menu a',
				'.main-navigation a',
				'.site-navigation a',
				'.primary-navigation a',
				'.menu a',
				'.nav-menu a',
				'.primary-menu a',
				'.pawfect-nav-link'
			].join(', ');

			// Inject CSS for menu font
			var css = menuSelectors + ' { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
			pawfectInjectCSS(css, 'pawfect-real-menu-font');
		});
	});

	// Heading Font Weight
	wp.customize('pawfect_heading_font_weight', function(value) {
		value.bind(function(newval) {

			var css = 'h1, h2, h3, h4, h5, h6, .pawfect-heading, .entry-title, .post-title, .page-title { font-weight: ' + newval + ' !important; }';
			pawfectInjectCSS(css, 'pawfect-real-heading-weight');
		});
	});

	// Menu Font Weight
	wp.customize('pawfect_menu_font_weight', function(value) {
		value.bind(function(newval) {

			var menuSelectors = [
				'.pawfect-header nav a',
				'.pawfect-header nav ul li a',
				'.pawfect-sticky-header nav a',
				'.pawfect-sticky-scrolled-layout nav a',
				'#pawfect-mobile-drawer nav a',
				'#pawfect-mobile-drawer a',
				'.pawfect-nav a',
				'.pawfect-menu a',
				'.main-navigation a',
				'.site-navigation a',
				'.primary-navigation a',
				'.menu a',
				'.nav-menu a',
				'.primary-menu a',
				'.pawfect-nav-link'
			].join(', ');

			var css = menuSelectors + ' { font-weight: ' + newval + ' !important; }';
			pawfectInjectCSS(css, 'pawfect-real-menu-weight');
		});
	});

	// Menu Text Transform
	wp.customize('pawfect_menu_text_transform', function(value) {
		value.bind(function(newval) {

			var menuSelectors = [
				'.pawfect-header nav a',
				'.pawfect-header nav ul li a',
				'.pawfect-sticky-header nav a',
				'.pawfect-sticky-scrolled-layout nav a',
				'#pawfect-mobile-drawer nav a',
				'#pawfect-mobile-drawer a',
				'.pawfect-nav a',
				'.pawfect-menu a',
				'.main-navigation a',
				'.site-navigation a',
				'.primary-navigation a',
				'.menu a',
				'.nav-menu a',
				'.primary-menu a',
				'.pawfect-nav-link'
			].join(', ');

			var css = menuSelectors + ' { text-transform: ' + newval + ' !important; }';
			pawfectInjectCSS(css, 'pawfect-real-menu-transform');
		});
	});

	// Button Typography Live Preview
	wp.customize('pawfect_button_font_family', function(value) {
		value.bind(function(newval) {
			var buttonSelectors = [
				'.pawfect-btn',
				'.pawfect-btn--dark',
				'.pawfect-btn--primary',
				'.pawfect-btn--secondary',
				'.pawfect-btn--outline',
				'.pawfect-button',
				'button[type="submit"]',
				'input[type="submit"]',
				'.wp-block-button__link',
				'.woocommerce button.button',
				'.woocommerce a.button',
				'.woocommerce input.button'
			].join(', ');

			var css = buttonSelectors + ' { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
			pawfectInjectCSS(css, 'pawfect-button-font-family');
		});
	});

	// OLD Button Font Size implementation removed - now using responsive range slider version above

	wp.customize('pawfect_button_font_weight', function(value) {
		value.bind(function(newval) {
			var buttonSelectors = [
				'.pawfect-btn',
				'.pawfect-btn--dark',
				'.pawfect-btn--primary',
				'.pawfect-btn--secondary',
				'.pawfect-btn--outline',
				'.pawfect-button',
				'button[type="submit"]',
				'input[type="submit"]',
				'.wp-block-button__link',
				'.woocommerce button.button',
				'.woocommerce a.button',
				'.woocommerce input.button'
			].join(', ');

			var css = buttonSelectors + ' { font-weight: ' + newval + ' !important; }';
			pawfectInjectCSS(css, 'pawfect-button-font-weight');
		});
	});

	wp.customize('pawfect_button_text_transform', function(value) {
		value.bind(function(newval) {
			var buttonSelectors = [
				'.pawfect-btn',
				'.pawfect-btn--dark',
				'.pawfect-btn--primary',
				'.pawfect-btn--secondary',
				'.pawfect-btn--outline',
				'.pawfect-button',
				'button[type="submit"]',
				'input[type="submit"]',
				'.wp-block-button__link',
				'.woocommerce button.button',
				'.woocommerce a.button',
				'.woocommerce input.button'
			].join(', ');

			var css = buttonSelectors + ' { text-transform: ' + newval + ' !important; }';
			pawfectInjectCSS(css, 'pawfect-button-text-transform');
		});
	});

	// Blog Post Typography Live Preview
	wp.customize('pawfect_blog_title_font_family', function(value) {
		value.bind(function(newval) {
			var blogTitleSelectors = [
				'.pawfect-post-title',
				'.pawfect-blog-post .pawfect-post-title',
				'.pawfect-blog-post h2',
				'.pawfect-post-card h2',
				'.pawfect-post-card h3',
				'.entry-title',
				'.post-title'
			].join(', ');

			var css = blogTitleSelectors + ' { font-family: "' + newval + '", -apple-system, BlinkMacSystemFont, sans-serif !important; }';
			pawfectInjectCSS(css, 'pawfect-blog-title-font-family');
		});
	});

	// OLD Blog Title Font Size implementation removed - now using responsive range slider version above

	wp.customize('pawfect_blog_title_font_weight', function(value) {
		value.bind(function(newval) {
			var blogTitleSelectors = [
				'.pawfect-post-title',
				'.pawfect-blog-post .pawfect-post-title',
				'.pawfect-blog-post h2',
				'.pawfect-post-card h2',
				'.pawfect-post-card h3',
				'.entry-title',
				'.post-title'
			].join(', ');

			var css = blogTitleSelectors + ' { font-weight: ' + newval + ' !important; }';
			pawfectInjectCSS(css, 'pawfect-blog-title-font-weight');
		});
	});

	// Blog Layout Style Live Preview
	wp.customize('pawfect_blog_layout_style', function(value) {
		value.bind(function(to) {
			// Force refresh for layout changes since structure changes significantly
			wp.customize.previewer.refresh();
		});
	});

	// Blog Card Style Live Preview
	wp.customize('pawfect_blog_card_style', function(value) {
		value.bind(function(to) {
			// Force refresh for card style changes
			wp.customize.previewer.refresh();
		});
	});

	// Blog Count - Responsive Range Live Preview
	wp.customize('pawfect_blog_count', function(value) {
		value.bind(function(to) {
			// Parse responsive values
			var values = {};
			try {
				values = JSON.parse(to);
			} catch (e) {
				// If not JSON, treat as single value
				values = {
					desktop: parseInt(to) || 6,
					tablet: parseInt(to) || 4,
					mobile: parseInt(to) || 3
				};
			}

			// For live preview, we'll need to refresh the blog section
			// since changing post count requires a new WP_Query
			wp.customize.previewer.refresh();
		});
	});

	// Blog Category Live Preview
	wp.customize('pawfect_theme_blog_category', function(value) {
		value.bind(function(to) {
			// Category changes require a refresh to load new posts
			wp.customize.previewer.refresh();
		});
	});
	// Primary Color Live Preview
	wp.customize('pawfect_primary_color', function(value) {
		value.bind(function(to) {
			document.documentElement.style.setProperty('--pawfect-primary', to);
			document.documentElement.style.setProperty('--pawfect-primary-color', to);
			document.documentElement.style.setProperty('--pawfect-accent', to);
		});
	});

	// Secondary Color Live Preview
	wp.customize('pawfect_secondary_color', function(value) {
		value.bind(function(to) {
			document.documentElement.style.setProperty('--pawfect-secondary', to);
		});
	});

	// Text Color Live Preview
	wp.customize('pawfect_text_color', function(value) {
		value.bind(function(to) {
			document.documentElement.style.setProperty('--pawfect-text', to);
			// Also update body color directly for immediate feedback
			$('body').css('color', to);
		});
	});

	// Background Color Live Preview
	wp.customize('pawfect_background_color', function(value) {
		value.bind(function(to) {
			document.documentElement.style.setProperty('--pawfect-background', to);
			$('body').css('background-color', to);
		});
	});

	// Instagram Gallery Live Preview
	wp.customize('pawfect_instagram_gallery_enabled', function(value) {
		value.bind(function(to) {
			// Instagram Gallery enable/disable requires refresh
			wp.customize.previewer.refresh();
		});
	});

	wp.customize('pawfect_instagram_gallery_title', function(value) {
		value.bind(function(to) {
			$('.pawfect-instagram-gallery h2, .pawfect-instagram-gallery .pawfect-section-title').text(to);
		});
	});

	wp.customize('pawfect_instagram_gallery_description', function(value) {
		value.bind(function(to) {
			$('.pawfect-instagram-gallery p, .pawfect-instagram-gallery .pawfect-section-description').text(to);
		});
	});

	// Blog Classic Minimal Style Live Preview
	wp.customize('pawfect_blog_classic_minimal_style', function(value) {
		value.bind(function(to) {
			var primaryColor = wp.customize('pawfect_primary_color').get();

			if (to) {
				// Apply minimal styles
				var minimalCSS = `
					.pawfect-blog-section .pawfect-blog-post {
						background: transparent !important;
						box-shadow: none !important;
						border: none !important;
						transition: none !important;
						overflow: visible !important;
						margin-bottom: 0 !important;
					}
					.pawfect-blog-section .pawfect-blog-post:hover {
						transform: translateY(-4px);
						transition: transform 0.3s ease;
					}
					.pawfect-blog-section .pawfect-blog-post:hover img {
						transform: scale(1.05);
						transition: transform 0.3s ease;
					}
					.pawfect-blog-section .pawfect-blog-post:hover .pawfect-post-featured-image img {
						transform: scale(1.05);
						transition: transform 0.3s ease;
					}
					.pawfect-blog-section .pawfect-blog-post .pawfect-post-featured-image {
						background: transparent !important;
						border: none !important;
						box-shadow: none !important;
						
					}
					.pawfect-blog-section .pawfect-blog-post .pawfect-aspect-\\[4\\/3\\] {
						background: transparent !important;
					}
					.pawfect-blog-section .pawfect-blog-post .pawfect-post-featured-image .pawfect-absolute {
						opacity: 0 !important;
						transform: scale(0.75) !important;
						transition: all 0.3s ease !important;
					}
					.pawfect-blog-section .pawfect-blog-post:hover .pawfect-post-featured-image .pawfect-absolute {
						opacity: 1 !important;
						transform: scale(1) !important;
						transition: all 0.3s ease !important;
					}
					.pawfect-blog-section .pawfect-blog-post .pawfect-post-featured-image .pawfect-absolute > div {
						background: rgba(255, 255, 255, 0.9) !important;
						backdrop-filter: blur(4px) !important;
						box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
					}
					.pawfect-blog-section .pawfect-blog-post:hover h2 a {
						color: ${primaryColor} !important;
						transition: color 0.3s ease;
					}
					.pawfect-blog-section .pawfect-blog-post:hover .pawfect-text-pawfect-primary:after {
						content: " →";
						opacity: 1;
						transform: translateX(4px);
						transition: all 0.3s ease;
					}
					.pawfect-blog-section .pawfect-blog-post .pawfect-text-pawfect-primary:after {
						content: "";
						opacity: 0;
						transform: translateX(0);
						transition: all 0.3s ease;
					}
				`;
				pawfectInjectCSS(minimalCSS, 'pawfect-blog-classic-minimal');
			} else {
				// Remove minimal styles
				pawfectInjectCSS('', 'pawfect-blog-classic-minimal');
			}
		});
	});


} )( jQuery );

