/* ============================================================================
   DETECTUM — baner zgód na ciasteczka
   ========================================================================== */

.zgody {
	position: fixed;
	inset-block-end: 0;
	inset-inline: 0;
	z-index: 400;
	padding: 20px;
	display: flex;
	justify-content: center;
	pointer-events: none;
}

.zgody[hidden] { display: none; }

.zgody__panel {
	pointer-events: auto;
	width: 100%;
	max-width: 780px;
	max-height: calc(100vh - 40px);
	overflow-y: auto;
	padding: 30px 34px 28px;
	background: linear-gradient(158deg, #0E1119 0%, #05070D 100%);
	border: 1px solid #1B1D26;
	border-block-start: 3px solid #fcc110;
	box-shadow: 0 24px 70px rgba(0, 0, 0, .72);
	transform: translateY(20px);
	opacity: 0;
	transition: transform .3s cubic-bezier(.2, .8, .3, 1), opacity .3s ease;
}

.zgody.otwarty .zgody__panel { transform: none; opacity: 1; }

@media (prefers-reduced-motion: reduce) { .zgody__panel { transition: none; } }

.zgody__tytul {
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 12px;
}

.zgody__tresc {
	margin: 0 0 20px;
	font-size: 15px;
	line-height: 1.72;
	color: #AFB4C2;
}

.zgody__tresc a { color: #fcc110; border-block-end: 1px solid rgba(252, 193, 16, .45); }
.zgody__tresc a:hover { border-block-end-color: #fcc110; }

/* --- kategorie ------------------------------------------------------------ */

.zgody__kategorie {
	display: grid;
	gap: 14px;
	margin-block-end: 22px;
	padding-block: 18px;
	border-block: 1px solid #1B1D26;
}

.zgody__prz {
	display: flex;
	align-items: center;
	gap: 11px;
	cursor: pointer;
}

.zgody__prz input {
	appearance: none;
	flex: none;
	inline-size: 40px;
	block-size: 22px;
	border-radius: 22px;
	border: 1px solid #1B1D26;
	background: rgba(0, 0, 0, .4);
	position: relative;
	cursor: pointer;
	transition: background-color .22s ease, border-color .22s ease;
}

.zgody__prz input::after {
	content: "";
	position: absolute;
	inset-block-start: 3px;
	inset-inline-start: 3px;
	inline-size: 14px;
	block-size: 14px;
	border-radius: 50%;
	background: #6E7385;
	transition: transform .22s ease, background-color .22s ease;
}

.zgody__prz input:checked { background: rgba(252, 193, 16, .22); border-color: #fcc110; }
.zgody__prz input:checked::after { transform: translateX(18px); background: #fcc110; }
.zgody__prz input:disabled { opacity: .75; cursor: not-allowed; }
.zgody__prz input:focus-visible { outline: 2px solid #fcc110; outline-offset: 3px; }

.zgody__nazwa {
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: #E8E8EC;
}

.zgody__opis {
	margin: 6px 0 0 51px;
	font-size: 13.5px;
	line-height: 1.6;
	color: #9095A8;
}

/* --- przyciski ------------------------------------------------------------ */

.zgody__guziki {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.zgody .btn {
	font-size: 13px;
	padding: 13px 24px;
	cursor: pointer;
}

.zgody__link {
	margin-inline-start: auto;
	background: none;
	border: 0;
	padding: 6px 2px;
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 13px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: #9095A8;
	border-block-end: 1px solid transparent;
	cursor: pointer;
}

.zgody__link:hover { color: #fcc110; border-block-end-color: #fcc110; }
.zgody__link:focus-visible { outline: 2px solid #fcc110; outline-offset: 3px; }

@media (max-width: 620px) {
	.zgody { padding: 12px; }
	.zgody__panel { padding: 24px 20px 22px; }
	.zgody__guziki { flex-direction: column; align-items: stretch; }
	.zgody .btn { justify-content: center; }
	.zgody__link { margin-inline-start: 0; text-align: center; }
	.zgody__opis { margin-inline-start: 0; }
}
