/**
 * Rakmyat Advanced Heading Widget Styles
 * Styles for the advanced heading widget with animated text effects
 *
 * @package Rakmyat Core
 * @version 2.0.0
 */
/**
 * Rakmyat Core Global Variables
 * Optimized for 250+ widgets - Maximum 250 lines
 * Only essential, reusable variables for scalable widget development
 */
/* ========================================
   Base Styles
   ======================================== */
.rmt-advanced-heading-wrapper {
  display: block;
  position: relative;
  word-wrap: break-word;
  overflow-wrap: break-word;
  line-height: inherit;
}

.rmt-advanced-heading {
  margin: 0;
  padding: 0;
  display: block;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.rmt-advanced-heading br {
  display: block;
  content: "";
  height: 0;
  margin: 0;
  padding: 0;
  line-height: 0;
}

.rmt-standard-text {
  display: inline;
  position: relative;
  word-wrap: break-word;
  overflow-wrap: break-word;
  line-height: inherit;
  transition: color 0.3s ease;
}

.rmt-animated-text-wrapper {
  display: inline-block;
  position: relative;
  vertical-align: baseline;
  white-space: nowrap;
  min-height: 1em;
  line-height: inherit;
}

.rmt-animated-text {
  display: inline-block;
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, transform 0.3s ease, color 0.3s ease;
  line-height: inherit;
}
.rmt-animated-text.active {
  position: relative;
  opacity: 1;
  visibility: visible;
}

/* ========================================
   No Animation (Static Display with Full Styling)
   ======================================== */
.rmt-advanced-heading-wrapper[data-animation=none] .rmt-animated-text {
  position: relative;
  animation: none !important;
  transition: none !important;
}
.rmt-advanced-heading-wrapper[data-animation=none] .rmt-animated-text.active {
  opacity: 1;
  visibility: visible;
}
.rmt-advanced-heading-wrapper[data-animation=none] .rmt-animated-text:not(.active) {
  display: none;
}

/* ========================================
   Fade Animation
   ======================================== */
.rmt-advanced-heading-wrapper[data-animation=fade] .rmt-animated-text {
  transition: opacity 0.5s ease-in-out;
}
.rmt-advanced-heading-wrapper[data-animation=fade] .rmt-animated-text.active {
  animation: fadeIn 0.5s ease-in-out;
}
.rmt-advanced-heading-wrapper[data-animation=fade] .rmt-animated-text.fade-out {
  animation: fadeOut 0.5s ease-in-out;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* ========================================
   Slide Down Animation
   ======================================== */
.rmt-advanced-heading-wrapper[data-animation=slide-down] .rmt-animated-text {
  transform: translateY(-100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
}
.rmt-advanced-heading-wrapper[data-animation=slide-down] .rmt-animated-text.active {
  transform: translateY(0);
  animation: slideDown 0.5s ease-out;
}
.rmt-advanced-heading-wrapper[data-animation=slide-down] .rmt-animated-text.slide-out {
  animation: slideDownOut 0.5s ease-in;
}

@keyframes slideDown {
  0% {
    transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slideDownOut {
  0% {
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    transform: translateY(100%);
    opacity: 0;
  }
}
/* ========================================
   Rotate Animation
   ======================================== */
.rmt-advanced-heading-wrapper[data-animation=rotate] .rmt-animated-text {
  transform: rotateX(90deg);
  transform-origin: center;
  transition: transform 0.5s ease, opacity 0.5s ease;
}
.rmt-advanced-heading-wrapper[data-animation=rotate] .rmt-animated-text.active {
  transform: rotateX(0deg);
  animation: rotateIn 0.5s ease-out;
}
.rmt-advanced-heading-wrapper[data-animation=rotate] .rmt-animated-text.rotate-out {
  animation: rotateOut 0.5s ease-in;
}

@keyframes rotateIn {
  0% {
    transform: rotateX(90deg);
    opacity: 0;
  }
  100% {
    transform: rotateX(0deg);
    opacity: 1;
  }
}
@keyframes rotateOut {
  0% {
    transform: rotateX(0deg);
    opacity: 1;
  }
  100% {
    transform: rotateX(-90deg);
    opacity: 0;
  }
}
/* ========================================
   Clip Animation
   ======================================== */
.rmt-advanced-heading-wrapper[data-animation=clip] .rmt-animated-text {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease;
}
.rmt-advanced-heading-wrapper[data-animation=clip] .rmt-animated-text.active {
  clip-path: inset(0 0 0 0);
  animation: clipIn 0.7s ease-out;
}
.rmt-advanced-heading-wrapper[data-animation=clip] .rmt-animated-text.clip-out {
  animation: clipOut 0.5s ease-in;
}
[dir=rtl] .rmt-advanced-heading-wrapper[data-animation=clip] .rmt-animated-text {
  clip-path: inset(0 0 0 100%);
}
[dir=rtl] .rmt-advanced-heading-wrapper[data-animation=clip] .rmt-animated-text.active {
  clip-path: inset(0 0 0 0);
  animation: clipInRTL 0.7s ease-out;
}
[dir=rtl] .rmt-advanced-heading-wrapper[data-animation=clip] .rmt-animated-text.clip-out {
  animation: clipOutRTL 0.5s ease-in;
}

@keyframes clipIn {
  0% {
    clip-path: inset(0 100% 0 0);
    opacity: 0;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes clipOut {
  0% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 0 0 100%);
    opacity: 0;
  }
}
@keyframes clipInRTL {
  0% {
    clip-path: inset(0 0 0 100%);
    opacity: 0;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes clipOutRTL {
  0% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 100% 0 0);
    opacity: 0;
  }
}
/* ========================================
   Link Styles
   ======================================== */
.rmt-advanced-heading-wrapper a {
  text-decoration: none;
  color: inherit;
  display: inline-block;
}
.rmt-advanced-heading-wrapper a:hover {
  text-decoration: none;
}

/* ========================================
   Responsive Adjustments
   ======================================== */
@media (max-width: 768px) {
  .rmt-animated-text {
    font-size: inherit;
  }
}
/* ========================================
   Background Clip Support
   ======================================== */
.rmt-animated-text[style*=background-image],
.rmt-standard-text[style*=background-image] {
  -webkit-background-clip: text;
  -moz-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
  background-size: cover;
  background-position: center;
}

/* ========================================
   Text Gradient/Fill Support
   ======================================== */
.rmt-animated-text[style*=background-clip],
.rmt-standard-text[style*=background-clip] {
  -webkit-background-clip: text;
  -moz-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
  text-fill-color: transparent;
}

.rmt-animated-text[style*=-webkit-text-fill-color],
.rmt-standard-text[style*=-webkit-text-fill-color] {
  -webkit-background-clip: text;
  background-clip: text;
}

/* ========================================
   Accessibility
   ======================================== */
@media (prefers-reduced-motion: reduce) {
  .rmt-animated-text,
  .rmt-advanced-heading-wrapper[data-animation] .rmt-animated-text {
    animation: none !important;
    transition: none !important;
  }
  .rmt-animated-text.active {
    opacity: 1;
    visibility: visible;
    transform: none;
  }
}
/* ========================================
   Editor Specific Styles
   ======================================== */
.elementor-editor-active .rmt-advanced-heading-wrapper {
  display: block;
}
.elementor-editor-active .rmt-advanced-heading {
  display: block;
  min-height: 1em;
}
.elementor-editor-active .rmt-animated-text-wrapper {
  display: inline-block;
  min-height: 1em;
  position: relative;
}
.elementor-editor-active .rmt-animated-text {
  position: relative !important;
  opacity: 0.25 !important;
  visibility: visible !important;
  display: inline-block !important;
}
.elementor-editor-active .rmt-animated-text.active {
  opacity: 1 !important;
  z-index: 10;
}
.elementor-editor-active .rmt-animated-text:not(.active) {
  display: none !important;
}
.elementor-editor-active .rmt-standard-text {
  display: inline;
}

/*# sourceMappingURL=advanced-heading.css.map */
