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

(function ($) {
	// Site title and description.
	wp.customize('blogname', function (value) {
		value.bind(function (to) {
			$('.site-title a').text(to);
		});
	});
	wp.customize('blogdescription', function (value) {
		value.bind(function (to) {
			$('.site-description').text(to);
		});
	});
	// Header text color.
	wp.customize('header_textcolor', function (value) {
		value.bind(function (to) {
			if ('blank' === to) {
				$('.site-title, .site-description').css({
					'clip': 'rect(1px, 1px, 1px, 1px)',
					'position': 'absolute'
				});
			} else {
				$('.site-title, .site-description').css({
					'clip': 'auto',
					'position': 'relative'
				});
				$('.site-title a, .site-description').css({
					'color': to
				});
			}
		});
	});

	// Core Header BG Color (Old Setting)
	wp.customize('header_bg_color', function (value) {
		value.bind(function (to) {
			$('.site-header').css({
				'background-color': to
			});
		});
	});

	// ---------------------------------------------------------
	// New Global Settings (Live Preview via CSS Variables)
	// ---------------------------------------------------------

	function golpo_update_css_var(varName, val) {
		document.documentElement.style.setProperty(varName, val);
	}

	// Colors
	wp.customize('golpo_primary_color', function (value) {
		value.bind(function (to) {
			golpo_update_css_var('--golpo-primary-color', to);
			// Also update specific elements if they don't use the var yet for some reason
			// But our CSS strategy relies on vars
		});
	});

	wp.customize('golpo_secondary_color', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-secondary-color', to); });
	});

	wp.customize('golpo_text_color', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-text-color', to); });
	});

	wp.customize('golpo_link_color', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-link-color', to); });
	});

	wp.customize('golpo_link_hover_color', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-link-hover-color', to); });
	});

	// Color Scheme Switcher
	// Color Scheme Switcher
	// Color Scheme Switcher
	var palettes = {
		'default': { primary: '#0f172a', secondary: '#3b82f6', text: '#334155', link: '#3b82f6', link_hover: '#0f172a', btn_bg: '#3b82f6', btn_text: '#ffffff', btn_hover_bg: '#2563eb', btn_hover_text: '#ffffff' },
		'ocean': { primary: '#006994', secondary: '#00a8e8', text: '#333333', link: '#006994', link_hover: '#002a40', btn_bg: '#006994', btn_text: '#ffffff', btn_hover_bg: '#004e6e', btn_hover_text: '#ffffff' },
		'midnight': { primary: '#1a1a2e', secondary: '#16213e', text: '#e94560', link: '#16213e', link_hover: '#e94560', btn_bg: '#16213e', btn_text: '#ffffff', btn_hover_bg: '#e94560', btn_hover_text: '#ffffff' },
		'forest': { primary: '#2e4a33', secondary: '#7ea172', text: '#3a3a3a', link: '#2e4a33', link_hover: '#0c160e', btn_bg: '#2e4a33', btn_text: '#ffffff', btn_hover_bg: '#142518', btn_hover_text: '#ffffff' },
		'emerald': { primary: '#0F5132', secondary: '#198754', text: '#212529', link: '#0F5132', link_hover: '#052c1a', btn_bg: '#198754', btn_text: '#ffffff', btn_hover_bg: '#0F5132', btn_hover_text: '#ffffff' },
		'sunset': { primary: '#c0392b', secondary: '#e67e22', text: '#444444', link: '#c0392b', link_hover: '#7b241c', btn_bg: '#e67e22', btn_text: '#ffffff', btn_hover_bg: '#d35400', btn_hover_text: '#ffffff' },
		'coral': { primary: '#FF7F50', secondary: '#FF4500', text: '#2F4F4F', link: '#FF4500', link_hover: '#8b2500', btn_bg: '#FF7F50', btn_text: '#ffffff', btn_hover_bg: '#FF4500', btn_hover_text: '#ffffff' },
		'berry': { primary: '#8e44ad', secondary: '#d2b4de', text: '#555555', link: '#8e44ad', link_hover: '#4a235a', btn_bg: '#8e44ad', btn_text: '#ffffff', btn_hover_bg: '#6c3483', btn_hover_text: '#ffffff' },
		'rose': { primary: '#b76e79', secondary: '#d8a1a8', text: '#4a4a4a', link: '#b76e79', link_hover: '#754048', btn_bg: '#b76e79', btn_text: '#ffffff', btn_hover_bg: '#8f565e', btn_hover_text: '#ffffff' },
		'charcoal': { primary: '#36454F', secondary: '#D4AF37', text: '#1C1C1C', link: '#36454F', link_hover: '#000000', btn_bg: '#36454F', btn_text: '#D4AF37', btn_hover_bg: '#1C1C1C', btn_hover_text: '#D4AF37' },
		'slate': { primary: '#37474F', secondary: '#009688', text: '#263238', link: '#009688', link_hover: '#004d40', btn_bg: '#37474F', btn_text: '#ffffff', btn_hover_bg: '#263238', btn_hover_text: '#ffffff' },
		'coffee': { primary: '#6F4E37', secondary: '#A07855', text: '#3E2723', link: '#6F4E37', link_hover: '#3e2723', btn_bg: '#6F4E37', btn_text: '#ffffff', btn_hover_bg: '#3e2723', btn_hover_text: '#ffffff' },
		'royal': { primary: '#2c3e50', secondary: '#f1c40f', text: '#2c3e50', link: '#faa61a', link_hover: '#ffffff', btn_bg: '#2c3e50', btn_text: '#f1c40f', btn_hover_bg: '#f1c40f', btn_hover_text: '#2c3e50' },
		'lavender': { primary: '#9575CD', secondary: '#B39DDB', text: '#512DA8', link: '#673AB7', link_hover: '#311b92', btn_bg: '#9575CD', btn_text: '#ffffff', btn_hover_bg: '#5e35b1', btn_hover_text: '#ffffff' },
		'mint': { primary: '#20B2AA', secondary: '#66CDAA', text: '#006400', link: '#20B2AA', link_hover: '#004d40', btn_bg: '#20B2AA', btn_text: '#ffffff', btn_hover_bg: '#008b8b', btn_hover_text: '#ffffff' },
	};

	wp.customize('golpo_color_scheme', function (value) {
		value.bind(function (to) {
			if (to !== 'custom' && palettes[to]) {
				var p = palettes[to];
				golpo_update_css_var('--golpo-primary-color', p.primary);
				golpo_update_css_var('--golpo-secondary-color', p.secondary);
				golpo_update_css_var('--golpo-text-color', p.text);
				golpo_update_css_var('--golpo-link-color', p.link);
				golpo_update_css_var('--golpo-link-hover-color', p.link_hover);
				golpo_update_css_var('--golpo-btn-bg-color', p.btn_bg);
				golpo_update_css_var('--golpo-btn-text-color', p.btn_text);
				golpo_update_css_var('--golpo-btn-hover-bg-color', p.btn_hover_bg);
				golpo_update_css_var('--golpo-btn-hover-text-color', p.btn_hover_text);
			}
		});
	});

	// Buttons
	wp.customize('golpo_btn_bg_color', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-btn-bg-color', to); });
	});

	wp.customize('golpo_btn_text_color', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-btn-text-color', to); });
	});

	wp.customize('golpo_btn_radius', function (value) {
		value.bind(function (to) {
			golpo_update_css_var('--golpo-btn-radius', to + 'px');
		});
	});

	// Typography
	wp.customize('golpo_body_font_size', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-body-font-size', to + 'px'); });
	});

	wp.customize('golpo_site_title_font_size', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-site-title-font-size', to + 'px'); });
	});

	for (let i = 1; i <= 6; i++) {
		wp.customize('golpo_h' + i + '_font_size', function (value) {
			value.bind(function (to) { golpo_update_css_var('--golpo-h' + i + '-font-size', to + 'px'); });
		});
	}

	// Sidebar
	wp.customize('golpo_sidebar_heading_font_size', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-sidebar-heading-size', to + 'px'); });
	});

	wp.customize('golpo_sidebar_link_font_size', function (value) {
		value.bind(function (to) { golpo_update_css_var('--golpo-sidebar-link-size', to + 'px'); });
	});

})(jQuery);
