/**
 * Shared Title Link & Underline Styles
 *
 * Applied via the .cdswerx-title-link class used by Link_Mode_Trait.
 * Works across Section, Banner, Icon Box, Info Box, and any future widget
 * that adopts the trait.
 *
 * @since 2.16.0
 */

/* Base Title Link */
.cdswerx-title-link {
    display: inline-block;
    text-decoration: none;
    color: inherit;
    position: relative;
    transition: color 0.25s ease-in-out;
}
.cdswerx-title-link:hover {
    text-decoration: none;
}

/* Underline pseudo-element (shared base) */
.cdswerx-title-link.cdswerx-title-link--underline:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: currentColor;
    transition: width 0.25s ease-in-out, background-color 0.25s ease-in-out;
}

/* Underline alignment: right */
.cdswerx-title-link.cdswerx-title-link--right:after {
    left: auto;
    right: 0;
}

/* Underline alignment: center */
.cdswerx-title-link.cdswerx-title-link--center:after {
    left: 50%;
    transform: translateX(-50%);
}

/* Draw animation: left-to-right */
.cdswerx-title-link.cdswerx-title-link--draw.cdswerx-title-link--left:after {
    width: 0;
}
.cdswerx-title-link.cdswerx-title-link--draw.cdswerx-title-link--left:hover:after {
    width: 100%;
}

/* Draw animation: right-to-left */
.cdswerx-title-link.cdswerx-title-link--draw.cdswerx-title-link--right:after {
    width: 0;
}
.cdswerx-title-link.cdswerx-title-link--draw.cdswerx-title-link--right:hover:after {
    width: 100%;
}