/* Animex Elementor Addon Common Styles */

/* [Elite Performance v3.0]: Disable CSS transitions during JS animations */
.animex-motion-initialized,
.animex-motion-initialized * {
  transition: none !important;
}

.animex-motion-initialized {
  will-change: transform, opacity, filter;
  backface-visibility: hidden;
}

/* Advanced Heading */
.animex-advanced-heading {
  display: block;
}

.animex-advanced-heading .animex-heading-text {
  margin: 0;
  padding: 0;
  transition: all 0.3s ease;
}

/* Gradient Text Support */
.animex-heading-gradient {
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

/* Text Stroke Support */
.animex-heading-stroke {
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #000;
}

/* Text Icon Box */
.animex-text-icon-box {
  display: flex;
  flex-direction: column;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  box-sizing: border-box;
  overflow: hidden; /* Ensure background/border radius works well */
}

.animex-text-icon-box .animex-icon-wrapper {
  display: flex;
  align-items: center;
  transition: all 0.3s ease;
  min-height: 50px; /* Ensure visibility */
}

/* Editor Specific Visibility */
.elementor-editor-active .animex-text-icon-box .animex-icon-wrapper:empty {
  border: 1px dashed #6c5ce7;
  min-width: 50px;
}

.animex-text-icon-box .animex-icon-wrapper img {
  max-width: 100%;
  height: auto;
  display: block;
}

.animex-text-icon-box .animex-icon-wrapper i {
  font-size: 50px;
  color: #6c5ce7; /* Fallback Primary Color */
  display: inline-block;
  vertical-align: middle;
  transition: all 0.3s ease;
}

.animex-text-icon-box .animex-icon-wrapper svg {
  width: 50px;
  height: 50px;
  fill: #6c5ce7; /* Fallback Primary Color */
  display: inline-block;
  vertical-align: middle;
  transition: all 0.3s ease;
}

.animex-text-icon-box .animex-content-wrapper {
  text-align: inherit;
}

.animex-text-icon-box .animex-title {
  margin: 0;
  transition: all 0.3s ease;
}

.animex-text-icon-box .animex-description {
  margin: 0;
  line-height: 1.6;
}

/* Hover Animations */
.animex-hover-grow:hover {
  transform: scale(1.05);
}
.animex-hover-shrink:hover {
  transform: scale(0.95);
}

.animex-hover-pulse:hover {
  animation: animex-pulse 1s infinite alternate;
}
@keyframes animex-pulse {
  to {
    transform: scale(1.08);
  }
}

.animex-hover-float:hover {
  transform: translateY(-10px);
}
.animex-hover-sink:hover {
  transform: translateY(10px);
}

.animex-hover-bob:hover {
  animation: animex-bob 0.8s infinite alternate;
}
@keyframes animex-bob {
  to {
    transform: translateY(-10px);
  }
}

.animex-hover-hang:hover {
  animation: animex-hang 0.8s infinite alternate;
}
@keyframes animex-hang {
  to {
    transform: translateY(10px);
  }
}

/* Button Base */
/* Button Base */
.animex-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  cursor: pointer;
  padding: 12px 30px;
  border-radius: 4px;
  overflow: hidden;
}

.animex-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.animex-button-icon-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  line-height: 1;
}

.animex-button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 16px;
  transition: all 0.3s ease;
}

.animex-button-icon i,
.animex-button-icon svg {
  display: block;
  width: 1em;
  height: 1em;
}

.animex-icon-reveal .animex-button-icon-wrapper {
  opacity: 0;
  visibility: hidden;
  position: absolute;
}

/* Button Variants */
.animex-button-variant-primary .animex-button {
  background-color: #6c5ce7;
  color: #fff;
}

.animex-button-variant-primary .animex-button:hover {
  background-color: #5b4bc4;
}

.animex-button-variant-outline .animex-button {
  background: transparent !important;
  border: 2px solid #6c5ce7;
  color: #6c5ce7;
}

.animex-button-variant-outline .animex-button:hover {
  background: #6c5ce7 !important;
  color: #fff;
}

.animex-button-variant-glass .animex-button {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.1);
  color: #fff;
}

.animex-button-variant-glass .animex-button:hover {
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.animex-button-variant-gradient .animex-button {
  background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);
  color: #fff;
  border: none;
}

.animex-button-variant-gradient .animex-button:hover {
  background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
}

.animex-button-variant-3d .animex-button {
  background-color: #6c5ce7;
  color: #fff;
  box-shadow: 0 6px 0 #4834d4;
  position: relative;
  top: 0;
  transition: all 0.1s ease;
}

.animex-button-variant-3d .animex-button:hover {
  top: 2px;
  box-shadow: 0 4px 0 #4834d4;
}

.animex-button-variant-3d .animex-button:active {
  top: 6px;
  box-shadow: 0 0 0 #4834d4;
}

/* Animex Motion (Scroll Animations) */
.animex-motion-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Ensure editor content is visible even if animation states are applied */
.elementor-editor-active .animex-motion-hidden {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: all !important;
  animation: none !important;
  transition: none !important;
}

/* Animex Logo Icon for Elementor Panel */
.animex-logo-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url("../images/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  margin-right: 8px;
  position: relative;
  top: -1px;
}

/* Animex Logo Badge for Widget Icons */
.animex-badge {
  position: static !important;
}

.animex-badge:after {
  content: "";
  position: absolute !important;
  top: 5px !important;
  right: 5px !important;
  width: 14px;
  height: 14px;
  background-image: url("../images/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 100;
}

/* Smooth Scroll Structure */
#smooth-wrapper {
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  z-index: 1; /* Keep below admin bar (99999) */
  opacity: 0; /* Hide initially to prevent jumping */
  visibility: hidden;
  transition:
    opacity 0.5s ease,
    visibility 0.5s ease;
}

#smooth-wrapper.is-ready {
  opacity: 1;
  visibility: visible;
}

#smooth-content {
  overflow: visible;
  width: 100%;
  /* Fix margin collapsing at the top */
  padding-top: 0.1px;
}

/* WP Admin Bar Compatibility */
.admin-bar #smooth-wrapper {
  top: 32px !important;
}

@media screen and (max-width: 782px) {
  .admin-bar #smooth-wrapper {
    top: 46px !important;
  }
}

@media screen and (max-width: 600px) {
  #wpadminbar {
    position: fixed !important;
  }
}