.sliding-underline { position: relative; text-decoration: none !important; } .sliding-underline::after { content: ''; position: absolute; width: 0; height: 2px; bottom: -2px; left: 0; background-color: currentColor; transition: width 0.3s ease; opacity: 0.8; pointer-events: none; } .sliding-underline:hover::after, .sliding-underline:focus::after { width: 100%; }  .sliding-underline.active::after { width: 100%; }  .sliding-underline.light::after { background-color: rgba(255, 255, 255, 0.8); }  .sliding-underline.dark::after { background-color: rgba(0, 0, 0, 0.7); }