/**
 * Typing Effect Styles
 */

/* Hide elements with typing effect until animation starts */
[data-typing-effect="true"] {
	visibility: hidden;
}

/* Show elements once typing animation has started */
[data-typing-effect="true"][data-typing-started="true"] {
	visibility: visible;
}

/* Ensure cursor visibility during typing (optional - can be customized) */
[data-typing-effect="true"][data-typing-started="true"]:not([data-typing-complete="true"])::after {
	content: '|';
	animation: blink 1s infinite;
	margin-left: 2px;
}

/* Blinking cursor animation */
@keyframes blink {
	0%, 50% {
		opacity: 1;
	}
	51%, 100% {
		opacity: 0;
	}
}

/* Remove cursor after typing is complete */
[data-typing-effect="true"][data-typing-complete="true"]::after {
	display: none;
}