/* ==========================================================================
   Shared components: buttons, form controls, badges, price, quantity.
   Replaces the legacy Customizer "Additional CSS" (product card, price,
   quantity stepper, sale badge) on tokens, without !important.
   ========================================================================== */

/* Buttons ------------------------------------------------------------- */
.button,
button.button,
input[type="submit"],
input[type="button"],
.woocommerce .button {
	align-items: center;
	border-radius: var(--ce-radius-sm);
	display: inline-flex;
	font-family: var(--ce-font-sans);
	font-size: .9375rem;
	font-weight: 600;
	gap: var(--ce-space-2);
	justify-content: center;
	letter-spacing: .01em;
	line-height: 1.2;
	min-height: var(--ce-control-height);
	padding: 0 var(--ce-space-6);
	text-transform: none;
	transition: background-color var(--ce-dur-fast) var(--ce-ease),
		border-color var(--ce-dur-fast) var(--ce-ease),
		color var(--ce-dur-fast) var(--ce-ease),
		transform var(--ce-dur-fast) var(--ce-ease);
}

.button.primary,
.button.alt,
.button.checkout,
.single_add_to_cart_button,
input[type="submit"].button,
.woocommerce .button.alt {
	background-color: var(--ce-forest);
	border: 1px solid var(--ce-forest);
	color: var(--ce-on-dark);
}

.button.primary:hover,
.button.alt:hover,
.button.checkout:hover,
.single_add_to_cart_button:hover,
.woocommerce .button.alt:hover {
	background-color: var(--ce-forest-dark);
	border-color: var(--ce-forest-dark);
	box-shadow: none;
	color: var(--ce-on-dark);
}

.button.secondary,
.button.is-outline,
.button.white.is-outline {
	background-color: transparent;
	border: 1px solid var(--ce-forest);
	color: var(--ce-forest);
}

.button.secondary:hover,
.button.is-outline:hover {
	background-color: var(--ce-forest);
	color: var(--ce-on-dark);
}

.button:active { transform: translateY(1px); }

.button:focus-visible,
input[type="submit"]:focus-visible {
	box-shadow: var(--ce-focus-ring);
}

/* Form controls -------------------------------------------------------- */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="url"],
input[type="date"],
select,
textarea {
	background-color: var(--ce-paper);
	border: 1px solid var(--ce-border-strong);
	border-radius: var(--ce-radius-sm);
	box-shadow: none;
	color: var(--ce-charcoal);
	font-family: var(--ce-font-sans);
	font-size: 1rem; /* ≥16px prevents iOS zoom on focus */
	min-height: var(--ce-control-height);
	transition: border-color var(--ce-dur-fast) var(--ce-ease), box-shadow var(--ce-dur-fast) var(--ce-ease);
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--ce-forest);
	box-shadow: 0 0 0 3px rgba(41, 72, 59, .18);
}

input::placeholder,
textarea::placeholder { color: var(--ce-muted); opacity: 1; }

label,
legend {
	color: var(--ce-charcoal);
	font-size: var(--ce-fs-small);
	font-weight: 600;
}

.woocommerce-invalid input,
input[aria-invalid="true"] { border-color: var(--ce-error); }

/* Notices -------------------------------------------------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.message-container {
	border-radius: var(--ce-radius-sm);
}

.woocommerce-error { color: var(--ce-error); }

/* Price & sale --------------------------------------------------------- */
.price {
	color: var(--ce-charcoal);
	font-weight: 700;
}

.price del,
.price del .amount {
	color: var(--ce-muted);
	font-weight: 400;
	opacity: 1;
}

.price ins,
.price ins .amount {
	color: var(--ce-terracotta-ink);
	text-decoration: none;
}

/* Badges --------------------------------------------------------------- */
.badge-container .badge-inner,
.onsale {
	background-color: var(--ce-terracotta-ink);
	border-radius: 999px;
	color: var(--ce-on-dark);
	font-family: var(--ce-font-sans);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .04em;
}

/* Quantity stepper ----------------------------------------------------- */
.quantity.buttons_added {
	border: 1px solid var(--ce-border-strong);
	border-radius: var(--ce-radius-sm);
	overflow: hidden;
}

.quantity.buttons_added .minus,
.quantity.buttons_added .plus,
.quantity.buttons_added input.qty {
	background: var(--ce-paper);
	border: 0;
	box-shadow: none;
	min-height: 44px;
}

.quantity.buttons_added .minus,
.quantity.buttons_added .plus {
	color: var(--ce-forest);
	min-width: 44px;
}

/* Product card (Flatsome .product-small) — interim until Phase 2 ------ */
.product-small .box-image {
	background-color: var(--ce-paper);
	border-radius: var(--ce-radius-md);
	overflow: hidden;
}

.product-small .box-image img {
	transition: transform 400ms var(--ce-ease);
}

.product-small:hover .box-image img { transform: scale(1.03); }

.product-small .product-title,
.product-small .product-title a {
	color: var(--ce-charcoal);
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.4;
}

.product-small .category {
	color: var(--ce-muted);
	font-size: .75rem;
	letter-spacing: .08em;
	opacity: 1;
}

/* Component lists: cancel Flatsome's content-list indent (.col-inner ul li). */
body :is(.ce-steps, .ce-contact-cards, .ce-cat-tiles, .ce-chip-list, .ce-facts, .ce-toc__list, .ce-assurances) > li {
	margin-left: 0;
}
