/**
 * Styles pour le système de données
 * Generated by Copilot
 */

/* Indicateurs visuels discrets pour les éléments avec données (uniquement en mode développement) */
body.data-debug .data-click,
body.data-debug .data-cta,
body.data-debug .data-secondary,
body.data-debug .data-download,
body.data-debug .data-phone,
body.data-debug .data-email,
body.data-debug .data-social,
body.data-debug .data-form,
body.data-debug .btn-cta,
body.data-debug .cta-button,
body.data-debug .btn-secondary,
body.data-debug .btn-download,
body.data-debug a[href^="tel:"],
body.data-debug a[href^="mailto:"],
body.data-debug a[href*=".pdf"],
body.data-debug a[href*=".zip"],
body.data-debug a[href*=".doc"],
body.data-debug a[href*="facebook.com"],
body.data-debug a[href*="twitter.com"],
body.data-debug a[href*="linkedin.com"],
body.data-debug a[href*="instagram.com"],
body.data-debug form[data-data] {
	position: relative;
}

body.data-debug .data-click::after,
body.data-debug .data-cta::after,
body.data-debug .data-secondary::after,
body.data-debug .data-download::after,
body.data-debug .data-phone::after,
body.data-debug .data-email::after,
body.data-debug .data-social::after,
body.data-debug .data-form::after,
body.data-debug .btn-cta::after,
body.data-debug .cta-button::after,
body.data-debug .btn-secondary::after,
body.data-debug .btn-download::after,
body.data-debug a[href^="tel:"]::after,
body.data-debug a[href^="mailto:"]::after,
body.data-debug a[href*=".pdf"]::after,
body.data-debug a[href*=".zip"]::after,
body.data-debug a[href*=".doc"]::after,
body.data-debug a[href*="facebook.com"]::after,
body.data-debug a[href*="twitter.com"]::after,
body.data-debug a[href*="linkedin.com"]::after,
body.data-debug a[href*="instagram.com"]::after,
body.data-debug form[data-data]::after {
	font-size: 12px;

	position: absolute;
	z-index: 9999;
	top: -8px;
	right: -8px;

	content: "📊";

	opacity: 0.7;
}

/* Différentes couleurs pour différents types de données */
body.data-debug .data-cta::after,
body.data-debug .btn-cta::after,
body.data-debug .cta-button::after {
	content: "🎯";
}

body.data-debug .data-secondary::after,
body.data-debug .btn-secondary::after {
	content: "⚪";
}

body.data-debug .data-phone::after,
body.data-debug a[href^="tel:"]::after {
	content: "📞";
}

body.data-debug .data-email::after,
body.data-debug a[href^="mailto:"]::after {
	content: "📧";
}

body.data-debug .data-download::after,
body.data-debug .btn-download::after,
body.data-debug a[href*=".pdf"]::after,
body.data-debug a[href*=".zip"]::after,
body.data-debug a[href*=".doc"]::after {
	content: "📥";
}

body.data-debug .data-social::after,
body.data-debug a[href*="facebook.com"]::after,
body.data-debug a[href*="twitter.com"]::after,
body.data-debug a[href*="linkedin.com"]::after,
body.data-debug a[href*="instagram.com"]::after {
	content: "👥";
}

body.data-debug .data-form::after,
body.data-debug form[data-data]::after {
	content: "📝";
}

/* Indicateurs spéciaux pour les éléments dans un bloc CTA */
body.data-debug .cta-block .data-phone::after,
body.data-debug .cta-section .data-phone::after,
body.data-debug .hero-cta .data-phone::after,
body.data-debug .call-to-action .data-phone::after,
body.data-debug [class*="cta"] .data-phone::after,
body.data-debug .cta-block a[href^="tel:"]::after,
body.data-debug .cta-section a[href^="tel:"]::after,
body.data-debug .hero-cta a[href^="tel:"]::after,
body.data-debug .call-to-action a[href^="tel:"]::after,
body.data-debug [class*="cta"] a[href^="tel:"]::after {
	padding: 2px 4px;

	content: "📞🎯";

	border-radius: 3px;
	background: rgba(255, 193, 7, 0.2);
}

body.data-debug .cta-block .data-email::after,
body.data-debug .cta-section .data-email::after,
body.data-debug .hero-cta .data-email::after,
body.data-debug .call-to-action .data-email::after,
body.data-debug [class*="cta"] .data-email::after,
body.data-debug .cta-block a[href^="mailto:"]::after,
body.data-debug .cta-section a[href^="mailto:"]::after,
body.data-debug .hero-cta a[href^="mailto:"]::after,
body.data-debug .call-to-action a[href^="mailto:"]::after,
body.data-debug [class*="cta"] a[href^="mailto:"]::after {
	padding: 2px 4px;

	content: "📧🎯";

	border-radius: 3px;
	background: rgba(0, 123, 255, 0.2);
}

body.data-debug .cta-block .data-cta::after,
body.data-debug .cta-section .data-cta::after,
body.data-debug .hero-cta .data-cta::after,
body.data-debug .call-to-action .data-cta::after,
body.data-debug [class*="cta"] .data-cta::after,
body.data-debug .cta-block .btn-cta::after,
body.data-debug .cta-section .btn-cta::after,
body.data-debug .hero-cta .btn-cta::after,
body.data-debug .call-to-action .btn-cta::after,
body.data-debug [class*="cta"] .btn-cta::after,
body.data-debug .cta-block .cta-button::after,
body.data-debug .cta-section .cta-button::after,
body.data-debug .hero-cta .cta-button::after,
body.data-debug .call-to-action .cta-button::after,
body.data-debug [class*="cta"] .cta-button::after {
	padding: 2px 4px;

	content: "🎯🔥";

	border-radius: 3px;
	background: rgba(220, 53, 69, 0.2);
}

body.data-debug .cta-block .data-download::after,
body.data-debug .cta-section .data-download::after,
body.data-debug .hero-cta .data-download::after,
body.data-debug .call-to-action .data-download::after,
body.data-debug [class*="cta"] .data-download::after,
body.data-debug .cta-block .btn-download::after,
body.data-debug .cta-section .btn-download::after,
body.data-debug .hero-cta .btn-download::after,
body.data-debug .call-to-action .btn-download::after,
body.data-debug [class*="cta"] .btn-download::after,
body.data-debug .cta-block a[href*=".pdf"]::after,
body.data-debug .cta-section a[href*=".pdf"]::after,
body.data-debug .hero-cta a[href*=".pdf"]::after,
body.data-debug .call-to-action a[href*=".pdf"]::after,
body.data-debug [class*="cta"] a[href*=".pdf"]::after,
body.data-debug .cta-block a[href*=".zip"]::after,
body.data-debug .cta-section a[href*=".zip"]::after,
body.data-debug .hero-cta a[href*=".zip"]::after,
body.data-debug .call-to-action a[href*=".zip"]::after,
body.data-debug [class*="cta"] a[href*=".zip"]::after,
body.data-debug .cta-block a[href*=".doc"]::after,
body.data-debug .cta-section a[href*=".doc"]::after,
body.data-debug .hero-cta a[href*=".doc"]::after,
body.data-debug .call-to-action a[href*=".doc"]::after,
body.data-debug [class*="cta"] a[href*=".doc"]::after {
	padding: 2px 4px;

	content: "📥🎯";

	border-radius: 3px;
	background: rgba(40, 167, 69, 0.2);
}
