@import "../links.less";

a {
	color: var(--text-link);

	&:hover {
		color: var(--text-hover);
		text-decoration: none;
	}

	span {
		&:hover {
			color: var(--text-hover);
			text-decoration: underline;
		}
	}

	&:focus {
		color: var(--brand-primary);
	}

	&.bright {
		color: var(--payex-light-blue);

		i {
			color: var(--payex-light-blue);
		}

		&:focus-visible {
			outline: 2px solid var(--white);
			border-radius: 2px;
		}
	}

	&.icon-link {
		&.bright {
			span {
				color: var(--payex-light-blue);

				&:hover {
					text-decoration: underline;
				}
			}
		}

		&:hover {
			color: var(--brand-primary);
		}
	}

	&.action-link {
		&:hover {
			color: var(--brand-secondary);
			text-decoration: none;
		}

		&.action-link-new-tab {
			&:before {
				background-color: var(--brand-primary);
			}
		}
	}
}