/* ═══════════════════════════════════════════════
   邮件订阅表单样式
   ═══════════════════════════════════════════════ */

.ces-form {
	display: flex;
	align-items: stretch;
	border: 1px solid #c4b9ac;
	overflow: hidden;
}

.ces-input {
	flex: 1;
	padding: 0 20px;
	border: none;
	outline: none;
	font-size: 14px;
	background: transparent;
}

.ces-input::placeholder {
	color: #999999;
}

.ces-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 25px;
	border: none;
	background-color: #c4b9ac;
	color: #ffffff;
	font-size: 14px;
	cursor: pointer;
	transition: background-color 0.2s ease;
	white-space: nowrap;
}

.ces-btn:hover {
	background-color: #b0a495;
}

.ces-btn:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.ces-spinner {
	width: 20px;
	height: 20px;
	animation: ces-spin 1s linear infinite;
}

@keyframes ces-spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

.ces-message {
	margin-top: 10px;
	padding: 10px 15px;
	font-size: 14px;
	border-radius: 3px;
}

.ces-message--success {
	background-color: #d4edda;
	color: #155724;
	border: 1px solid #c3e6cb;
}

.ces-message--error {
	background-color: #f8d7da;
	color: #721c24;
	border: 1px solid #f5c6cb;
}

@media (max-width: 1024px) {
	.ces-form {
		max-width: 100%;
	}
}

@media (max-width: 767px) {
	.ces-form {
		flex-direction: column;
		height: auto !important;
		border: none;
	}

	.ces-input {
		height: 48px !important;
		text-align: center;
		border: 1px solid #c4b9ac;
		margin-bottom: 10px;
	}

	.ces-btn {
		width: 100% !important;
		height: 48px !important;
		margin-left: 0 !important;
	}
}