.wroclaw-gift {
	background-color: var(--white-50);

	.gift_wrapper {
		max-width: 720px;
		margin: 0 auto;
		padding: 40px;
		border-radius: 24px;
	}

	.head {
		margin-bottom: 32px;

		h2 {
			color: var(--green-700);
		}

		p {
			margin-bottom: 8px;
		}
	}

	.base_gift {
		position: relative;
		display: flex;
		align-items: center;
		gap: 16px;
		padding: 16px;
		margin-bottom: 32px;
		background: var(--green-10);
		border-radius: 16px;

		.base_gift_image {
			width: 72px;
			height: 72px;
			flex-shrink: 0;
			object-fit: contain;
		}

		.base_gift_label {
			font-weight: 500;
			color: var(--green-700);
		}

		.base_gift_note {
			font-size: 13px;
			color: var(--text-color);
		}

		.badge {
			position: absolute;
			top: -10px;
			right: 16px;
			padding: 4px 12px;
			font-size: 12px;
			font-weight: 500;
			color: var(--green-700);
			background: var(--green-50);
			border-radius: 24px;
		}
	}

	.honeypot_field {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
	}

	.lead_form {
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	.field_box {
		input {
			min-height: 52px;
		}
	}

	label.field_box.checkbox {
		grid-template-columns: 24px 1fr;
		align-items: start;
		margin-top: 4px;

		.rodo_text {
			font-size: 13px;

			p {
				margin: 0;
			}
		}
	}

	.referral_block {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding-top: 4px;

		&[hidden] {
			display: none;
		}
	}

	.friend_fields[hidden] {
		display: none;
	}

	.tiles {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}

	.tile {
		position: relative;
		padding: 10px 20px;
		background-color: var(--white-50);
		border-radius: 60px;
		cursor: pointer;
		transition: .4s;

		input {
			position: absolute;
			opacity: 0;
			pointer-events: none;
		}

		&.active {
			background-color: var(--green-700);
			color: var(--white-100);
		}
	}

	.gift_level[hidden] {
		display: none;
	}

	.level_title {
		margin-bottom: 12px;
		font-weight: 500;
		color: var(--green-700);
	}

	.unlock_hint {
		margin-bottom: 16px;
		font-size: 13px;
		color: var(--text-color);

		&[hidden] {
			display: none;
		}
	}

	.gift_grid {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 16px;
		width: 100%;
		max-width: 100%;
	}

	.gift_card {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
		width: 100%;
		min-width: 0;
		max-width: 100%;
		min-height: 140px;
		padding: 16px;
		background: var(--white-100);
		border: 2px solid transparent;
		border-radius: 16px;
		box-sizing: border-box;
		transition: border-color .4s, opacity .4s;

		&.locked .gift_box {
			cursor: not-allowed;
		}

		&.locked {
			opacity: .5;
			filter: grayscale(1);
		}

		&.selected {
			border-color: var(--green-700);
		}

		.gift_box {
			display: block;
			width: 100%;
			min-height: 140px;
			padding: 0;
			background: none;
			border: 0;
			cursor: pointer;
		}

		.gift_images {
			display: block;
			position: relative;
			width: 100%;
			min-height: 140px;
			aspect-ratio: 1;
		}

		.gift_images img {
			position: absolute;
			inset: 0;
			width: 100%;
			height: 100%;
			object-fit: contain;
			opacity: 0;
			transition: opacity .5s, transform .5s;
		}

		.gift_images .img_closed {
			opacity: 1;
		}

		&.revealed .img_closed {
			opacity: 0;
			transform: scale(1.06) rotate(-2deg);
		}

		&.revealed .img_open {
			opacity: 1;
		}

		&.show-product .img_open {
			opacity: 0;
		}

		&.show-product .img_product {
			opacity: 1;
		}

		.lock_icon {
			position: absolute;
			top: 8px;
			right: 8px;
			color: var(--brown-400);
		}

		&:not(.locked) .lock_icon {
			display: none;
		}

		.gift_label {
			display: none;
			font-size: 13px;
			font-weight: 500;
			text-align: center;
			color: var(--text-color);
		}

		&.revealed .gift_label {
			display: block;
		}

		.gift_confirm {
			display: none;
			max-width: 100%;
			padding: 6px 16px;
			font-size: 12px;
			font-weight: 500;
			color: var(--white-100);
			background-color: var(--green-700);
			border: 0;
			border-radius: 24px;
			white-space: normal;
			word-break: break-word;
			cursor: pointer;
		}

		&.revealed .gift_confirm {
			display: inline-block;
		}

		.selected_check {
			display: none;
			position: absolute;
			top: 8px;
			left: 8px;
			color: var(--green-700);
		}

		&.selected .selected_check {
			display: block;
		}
	}

	.lock_hint {
		font-size: 13px;
		color: var(--brown-400);

		&[hidden] {
			display: none;
		}
	}

	.button {
		width: 100%;
		margin-top: 8px;
	}

	.success_screen {
		max-width: 720px;
		margin: 0 auto;
		padding: 40px;
		text-align: center;
		border-radius: 24px;
		background-color: var(--green-10);

		h3 {
			margin-bottom: 16px;
			color: var(--green-700);
		}

		&[hidden] {
			display: none;
		}
	}

	.submit_error {
		max-width: 720px;
		margin: 16px auto 0;
		font-size: 14px;
		text-align: center;
		color: var(--brown-400);

		&[hidden] {
			display: none;
		}
	}

	.regulamin_link {
		margin-top: 16px;
		font-size: 13px;
		text-align: center;

		a {
			color: var(--green-700);
		}
	}

	.cf7_carrier {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
	}

	@media (max-width: 1199px) {
		.gift_grid {
			grid-template-columns: repeat(2, 1fr);
			gap: 12px;
		}
	}

	@media (max-width: 767px) {
		.gift_wrapper,
		.success_screen {
			padding: 24px;
		}

		.base_gift {
			flex-direction: column;
			text-align: center;
		}

		.gift_grid {
			gap: 8px;
		}
	}
}
