/* A/B Testing Styles for Proofiled */
/* ================================= */

/* Variant-specific styling utilities */
[data-variant-version="variant-a"] {
  --variant-accent: #10b981; /* emerald-500 */
}

[data-variant-version="variant-b"] {
  --variant-accent: #f59e0b; /* amber-500 */
}

/* Variant highlight classes for debugging */
.ab-test-debug [data-variant] {
  outline: 2px dashed rgba(99, 102, 241, 0.5);
  outline-offset: 2px;
}

.ab-test-debug [data-variant-version="variant-a"] {
  outline-color: rgba(16, 185, 129, 0.7);
}

.ab-test-debug [data-variant-version="variant-b"] {
  outline-color: rgba(245, 158, 11, 0.7);
}

/* Smooth transitions for variant changes */
[data-variant] {
  transition: color 0.3s ease, background-color 0.3s ease;
}

/* Hide elements during variant loading to prevent flash */
.ab-loading [data-variant] {
  opacity: 0;
}

.ab-loaded [data-variant] {
  opacity: 1;
  transition: opacity 0.2s ease;
}