PFE-7 update hoverstates

After updated UX Figma some changes had to be made

src/less/components/payex/links.less

@@ -1,25 +1,34 @@
 @import "../links.less";
 
 a {
+	color: var(--text-link);
 
 	&:hover {
-		color: @link-hover-color;
+		color: var(--text-hover);
 		text-decoration: none;
 	}
 
+	span {
+
+		&:hover {
+			color: var(--text-hover);
+			text-decoration: underline;
+		}
+	}
+
 	&:focus {
-		color: @brand-primary;
+		color: var(--brand-primary);
 	}
 
 	&.bright {
-		color: @payex-light-blue;
+		color: var(--payex-light-blue);
 
 		i {
-			color: @payex-light-blue;
+			color: var(--payex-light-blue);
 		}
 
 		&:focus-visible {
-			outline: 2px solid @white;
+			outline: 2px solid var(--white);
 			border-radius: 2px;
 		}
 	}
@@ -29,7 +38,7 @@ a {
 		&.bright {
 
 			span {
-				color: @payex-light-blue;
+				color: var(--payex-light-blue);
 
 				&:hover {
 					text-decoration: underline;
@@ -38,31 +47,27 @@ a {
 		}
 
 		&:hover {
-			color: @brand-primary;
-
-			span {
-				text-decoration: none;
-			}
+			color: var(--brand-primary);
 		}
 	}
 
 	&.action-link {
 		&:after {
-			color: @brand-secondary;
+			color: var(--brand-secondary);
 			content: "arrow_forward";
 			font-family: var(--payex-material-icons);
 			font-size: 1.5rem;
 			top: calc(50% - 1.5rem / 2);
 		}
 
 		&:hover {
-			color: @brand-secondary;
+			color: var(--brand-secondary);
 			text-decoration: none;
 		}
 
 		&.action-link-new-tab {
 			&:before {
-				background-color: @brand-primary;
+				background-color: var(--brand-primary);
 			}
 		}
 	}

src/less/variables-payex.less

@@ -196,6 +196,8 @@ body {
 	// text colors
 	--text-color: var(--brand-secondary);
 	--text-muted: color-mix(in srgb, var(--text-color), var(--white) 75%);
+	--text-link: #1C7D2E;
+	--text-hover: var(--brand-primary);
 
 	/* Checkbox */
 	--checkbox-checked-color: var(--brand-secondary, #3c3c3c);