/* Kontrastmodus. Wirkt nur mit der Klasse wak-contrast am html-Element. */

.wak-contrast-toggle {
	position: fixed;
	z-index: 9990;
	left: 12px;
	bottom: 12px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 7px 14px 7px 8px;
	border: 1px solid rgba(44, 57, 87, 0.22);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.94);
	color: var(--darkblue);
	box-shadow: 0 4px 12px rgba(44, 57, 87, 0.1);
	font-family: "Barlow", Arial, Helvetica, sans-serif;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
}
.wak-contrast-toggle:hover,
.wak-contrast-toggle:focus {
	color: var(--darkblue);
	border-color: var(--darkblue);
	text-decoration: none;
}
.wak-contrast-toggle:focus {
	outline: none;
}
.wak-contrast-toggle:focus-visible {
	outline: 2px solid var(--darkblue);
	outline-offset: 3px;
}
.wak-contrast-toggle__switch {
	position: relative;
	flex: 0 0 34px;
	width: 34px;
	height: 18px;
	border-radius: 999px;
	background: #e2e3e3;
}
.wak-contrast-toggle__switch::after {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--white);
	box-shadow: 0 1px 2px rgba(44, 57, 87, 0.28);
	transition: transform 0.2s ease;
}
html.wak-contrast .wak-contrast-toggle {
	background: var(--darkblue);
	color: var(--white);
	border-color: var(--darkblue);
}
html.wak-contrast .wak-contrast-toggle:hover,
html.wak-contrast .wak-contrast-toggle:focus {
	color: var(--white);
}
html.wak-contrast .wak-contrast-toggle:focus-visible {
	outline-color: var(--white);
}
html.wak-contrast .wak-contrast-toggle__switch {
	background: #00adf8;
}
html.wak-contrast .wak-contrast-toggle__switch::after {
	transform: translateX(16px);
}

@media (max-width: 767px) {
	.wak-contrast-toggle {
		left: 10px;
		bottom: 10px;
	}
}

@media print {
	.wak-contrast-toggle {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wak-contrast-toggle__switch::after {
		transition: none;
	}
}

html.wak-contrast {
	--lightblue: var(--darkblue);
}

html.wak-contrast #footercontainer,
html.wak-contrast #footer,
html.wak-contrast #menu,
html.wak-contrast #menu-toggle,
html.wak-contrast #sidebar,
html.wak-contrast .wak-home-login__actions,
html.wak-contrast .wak-columns.wak-eservice-blue-icon-box,
html.wak-contrast .frame-layout-14,
html.wak-contrast .wak-columns.anker-idaustria {
	--lightblue: #fff;
}

html.wak-contrast .wak-skip a:hover,
html.wak-contrast .wak-skip a:focus {
	background: var(--white);
	color: var(--darkblue) !important;
	outline-color: var(--darkblue);
}
html.wak-contrast #klara-box h3,
html.wak-contrast .klara-link,
html.wak-contrast .klara-link:hover,
html.wak-contrast .klara-link:focus,
html.wak-contrast .tuerkis,
html.wak-contrast .kontakt a:link,
html.wak-contrast .kontakt a:visited,
html.wak-contrast .kontakt a:hover,
html.wak-contrast .kontakt a:active,
html.wak-contrast .step-title,
html.wak-contrast .wak-job-subtitle {
	color: var(--darkblue);
}

html.wak-contrast .tuerkis_hg,
html.wak-contrast .absenden {
	background-color: var(--darkblue);
	color: var(--white);
}

html.wak-contrast .anker-idaustria .button-style a,
html.wak-contrast .wak-eservice-blue-icon-box .button-style a,
html.wak-contrast .frame-layout-14 .button-style a {
	color: var(--darkblue) !important;
}

html.wak-contrast .wak-schritte-nav__dot.is-active {
	box-shadow: inset 0 0 0 6px var(--white);
}

html.wak-contrast #sidebar .teaser-item::after,
html.wak-contrast #sidebar .teaser-item:hover::after,
html.wak-contrast #sidebar .teaser-item:focus::after,
html.wak-contrast .wak-home-login__arrow,
html.wak-contrast .wak-home-login__action:hover .wak-home-login__arrow,
html.wak-contrast .wak-home-login__action:focus .wak-home-login__arrow,
html.wak-contrast #menu ul li ul li a:before,
html.wak-contrast #footer .footer-phone-link::before {
	background-color: #fff;
	background-image: none;
}

html.wak-contrast #sidebar .teaser-item::after,
html.wak-contrast .wak-home-login__arrow {
	-webkit-mask: url("../img/login-arrow-right.png") no-repeat center / contain;
	mask: url("../img/login-arrow-right.png") no-repeat center / contain;
}

html.wak-contrast #menu ul li ul li a:before,
html.wak-contrast #colmiddle .frame-type-text ul li:before,
html.wak-contrast #colmiddle .ce-textpic .ce-bodytext-inner ul li:before,
html.wak-contrast .fancybox-inner .frame-type-text ul li:before {
	-webkit-mask: url("../img/icon-submenu.png") no-repeat left center / contain;
	mask: url("../img/icon-submenu.png") no-repeat left center / contain;
}

html.wak-contrast #colmiddle .frame-type-text ul li:before,
html.wak-contrast #colmiddle .ce-textpic .ce-bodytext-inner ul li:before,
html.wak-contrast .fancybox-inner .frame-type-text ul li:before,
html.wak-contrast .wak-news-card__text a::before {
	background-color: var(--darkblue);
	background-image: none;
}

html.wak-contrast .wak-news-card__text a::before {
	-webkit-mask: url("../img/login-arrow-right.png") no-repeat center / contain;
	mask: url("../img/login-arrow-right.png") no-repeat center / contain;
}

html.wak-contrast #footer .footer-phone-link::before {
	-webkit-mask: url("../img/footer-icon-phone.png") no-repeat center / contain;
	mask: url("../img/footer-icon-phone.png") no-repeat center / contain;
}
