/* CV Preview Animation Styles */

/* Keyframe animation for fade in from below */
@keyframes slideUpFadeIn {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Initial state - all elements hidden and positioned below */
.cv-preview-wrapper .cv-preview-header,
.cv-preview-wrapper .cv-preview-element {
	opacity: 0;
	transform: translateY(30px);
	transition: none; /* Disable any existing transitions during animation */
}

/* Animation triggers - elements fade in with staggered delays */
.cv-preview-wrapper.animate .cv-preview-header {
	animation: slideUpFadeIn 0.6s ease-out 0.2s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(2) {
	animation: slideUpFadeIn 0.6s ease-out 0.6s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(3) {
	animation: slideUpFadeIn 0.6s ease-out 1s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(4) {
	animation: slideUpFadeIn 0.6s ease-out 1.4s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(5) {
	animation: slideUpFadeIn 0.6s ease-out 1.8s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(6) {
	animation: slideUpFadeIn 0.6s ease-out 2.2s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(7) {
	animation: slideUpFadeIn 0.6s ease-out 2.6s forwards;
}

.cv-preview-wrapper.animate .cv-preview-element:nth-child(8) {
	animation: slideUpFadeIn 0.6s ease-out 3s forwards;
}

/* Optional: Add a class to reset animations if needed */
.cv-preview-wrapper.reset-animation .cv-preview-header,
.cv-preview-wrapper.reset-animation .cv-preview-element {
	animation: none;
	opacity: 0;
	transform: translateY(30px);
}

/* Optional: Add a class for immediate show without animation */
.cv-preview-wrapper.show-immediately .cv-preview-header,
.cv-preview-wrapper.show-immediately .cv-preview-element {
	opacity: 1;
	transform: translateY(0);
	animation: none;
}

.animation-text-title {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 4px;
}

/* Skeleton Loader Styles */
.skeleton-loader {
  background: linear-gradient(90deg, #e0e0e0 25%, #eeeeee 50%, #e0e0e0 75%);
  background-size: 200% 100%;
  animation: skeleton-loading 1.5s infinite;
  border-radius: 4px;
  height: 1em;
  margin: 0.25em 0;
  display: block;
}
.skeleton-loader.rounded {
  border-radius: 8px;
}

.quickbuildbox-wrap.centered {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.skeleton-text {
    height: 1em;
    width: 75%;
}

.skeleton-text-multi {
    height: 3em;
    width: 100%;
}

.skeleton-text-big {
    height: 4em;
    width: 100%;
    margin: 0.5em 0;
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* CV Preview specific skeleton styles */
.cv-preview-name .skeleton-loader {
    height: 1.5em;
    width: 60%;
    margin: 0.5em 0;
}

.cv-preview-job .skeleton-loader {
    height: 1.2em;
    width: 50%;
    margin: 0.3em 0;
}

.cv-preview-description .skeleton-loader {
    height: 1em;
    width: 100%;
    margin: 0.3em 0;
}

.cv-preview-description .skeleton-loader:nth-child(2) {
    width: 85%;
}

.cv-preview-description .skeleton-loader:nth-child(3) {
    width: 70%;
}

.cv-preview-text .skeleton-loader {
    height: 1em;
    width: 80%;
    margin: 0.3em 0;
}

.cv-preview-list li .skeleton-loader {
    height: 1em;
    width: 90%;
    margin: 0.2em 0;
}

.cv-preview-list li .skeleton-loader:nth-child(2) {
    width: 70%;
}