/**
 * Newsletter Block Styles
 *
 * @package kairo
 * @since 1.0.0
 */

.kairo-newsletter {
	padding: var(--wp--preset--spacing--50);
	border-radius: 12px;
}

.kairo-newsletter__inner {
	max-width: 580px;
	margin-inline: auto;
	text-align: center;
}

.kairo-newsletter__heading {
	font-size: 1.5rem;
	font-weight: 600;
	margin: 0 0 0.5rem;
	line-height: 1.3;
}

.kairo-newsletter__description {
	font-size: 1rem;
	line-height: 1.6;
	margin: 0 0 1.5rem;
	opacity: 0.9;
}

.kairo-newsletter__form {
	display: flex;
	gap: 0.75rem;
	justify-content: center;
	flex-wrap: wrap;
}

.kairo-newsletter__input {
	flex: 1;
	min-width: 200px;
	max-width: 280px;
	padding: 0.875rem 1.25rem;
	font-size: 1rem;
	border: 1px solid transparent;
	border-radius: 8px;
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.kairo-newsletter__input:focus {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

.kairo-newsletter__input--name {
	max-width: 180px;
}

.kairo-newsletter__button {
	padding: 0.875rem 2rem;
	font-size: 1rem;
	font-weight: 600;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	white-space: nowrap;
}

.kairo-newsletter__button:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.kairo-newsletter__button:active {
	transform: translateY(0);
}

.kairo-newsletter__privacy {
	font-size: 0.8125rem;
	margin: 1rem 0 0;
	opacity: 0.7;
}

.kairo-newsletter__privacy a {
	text-decoration: underline;
	opacity: 0.9;
}

.kairo-newsletter__privacy a:hover {
	opacity: 1;
}

/* Dark Style Preset (Default) - Uses fixed colors to work in both light and dark site modes */
.kairo-newsletter--dark {
	background-color: #111827 !important;
	color: #F9FAFB !important;
}

.kairo-newsletter--dark .kairo-newsletter__heading {
	color: #F9FAFB !important;
}

.kairo-newsletter--dark .kairo-newsletter__description {
	color: rgba(249, 250, 251, 0.9) !important;
}

.kairo-newsletter--dark .kairo-newsletter__input {
	background-color: rgba(255, 255, 255, 0.1);
	color: #F9FAFB;
	border-color: rgba(255, 255, 255, 0.2);
}

.kairo-newsletter--dark .kairo-newsletter__input::placeholder {
	color: rgba(255, 255, 255, 0.6);
}

.kairo-newsletter--dark .kairo-newsletter__button {
	background-color: #374151;
	color: #F9FAFB;
}

.kairo-newsletter--dark .kairo-newsletter__button:hover {
	background-color: #4B5563;
}

.kairo-newsletter--dark .kairo-newsletter__privacy {
	color: rgba(249, 250, 251, 0.7) !important;
}

/* Dark preset in dark mode - use lighter shade to stand out from background */
[data-theme="dark"] .kairo-newsletter--dark {
	background-color: #1E293B !important;
	border: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .kairo-newsletter--dark .kairo-newsletter__input {
	background-color: rgba(0, 0, 0, 0.3);
	border-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .kairo-newsletter--dark .kairo-newsletter__button {
	background-color: #475569;
}

[data-theme="dark"] .kairo-newsletter--dark .kairo-newsletter__button:hover {
	background-color: #64748B;
}

/* Light Style Preset - Fixed colors for consistency */
.kairo-newsletter--light {
	background-color: #FFFFFF !important;
	color: #111827 !important;
}

.kairo-newsletter--light .kairo-newsletter__heading {
	color: #111827 !important;
}

.kairo-newsletter--light .kairo-newsletter__description {
	color: #374151 !important;
}

.kairo-newsletter--light .kairo-newsletter__input {
	background-color: #FAFAFA;
	color: #111827;
	border-color: #E5E7EB;
}

.kairo-newsletter--light .kairo-newsletter__input::placeholder {
	color: #9CA3AF;
}

.kairo-newsletter--light .kairo-newsletter__button {
	background-color: #111827;
	color: #FFFFFF;
}

.kairo-newsletter--light .kairo-newsletter__button:hover {
	background-color: #374151;
}

.kairo-newsletter--light .kairo-newsletter__privacy {
	color: #6B7280 !important;
}

/* Light preset in dark mode - maintain light appearance but add subtle distinction */
[data-theme="dark"] .kairo-newsletter--light {
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

/* Card Style Preset - Uses theme colors but with dark mode overrides */
.kairo-newsletter--card {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--subtle);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.kairo-newsletter--card .kairo-newsletter__heading {
	color: var(--wp--preset--color--contrast);
}

.kairo-newsletter--card .kairo-newsletter__description {
	color: var(--wp--preset--color--secondary);
}

.kairo-newsletter--card .kairo-newsletter__input {
	background-color: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--subtle);
}

.kairo-newsletter--card .kairo-newsletter__input::placeholder {
	color: var(--wp--preset--color--muted);
}

.kairo-newsletter--card .kairo-newsletter__button {
	background-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.kairo-newsletter--card .kairo-newsletter__button:hover {
	background-color: var(--wp--preset--color--primary);
}

.kairo-newsletter--card .kairo-newsletter__privacy {
	color: var(--wp--preset--color--muted);
}

/* WordPress Color Supports - Override presets when custom colors are set */
.kairo-newsletter.has-background {
	background-color: var(--wp--custom--background-color, var(--wp--preset--color--contrast));
}

.kairo-newsletter.has-text-color {
	color: var(--wp--custom--text-color, var(--wp--preset--color--base));
}

/* Button colors from WordPress supports */
.kairo-newsletter.has-button-color .kairo-newsletter__button {
	background-color: var(--wp--custom--button--background-color);
}

.kairo-newsletter.has-button-text-color .kairo-newsletter__button {
	color: var(--wp--custom--button--text-color);
}

/* Stacked Layout */
.kairo-newsletter--stacked .kairo-newsletter__form {
	flex-direction: column;
	align-items: center;
}

.kairo-newsletter--stacked .kairo-newsletter__input {
	width: 100%;
	max-width: 360px;
}

.kairo-newsletter--stacked .kairo-newsletter__input--name {
	max-width: 360px;
}

.kairo-newsletter--stacked .kairo-newsletter__button {
	width: 100%;
	max-width: 360px;
}

/* Responsive */
@media (max-width: 600px) {
	.kairo-newsletter {
		padding: var(--wp--preset--spacing--40);
	}

	.kairo-newsletter__form {
		flex-direction: column;
		align-items: stretch;
	}

	.kairo-newsletter__input,
	.kairo-newsletter__input--name {
		max-width: none;
		min-width: auto;
	}

	.kairo-newsletter__button {
		width: 100%;
	}
}

/* Editor styles */
.block-editor-block-list__block .kairo-newsletter__input,
.block-editor-block-list__block .kairo-newsletter__button {
	pointer-events: none;
}

/* ========== JETPACK SUBSCRIPTIONS INTEGRATION ========== */
/* Styles for when Jetpack subscription form is rendered inside the Kairo newsletter block */

.kairo-newsletter--jetpack .wp-block-jetpack-subscriptions {
	margin: 0;
}

.kairo-newsletter--jetpack .wp-block-jetpack-subscriptions__container {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
}

.kairo-newsletter--jetpack .wp-block-jetpack-subscriptions p {
	margin: 0;
}

.kairo-newsletter--jetpack #subscribe-email {
	flex: 1;
	min-width: 200px;
	max-width: 280px;
	margin: 0;
}

.kairo-newsletter--jetpack #subscribe-email input[type="email"] {
	width: 100%;
	padding: 0.875rem 1.25rem;
	font-size: 1rem;
	border: 1px solid transparent;
	border-radius: 8px;
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.kairo-newsletter--jetpack #subscribe-submit {
	margin: 0;
}

.kairo-newsletter--jetpack #subscribe-submit button,
.kairo-newsletter--jetpack #subscribe-submit input[type="submit"] {
	padding: 0.875rem 2rem;
	font-size: 1rem;
	font-weight: 600;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	white-space: nowrap;
}

.kairo-newsletter--jetpack #subscribe-submit button:hover,
.kairo-newsletter--jetpack #subscribe-submit input[type="submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Dark style preset for Jetpack form */
.kairo-newsletter--dark.kairo-newsletter--jetpack #subscribe-email input[type="email"] {
	background-color: rgba(255, 255, 255, 0.1);
	color: #F9FAFB;
	border-color: rgba(255, 255, 255, 0.2);
}

.kairo-newsletter--dark.kairo-newsletter--jetpack #subscribe-email input[type="email"]::placeholder {
	color: rgba(255, 255, 255, 0.6);
}

.kairo-newsletter--dark.kairo-newsletter--jetpack #subscribe-submit button,
.kairo-newsletter--dark.kairo-newsletter--jetpack #subscribe-submit input[type="submit"] {
	background-color: #374151;
	color: #F9FAFB;
}

.kairo-newsletter--dark.kairo-newsletter--jetpack #subscribe-submit button:hover,
.kairo-newsletter--dark.kairo-newsletter--jetpack #subscribe-submit input[type="submit"]:hover {
	background-color: #4B5563;
}

/* Light style preset for Jetpack form */
.kairo-newsletter--light.kairo-newsletter--jetpack #subscribe-email input[type="email"] {
	background-color: #FAFAFA;
	color: #111827;
	border-color: #E5E7EB;
}

.kairo-newsletter--light.kairo-newsletter--jetpack #subscribe-email input[type="email"]::placeholder {
	color: #9CA3AF;
}

.kairo-newsletter--light.kairo-newsletter--jetpack #subscribe-submit button,
.kairo-newsletter--light.kairo-newsletter--jetpack #subscribe-submit input[type="submit"] {
	background-color: #111827;
	color: #FFFFFF;
}

.kairo-newsletter--light.kairo-newsletter--jetpack #subscribe-submit button:hover,
.kairo-newsletter--light.kairo-newsletter--jetpack #subscribe-submit input[type="submit"]:hover {
	background-color: #374151;
}

/* Card style preset for Jetpack form */
.kairo-newsletter--card.kairo-newsletter--jetpack #subscribe-email input[type="email"] {
	background-color: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--subtle);
}

.kairo-newsletter--card.kairo-newsletter--jetpack #subscribe-email input[type="email"]::placeholder {
	color: var(--wp--preset--color--muted);
}

.kairo-newsletter--card.kairo-newsletter--jetpack #subscribe-submit button,
.kairo-newsletter--card.kairo-newsletter--jetpack #subscribe-submit input[type="submit"] {
	background-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.kairo-newsletter--card.kairo-newsletter--jetpack #subscribe-submit button:hover,
.kairo-newsletter--card.kairo-newsletter--jetpack #subscribe-submit input[type="submit"]:hover {
	background-color: var(--wp--preset--color--primary);
}

/* Stacked layout for Jetpack form */
.kairo-newsletter--stacked.kairo-newsletter--jetpack .wp-block-jetpack-subscriptions__container {
	flex-direction: column;
	align-items: center;
}

.kairo-newsletter--stacked.kairo-newsletter--jetpack #subscribe-email {
	width: 100%;
	max-width: 360px;
}

.kairo-newsletter--stacked.kairo-newsletter--jetpack #subscribe-submit {
	width: 100%;
	max-width: 360px;
}

.kairo-newsletter--stacked.kairo-newsletter--jetpack #subscribe-submit button,
.kairo-newsletter--stacked.kairo-newsletter--jetpack #subscribe-submit input[type="submit"] {
	width: 100%;
}

/* Responsive for Jetpack form */
@media (max-width: 600px) {
	.kairo-newsletter--jetpack .wp-block-jetpack-subscriptions__container {
		flex-direction: column;
		align-items: stretch;
	}

	.kairo-newsletter--jetpack #subscribe-email {
		max-width: none;
		min-width: auto;
	}

	.kairo-newsletter--jetpack #subscribe-submit button,
	.kairo-newsletter--jetpack #subscribe-submit input[type="submit"] {
		width: 100%;
	}
}