/**
 * CDSWerx Shared Underline Engine
 *
 * Single source of truth for the animated-underline keyframes used by both the
 * CTA Button (single-line bar) and the TOC widget (multi-line, wrap-following
 * gradient). Widgets supply their own application rules but share these
 * keyframes so the motion stays in lockstep.
 *
 * - cds-animate-underline-from-left / -from-right : single-line "draw" redraw
 *   (used by the button ::after bar — scaleX based).
 * - cds-animate-underline-multiline / -multiline-thick : wrap-following draw for
 *   inline text spanning multiple lines (background-size based, used by TOC).
 *
 * @package CDSWerx_Widget_Library
 * @since   2.14.0
 */

@keyframes cds-animate-underline-from-left {
	0%   { transform: scaleX(1); transform-origin: right; }
	37%  { transform: scaleX(0); transform-origin: right; }
	38%  { transform: scaleX(0); transform-origin: left; }
	100% { transform: scaleX(1); transform-origin: left; }
}

@keyframes cds-animate-underline-from-right {
	0%   { transform: scaleX(1); transform-origin: left; }
	37%  { transform: scaleX(0); transform-origin: left; }
	38%  { transform: scaleX(0); transform-origin: right; }
	100% { transform: scaleX(1); transform-origin: right; }
}

@keyframes cds-animate-underline-multiline {
	0%   { background-size: 100% 87%; background-position-x: right; }
	38%  { background-size: 0% 87%;   background-position-x: right; }
	39%  { background-size: 0% 87%;   background-position-x: left; }
	100% { background-size: 100% 87%; background-position-x: left; }
}

@keyframes cds-animate-underline-multiline-thick {
	0%   { background-size: 100% 93%; background-position-x: right; }
	38%  { background-size: 0% 93%;   background-position-x: right; }
	39%  { background-size: 0% 93%;   background-position-x: left; }
	100% { background-size: 100% 93%; background-position-x: left; }
}

/* Thin variant: keeps a hairline thickness (via --cds-ul-thickness) instead of
   filling the line height — used for the TOC link draw-underline. The height is
   read from the animated element's custom property so it respects the widget's
   Thickness control. */
@keyframes cds-animate-underline-multiline-thin {
	0%   { background-size: 100% var(--cds-ul-thickness, 2px); background-position-x: right; }
	38%  { background-size: 0% var(--cds-ul-thickness, 2px);   background-position-x: right; }
	39%  { background-size: 0% var(--cds-ul-thickness, 2px);   background-position-x: left; }
	100% { background-size: 100% var(--cds-ul-thickness, 2px); background-position-x: left; }
}

/* ──────────────────────────────────────────────────────────────────────────
   Shared link/button underline reset — single source of truth.

   In CDSWerx widgets the underline is ALWAYS a pseudo-element (:after bar) or
   the wrap-following gradient — never `text-decoration`. The per-widget
   `text-decoration: none` bases are specificity (0,1,0), which theme link rules
   like `.elementor-widget-container a` (0,1,1) out-rank, so themes underline
   these labels even when the widget's underline control is Off. This !important
   reset makes the control the single source of truth for every CDSWerx
   label/link. It does NOT affect the :after / gradient underline features
   (not text-decoration), and deliberately EXCLUDES the intentional-underline
   cases (biolinks link-mode, calendar-link hover, section title-decoration) and
   line-through (pricing). Enqueued globally so it reaches every widget. */
.cdswerx-button-widget,
.cdswerx-button-widget:hover,
.cdswerx-button-widget:focus,
.cdswerx-button-widget:active,
.cdswerx-section__title-link,
.cdswerx-section__title-link:hover,
.cdswerx-section__title-link:focus,
.cdswerx-section__title-link:active,
.cdswerx-section__box-link,
.cdswerx-section__box-link:hover,
.cdswerx-section-title-link,
.cdswerx-section-title-link:hover,
.cdswerx-slider__button,
.cdswerx-slider__button:hover,
.cdswerx-banner__button,
.cdswerx-mask-button,
.cdswerx-mask-button__link,
.cdswerx-info-box__link,
.cdswerx-info-box__heading-link,
.cdswerx-info-images__title-link,
.cdswerx-info-images__title-link:hover,
.cdswerx-interactive-links__title-link,
.cdswerx-interactive-links__title-link:hover,
.cdswerx-interactive-links__item,
.cdswerx-interactive-links__button a,
.cdswerx-icon-box__link,
.cdswerx-biolinks__icon,
.cdswerx-biolinks__icon:hover,
.cdswerx-biolinks--links-button .cdswerx-biolinks__link,
.cdswerx-biolinks--links-button .cdswerx-biolinks__link:hover,
.cdswerx-submenu__link,
.cdswerx-toc__link,
.cdswerx-toc__link:hover,
.cdswerx-tabs__tab,
.cdswerx-svg__link,
.cdswerx-svg__link:hover,
.cdswerx-title-link,
.cdswerx-title-link:hover {
	text-decoration: none !important;
}
