/* ============================================
   Voove Theme - n8n Query Widget Override
   Dark theme styles for postcode checker
   ============================================ */

.n8n-query-widget {
	background-color: var(--voove-dark-grey);
	border: 1px solid var(--voove-charcoal);
	border-radius: var(--voove-radius);
	padding: 2rem;
}

.n8n-query-widget input[type="text"] {
	background-color: var(--voove-black);
	border: 1px solid var(--voove-charcoal);
	color: var(--voove-white);
	border-radius: var(--voove-radius-sm);
	padding: 0.875rem 1rem;
	font-family: var(--voove-font);
	font-size: var(--voove-font-size-base);
}

.n8n-query-widget input[type="text"]:focus {
	border-color: var(--voove-red);
	outline: none;
	box-shadow: 0 0 0 3px rgba(227, 25, 55, 0.2);
}

.n8n-query-widget input[type="text"]::placeholder {
	color: var(--voove-light-grey);
}

.n8n-query-widget button {
	background-color: var(--voove-red);
	color: var(--voove-white);
	border: none;
	border-radius: var(--voove-radius);
	padding: 0.875rem 2rem;
	font-family: var(--voove-font);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background-color var(--voove-transition);
}

.n8n-query-widget button:hover {
	background-color: var(--voove-red-hover);
}

.n8n-query-widget button:disabled {
	background-color: var(--voove-charcoal);
	color: var(--voove-light-grey);
}

.n8n-query-widget .n8n-results {
	background-color: var(--voove-black);
	border: 1px solid var(--voove-charcoal);
	border-radius: var(--voove-radius-sm);
	color: var(--voove-white);
}

.n8n-query-widget .address-item {
	border-color: var(--voove-charcoal);
}

.n8n-query-widget .n8n-error {
	background-color: rgba(227, 25, 55, 0.1);
	border-color: var(--voove-red);
	color: var(--voove-red);
}
