/**
 * Coffee Trade — Forms & input states
 * ----------------------------------------------------------------------------
 * Consistent, accessible inputs across WooCommerce, WPForms and comments.
 * Calm fields, clear focus, legible errors. Presentation only — no checkout
 * field logic, validation rules or gateway behaviour is changed.
 */

/* --- Base fields ---------------------------------------------------------- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-page form .form-row input.input-text,
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="number"],
.wpforms-field input[type="url"],
.wpforms-field textarea,
.wpforms-field select,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="search"],
input[type="password"],
textarea,
select {
	background-color: var(--ctc-cream);
	color: var(--ctc-text);
	border: var(--ctc-border);
	border-radius: var(--ctc-radius);
	padding: 0.65rem 0.85rem;
	line-height: 1.5;
	transition: border-color var(--ctc-transition), box-shadow var(--ctc-transition);
}

textarea {
	min-height: 8rem;
}

/* Placeholders: muted but readable. */
::placeholder {
	color: var(--ctc-text-muted);
	opacity: 1;
}

/* --- Focus: clear bronze ring + espresso edge ----------------------------- */
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.wpforms-field input:focus,
.wpforms-field textarea:focus,
.wpforms-field select:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: var(--ctc-espresso);
	box-shadow: var(--ctc-focus-ring);
}

/* --- Labels --------------------------------------------------------------- */
.woocommerce form .form-row label,
.wpforms-field-label,
.comment-form label {
	color: var(--ctc-text);
	font-weight: 600;
	margin-bottom: var(--ctc-space-2);
}

/* Required marker in the brand accent. */
.woocommerce form .form-row .required,
.wpforms-required-label {
	color: var(--ctc-walnut);
	border: 0;
}

/* --- WooCommerce select2 (country/state etc.) to match ------------------- */
.woocommerce .select2-container .select2-selection--single,
.select2-container--default .select2-selection--single {
	height: auto;
	min-height: 2.9rem;
	border: var(--ctc-border);
	border-radius: var(--ctc-radius);
	background-color: var(--ctc-cream);
	display: flex;
	align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--ctc-text);
	line-height: 1.5;
}

.select2-dropdown {
	border: var(--ctc-border);
	border-radius: var(--ctc-radius);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: var(--ctc-walnut);
}

/* --- Error / invalid states (accessible, warm) --------------------------- */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.wpforms-field input.wpforms-error,
.wpforms-field textarea.wpforms-error,
.wpforms-field select.wpforms-error {
	border-color: #b3261e;
	box-shadow: 0 0 0 3px rgba(179, 38, 30, 0.18);
}

.woocommerce form .form-row.woocommerce-validated input.input-text {
	border-color: var(--ctc-bronze);
}

.wpforms-error,
label.wpforms-error,
.woocommerce-error li {
	color: #b3261e;
}

/* --- Submit buttons inherit the primary button look ---------------------- */
.wpforms-submit,
.comment-form .submit,
.comment-form input#submit {
	background-color: var(--ctc-cta-bg);
	color: var(--ctc-cta-fg);
	border: var(--ctc-border-width) solid var(--ctc-cta-bg);
	border-radius: var(--ctc-radius);
	padding: 0.75rem 2rem;
	font-weight: 600;
	cursor: pointer;
	transition: background-color var(--ctc-transition), border-color var(--ctc-transition);
}

.wpforms-submit:hover,
.wpforms-submit:focus,
.comment-form .submit:hover,
.comment-form input#submit:hover {
	background-color: var(--ctc-cta-hover-bg);
	border-color: var(--ctc-cta-hover-bg);
}

.wpforms-submit:focus-visible,
.comment-form input#submit:focus-visible {
	outline: none;
	box-shadow: var(--ctc-focus-ring);
}

/* --- WooCommerce notices: calm, on-brand --------------------------------- */
.woocommerce-message,
.woocommerce-info {
	border-top-color: var(--ctc-bronze);
	background: var(--ctc-cream);
	color: var(--ctc-text);
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: var(--ctc-bronze);
}
