/**
 * KP Consent - baner zgody na cookies (marka „Stal & Żar").
 *
 * Baza premium: granat (--kp-primary) + akcent żar (--kp-accent).
 * Zależny od `noxiy-child-tokens` (tokeny :root ładowane wcześniej).
 */

.kp-consent {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 99999;
	max-width: 720px;
	margin-inline: auto;
	background: var(--kp-primary, #0E2A44);
	color: #EAF2F9;
	border: 1px solid rgba(255, 255, 255, 0.10);
	border-radius: 16px;
	box-shadow: 0 18px 50px rgba(6, 18, 30, 0.45);
	/* Wejście od dołu. */
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.28s ease, transform 0.28s ease;
	overflow: hidden;
}

/* Górna „oś termiczna" - sygnatura marki. */
.kp-consent::before {
	content: "";
	display: block;
	height: 3px;
	width: 100%;
	background: var(--kp-gradient-thermal, linear-gradient(90deg, #FF6B2C, #F2B441, #4FB8D4, #12A0C4));
}

.kp-consent.is-open {
	opacity: 1;
	transform: translateY(0);
}

.kp-consent__inner {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 22px 24px 20px;
}

.kp-consent__title {
	font-family: var(--kp-font-heading, "Space Grotesk", sans-serif);
	font-size: 1.15rem;
	line-height: 1.25;
	margin: 0 0 6px;
	color: #FFFFFF;
}

.kp-consent__text {
	font-family: var(--kp-font-body, "Kumbh Sans", sans-serif);
	font-size: 0.92rem;
	line-height: 1.6;
	margin: 0;
	color: #C6D6E4;
}

.kp-consent__text a {
	color: #FFFFFF;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.kp-consent__text a:hover {
	color: var(--kp-accent, #FF6B2C);
}

/* --- Panel ustawień (kategorie) --- */
.kp-consent__options {
	display: grid;
	gap: 12px;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid rgba(255, 255, 255, 0.10);
}

.kp-consent__opt {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	cursor: pointer;
}

.kp-consent__opt input[type="checkbox"] {
	margin-top: 3px;
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	accent-color: var(--kp-accent, #FF6B2C);
	cursor: pointer;
}

.kp-consent__opt input:disabled {
	cursor: not-allowed;
	opacity: 0.7;
}

.kp-consent__opt span {
	display: block;
}

.kp-consent__opt strong {
	display: block;
	font-family: var(--kp-font-heading, "Space Grotesk", sans-serif);
	font-size: 0.95rem;
	color: #FFFFFF;
}

.kp-consent__opt em {
	display: block;
	font-style: normal;
	font-size: 0.82rem;
	line-height: 1.5;
	color: #A9BECE;
	margin-top: 2px;
}

/* --- Przyciski --- */
.kp-consent__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-end;
}

.kp-consent__btn {
	appearance: none;
	border: 1px solid transparent;
	border-radius: 10px;
	padding: 11px 18px;
	font-family: var(--kp-font-heading, "Space Grotesk", sans-serif);
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.12s ease;
}

.kp-consent__btn:active {
	transform: translateY(1px);
}

.kp-consent__btn--ghost {
	background: transparent;
	color: #D6E3EF;
	border-color: rgba(255, 255, 255, 0.28);
}

.kp-consent__btn--ghost:hover {
	color: #FFFFFF;
	border-color: rgba(255, 255, 255, 0.55);
}

.kp-consent__btn--save {
	background: var(--kp-cool, #12A0C4);
	color: #FFFFFF;
}

.kp-consent__btn--save:hover {
	background: var(--kp-cool-600, #0E86A6);
}

.kp-consent__btn--accept {
	background: var(--kp-accent, #FF6B2C);
	color: #FFFFFF;
	box-shadow: 0 6px 16px rgba(255, 107, 44, 0.35);
}

.kp-consent__btn--accept:hover {
	background: var(--kp-accent-600, #EA5A1E);
}

.kp-consent__btn:focus-visible {
	outline: 2px solid #FFFFFF;
	outline-offset: 2px;
}

/* Na większych ekranach: treść i akcje w jednym rzędzie (gdy nie widać panelu). */
@media (min-width: 720px) {
	.kp-consent:not(.kp-consent--settings) .kp-consent__inner {
		flex-direction: row;
		align-items: center;
	}
	.kp-consent:not(.kp-consent--settings) .kp-consent__actions {
		flex-wrap: nowrap;
		flex-shrink: 0;
	}
}

@media (max-width: 480px) {
	.kp-consent__inner {
		padding: 18px 16px 16px;
	}
	.kp-consent__actions .kp-consent__btn {
		flex: 1 1 auto;
		text-align: center;
	}
}

/* Szacunek dla „reduce motion". */
@media (prefers-reduced-motion: reduce) {
	.kp-consent {
		transition: none;
		transform: none;
	}
}

/* ==========================================================================
 * Ikona telefonu w formularzach (pole „Telefon").
 * Motyw pozycjonuje ikony w `.contact-item span` (absolutnie, po prawej).
 * Poniżej wyrównujemy ikonę telefonu do reszty i wymuszamy poprawny wariant
 * Font Awesome 5 Pro (regular/light/solid), aby glif zawsze się renderował.
 * ========================================================================== */
.contact-item .fa-phone,
.contact-item .fa-phone-alt,
.quote__area-right-form .contact-item .fa-phone,
.quote__area-right-form .contact-item .fa-phone-alt {
	color: var(--primary-color-1);
	font-weight: 400;
}

/* Gdyby ikonę dodano bez klasy stylu (far/fal/fas) - domyślnie „regular". */
.contact-item span.fa-phone:not(.fas):not(.fal):not(.far),
.contact-item span.fa-phone-alt:not(.fas):not(.fal):not(.far) {
	font-family: "Font Awesome 5 Pro";
	font-weight: 400;
}