<?php
/**
 * @license GPL-2.0-or-later
 */
defined( 'ABSPATH' ) || exit;
?>
<div class="volade-wrap volade-premium-page">
	<?php
	$tier       = $this->get_tier( $user['id'] );
	$is_premium = $this->is_premium( $user['id'] );
	$site_limit = $this->get_site_limit( $user['id'] );
	$sites_used = $this->get_active_sites_count( $user['id'] );
	$all_tiers  = $this->get_all_tiers();

	$hero_kicker  = __( 'Formules', 'core-version-switcher-by-volade' );
	$hero_title   = __( 'V+ Premium', 'core-version-switcher-by-volade' );
	$hero_lead    = $is_premium
		? __( 'Premium actif sur tout l\'écosystème Volade — fonctionnalités avancées dans chaque plugin.', 'core-version-switcher-by-volade' )
		: __( 'Débloquez toutes les fonctionnalités premium sur l\'ensemble des plugins Volade, sans module payant par extension.', 'core-version-switcher-by-volade' );
	$hero_variant = 'indigo';
	$hero_orbs    = array( '⭐', '✨', '🚀' );

	ob_start();
	if ( $is_premium && $this->get_portal_url() ) :
		?>
		<a href="<?php echo esc_url( $this->get_portal_url() ); ?>" class="volade-btn volade-btn-secondary" target="_blank" rel="noopener">
			<?php $this->_e( 'Gérer mon abonnement' ); ?>
		</a>
		<?php
	elseif ( ! $is_premium ) :
		?>
		<a href="#volade-tier-cards" class="volade-btn volade-btn-primary">
			<?php $this->_e( 'Voir les offres' ); ?>
		</a>
		<?php
	endif;
	$hero_actions_html = ob_get_clean();
	require __DIR__ . '/partials/page-hero.php';
	?>

	<div class="volade-plan-banner">
		<div>
			<h3>
				<?php if ( $is_premium ) : ?>
					&#x2B50; <?php echo esc_html( $this->get_tier_label( $tier ) ); ?>
				<?php else : ?>
					&#x26A1; <?php $this->_e( 'Formule gratuite' ); ?>
				<?php endif; ?>
			</h3>
			<p>
				<?php echo (int) $sites_used; ?> / <?php echo $site_limit === -1 ? '&#x221E;' : (int) $site_limit; ?> <?php $this->_e( 'sites utilisés' ); ?>
				<?php if ( $is_premium && $this->get_portal_url() ) : ?>
					&mdash; <a href="<?php echo esc_url( $this->get_portal_url() ); ?>"><?php $this->_e( 'Gérer' ); ?></a>
				<?php endif; ?>
			</p>
		</div>
		<?php if ( ! $is_premium ) : ?>
			<span class="volade-plan-pill">
				<?php $this->_e( 'Premium = toutes les fonctionnalités + premium sur tout l\'écosystème' ); ?>
			</span>
		<?php endif; ?>
	</div>

	<div class="volade-billing-toggle">
		<button type="button" class="volade-billing-btn active" data-period="monthly"><?php $this->_e( 'Mensuel' ); ?></button>
		<button type="button" class="volade-billing-btn" data-period="yearly"><?php $this->_e( 'Annuel' ); ?> <span class="volade-billing-save"><?php $this->_e( '2 mois offerts' ); ?></span></button>
	</div>

	<div class="volade-tier-cards" id="volade-tier-cards">
		<?php foreach ( $all_tiers as $key => $t ) : ?>
			<?php
			if ( $key === 'free' ) {
				continue;}
			?>
			<div class="volade-tier-card <?php echo $tier === $key ? 'volade-tier-current' : ''; ?>" data-tier="<?php echo esc_attr( $key ); ?>">
				<h3><?php echo esc_html( $this->get_tier_label( $key ) ); ?></h3>
				<div class="volade-tier-price">
					<span class="price-amount" data-monthly="<?php echo esc_attr( $this->get_tier_price_display( $key, 'monthly' ) ); ?>" data-yearly="<?php echo esc_attr( $this->get_tier_price_display( $key, 'yearly' ) ); ?>">
						<?php echo esc_html( $this->get_tier_price_display( $key, 'monthly' ) ); ?>
					</span>
					<span class="price-period"><?php esc_html_e( '/mois', 'core-version-switcher-by-volade' ); ?></span>
				</div>
				<ul class="volade-tier-features">
					<li><?php echo $t['site_limit'] === -1 ? '&#x221E;' : (int) $t['site_limit']; ?> <?php $this->_e( 'sites WordPress' ); ?></li>
					<li><?php $this->_e( 'Fonctionnalités premium dans chaque plugin Volade' ); ?></li>
					<li><?php $this->_e( 'Premium débloqué sur tout l\'écosystème' ); ?></li>
					<li><?php $this->_e( 'Pas de modules payants par plugin' ); ?></li>
				</ul>
				<?php if ( $tier !== $key ) : ?>
					<button class="volade-tier-cta primary volade-checkout-btn" data-tier="<?php echo esc_attr( $key ); ?>" data-label="<?php echo esc_attr__( 'Passer à V+', 'core-version-switcher-by-volade' ); ?>">&#x2B50; <?php $this->_e( 'Passer à V+' ); ?></button>
				<?php else : ?>
					<span class="volade-tier-cta secondary" style="display:block;text-align:center;"><?php $this->_e( 'Formule actuelle' ); ?></span>
				<?php endif; ?>
			</div>
		<?php endforeach; ?>
	</div>
</div>

<script>
jQuery(function($) {
	var period = 'monthly';
	var i18n = (window.voladeSDK && voladeSDK.i18n) || {};

	$('.volade-billing-btn').on('click', function() {
		period = $(this).data('period');
		$('.volade-billing-btn').removeClass('active');
		$(this).addClass('active');
		$('.price-amount').each(function() {
			var val = $(this).data(period);
			$(this).text(val);
		});
		$('.price-period').text(period === 'yearly' ? '/an' : '/mois');
	});

	$('.volade-checkout-btn').on('click', function() {
		var tier = $(this).data('tier');
		var label = $(this).data('label') || 'Passer à V+';
		var btn = $(this).prop('disabled', true).text(i18n.processing || 'Processing…');
		$.post(voladeSDK.ajax_url, {
			action: 'volade_checkout',
			nonce: voladeSDK.nonce,
			tier: tier,
			period: period
		}, function(res) {
			if (res.success && res.data.url) {
				window.location.href = res.data.url;
			} else {
				alert(res.data || i18n.error_generic || 'An error occurred.');
				btn.prop('disabled', false).html('&#x2B50; ' + label);
			}
		});
	});
});
</script>
