.btn.btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--base-ultra-dark);
	border-radius: 50vmax;
	padding: 13px 20px;
	text-align: center;
	text-transform: uppercase;
	font-weight: 500;
	font-family: Space Grotesk;
	line-height:1;
}

.btn img {
	max-height: 20px;
	pointer-events: none;
	width:auto;
	max-width:30px;
}

.btn--base {
	background-color: var(--base);
	transition: 0.2s ease-out;
	font-weight: 500;
}
@media screen and (min-width: 1026px) {
	.btn--base:hover {
		background: var(--base-light);
	}
}
.btn--primary {
	background-color: var(--primary);
	text-transform: unset !important;
	font-weight: 500;
}

.btn--secondary {
	background-color: var(--secondary);
	font-weight: 500;
}
.btn--ghost {
	border: 1px solid var(--base-ultra-dark);
	transition: 0.2s ease-out;
	font-weight: 500;
}
@media screen and (min-width: 1026px) {
	.btn--ghost.btn--ghost.btn--ghost:hover {
		color: var(--base-ultra-dark);
		background: white;
	}
}

.link-primary {
	display: inline-flex;
	width: 100%;
	justify-content: space-between;
	color: var(--base-ultra-dark);
	font-weight: 600;
	margin: 25px 0;
	font-family: Space Grotesk;
}

.link-primary .img-wrapper {
	background: var(--base-light);
	border-radius: 2px;
	padding: 4px;
	transition: 0.2s ease-out;
}

.link-primary + .link-primary {
	margin-top: 0;
}
.link-primary:has(+ .link-primary) {
	margin-bottom: 25px;
}

@media screen and (min-width: 1026px) {
	.link-primary:is(:hover, :focus-visible) {
		text-decoration: underline;
	}

	.link-primary:is(:hover, :focus-visible) .img-wrapper {
		background: var(--base);
	}

	/* Hide button on desktop when dolj_pa_dator is true */
	.btn-wrapper--hide-desktop {
		display: none;
	}
}