/**
 * Quote-builder styling. Colour tokens, radii and the orange eyebrow/CTA
 * treatment deliberately mirror the Etik24 theme (see the child theme's
 * style.css :root block) so these pages read as part of the site rather than
 * a standalone form.
 */

.etik24-preventivo {
	--etik24-primary: #0f6b5c;
	--etik24-primary-dark: #0a3f36;
	--etik24-primary-light: #14876f;
	--etik24-accent: #e8792c;
	--etik24-accent-dark: #c8621f;
	--etik24-ink: #1b2523;
	--etik24-muted: #55625f;
	--etik24-muted-soft: #7c8985;
	--etik24-bg-soft: #f4f7f6;
	--etik24-border: #e2e8e6;
	--etik24-radius: 14px;
	--etik24-radius-sm: 10px;
	max-width: 1180px;
	margin: 0 auto;
	font-size: 16px;
	color: var(--etik24-ink);
}

/* ---------------------------------------------------------------
 * Hero — same visual language as the homepage hero
 * ------------------------------------------------------------- */

.etik24-prev-hero {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	background: linear-gradient(135deg, var(--etik24-primary-dark) 0%, var(--etik24-primary) 100%);
	border-radius: var(--etik24-radius);
	padding: 2.75rem 2.5rem;
	margin-bottom: 2rem;
}

.etik24-prev-hero-inner {
	flex: 1 1 420px;
	min-width: 0;
}

.etik24-prev-eyebrow {
	display: block;
	color: var(--etik24-accent);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	margin-bottom: 0.6rem;
}

.etik24-prev-hero h1 {
	color: #fff;
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	font-weight: 800;
	line-height: 1.15;
	margin: 0 0 0.65rem;
}

.etik24-prev-intro {
	color: rgba(255, 255, 255, 0.85);
	font-size: 1.02rem;
	line-height: 1.55;
	margin: 0;
	max-width: 56ch;
}

.etik24-prev-hero-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.4rem;
	margin-top: 1.5rem;
}

.etik24-prev-hero-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	color: rgba(255, 255, 255, 0.92);
	font-size: 0.85rem;
	font-weight: 500;
}

.etik24-prev-hero-badge svg {
	width: 18px;
	height: 18px;
	flex: none;
	color: var(--etik24-accent);
}

.etik24-prev-hero-art {
	flex: 0 0 190px;
	line-height: 0;
}

.etik24-prev-hero-art svg {
	width: 100%;
	height: auto;
}

@media (max-width: 860px) {
	.etik24-prev-hero {
		padding: 2rem 1.5rem;
	}

	.etik24-prev-hero-art {
		display: none;
	}
}

/* ---------------------------------------------------------------
 * Two-column layout: config on the left, sticky order summary right
 * ------------------------------------------------------------- */

.etik24-prev-layout {
	display: grid;
	grid-template-columns: 1.7fr 1fr;
	gap: 2rem;
	align-items: start;
}

@media (max-width: 900px) {
	.etik24-prev-layout {
		grid-template-columns: 1fr;
	}
}

.etik24-prev-main {
	counter-reset: etik24-step;
	min-width: 0;
}

.etik24-prev-sidebar {
	position: sticky;
	top: 1.5rem;
}

.etik24-prev-summary {
	position: relative;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--etik24-border);
	border-radius: var(--etik24-radius);
	padding: 1.75rem 1.5rem 1.5rem;
	box-shadow: 0 10px 30px rgba(11, 40, 34, 0.09);
}

/* Accent rule across the top, echoing the theme's card treatment. */
.etik24-prev-summary::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 4px;
	background: linear-gradient(90deg, var(--etik24-accent) 0%, var(--etik24-primary-light) 100%);
}

.etik24-prev-summary h2 {
	color: var(--etik24-primary-dark);
	font-size: 1.05rem;
	font-weight: 700;
	margin: 0 0 1.1rem;
}

.etik24-prev-summary-note {
	margin: 0.9rem 0 0;
	font-size: 0.78rem;
	line-height: 1.5;
	color: var(--etik24-muted-soft);
	text-align: center;
}

/* ---------------------------------------------------------------
 * Form groups — numbered steps via CSS counter, so conditionally
 * rendered sections (colours, finishes) never leave a gap
 * ------------------------------------------------------------- */

.etik24-prev-group {
	border: 1px solid var(--etik24-border);
	border-radius: var(--etik24-radius);
	padding: 1.6rem 1.75rem;
	margin-bottom: 1.25rem;
	background: #fff;
	box-shadow: 0 2px 12px rgba(11, 40, 34, 0.05);
	transition: box-shadow 0.2s ease;
}

.etik24-prev-group:hover {
	box-shadow: 0 6px 20px rgba(11, 40, 34, 0.08);
}

.etik24-prev-group h2 {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	font-weight: 700;
	color: var(--etik24-primary-dark);
	font-size: 1.05rem;
	margin: 0 0 1.15rem;
}

.etik24-prev-group h2::before {
	counter-increment: etik24-step;
	content: counter(etik24-step);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 1.85rem;
	height: 1.85rem;
	border-radius: 50%;
	background: var(--etik24-bg-soft);
	color: var(--etik24-primary);
	font-size: 0.85rem;
	font-weight: 800;
	box-shadow: inset 0 0 0 1px var(--etik24-border);
}

.etik24-optional {
	font-weight: 400;
	color: var(--etik24-muted-soft);
	font-size: 0.85rem;
}

.etik24-prev-form label {
	display: block;
	margin-bottom: 0.9rem;
	font-weight: 500;
	color: #33403d;
}

.etik24-prev-form input[type="number"],
.etik24-prev-form input[type="text"],
.etik24-prev-form input[type="file"],
.etik24-prev-form select,
.etik24-prev-form textarea {
	display: block;
	width: 100%;
	max-width: 320px;
	margin-top: 0.4rem;
	padding: 0.65rem 0.8rem;
	border: 1px solid #ccd6d3;
	border-radius: var(--etik24-radius-sm);
	/* Longhand so it can't clobber the select chevron's background-image. */
	background-color: #fff;
	font-size: 1rem;
	color: var(--etik24-ink);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.etik24-prev-form input:focus,
.etik24-prev-form select:focus,
.etik24-prev-form textarea:focus {
	outline: none;
	border-color: var(--etik24-primary);
	box-shadow: 0 0 0 3px rgba(15, 107, 92, 0.15);
}

/**
 * Explicit chevron on every dropdown: the theme's form reset strips the
 * native arrow on some browsers, leaving selects looking like plain text
 * inputs. Inline data-URI so it needs no external request.
 */
.etik24-prev-form select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%230f6b5c" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
	background-repeat: no-repeat;
	background-position: right 0.7rem center;
	background-size: 18px 18px;
	padding-right: 2.5rem !important;
}

/* Native arrow in old IE/Edge would sit alongside the one above. */
.etik24-prev-form select::-ms-expand {
	display: none;
}

/* ---------------------------------------------------------------
 * Selectable cards: materials, shapes, finish chips
 * ------------------------------------------------------------- */

.etik24-material-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 0.75rem;
}

.etik24-material-card {
	display: flex !important;
	align-items: center;
	justify-content: center;
	text-align: center;
	border: 1px solid #ccd6d3;
	border-radius: var(--etik24-radius-sm);
	padding: 1rem 0.75rem;
	font-weight: 600 !important;
	font-size: 0.92rem;
	cursor: pointer;
	margin: 0 !important;
	min-height: 4rem;
	background: #fff;
	transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.etik24-material-card:hover,
.etik24-shape-card:hover {
	border-color: var(--etik24-primary-light);
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(11, 40, 34, 0.08);
}

.etik24-material-card:has(input:checked) {
	border-color: var(--etik24-primary);
	background: rgba(15, 107, 92, 0.08);
	color: var(--etik24-primary-dark);
	box-shadow: 0 0 0 1px var(--etik24-primary) inset;
}

.etik24-material-card input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* Fixed 4-up: auto-fill left a trailing empty column once the shape list
   dropped to four, so the cards no longer spanned the full row. */
.etik24-shape-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.75rem;
	margin-bottom: 1.25rem;
}

@media (max-width: 640px) {
	.etik24-shape-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.etik24-shape-card {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	text-align: center;
	border: 1px solid #ccd6d3;
	border-radius: var(--etik24-radius-sm);
	padding: 1.35rem 0.6rem 1.1rem;
	min-height: 7.5rem;
	font-weight: 600 !important;
	font-size: 0.85rem;
	line-height: 1.3;
	cursor: pointer;
	margin: 0 !important;
	background: #fff;
	transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.etik24-shape-card:has(input:checked) {
	border-color: var(--etik24-primary);
	background: rgba(15, 107, 92, 0.08);
	color: var(--etik24-primary-dark);
	box-shadow: 0 0 0 1px var(--etik24-primary) inset;
}

.etik24-shape-card input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* Square drawing box keeps every shape at the same scale, so the circle and
   the rectangle read as the same "size" of label rather than one looking
   stretched next to the other. */
.etik24-shape-card svg {
	width: 46px;
	height: 46px;
	flex: none;
	color: var(--etik24-primary);
}

.etik24-dim-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 1rem;
	max-width: 420px;
}

.etik24-dim-grid input {
	max-width: none;
}

.etik24-shape-note,
.etik24-grid-hint {
	font-size: 0.85rem;
	line-height: 1.5;
	color: var(--etik24-muted-soft);
	margin: 0.35rem 0 0;
}

.etik24-grid-hint {
	margin: 0 0 0.9rem;
}

/* One dropdown per finish, so several can be combined (one choice each),
   each on its own full-width row. */
.etik24-finish-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

.etik24-finish-field {
	display: block !important;
	margin: 0 !important;
	font-weight: 500 !important;
}

.etik24-finish-name {
	display: block;
	margin-bottom: 0.3rem;
	font-size: 0.9rem;
	font-weight: 600;
	color: #33403d;
}

.etik24-prev-form .etik24-finish-select {
	display: block;
	width: 100%;
	max-width: none;
	margin-top: 0;
	padding: 0.6rem 0.7rem;
	border: 1px solid #ccd6d3;
	border-radius: var(--etik24-radius-sm);
	/* Longhand: the `background` shorthand would wipe the chevron set above. */
	background-color: #fff;
	font-size: 0.95rem;
	cursor: pointer;
}

/* A chosen finish stands out from the ones left on "Nessuna" (class is
   toggled in frontend.js). */
.etik24-prev-form .etik24-finish-select.is-selected {
	border-color: var(--etik24-primary);
	box-shadow: 0 0 0 1px var(--etik24-primary) inset;
	font-weight: 600;
	color: var(--etik24-primary-dark);
}

/* ---------------------------------------------------------------
 * Order summary (result panel, impose, add to cart) — in sidebar
 * ------------------------------------------------------------- */

.etik24-prev-result {
	background: var(--etik24-bg-soft);
	border: 1px solid var(--etik24-border);
	border-radius: var(--etik24-radius-sm);
	padding: 1.25rem;
	margin-bottom: 1.1rem;
	min-height: 60px;
}

.etik24-prev-placeholder {
	margin: 0;
	color: #667470;
	font-size: 0.92rem;
	line-height: 1.5;
}

.etik24-prev-price {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding-bottom: 0.85rem;
	margin-bottom: 0.85rem;
	border-bottom: 1px solid var(--etik24-border);
}

.etik24-prev-delivery {
	margin: 0 0 0.85rem;
	font-size: 0.85rem;
	color: var(--etik24-primary-dark);
	font-weight: 600;
}

.etik24-prev-unit {
	font-size: 0.88rem;
	color: var(--etik24-muted);
	font-weight: 600;
	order: 2;
}

.etik24-prev-total {
	font-size: 1.65rem;
	font-weight: 800;
	line-height: 1.2;
	color: var(--etik24-primary-dark);
	order: 1;
}

.etik24-prev-breakdown {
	list-style: none;
	margin: 0;
	padding: 0;
	color: var(--etik24-muted);
	font-size: 0.86rem;
}

.etik24-prev-breakdown li {
	padding: 0.22rem 0;
	display: flex;
	justify-content: space-between;
	gap: 0.75rem;
}

.etik24-prev-tech-note {
	font-style: italic;
	color: var(--etik24-muted-soft);
	display: block;
	margin-top: 0.5rem;
	line-height: 1.45;
	justify-content: flex-start !important;
}

.etik24-prev-impose {
	display: none;
	background: #fff;
	border: 1px solid var(--etik24-border);
	border-radius: var(--etik24-radius-sm);
	padding: 1.1rem;
	margin-bottom: 1.1rem;
	text-align: center;
}

.etik24-impose-label,
.etik24-grid-label {
	margin: 0 0 0.75rem;
	font-weight: 700;
	color: var(--etik24-accent);
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.etik24-prev-impose svg {
	max-width: 100%;
	height: auto;
}

/* Roll view can be very wide and short; cap the height so it stays legible. */
.etik24-impose-svg {
	display: block;
	width: 100%;
	max-height: 260px;
}

/* ---------------------------------------------------------------
 * Print orientation picker
 * ------------------------------------------------------------- */

.etik24-orient-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.75rem;
}

@media (max-width: 640px) {
	.etik24-orient-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.etik24-orient-card {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	margin: 0 !important;
	padding: 0.9rem 0.5rem;
	border: 1px solid #ccd6d3;
	border-radius: var(--etik24-radius-sm);
	background: #fff;
	text-align: center;
	font-weight: 600 !important;
	font-size: 0.8rem;
	line-height: 1.25;
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.etik24-orient-card:hover {
	border-color: var(--etik24-primary-light);
}

.etik24-orient-card:has(input:checked) {
	border-color: var(--etik24-primary);
	background: rgba(15, 107, 92, 0.08);
	color: var(--etik24-primary-dark);
	box-shadow: 0 0 0 1px var(--etik24-primary) inset;
}

.etik24-orient-card input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.etik24-orient-art {
	color: var(--etik24-primary);
	line-height: 0;
}

.etik24-orient-art svg {
	width: 62px;
	height: auto;
}

.etik24-impose-caption {
	margin: 0.75rem 0 0;
	font-size: 0.8rem;
	color: var(--etik24-muted-soft);
}

/**
 * Orange CTA, matching the primary buttons used across the site.
 *
 * The theme paints every `button` green via an `!important` rule whose
 * selector (`button:not(.etik24-qty-btn):not(...):not(...)`) already outweighs
 * a two-class selector here, so these need both `!important` and a longer
 * ancestor chain to win. Cleaner long-term fix: add
 * `.etik24-prev-add-to-cart` to that rule's `:not()` list in the theme.
 */
.etik24-preventivo .etik24-prev-sidebar .etik24-prev-summary button.etik24-prev-add-to-cart {
	display: block;
	width: 100%;
	border: none;
	border-radius: var(--etik24-radius-sm);
	background: var(--etik24-accent) !important;
	/* Longhand too: the theme rule this overrides sets background-color. */
	background-color: var(--etik24-accent) !important;
	color: #fff !important;
	font-size: 1.05rem;
	font-weight: 700;
	padding: 0.95rem 2rem !important;
	/* The theme pins every button to height:48px/line-height:48px, which fights
	   this padding and pushes the label off-centre (it overflowed the bottom
	   edge). Letting the box size itself around the text fixes the centring. */
	height: auto !important;
	min-height: 0 !important;
	line-height: 1.3 !important;
	text-align: center;
	cursor: pointer;
	transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.etik24-preventivo .etik24-prev-sidebar .etik24-prev-summary button.etik24-prev-add-to-cart:hover:not(:disabled) {
	background: var(--etik24-accent-dark) !important;
	background-color: var(--etik24-accent-dark) !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(232, 121, 44, 0.32);
}

.etik24-preventivo .etik24-prev-sidebar .etik24-prev-summary button.etik24-prev-add-to-cart:disabled {
	background: #c3ccc9 !important;
	background-color: #c3ccc9 !important;
	opacity: 1;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

.etik24-prev-error {
	color: #b00020;
	margin-top: 0.75rem;
	font-weight: 600;
	font-size: 0.9rem;
}

/* ---------------------------------------------------------------
 * Price grid (quantity × delivery)
 * ------------------------------------------------------------- */

.etik24-prev-grid {
	display: none;
	margin-top: 1.25rem;
}

.etik24-grid-scroll {
	overflow-x: auto;
	border-radius: var(--etik24-radius-sm);
	border: 1px solid var(--etik24-border);
}

.etik24-grid-table {
	width: 100%;
	border-collapse: collapse;
	text-align: center;
}

/**
 * The theme left-aligns every `.woocommerce table th`, which beats the
 * centring inherited from .etik24-grid-table — hence the explicit,
 * higher-specificity rule here rather than relying on the table's own
 * text-align.
 */
.etik24-preventivo .etik24-grid-table th,
.etik24-preventivo .etik24-grid-table td {
	text-align: center;
}

.etik24-grid-table th,
.etik24-grid-table td {
	border: 1px solid var(--etik24-border);
	padding: 0.55rem;
}

/* White header: the estimated date is what customers compare, so it gets the
   size, and the tier name sits above it as a small label. */
.etik24-grid-table thead th {
	background: #fff;
	color: var(--etik24-primary-dark);
	font-size: 0.85rem;
	font-weight: 700;
	padding: 0.75rem 0.6rem;
	border-bottom: 2px solid var(--etik24-primary);
	vertical-align: bottom;
}

.etik24-grid-tier {
	display: block;
	margin-bottom: 0.15rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--etik24-accent);
}

.etik24-grid-date {
	display: block;
	font-size: 1.02rem;
	font-weight: 800;
	line-height: 1.25;
	color: var(--etik24-primary-dark);
	white-space: nowrap;
}

.etik24-grid-table tbody th {
	background: var(--etik24-bg-soft);
	font-weight: 700;
	color: var(--etik24-primary-dark);
	white-space: nowrap;
}

.etik24-grid-cell {
	display: block;
	width: 100%;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0.4rem 0.2rem;
	border-radius: 6px;
	font-weight: 700;
	font-size: 0.95rem;
	color: #33403d;
	transition: background 0.12s ease, color 0.12s ease;
}

/* The row matching what the customer typed, so it stands out from the
   larger runs suggested below it. */
.etik24-grid-table tbody tr.is-entered th {
	background: rgba(232, 121, 44, 0.1);
	box-shadow: inset 3px 0 0 var(--etik24-accent);
}

.etik24-grid-qty-note {
	display: block;
	margin-top: 0.1rem;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--etik24-accent);
}

.etik24-grid-cell:hover {
	background: rgba(15, 107, 92, 0.08);
}

.etik24-grid-cell.is-active {
	background: var(--etik24-primary);
	color: #fff;
}

.etik24-grid-cell.is-active span {
	color: rgba(255, 255, 255, 0.8);
}

.etik24-grid-cell-error {
	color: #ccc;
}

/* ---------------------------------------------------------------
 * "artwork is collected later" hint under the quote form
 * ------------------------------------------------------------- */

.etik24-prev-artwork-hint {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	background: #fff;
	border: 1px dashed #c3d2ce;
	border-radius: var(--etik24-radius-sm);
	padding: 1rem 1.2rem;
	margin: 0 0 1.25rem;
	font-size: 0.9rem;
	line-height: 1.5;
	color: var(--etik24-muted);
}

.etik24-prev-artwork-hint svg {
	width: 20px;
	height: 20px;
	flex: none;
	margin-top: 0.1rem;
	color: var(--etik24-primary);
}

/* ---------------------------------------------------------------
 * Artwork + notes block (cart and account area — outside the
 * .etik24-preventivo wrapper, so these carry their own colours)
 * ------------------------------------------------------------- */

.etik24-artwork {
	margin: 0.85rem 0 0;
	padding: 1rem 1.1rem;
	background: #f4f7f6;
	border: 1px solid #e2e8e6;
	border-left: 3px solid #e8792c;
	border-radius: 10px;
	font-size: 0.88rem;
	line-height: 1.5;
	color: #1b2523;
}

.etik24-artwork-title {
	margin: 0 0 0.5rem;
	font-weight: 700;
	font-size: 0.78rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #0a3f36;
}

.etik24-artwork-current {
	margin: 0 0 0.75rem;
	word-break: break-word;
}

.etik24-artwork-current.is-missing {
	color: #7c8985;
	font-style: italic;
}

.etik24-artwork label {
	display: block;
	margin: 0 0 0.6rem;
	font-weight: 500;
}

.etik24-artwork label span {
	display: block;
	margin-bottom: 0.25rem;
	font-size: 0.82rem;
	color: #55625f;
}

.etik24-artwork label small {
	display: block;
	margin-top: 0.2rem;
	font-size: 0.76rem;
	font-weight: 400;
	color: #7c8985;
}

.etik24-artwork input[type="file"],
.etik24-artwork input[type="text"],
.etik24-artwork textarea {
	display: block;
	width: 100%;
	max-width: 340px;
	padding: 0.5rem 0.6rem;
	border: 1px solid #ccd6d3;
	border-radius: 8px;
	background: #fff;
	font-size: 0.88rem;
}

.etik24-artwork textarea {
	resize: vertical;
}

/* Matches the theme's own !important button rule — see the note on the
   add-to-cart button above. */
.etik24-artwork button.etik24-artwork-save {
	border: none;
	border-radius: 8px;
	background: #0f6b5c !important;
	background-color: #0f6b5c !important;
	color: #fff !important;
	font-weight: 700;
	font-size: 0.85rem;
	padding: 0.55rem 1.4rem !important;
	/* Same theme height:48px/line-height:48px override as the add-to-cart
	   button, so the label stays vertically centred. */
	height: auto !important;
	min-height: 0 !important;
	line-height: 1.3 !important;
	cursor: pointer;
}

.etik24-artwork button.etik24-artwork-save:hover:not(:disabled) {
	background: #0a3f36 !important;
	background-color: #0a3f36 !important;
}

.etik24-artwork button.etik24-artwork-save:disabled {
	opacity: 0.6;
	cursor: wait;
}

.etik24-artwork-feedback {
	margin-left: 0.7rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: #0f6b5c;
}

.etik24-artwork-feedback.is-error {
	color: #b00020;
}

.etik24-artwork-limit {
	margin: 0.6rem 0 0;
	font-size: 0.78rem;
	color: #7c8985;
}

.etik24-artwork-notes-ro {
	margin: 0;
	color: #55625f;
}

/* ---------------------------------------------------------------
 * Help banner
 * ------------------------------------------------------------- */

.etik24-prev-help-banner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	background: var(--etik24-bg-soft);
	border: 1px solid var(--etik24-border);
	border-left: 4px solid var(--etik24-accent);
	border-radius: var(--etik24-radius-sm);
	padding: 1.25rem 1.5rem;
}

.etik24-prev-help-banner strong {
	display: block;
	color: var(--etik24-primary-dark);
	font-size: 1rem;
	margin-bottom: 0.25rem;
}

.etik24-prev-help-banner p {
	margin: 0;
	color: var(--etik24-muted);
	font-size: 0.9rem;
	line-height: 1.5;
}

/* Same theme-override caveat as the add-to-cart button above. */
.etik24-preventivo .etik24-prev-help-banner a.etik24-prev-help-cta {
	flex: none;
	background: var(--etik24-primary) !important;
	background-color: var(--etik24-primary) !important;
	color: #fff !important;
	border: none;
	border-radius: var(--etik24-radius-sm);
	padding: 0.7rem 1.6rem;
	font-weight: 700;
	text-decoration: none;
	transition: background 0.15s ease;
}

.etik24-preventivo .etik24-prev-help-banner a.etik24-prev-help-cta:hover {
	background: var(--etik24-primary-dark) !important;
	color: #fff !important;
}