/* Gated Content Styles */
.post-content--gated {
	position: relative;
	overflow: hidden;
	max-height: var(--gated-max-height, 500px);
}

.post-content--gated::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 250px;
	background: linear-gradient(360deg, #f2f2f5 10%, rgba(242, 242, 245, 0) 98.95%);
	z-index: 8;
	pointer-events: none;
}

.gated-content-gate {
	position: relative;
	z-index: 9;
	padding: 40px 20px;
	margin-top: -20px;
	background-color: #ffffff;
	box-shadow: 0 4px 46px 0 rgba(0, 0, 0, 0.07);
	border-top: 6px solid #282359; /* Memcyco brand color */
	border-radius: 0 0 10px 10px;
}

.gated-content-gate__title {
	text-align: center;
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: 700;
	color: #282359;
}

.gated-content-gate__form {
	max-width: 600px;
	margin: 0 auto 20px;
}

/* Missing Form ID Warning */
.gated-content-gate__warning {
	padding: 30px;
	text-align: center;
	background: #fff3cd;
	border: 2px solid #ffc107;
	border-radius: 4px;
}

.gated-content-gate__warning-title {
	color: #856404;
	font-weight: bold;
	margin: 0;
	font-size: 16px;
}

.gated-content-gate__warning-text {
	color: #856404;
	margin: 10px 0 0 0;
	font-size: 14px;
}

.gated-content-gate__skip {
	text-align: center;
	margin-top: 20px;
}

.gated-skip-button {
	background: none;
	border: none;
	color: #e8347d;
	text-decoration: underline;
	cursor: pointer;
	font-size: 14px;
	padding: 10px;
	font-family: 'Inter', Sans-Serif;
	font-weight: 500;
}

.gated-skip-button:hover {
	color: #282359;
}

.gated-content-gate--hidden {
	display: none;
}

.post-content--unlocked::after {
	display: none;
}

.post-content--unlocked {
	max-height: none;
}

/* ============================================ */
/* HubSpot Form Styles - Gated Content */
/* ============================================ */

.gated-content-gate .hbspt-wrap2 .hbspt-form form {
	padding: 40px;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form form fieldset {
	max-width: 100% !important;
}

/* Labels - Base & Error States */
.gated-content-gate .hbspt-wrap2 .hbspt-form label {
	font-family: 'Inter', Sans-Serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 14px;
	color: #282359;
	margin-bottom: 8px;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-error-msgs label {
	font-size: 12px;
	line-height: 12px;
}

/* Input Fields - Text & Textarea */
.gated-content-gate .hbspt-wrap2 .hbspt-form .input {
	margin: 0 !important;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .input input {
	background-color: #f6f8fa;
	border: 1px solid #cdd6e1;
	border-radius: 4px;
	margin-bottom: 16px;
	color: #282359;
	font-size: 16px;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .input input.invalid {
	border-color: #e8347d;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .input textarea {
	background-color: #f6f8fa;
	border: 1px solid #cdd6e1;
	border-radius: 4px;
	color: #282359;
	font-size: 16px;
	height: 83px;
	resize: none;
	width: 100% !important;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-richtext.hs-main-font-element p {
	font-family: 'Inter', Sans-Serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 14px;
	color: #282359;
	margin-top: 24px;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-richtext.hs-main-font-element p span {
	color: #282359 !important;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-richtext.hs-main-font-element p a {
	color: #e8347d;
	text-decoration: underline;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .actions {
	position: relative;
	display: inline-block;
	background-color: #282359;
	border: 1px solid #282359;
	margin-top: 32px;
	transform: perspective(1px) translateZ(0);
	overflow: hidden;
	transition: all 0.3s ease-in-out;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .actions::before {
	content: '';
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(255, 255, 255, 0.2);
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: 0 50%;
	transform-origin: 0 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 0 50%, 0% 0%);
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .actions:hover {
	transform: scale(0.97) perspective(1px) translateZ(0);
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .actions:hover::before {
	-webkit-transform: scaleX(1.4);
	transform: scaleX(1.4);
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .actions input {
	font-family: 'Inter', Sans-Serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 14px;
	color: #fff;
	padding: 13px 25px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 177px;
	height: 40px;
	background-color: transparent;
	border: none;
	border-radius: 0;
}

/* Layout Utilities */
.gated-content-gate .hbspt-wrap2 .hbspt-form .form-columns-2 {
	display: flex;
	column-gap: 24px;
}

/* Checkbox & Radio Fields */
.gated-content-gate .hbspt-wrap2 .hbspt-form .inputs-list {
	padding: 0;
	list-style-type: none;
	margin-top: -10px;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .inputs-list li {
	display: flex;
	align-items: center;
	margin-bottom: 16px;
	margin-top: 16px;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .inputs-list li input[type='checkbox'],
.gated-content-gate .hbspt-wrap2 .hbspt-form .inputs-list li input[type='radio'] {
	margin-right: 8px;
	margin-bottom: 0;
	flex-shrink: 0;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .inputs-list label {
	color: #e8347d;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-form-booleancheckbox-display {
	display: flex !important;
	align-items: center;
	margin-bottom: 0 !important;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	min-height: 24px;
	color: #282359;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-form-booleancheckbox-display input {
	margin-right: 8px;
	margin-bottom: 0 !important;
	flex-shrink: 0;
}

.gated-content-gate .hbspt-wrap2 .hbspt-form .hs-form-booleancheckbox-display span {
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #282359;
}

/* Error Messages */
.gated-content-gate .hbspt-wrap2 .hbspt-form .hs_error_rollup .hs-error-msgs {
	margin-top: 20px;
	margin-bottom: -20px;
}

@media (max-width: 767.98px) {
	.gated-content-gate .hbspt-wrap2 .hbspt-form .form-columns-2 {
		flex-direction: column;
	}

	.gated-content-gate .hbspt-wrap2 .hbspt-form .form-columns-2 .hs-form-field {
		width: 100% !important;
	}

	.gated-content-gate .hbspt-wrap2 .hbspt-form form {
		padding: 20px;
	}
}

.gated-content-gate .hbspt-wrap2 .submitted-message {
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: right bottom;
	background-repeat: no-repeat;
	background-image: url('https://memcyco.local/wp-content/uploads/2024/05/Demo-pop-up-wrong-text.jpg');
	padding: 40px;
	text-align: center;
}

.gated-content-gate .hbspt-wrap2 .submitted-message h3 {
	font-size: 28px;
	line-height: 36px;
	font-weight: 600;
	color: #fff;
	margin: 16px 0 16px;
}

.gated-content-gate .hbspt-wrap2 .submitted-message p {
	font-size: 16px;
	line-height: 20px;
	color: #fff;
}

.gated-content-gate .hbspt-wrap2 .submitted-message:after {
	margin: 40px 0 0;
	display: inline-block;
	width: 105px;
	height: 60px;
	content: '';
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='105' height='61' fill='none' viewBox='0 0 105 61'%3E%3Cpath fill='%23fff' d='M30.718 60.24.04 31.21 28.9.694l5.252 4.93L10.22 30.927l25.468 24.1-4.969 5.212ZM75.848 60.624l-5.273-4.91 24.257-25.85-25.39-24.42 5.01-5.17L104.954 29.6 75.848 60.624ZM52.673 50.25c-6.753 0-12.247-5.475-12.247-12.203h5.154c0 3.898 3.18 7.067 7.093 7.067 3.912 0 7.092-3.17 7.092-7.067h5.155c0 6.728-5.495 12.202-12.247 12.202Z'/%3E%3Cpath fill='%23fff' d='M71.876 20.773H56.79v5.65h15.087v-5.65ZM41.72 29.978c3.538 0 6.406-2.858 6.406-6.383 0-3.526-2.868-6.384-6.407-6.384-3.538 0-6.407 2.858-6.407 6.384 0 3.525 2.869 6.383 6.407 6.383Z'/%3E%3C/svg%3E");
}

/* Responsive Styles */
@media (max-width: 767.98px) {
	.gated-content-gate {
		padding: 20px 15px;
	}
}
