/* ==========================================================================
   Interpro HWCS Orders — order form
   Uses global site colour variables (with fallbacks):
   --color-dark-blue #1F3986 | --color-light-blue #069BE4
   --color-red #DC2118 | --color-light-bg #ededed
   ========================================================================== */

.ihwcs-form,
.ihwcs-confirmation,
.ihwcs-login-required {
	width: 100%;
	box-sizing: border-box;
	color: #1d1d1f;
	font-size: 16px;
}

.ihwcs-form *,
.ihwcs-form *::before,
.ihwcs-form *::after { box-sizing: border-box; }

/* ---------- VAT display toggle (in the Searches step, above the filter) ---------- */
.ihwcs-vat-toggle {
	display: flex;
	justify-content: flex-end;
	max-width: 100%;
	margin: 0;
}
.ihwcs-vat-toggle__label {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    cursor: pointer;
    font-size: .85rem;
    font-weight: 600;
    color: var(--color-text);
}
.ihwcs-vat-toggle__input {
	width: 18px;
	height: 18px;
	cursor: pointer;
	accent-color: var(--color-light-blue, #069BE4);
}

/* incl/excl swap: excl values are hidden until the toggle adds .show-excl */
.ihwcs-vat-excl { display: none; }
.ihwcs-form.show-excl .ihwcs-vat-incl { display: none; }
.ihwcs-form.show-excl .ihwcs-vat-excl { display: inline; }

/* ---------- login gate ---------- */
.ihwcs-login-required {
	text-align: center;
	padding: 2.5rem 1.5rem;
	background: var(--color-light-bg, #ededed);
	border-radius: var(--border-radius, 12px);
}
.ihwcs-login-required i { color: var(--color-light-blue, #069BE4); margin-right: .4rem; }

/* ---------- steps / accordion ---------- */
.ihwcs-step {
	border-radius: var(--border-radius, 12px);
	margin-bottom: 1rem;
	background: #fff;
	overflow: hidden;
}
.ihwcs-step__header {
	display: flex;
	align-items: center;
	gap: .75rem;
	width: 100%;
	padding: 1rem 1.25rem;
	background: #fff;
	border: 0;
	cursor: pointer;
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--color-dark-blue, #1F3986);
	text-align: left;
}
.ihwcs-step.is-open .ihwcs-step__header { background: var(--color-teal, #0872aa); color: #fff; }
.ihwcs-step__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	background: var(--color-light-bg, #ededed);
	color: var(--color-dark-blue, #1F3986);
	flex: 0 0 auto;
}
.ihwcs-step.is-open .ihwcs-step__icon { background: #fff; color: var(--color-teal, #0872aa); }
.ihwcs-step__title { flex: 1 1 auto; }
.ihwcs-step__chev { transition: transform .25s ease; }
.ihwcs-step.is-open .ihwcs-step__chev { transform: rotate(180deg); }

/* completion state */
.ihwcs-step__status { display: inline-flex; align-items: center; gap: .4rem; }
.ihwcs-step__tick { display: none; color: #2e8b3d; font-size: 1.1rem; }
.ihwcs-step.completed .ihwcs-step__tick { display: inline-block; }
.ihwcs-step.is-open .ihwcs-step__tick { color: #fff; }
.ihwcs-step__incomplete {
	display: none;
	font-size: .72rem;
	font-weight: 600;
	color: var(--color-red, #DC2118);
	background: #fde8e7;
	padding: .15rem .55rem;
	border-radius: 999px;
}
.ihwcs-step.incomplete .ihwcs-step__incomplete { display: inline-block; }
.ihwcs-step.is-open .ihwcs-step__incomplete { display: none; }
.ihwcs-step.completed:not(.is-open) { opacity: .6; transition: opacity .2s ease; }
.ihwcs-step.completed:not(.is-open):hover { opacity: 1; }

/* Smooth expand/collapse: animate the single grid row from 0fr to 1fr so the
 * body eases to its real content height (works no matter how tall the step is).
 * The inner wrapper holds the padding and is clipped while collapsed. */
.ihwcs-step__body {
	display: grid;
	grid-template-rows: 0fr;
	background: var(--color-light-bg, #ededed);
	transition: grid-template-rows .3s ease;
}
.ihwcs-step.is-open .ihwcs-step__body { grid-template-rows: 1fr; }
.ihwcs-step__inner {
	overflow: hidden;
	min-height: 0;
	/* No vertical padding while collapsed, so the body closes flush (the padding
	 * would otherwise keep the row ~4rem tall even at 0fr). */
	padding: 0 1.5rem;
	opacity: 0;
	visibility: hidden;
	/* Fade out quickly so content is gone before the height finishes shrinking
	 * (prevents the flicker of overflowing content), then hide for tab order. */
	transition: padding .3s ease, opacity .12s ease, visibility 0s linear .3s;
}
.ihwcs-step.is-open .ihwcs-step__inner {
	padding: 2rem 1.5rem;
	opacity: 1;
	visibility: visible;
	transition: padding .3s ease, opacity .2s ease .05s, visibility 0s;
}

@media (prefers-reduced-motion: reduce) {
	.ihwcs-step__body, .ihwcs-step__inner { transition: none; }
}

.ihwcs-step__actions {
	display: flex;
	justify-content: space-between;
	gap: .75rem;
	margin-top: 1.25rem;
}
.ihwcs-step__actions .ihwcs-next { margin-left: auto; }

/* ---------- fields ---------- */
.ihwcs-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}
.ihwcs-field { margin-bottom: 1rem; }
.ihwcs-field--full { grid-column: 1 / -1; }
.ihwcs-field label {
	display: block;
	font-weight: 600;
	font-size: .9rem;
	margin-bottom: .35rem;
	color: var(--color-dark-blue, #1F3986);
}
.ihwcs-req { color: var(--color-red, #DC2118); }
.ihwcs-input {
	width: 100%;
	padding: .65rem .75rem;
	border: 1px solid var(--color-border, #d8d8de);
	border-radius: 6px;
	font-size: 1rem;
	background: #fff;
}
.ihwcs-input:focus {
	outline: none;
	border-color: var(--color-light-blue, #069BE4);
	box-shadow: 0 0 0 3px rgba(6, 155, 228, .15);
}
.ihwcs-input.is-invalid { border-color: var(--color-red, #DC2118); }
.ihwcs-field--type { max-width: 320px; }

/* ---------- property step: two-column layout ---------- *
 * Left (meta) ~1/3, right (address) ~2/3, each with a 400px floor so they sit
 * side by side on desktop, trend toward 1/2 on laptops, and stack below ~800px.
 */
.ihwcs-property-cols {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
	align-items: flex-start;
}
.ihwcs-prop-col { min-width: min(400px, 100%); }
.ihwcs-prop-col--meta { flex: 1 1 0; }
.ihwcs-prop-col--address { flex: 2 1 0; }
.ihwcs-prop-col--meta .ihwcs-field--type { max-width: none; }

/* bordered, titled field group (Order / Property Address / Plans).
 * The title straddles the top border (legend-style), centered; its background
 * matches the step body so it masks the border line behind the text. */
.ihwcs-group {
	position: relative;
	border: 1px solid var(--color-border, #d8d8de);
	border-radius: var(--border-radius, 12px);
	padding: 1.35rem 1.1rem 1.1rem;
}
.ihwcs-group__title {
	position: absolute;
	top: 0;
	left: .9rem;
	transform: translateY(-50%);
	padding: 0 .5rem;
	background: var(--color-light-bg, #ededed);
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	font-weight: 700;
	color: var(--color-dark-blue, #1F3986);
	white-space: nowrap;
}
.ihwcs-group > .ihwcs-field:last-child { margin-bottom: 0; }
.ihwcs-group--plans { margin-top: 1.25rem; }
.ihwcs-group--plans .ihwcs-plans { margin-top: 0; }
.ihwcs-address-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}
.ihwcs-address-grid .ihwcs-field { flex: 1 1 190px; min-width: min(190px, 100%); margin-bottom: 0; }
.ihwcs-address-grid .ihwcs-field--full { flex-basis: 100%; }

/* ---------- buttons ---------- */
.ihwcs-btn {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .7rem 1.2rem;
	border: 0;
	border-radius: 6px;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	transition: background .2s ease, opacity .2s ease;
}
.ihwcs-btn--primary { background: var(--color-light-blue, #069BE4); color: #fff; }
.ihwcs-btn--primary:hover { background: var(--color-dark-blue, #1F3986); }
.ihwcs-btn--ghost {
	background: transparent;
	color: var(--color-dark-blue, #1F3986);
	border: 1px solid var(--color-border, #d8d8de);
}
.ihwcs-btn--ghost:hover { background: var(--color-light-bg, #ededed); }
.ihwcs-btn--place {
	background: var(--color-dark-blue, #1F3986);
	color: #fff;
	width: 100%;
	justify-content: center;
	padding: .9rem;
	font-size: 1.1rem;
}
.ihwcs-btn--place:hover:not(:disabled) { background: var(--color-light-blue, #069BE4); }
.ihwcs-btn:disabled { opacity: .55; cursor: not-allowed; }

/* ---------- plans ---------- */
.ihwcs-plans { margin-top: .5rem; }
.ihwcs-plans__list { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .75rem; }
.ihwcs-plan {
	display: flex;
	align-items: center;
	gap: .6rem;
	padding: .55rem .75rem;
	background: var(--color-light-bg, #ededed);
	border-radius: 6px;
	font-size: .9rem;
}
.ihwcs-plan__name { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ihwcs-plan__status { color: #2e8b3d; }
.ihwcs-plan.is-error { background: #fde8e7; }
.ihwcs-plan.is-error .ihwcs-plan__status { color: var(--color-red, #DC2118); }
.ihwcs-plan__remove { background: none; border: 0; color: var(--color-red, #DC2118); cursor: pointer; }
.ihwcs-plans__add {
	display: inline-flex;
	cursor: pointer;
	background: var(--color-border, #d8d8de);
	color: var(--color-dark-blue, #1F3986);
}
.ihwcs-plans__add:hover { background: var(--color-light-blue, #069BE4); color: #fff; }
.ihwcs-plans__add i { color: inherit; }

/* ---------- plans row: upload (fills remaining space) + request option ---------- */
.ihwcs-plans-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
	margin-top: .5rem;
}
.ihwcs-plans-row .ihwcs-plans {
	flex: 1 1 240px;   /* take all remaining width, stack below ~240px */
	margin: 0;
}
.ihwcs-plans-row .ihwcs-plans__add {
	width: 100%;
	justify-content: center;
}
/* collapse the empty uploaded-plans list so it can't offset vertical centering */
.ihwcs-plans__list:empty { margin-bottom: 0; }

/* ---------- request a plan (checkbox + info tooltip) ---------- */
.ihwcs-request-plan {
	display: flex;
	align-items: center;
	gap: .5rem;
	flex: 0 0 auto;    /* only as wide as its content */
	margin: 0;
}
.ihwcs-request-plan[hidden] { display: none; }   /* [hidden] must beat display:flex */
/* Scoped under .ihwcs-request-plan so it beats the generic `.ihwcs-field label`
 * rule (display:block + margin-bottom + colour), which is otherwise more specific. */
.ihwcs-request-plan .ihwcs-check {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin: 0;
	line-height: 1;
	cursor: pointer;
	font-weight: 600;
	font-size: .95rem;
	color: var(--color-text, #1d1d1f);
}
.ihwcs-check__input {
	width: 18px;
	height: 18px;
	margin: 0;
	flex: 0 0 auto;
	cursor: pointer;
	accent-color: var(--color-light-blue, #069BE4);
}
.ihwcs-check__label { line-height: 1; }
/* info icon + hover/focus/click tooltip */
.ihwcs-info { position: relative; display: inline-flex; align-items: center; }
.ihwcs-info__btn {
	display: inline-flex;
	align-items: center;
	padding: 0;
	margin: 0;
	border: 0;
	background: none;
	line-height: 1;
	font-size: 1rem;
	cursor: pointer;
	color: var(--color-light-blue, #069BE4);
}
.ihwcs-info__btn:hover { color: var(--color-dark-blue, #1F3986); }
/* position:fixed so the accordion's overflow:hidden can't clip it. JS sets
 * top/left against the icon (and --arrow-left so the arrow still points at it). */
.ihwcs-info__bubble {
	position: fixed;
	top: 0;
	left: 0;
	width: max-content;
	max-width: min(260px, calc(100vw - 24px));
	padding: .55rem .7rem;
	background: var(--color-dark-blue, #1F3986);
	color: #fff;
	font-size: .8rem;
	font-weight: 500;
	line-height: 1.35;
	border-radius: 6px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .15s ease, visibility .15s ease;
	z-index: 9999;
}
.ihwcs-info__bubble::after {
	content: "";
	position: absolute;
	top: 100%;
	left: var(--arrow-left, 50%);
	transform: translateX(-50%);
	border: 6px solid transparent;
	border-top-color: var(--color-dark-blue, #1F3986);
}
/* flipped below the icon (no room above): arrow points up instead */
.ihwcs-info.is-below .ihwcs-info__bubble::after {
	top: auto;
	bottom: 100%;
	border-top-color: transparent;
	border-bottom-color: var(--color-dark-blue, #1F3986);
}
.ihwcs-info:hover .ihwcs-info__bubble,
.ihwcs-info:focus-within .ihwcs-info__bubble,
.ihwcs-info.is-open .ihwcs-info__bubble {
	opacity: 1;
	visibility: visible;
}

/* ---------- providers ---------- */
.ihwcs-providers {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}
.ihwcs-provider {
	flex: 0 0 auto;
	min-width: 120px;
	min-height: 84px;
	padding: .75rem 1rem;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	text-align: center;
	background: #fff;
	border: 2px solid var(--color-border, #d8d8de);
	border-radius: var(--border-radius, 12px);
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.ihwcs-provider:hover { border-color: var(--color-light-blue, #069BE4); }
.ihwcs-provider.is-active {
	border-color: var(--color-light-blue, #069BE4);
	box-shadow: 0 0 0 3px rgba(6, 155, 228, .15);
}
.ihwcs-provider__logo { max-height: 40px; max-width: 100px; width: auto; display: block; }
.ihwcs-provider__name { font-weight: 600; color: var(--color-dark-blue, #1F3986); font-size: .85rem; line-height: 1.2; }

/* ---------- searches head: provider + (VAT toggle / live filter) side by side ---------- *
 * The aside column (VAT toggle above the filter) sits to the right of the
 * provider list when there's room (right- & bottom-aligned), and drops to its
 * own row (still right-aligned) when not.
 */
.ihwcs-searches-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 1rem 1.25rem;
}
.ihwcs-searches-head > .ihwcs-field { margin-bottom: 0; }
.ihwcs-searches-head > .ihwcs-field--full { flex: 1 1 300px; }
.ihwcs-searches-aside {
	flex: 0 1 220px;
	max-width: 220px;
	margin-left: auto;
	display: flex;
	flex-direction: column;
	gap: .6rem;
}
.ihwcs-searches-aside .ihwcs-product-search { width: 100%; }
.ihwcs-product-search__wrap { position: relative; }
.ihwcs-product-search__icon {
	position: absolute;
	right: .8rem;
	top: 50%;
	transform: translateY(-50%);
	color: #888;
	pointer-events: none;
}
.ihwcs-product-search .ihwcs-input { padding-right: 2.2rem; }
.ihwcs-filtered-out { display: none !important; }

/* ---------- product list ---------- */
.ihwcs-products-wrap { margin-top: 1.25rem; }
/* Collapsible product category. The header is a full-width divider whose centre
 * is interrupted by the title + chevron; the body eases open/closed. */
.ihwcs-cat { margin: 1.25rem 0; }
.ihwcs-cat__header {
	display: flex;
	align-items: center;
	gap: 1rem;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	color: var(--color-dark-blue, #1F3986);
}
/* Left-aligned title, then the divider line filling the rest, with the chevron
 * pinned to the far right. */
.ihwcs-cat__header::after {
	content: "";
	order: 1;
	flex: 1 1 auto;
	height: 1px;
	background: var(--color-border, #d8d8de);
}
.ihwcs-cat__title {
	order: 0;
	font-size: .95rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .03em;
	white-space: nowrap;
}
.ihwcs-cat__chev {
	order: 2;
	display: inline-flex;
	color: var(--color-teal, #0872aa);
	transition: transform .25s ease;
}
.ihwcs-cat.is-open .ihwcs-cat__chev,
.ihwcs-searching .ihwcs-cat__chev { transform: rotate(180deg); }

/* Smooth expand/collapse: animate the grid row from 0fr to 1fr (same technique
 * as the step bodies). The inner wrapper is clipped while collapsed. */
.ihwcs-cat__body {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .3s ease;
}
.ihwcs-cat.is-open .ihwcs-cat__body,
.ihwcs-searching .ihwcs-cat__body { grid-template-rows: 1fr; }
.ihwcs-cat__inner { overflow: hidden; min-height: 0; }
.ihwcs-cat.is-open .ihwcs-cat__inner,
.ihwcs-searching .ihwcs-cat__inner { padding-top: .85rem; }

@media (prefers-reduced-motion: reduce) {
	.ihwcs-cat__body, .ihwcs-cat__chev { transition: none; }
}
/*
 * Product grid. auto-fill (not auto-fit) keeps trailing tracks so wrapped rows
 * stay the same width and left-align instead of stretching to fill. The
 * min(360px, 100%) floor lets a card shrink below 360px on narrow screens
 * rather than overflowing the viewport.
 */
.ihwcs-products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(360px, 100%), 1fr));
	gap: .75rem;
}
/* Search packs read better with a bit more room. */
.ihwcs-products:has(.ihwcs-product[data-pack-includes]:not([data-pack-includes=""])) {
	grid-template-columns: repeat(auto-fill, minmax(min(420px, 100%), 1fr));
}

/* Child-category sub-group inside a parent panel: a bordered, legend-titled
 * container mirroring the Order / Property Address groups on the Property step.
 * Sits below the parent category's own products; the title straddles the top
 * border and its background matches the step body so it masks the line behind. */
.ihwcs-subcat {
	position: relative;
	margin-top: 1.6rem;
	border: 1px solid var(--color-border, #d8d8de);
	border-radius: var(--border-radius, 12px);
	padding: 1.35rem 1.1rem 1.1rem;
}
.ihwcs-subcat__title {
	position: absolute;
	top: 0;
	left: .9rem;
	transform: translateY(-50%);
	padding: 0 .5rem;
	background: var(--color-light-bg, #ededed);
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	font-weight: 700;
	color: var(--color-dark-blue, #1F3986);
	white-space: nowrap;
}

.ihwcs-product {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1rem;
	border: 2px solid var(--color-border, #d8d8de);
	border-radius: var(--border-radius, 12px);
	background: #fff;
	transition: border-color .2s ease;
}
.ihwcs-product.is-added { border-color: var(--color-light-blue, #069BE4); background: #f6fcff; }
.ihwcs-product__thumb { flex: 0 0 56px; }
.ihwcs-product__thumb img { width: 56px; height: 56px; object-fit: contain; border-radius: 6px; }
.ihwcs-product__body { flex: 1 1 auto; min-width: 0; }
.ihwcs-product__title { margin: 0 0 .25rem; font-size: 1rem; color: var(--color-heading, #1F3986); }
.ihwcs-product__short { font-size: .9rem; color: #555; }
.ihwcs-product__short p { margin: 0; }
.ihwcs-product__more {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	margin-top: .4rem;
	background: none;
	border: 0;
	padding: 0;
	color: var(--color-light-blue, #069BE4);
	font-size: .85rem;
	font-weight: 600;
	cursor: pointer;
}
.ihwcs-product__more i { transition: transform .2s ease; }
.ihwcs-product__more[aria-expanded="true"] i { transform: rotate(180deg); }
.ihwcs-product__full {
	margin-top: .6rem;
	font-size: .9rem;
	color: #555;
	border-top: 1px dashed var(--color-border, #d8d8de);
	padding-top: .6rem;
}
.ihwcs-product__full p { margin: 0 0 .5rem; }

.ihwcs-product__aside {
	flex: 0 0 auto;
	text-align: right;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: .35rem;
	min-width: 120px;
}
.ihwcs-product__price { font-size: 1.15rem; font-weight: 700; color: var(--color-dark-blue, #1F3986); }
.ihwcs-product__was { display: block; font-size: .8rem; font-weight: 400; text-decoration: line-through; color: #aaa; }
.ihwcs-product__vat { font-size: .75rem; color: #888; margin-top: -.3rem; }
.ihwcs-product__insurance { font-size: .7rem; color: #999; font-style: italic; }
.ihwcs-add {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .5rem .9rem;
	border: 0;
	border-radius: 6px;
	background: var(--color-light-blue, #069BE4);
	color: #fff;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s ease, opacity .2s ease;
}
.ihwcs-add:hover { background: var(--color-dark-blue, #1F3986); }
.ihwcs-add.is-added { background: var(--color-light-blue, #069BE4); opacity: .55; }
.ihwcs-add:disabled { cursor: default; }

/* product included in a selected search pack */
.ihwcs-product.included { opacity: .6; }
.ihwcs-product.included .ihwcs-add { background: #9aa0a6; opacity: 1; cursor: default; }
.ihwcs-product.included .ihwcs-add:hover { background: #9aa0a6; }

/* ---------- compact property recap (Summary step) ---------- */
.ihwcs-summary-prop {
	border: 1px solid var(--color-border, #d8d8de);
	border-radius: var(--border-radius, 12px);
	padding: .75rem 1rem;
	margin-bottom: 1rem;
	background: #fff;
}
.ihwcs-summary-prop__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	margin-bottom: .5rem;
}
.ihwcs-summary-prop__title {
	font-size: .8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .03em;
	color: var(--color-dark-blue, #1F3986);
}
.ihwcs-summary-prop__edit {
	background: none;
	border: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	font-size: .8rem;
	font-weight: 600;
	color: var(--color-light-blue, #069BE4);
	cursor: pointer;
}
.ihwcs-summary-prop__edit:hover { text-decoration: underline; }
.ihwcs-summary-prop__row {
	display: flex;
	gap: .75rem;
	padding: .2rem 0;
	font-size: .9rem;
	line-height: 1.4;
}
.ihwcs-summary-prop__label {
	flex: 0 0 90px;
	color: #777;
	font-weight: 600;
}
.ihwcs-summary-prop__value { flex: 1 1 auto; color: var(--color-text, #374151); }

/* ---------- summary ---------- */
.ihwcs-summary { margin-bottom: 1rem; }
.ihwcs-summary__row {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .6rem 0;
	border-bottom: 1px solid var(--color-light-bg, #ededed);
}
.ihwcs-summary__name { flex: 1 1 auto; }
.ihwcs-summary__price { font-weight: 600; color: var(--color-dark-blue, #1F3986); }
.ihwcs-summary__remove { background: none; border: 0; color: var(--color-red, #DC2118); cursor: pointer; }
.ihwcs-summary__row--insurance .ihwcs-summary__name { color: #777; font-style: italic; }
.ihwcs-summary__row--insurance .ihwcs-summary__price { color: #777; font-weight: 500; }
.ihwcs-summary__total {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1rem;
	background: var(--color-light-bg, #ededed);
	border-radius: var(--border-radius, 12px);
	font-size: 1.1rem;
	margin-bottom: 1.25rem;
}
.ihwcs-summary__total strong { color: var(--color-dark-blue, #1F3986); font-size: 1.25rem; }

.ihwcs-place__msg {
	background: #fde8e7;
	color: var(--color-red, #DC2118);
	padding: .75rem 1rem;
	border-radius: 6px;
	margin-bottom: .75rem;
}

/* ---------- misc ---------- */
.ihwcs-empty, .ihwcs-loading { color: #888; font-style: italic; padding: .5rem 0; }

.ihwcs-confirmation {
	text-align: center;
	padding: 3rem 1.5rem;
	background: var(--color-light-bg, #ededed);
	border-radius: var(--border-radius, 12px);
}
.ihwcs-confirmation__icon { font-size: 3rem; color: #2e8b3d; margin-bottom: 1rem; }
.ihwcs-confirmation h3 { color: var(--color-dark-blue, #1F3986); margin: 0 0 .5rem; }

/* ---------- saved-draft resume panel ---------- */
.ihwcs-drafts {
	border: 1px solid var(--color-light-blue, #069BE4);
	border-radius: 8px;
	background: #f6fcff;
	padding: 1rem 1.25rem;
	margin: 0 0 1.25rem;
}
.ihwcs-drafts__title {
	margin: 0 0 .75rem;
	font-size: 1rem;
	color: var(--color-dark-blue, #1F3986);
}
.ihwcs-drafts__title i { color: var(--color-light-blue, #069BE4); margin-right: .4rem; }
.ihwcs-drafts__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.ihwcs-drafts__item { display: flex; align-items: stretch; gap: .5rem; }
.ihwcs-drafts__link {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .6rem .85rem;
	background: #fff;
	border: 1px solid var(--color-border, #d8d8de);
	border-radius: 6px;
	text-decoration: none;
	color: #1d1d1f;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.ihwcs-drafts__link:hover {
	border-color: var(--color-light-blue, #069BE4);
	box-shadow: 0 0 0 3px rgba(6, 155, 228, .12);
}
.ihwcs-drafts__name { flex: 1 1 auto; font-weight: 600; color: var(--color-dark-blue, #1F3986); }
.ihwcs-drafts__date { font-size: .8rem; color: #888; white-space: nowrap; }
.ihwcs-drafts__link i { color: var(--color-light-blue, #069BE4); }
.ihwcs-drafts__delete {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	background: #fff;
	border: 1px solid var(--color-border, #d8d8de);
	border-radius: 6px;
	color: #9aa0a6;
	cursor: pointer;
	transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.ihwcs-drafts__delete:hover {
	color: #fff;
	background: var(--color-red, #DC2118);
	border-color: var(--color-red, #DC2118);
}
.ihwcs-drafts__delete:disabled { cursor: default; opacity: .6; }

.ihwcs-resuming {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding: .65rem 1rem;
	margin: 0 0 1rem;
	background: #fff8e6;
	border: 1px solid #f0d98a;
	border-radius: 6px;
	font-size: .9rem;
	color: #7a5c00;
}
.ihwcs-resuming i { color: #b58a00; }

/* ---------- save-draft button ---------- */
.ihwcs-save-draft i { color: inherit; }
.ihwcs-save-draft--block { width: 100%; justify-content: center; margin-top: .6rem; }

/* ---------- success modal ---------- */
body.ihwcs-modal-open { overflow: hidden; }
.ihwcs-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.ihwcs-modal[hidden] { display: none; }
.ihwcs-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(20, 28, 56, .55);
}
.ihwcs-modal__dialog {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 440px;
	background: #fff;
	border-radius: 10px;
	padding: 2rem 1.75rem 1.75rem;
	text-align: center;
	box-shadow: 0 18px 50px rgba(0, 0, 0, .3);
	animation: ihwcs-modal-in .2s ease;
}
@keyframes ihwcs-modal-in {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}
.ihwcs-modal__close {
	position: absolute;
	top: .6rem;
	right: .75rem;
	background: none;
	border: 0;
	font-size: 1.1rem;
	color: #9aa0a6;
	cursor: pointer;
	line-height: 1;
}
.ihwcs-modal__close:hover { color: var(--color-red, #DC2118); }
.ihwcs-modal__icon { font-size: 2.75rem; color: #2e8b3d; margin-bottom: .75rem; }
.ihwcs-modal__title { margin: 0 0 .5rem; color: var(--color-dark-blue, #1F3986); }
.ihwcs-modal__text { margin: 0 0 1.25rem; color: #555; }
.ihwcs-modal__actions { display: flex; justify-content: center; }
.ihwcs-modal__actions--split { justify-content: center; gap: .75rem; }

/* confirm modal (provider switch) */
.ihwcs-modal__icon--warn { color: var(--color-red, #DC2118); }
.ihwcs-confirm__list {
	list-style: none;
	margin: 0 0 1.25rem;
	padding: .75rem 1rem;
	background: var(--color-light-bg, #f7f7f7);
	border-radius: 8px;
	text-align: left;
	font-weight: 600;
	color: var(--color-heading, #121724);
}
.ihwcs-confirm__list li { padding: .15rem 0; }
.ihwcs-confirm__list li + li { border-top: 1px solid rgba(0, 0, 0, .06); }

/* ---------- responsive ---------- */
@media (max-width: 640px) {
	.ihwcs-grid { grid-template-columns: 1fr; }
	.ihwcs-product { flex-wrap: wrap; }
	.ihwcs-product__aside { width: 100%; flex-direction: row; justify-content: space-between; align-items: center; text-align: left; margin-top: .5rem; }
	.ihwcs-product__vat { margin-top: 0; }
	.ihwcs-step__actions { flex-wrap: wrap; }
	.ihwcs-step__actions .ihwcs-btn { flex: 1 1 auto; justify-content: center; }
}
