/**
 * GhostBuster Shortcode Styles
 * Minimal CSS - relies on theme's Tailwind for base styling
 * Only contains state-based styles for JS interaction
 */

/* Result visibility - controlled by JS */
.ghostbuster-demo-result:not(.visible) {
    display: none;
}

.ghostbuster-demo-result.visible {
    display: block;
}

/* Result state backgrounds - uses theme's CSS custom properties */
.ghostbuster-demo-result.no-changes {
    background-color: var(--color-muted, #F7FAFC);
    border-color: var(--color-secondary, #4ECDC4);
}

.ghostbuster-demo-result.has-changes {
    background-color: var(--color-background, #FFFFFF);
    border-color: var(--color-accent, #FFE66D);
}