/*
MARK: ułatwienia dla użytkownika
*/

a:focus {
  outline: 2px dashed var(--primary) !important;
  outline-offset: 3px;
}

a:focus-visible {
  outline: 2px dashed var(--primary) !important;
  outline-offset: 3px;
}

a:focus:not(:focus-visible) {
  outline: none;
}

.accessibility-widgets {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: .5rem;

	position: fixed;
	top: 50vh;
	right: 0;
	height: auto;
	transform: translateY(-50%);
	z-index: 999;

	--primary-color: hsl(221, 100.00%, 37.10%);
	--primary-color-dark: hsl(229, 100.00%, 23.90%);
}

.accessibility-widgets button {
	background-color: var(--primary-color);
	border-radius: 3rem;
	border: none;
	cursor: pointer;
	padding: .6rem;

	display: flex;
	align-items: center;
	gap: .5rem;

	color: white;
	text-align: left;

	& img {
		display: block;
		height: 1.5rem;
		filter: invert(1);
	}

	& span {
		width: 150px;
		display: block;
		white-space: nowrap;
		transition: width 300ms ease-out;
	}

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

.accessibility-panel {
	display: flex;
	align-items: flex-start;
	margin-right: -320px;
	transition: margin-right 300ms ease-out;

	&.show {
		margin-right: 0;
	}
}

.accessibility-toggler {
	display: block;
	padding: 0.5rem;
	border-radius: 3rem 0 0 3rem;
	background-color: var(--primary-color);

	& img {
		filter: invert(1);
		display: block;
		height: 40px;
	}
}

.accessibility-body {
	width: 320px;
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: 1rem;
	background-color: var(--primary-color);
	border-radius: 0 0 0 1rem;
}


/*
MARK: Bigger fonts
*/

.bigger-fonts body {
	font-size: calc(16px * 1.125);
	--h1: calc(3.0625rem * 1.125);
	--h2: calc(2.4375rem * 1.125);
	--h3: calc(1.9375rem * 1.125);
	--h4: calc(1.5625rem * 1.125);
	--h5: calc(1.25rem * 1.125);
	--h6: calc(1rem * 1.125);
	--leadSize: calc(1.25rem * 1.125);
	--biggerSize: calc(1.125rem * 1.125);
	--smallSize: calc(0.875rem * 1.125);
}

/*
MARK: biggest fonts
*/
.biggest-fonts body {
	font-size: calc(16px * 1.25);
	--h1: calc(3.0625rem * 1.25);
	--h2: calc(2.4375rem * 1.25);
	--h3: calc(1.9375rem * 1.25);
	--h4: calc(1.5625rem * 1.25);
	--h5: calc(1.25rem * 1.25);
	--h6: calc(1rem * 1.25);
	--leadSize: calc(1.25rem * 1.25);
	--biggerSize: calc(1.125rem * 1.25);
	--smallSize: calc(0.875rem * 1.25);
}

.bigger-fonts body,
.biggest-fonts body {
	& .swiper-caption {
		background: #ffffff;
		padding: 30px 50px 60px 50px;
		height: auto;
	}
}

/*
MARK: kontrast
*/

.high-contrast body {

	/* tło : #000000;
	tekst: #FFFFFF;
	link: #8080FF;
	disabled: #A6A6A6;
	selected: #2B2B2B / #D6B4FD;
	primary: #FFEE32;
	*/

	background: #000000;
	--primary: #ffee33;
	--primaryDark: hsl(45, 100%, 45%);
	--primaryLight: hsl(52, 100%, 92%);
	--secondary: #ffee33;
	--titleColor: #FFFFFF;
	--textColor: #FFFFFF;
	--linkColor: #ffee33;
	--bgLight: #000000;
	--btnColor: #ffffff;
	--borderColor: #ffffff;
	--borderRadius: 0rem;
	--muted: hsl(209, 38%, 16%, .48);
	--red: #fd586c;

	& .bold,
	& .strong,
	& bold,
	& strong {
		font-weight: 700;
	}

	& a,
	& a h1,
	& a .h1,
	& a h2,
	& a .h2,
	& a h3,
	& a .h3,
	& a h4,
	& a .h4,
	& a h5,
	& a .h5,
	& a h6,
	& a .h6,
	.card-title--link {
		color: var(--linkColor) !important;
		text-decoration: underline !important;
	}

	& .swiper-caption-date,
	& .card-date {
		color: #ffffff !important;
	}

	& .card.horizontal  {
		border: 2px solid var(--linkColor);
		padding: 5px;
		border-radius: var(--borderRadius);
	}

		& .swiper-container  {
		border: 2px solid var(--linkColor);
	}




	& .navbar,
	& .navbar-nav ul,
	& .has-dropdown .dropdown,
	& .has-dropdown .dropdown input {
		background: var(--bgLight);
	}

	& .navbar-nav ul,
	& .has-dropdown .dropdown {
		border: 2px solid var(--primary);
	}

	& .navbar-nav ul li:hover {
		background: rgb(255, 238, 51, .2);
	}

	& table,
	& table.fancy {
		background: var(--bgLight);
		color: var(--textColor);
	}

	& .has-dropdown .dropdown input {
		border-bottom: none;
	}

	& .navbar_top {
		background: var(--primary);
	}

	& #navbar input {
		filter: invert(1);
		font-weight: bold;
	}

	& .navbar_bottom {
		background: var(--primary);
	}

	& .navbar-logo-image {
		filter: brightness(0) invert(1);
	}

	& .btn,
	& .btn.danger,
	& .btn.warning,
	& .btn.success,
	& header .btn.success,
	& .danger-btn,
	& .success-btn {
		font-weight: bold;
		background: none;
		color: var(--primary) !important;
		border: 2px solid var(--primary);
	}

	& h1,
	& h2,
	& h3,
	& h4,
	& h5,
	& h6 {
		color: white;
		font-weight: 700;
	}

	& footer {
		background: var(--bgLight);
	}

	& #dla {
		background: var(--primary);
	}

	& #dla a {
		background: var(--bgLight);
		font-weight: bold;
	}

	& .breadcrumbs span {
		color: white;
	}

	& .indeks-kategorii .card:hover .card-img-overlay,
	& .indeks-kategorii .card:focus .card-img-overlay {
		background: black;
		border: 2px solid white;
		border-radius: .5rem;
	}

	& .indeks-kategorii .card-text a:hover,
	& .indeks-kategorii .card-text a:focus {
		text-decoration: underline;
	}

	& .tabs>label {
		background: var(--primary);
		font-weight: 700;
	}

	& .tabs .tab {
		background: hsl(0 0% 10%);
	}

	& :focus-visible {
		outline: 2px dashed #D6B4FD;
	}

	& .swiper-caption {
		background: var(--bgLight);
	}

	& .downloads a {
		border: 2px solid var(--primary);
		box-shadow: none;
	}
}

.high-contrast body [data-aos] {
	transition: none !important;
	animation: none !important;
	transform: none !important;
	opacity: 1 !important;
}

.high-contrast::selection {
	background: #D6B4FD;
	color: #2B2B2B;
}

.high-contrast *:not(.swiper-container):not(.swiper-container *) {
	animation: none !important;
	transition: none !important;
	scroll-behavior: auto !important;
}

.high-contrast .lightUp--ready,
.high-contrast .lightDown--ready,
.high-contrast .lightLeft--ready,
.high-contrast .lightRight--ready {
	transform: translateY(0px) !important;
	opacity: 1 !important;
}


@media (prefers-reduced-motion: reduce) {

	*,
	::before,
	::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.swiper-container:hover .swiper-button-next,
	.swiper-container:hover .swiper-button-prev {
		opacity: .6 !important;
	}

	.indeks-kategorii .card:hover img {
		transform: none !important;
	}

	.indeks .card:hover>.card-img {
		transform: none !important;
	}

	.btn:hover {
		transform: none !important;
	}

	.btn:focus {
		transform: none !important;
	}

	form input:hover,
	form select:hover,
	form textarea:hover {
		transform: none !important;
	}

	form input:focus,
	form select:focus,
	form textarea:focus {
		transform: none !important;
	}
}