<?php
/**
 * Modales B2C — préférences email, rétention, suppression compte.
 *
 * Variables attendues : $avi_s11_radar_plan, $avi_s11_guardian_active, $avi_s11_bundle
 *
 * @package Avision
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
?>

<!-- ═══ MODAL EMAIL PREFERENCES B2C ══════════════════════════════ -->
<div id="aviEmailPrefsModal"
	data-radar="<?php echo esc_attr( $avi_s11_radar_plan ); ?>"
	data-guardian="<?php echo esc_attr( (string) (int) $avi_s11_guardian_active ); ?>"
	data-bundle="<?php echo esc_attr( $avi_s11_bundle ?? '' ); ?>"
	style="display:none;position:fixed;inset:0;background:rgba(15,23,42,.6);
	z-index:10000;align-items:center;justify-content:center;padding:16px;"
	role="dialog" aria-modal="true" aria-labelledby="aviEmailPrefsTitle">
  <div style="background:#fff;border-radius:16px;padding:32px;max-width:500px;
			  width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25);max-height:90vh;
			  overflow-y:auto;">
	<div style="display:flex;justify-content:space-between;align-items:center;
				margin-bottom:24px;">
	  <h3 id="aviEmailPrefsTitle"
		  style="font-size:18px;font-weight:700;color:#0f172a;margin:0;">
		📧 Email preferences
	  </h3>
	  <button type="button" id="aviEmailPrefsClose"
			  style="background:none;border:none;font-size:20px;
					 color:#94a3b8;cursor:pointer;padding:4px;">✕</button>
	</div>
	<p style="font-size:14px;color:#64748b;margin:0 0 24px;">
	  Choose which emails you want to receive from Avision.
	</p>

	<div id="aviEmailPrefsList" style="display:flex;flex-direction:column;gap:0;">
	  <!-- Toggles générés par JS via aviLoadEmailPrefs() -->
	</div>

	<div style="display:flex;gap:10px;justify-content:flex-end;margin-top:24px;
				padding-top:20px;border-top:1px solid #f1f5f9;">
	  <button type="button" id="aviEmailPrefsCancel"
			  style="background:#f1f5f9;border:none;color:#374151;font-size:14px;
					 font-weight:600;padding:10px 20px;border-radius:8px;cursor:pointer;">
		Cancel
	  </button>
	  <button type="button" id="aviEmailPrefsSave"
			  style="background:#0f172a;border:none;color:#fff;font-size:14px;
					 font-weight:600;padding:10px 24px;border-radius:8px;cursor:pointer;">
		Save preferences
	  </button>
	</div>

	<div style="margin-top:24px;padding-top:20px;border-top:1px solid #f1f5f9;">
	  <button type="button" id="aviDeleteAccountBtn"
			  style="background:none;border:none;color:#ef4444;font-size:13px;
					 cursor:pointer;text-decoration:underline;padding:0;">
		Delete my account
	  </button>
	</div>
  </div>
</div>

<!-- ═══ MODAL RETENTION B2C ════════════════════════════════════════ -->
<div id="aviRetentionModal"
	 data-radar="<?php echo esc_attr( $avi_s11_radar_plan ); ?>"
	 data-guardian="<?php echo esc_attr( (string) (int) $avi_s11_guardian_active ); ?>"
	 data-bundle="<?php echo esc_attr( $avi_s11_bundle ?? '' ); ?>"
	 style="display:none;position:fixed;inset:0;background:rgba(15,23,42,.6);
			z-index:10001;align-items:center;justify-content:center;padding:16px;"
	 role="dialog" aria-modal="true">
  <div style="background:#fff;border-radius:16px;padding:32px;max-width:480px;
			  width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25);">
	<div style="text-align:center;margin-bottom:24px;">
	  <div style="font-size:40px;margin-bottom:12px;">🎁</div>
	  <h3 style="font-size:20px;font-weight:700;color:#0f172a;margin:0 0 8px;">
		Before you go — exclusive offer
	  </h3>
	  <p style="font-size:14px;color:#64748b;margin:0;">
		As a valued member, here's a special deal just for you.
	  </p>
	</div>

	<div id="aviRetentionOffers" style="display:flex;flex-direction:column;gap:10px;
		 margin-bottom:24px;">
	  <!-- Offres injectées dynamiquement par JS selon le plan -->
	</div>

	<div style="display:flex;flex-direction:column;gap:8px;">
	  <button type="button" id="aviRetentionAccept"
			  style="background:linear-gradient(135deg,#f59e0b,#d97706);border:none;
					 color:#0a0e1a;font-size:15px;font-weight:700;padding:13px 24px;
					 border-radius:10px;cursor:pointer;width:100%;">
		Accept this offer →
	  </button>
	  <button type="button" id="aviRetentionRefuse"
			  style="background:none;border:none;color:#94a3b8;font-size:13px;
					 cursor:pointer;padding:8px;text-decoration:underline;">
		No thanks, continue with deletion
	  </button>
	</div>
  </div>
</div>

<!-- ═══ MODAL SUPPRESSION COMPTE B2C ═══════════════════════════════ -->
<div id="aviDeleteModal"
	 style="display:none;position:fixed;inset:0;background:rgba(15,23,42,.6);
			z-index:10002;align-items:center;justify-content:center;padding:16px;"
	 role="dialog" aria-modal="true">
  <div style="background:#fff;border-radius:16px;padding:32px;max-width:480px;
			  width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25);">
	<h3 style="font-size:18px;font-weight:700;color:#0f172a;margin:0 0 8px;">
	  We're sorry to see you go
	</h3>
	<p style="font-size:14px;color:#64748b;margin:0 0 24px;">
	  Help us improve — 3 quick questions before we proceed.
	</p>

	<!-- Q1 -->
	<p style="font-size:14px;font-weight:600;color:#374151;margin:0 0 10px;">
	  1. Why are you leaving?
	</p>
	<div style="display:flex;flex-direction:column;gap:8px;margin-bottom:20px;">
	  <?php foreach ( array(
		'closed'      => 'My business closed',
		'alternative' => 'I found another solution',
		'expensive'   => 'Too expensive',
		'unexpected'  => 'Not what I expected',
		'no_results'  => 'Not seeing enough results',
		'other'       => 'Other',
	  ) as $val => $label ) : ?>
	  <label style="font-size:14px;color:#374151;display:flex;
					align-items:center;gap:8px;cursor:pointer;">
		<input type="radio" name="avi_del_reason" value="<?php echo esc_attr( $val ); ?>">
		<?php echo esc_html( $label ); ?>
	  </label>
	  <?php endforeach; ?>
	</div>

	<!-- Q2 -->
	<p style="font-size:14px;font-weight:600;color:#374151;margin:0 0 10px;">
	  2. What would have made you stay?
	</p>
	<div style="display:flex;flex-direction:column;gap:8px;margin-bottom:20px;">
	  <?php foreach ( array(
		'lower_price'    => 'A lower price',
		'more_features'  => 'More features',
		'better_results' => 'Better results',
		'better_support' => 'Better support',
		'wrong_fit'      => 'Nothing — wrong fit for me',
	  ) as $val => $label ) : ?>
	  <label style="font-size:14px;color:#374151;display:flex;
					align-items:center;gap:8px;cursor:pointer;">
		<input type="radio" name="avi_del_stay" value="<?php echo esc_attr( $val ); ?>">
		<?php echo esc_html( $label ); ?>
	  </label>
	  <?php endforeach; ?>
	</div>

	<!-- Q3 -->
	<p style="font-size:14px;font-weight:600;color:#374151;margin:0 0 10px;">
	  3. Overall rating
	</p>
	<div id="aviDelStars" style="display:flex;gap:8px;margin-bottom:24px;">
	  <?php for ( $i = 1; $i <= 5; $i++ ) : ?>
	  <button type="button" data-star="<?php echo esc_attr( (string) $i ); ?>"
			  style="font-size:28px;background:none;border:none;
					 cursor:pointer;padding:0;line-height:1;opacity:.3;">⭐</button>
	  <?php endfor; ?>
	</div>
	<input type="hidden" id="aviDelRating" value="">

	<div style="display:flex;gap:10px;justify-content:flex-end;">
	  <button type="button" id="aviDeleteCancel"
			  style="background:#f1f5f9;border:none;color:#374151;font-size:14px;
					 font-weight:600;padding:10px 20px;border-radius:8px;cursor:pointer;">
		Keep my account
	  </button>
	  <button type="button" id="aviDeleteConfirm"
			  style="background:#ef4444;border:none;color:#fff;font-size:14px;
					 font-weight:600;padding:10px 20px;border-radius:8px;
					 cursor:pointer;opacity:.4;" disabled>
		Delete my account
	  </button>
	</div>
  </div>
</div>
