/* CC-Kar ordering system — front-end styling.
   Colors are pulled from this site's own Divi palette (Theme Customizer →
   Divi color scheme: deep green / gold / rose-pink / off-white) so the
   CC-Kar screens read as part of the same site, not a bolted-on plugin.

   Note on !important: Divi applies its own, fairly aggressive global button
   style (large, bold, uppercase-ish) to any element with class="button".
   Our own buttons intentionally carry that class too (so they still look
   like *a* button on this site), so a handful of properties below are
   forced with !important specifically to keep OUR button sizing consistent
   with the surrounding form fields instead of inheriting Divi's oversized
   default — everything else cascades normally. */

:root {
	--prc-green: #1f3d2b;
	--prc-green-hover: #2f5a41;
	--prc-gold: #c9b37e;
	--prc-rose: #b56a6f;
	--prc-ink: #2b2b2b;
	--prc-paper: #f7f6f3;
	--prc-line: #e6e6e3;
	--prc-muted: #8c8c8c;
	--prc-white: #ffffff;
	--prc-radius: 4px;
	--prc-radius-lg: 8px;
	--prc-shadow: 0 1px 3px rgba(31, 61, 43, 0.08), 0 1px 2px rgba(31, 61, 43, 0.06);
	--prc-font: 16px;
}

/* Establish one predictable base size for every "em" below, regardless of
   whatever font-size the surrounding Divi section/row happens to use. */
.prc-kar-builder,
.prc-karren-overzicht,
.prc-account-request-form,
.prc-mix-kar-card,
.prc-quick-add,
.prc-quick-add-link {
	font-size: var(--prc-font);
	line-height: 1.5;
}

.prc-notice {
	padding: 0.9em 1.1em;
	border-radius: var(--prc-radius);
	margin-bottom: 1.2em;
	font-size: 1em;
}
.prc-notice-success {
	background: #eef4ef;
	border: 1px solid var(--prc-green);
	color: var(--prc-green);
}

/* Buttons */
.prc-quick-add button,
.prc-kar-builder__new button,
.prc-account-request-form button,
.prc-mix-kar-card button,
.button.prc-add-btn,
.button.prc-new-kar,
.prc-checkout-btn {
	background: var(--prc-green) !important;
	color: var(--prc-white) !important;
	border: 1px solid var(--prc-green) !important;
	border-radius: 4px !important;
	padding: 0.65em 1.3em !important;
	font-size: 1em !important;
	line-height: 1.4 !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}
.prc-quick-add button:hover,
.prc-kar-builder__new button:hover,
.prc-account-request-form button:hover,
.prc-mix-kar-card button:hover,
.button.prc-add-btn:hover,
.button.prc-new-kar:hover,
.prc-checkout-btn:hover {
	background: var(--prc-green-hover) !important;
	border-color: var(--prc-green-hover) !important;
}

/* Language switcher */
.prc-lang-switcher {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-size: 0.9em;
	letter-spacing: 0.03em;
	margin: 0 0 1.2em;
	padding: 0.35em 0.8em;
	border: 1px solid var(--prc-line);
	border-radius: 999px;
	width: fit-content;
	color: var(--prc-muted);
}
.prc-lang-switcher a {
	color: var(--prc-muted);
	text-decoration: none;
	padding: 0.1em 0.3em;
}
.prc-lang-switcher a.is-active {
	color: var(--prc-green);
	font-weight: 600;
}
.prc-lang-switcher a:hover {
	color: var(--prc-green);
}
.prc-lang-switcher span {
	color: var(--prc-line);
}

/* Assortment grid (shop / archive) — tighten up the default Woo/Divi card
   so the image, title, price and quick-add form read as one compact unit
   instead of the wider default spacing. Scoped to .products so it only
   affects the product grid, not single-product or cart layouts.

   Woo/Divi's default grid is float-based with fixed percentage gutters, so
   the gap between cards stays wide no matter how much card content there
   is. Switching to CSS grid lets the cards themselves grow to fill the
   row, with a much narrower, consistent gap. */
ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 1.4em !important;
}
/* Divi's own stylesheet forces float-era width/margin/clear on product
   cards, at a specificity this plugin's CSS can't beat with a plain
   "ul.products li.product" — worst case (this site has a right sidebar,
   Divi's style.css):
     .et_right_sidebar.woocommerce-page #main-content ul.products
       li.product:nth-child(3n+1) { clear: both !important; margin-right: 60px !important; }
   That's 1 ID + 5 classes/pseudo-classes. Divi's stylesheet also loads
   after this one, so a tied specificity would still favor Divi regardless
   of !important. Anchoring on the same #main-content and repeating
   .product five times (1 ID + 6 classes) reliably outranks it — without
   this, cards render at Divi's float-era width with extra margin inside
   our grid cells, throwing off the whole row (looked like an empty first
   column, since item 1 gets the 60px nth-child(3n+1) margin). */
#main-content ul.products li.product.product.product.product.product {
	width: 100% !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
	padding: 0.9em 0.9em 1.1em !important;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius-lg);
	background: var(--prc-white);
	box-shadow: var(--prc-shadow);
	transition: box-shadow 0.2s ease;
}
/* Under the old float layout an item with no rendered content (e.g. a
   hidden/out-of-stock product Woo still outputs the <li> for) collapsed to
   an invisible sliver. Grid gives every item an equal column instead, which
   turns that same item into a visible empty card — so drop anything with
   no product image rather than reserve it a slot. */
ul.products li.product:not(:has(img)) {
	display: none !important;
}
ul.products li.product:hover {
	box-shadow: 0 2px 8px rgba(31, 61, 43, 0.12), 0 1px 3px rgba(31, 61, 43, 0.08);
}
ul.products li.product img {
	border-radius: var(--prc-radius);
	margin-bottom: 0.6em !important;
}
ul.products li.product .woocommerce-loop-product__title {
	font-size: 1em !important;
	line-height: 1.3;
	margin: 0 0 0.2em !important;
	letter-spacing: 0.01em;
}
ul.products li.product .price {
	font-size: 0.95em !important;
	margin-bottom: 0.2em !important;
	color: var(--prc-ink);
}

/* Table view: same card markup, restyled into compact one-per-row lines so
   the whole assortment (no pagination, see maybe_show_all_in_table_view())
   is scannable at a glance instead of scrolling through a grid of cards. */
body.prc-view-table ul.products {
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
}
/* Same Divi specificity fight as the grid-view rule above — see the
   comment there. Needed here too since Divi's width/margin-right rules
   would otherwise still throw off row sizing under flex just as under
   grid. */
body.prc-view-table #main-content ul.products li.product.product.product.product.product {
	display: flex !important;
	align-items: center !important;
	gap: 1em;
	width: 100% !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
	padding: 0.6em 0.9em !important;
	border: none !important;
	border-bottom: 1px solid var(--prc-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
body.prc-view-table ul.products li.product > a {
	display: flex !important;
	align-items: center !important;
	gap: 1em;
	flex: 1 1 auto;
	min-width: 0;
	text-decoration: none;
}
body.prc-view-table ul.products li.product img {
	width: 3.2em !important;
	height: 3.2em !important;
	object-fit: cover;
	flex-shrink: 0;
	margin-bottom: 0 !important;
}
body.prc-view-table ul.products li.product .woocommerce-loop-product__title {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0 !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
body.prc-view-table ul.products li.product .price {
	flex-shrink: 0;
	margin: 0 !important;
	white-space: nowrap;
}
body.prc-view-table .prc-quick-add {
	flex: 0 0 auto;
	margin-top: 0;
	padding-top: 0;
	padding-bottom: 1rem;
	border-top: none;
	flex-wrap: nowrap;
}
body.prc-view-table .prc-quick-add .prc-kar-type {
	flex: 0 0 auto;
	width: 16em;
}
/* Everything in a row sits on one horizontal centre line. Divi/WooCommerce
   give loop buttons (and sometimes inputs) a top/bottom margin, which pushed
   the quantity + button a few px below the rest of the row. */
body.prc-view-table ul.products li.product .prc-quick-add {
	align-self: center;
	align-items: center;
	margin: 0 !important;
}
body.prc-view-table ul.products li.product .prc-quick-add .button,
body.prc-view-table ul.products li.product .prc-quick-add .prc-qty,
body.prc-view-table ul.products li.product .prc-quick-add button,
body.prc-view-table ul.products li.product .prc-quick-add input {
	margin: 0 !important;
	vertical-align: middle;
}
body.prc-view-table ul.products li.product .prc-quick-add-feedback:empty {
	display: none;
}
body.prc-view-table ul.products li.product > a > * {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	line-height: 1.3;
}
body.prc-view-table .prc-quick-add-link {
	display: none; /* Redundant once every product — and the link's target — is on one page. */
}

/* Quick-add on assortment */
.prc-quick-add {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin-top: 0.6em;
	padding-top: 0.6em;
	border-top: 1px solid var(--prc-line);
	flex-wrap: wrap;
}
.prc-quick-add select {
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	padding: 0.55em 0.65em;
	background: var(--prc-white);
	color: var(--prc-ink);
	font-size: 0.95em;
	line-height: 1.4;
	box-sizing: border-box;
	max-width: 100%;
}
.prc-quick-add .prc-kar-type {
	/* The layer-type label ("3 layers – Buds – bloom 1-2 weeks") is long
	   enough that this select needs the full card width to itself — a flex
	   item won't shrink below its content's natural size otherwise, which
	   is what was pushing it past the card edge. */
	flex: 1 1 100%;
	width: 100%;
	min-width: 0;
	max-width: 100% !important;
}
.prc-quick-add .prc-qty {
	width: 4em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	padding: 0.55em 0.6em;
	font-size: 0.95em;
	line-height: 1.4;
}
.prc-quick-add-feedback {
	font-size: 0.95em;
	color: var(--prc-green);
	font-weight: 600;
}
.prc-quick-add-link {
	margin-top: 0.5em;
}
.prc-quick-add-link a {
	font-size: 0.95em;
	color: var(--prc-gold);
	text-decoration: none;
}
.prc-quick-add-link a:hover {
	text-decoration: underline;
}

/* My CC-Kars (mini overview) */
.prc-karren-overzicht {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1.2em;
}
.prc-kar-card {
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius-lg);
	padding: 1em 1.2em;
	background: var(--prc-white);
	box-shadow: var(--prc-shadow);
}

/* Kar Builder */
.prc-kar-builder {
	max-width: 100%;
}
.prc-kar-builder__new {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5em;
	margin-bottom: 1.4em;
}
.prc-kar-builder__new h3 {
	margin: 0 0 0.2em;
}
.prc-kar-builder__new button {
	padding: 0.55em 1.1em !important;
	font-size: 0.95em !important;
	width: 100%;
	max-width: 24em;
	text-align: left;
}

.prc-kar {
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius-lg);
	padding: 1.1em 1.3em;
	margin-bottom: 1.1em;
	background: var(--prc-white);
	box-shadow: var(--prc-shadow);
}
.prc-kar__header {
	margin-bottom: 0.7em;
	color: var(--prc-ink);
	font-size: 1em;
}
.prc-kar__title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.8em;
	flex-wrap: wrap;
}
.prc-kar__header strong {
	color: var(--prc-green);
	font-size: 1.05em;
}
.prc-remove-kar {
	white-space: nowrap;
	font-size: 0.85em !important;
}
.prc-kar__bar {
	background: var(--prc-paper);
	border: 1px solid var(--prc-line);
	border-radius: 999px;
	height: 8px;
	overflow: hidden;
	margin: 0.5em 0 0.3em;
}
.prc-kar__bar-fill {
	background: var(--prc-green);
	height: 100%;
	transition: width 0.3s ease;
}
.prc-kar__header-main > span {
	font-size: 0.9em;
	color: var(--prc-muted);
}

.prc-laag {
	border-top: 1px dashed var(--prc-line);
	padding: 0.8em 0;
}
.prc-laag:first-of-type {
	border-top: none;
	padding-top: 0.1em;
}
.prc-laag__header {
	font-weight: 700;
	font-size: 1em;
	margin-bottom: 0.5em;
	color: var(--prc-ink);
}
.prc-laag__items {
	list-style: none;
	margin: 0 0 0.6em;
	padding: 0;
}
.prc-laag__items li {
	display: flex;
	align-items: center;
	gap: 0.5em;
	flex-wrap: wrap;
	padding: 0.4em 0.1em;
	border-bottom: 1px solid var(--prc-paper);
	font-size: 0.95em;
}
.prc-laag__item-info {
	display: flex;
	align-items: baseline;
	gap: 0.6em;
	flex-wrap: wrap;
	flex: 1 1 auto;
}
.prc-item-qty-edit,
.prc-resale-price-edit {
	color: var(--prc-muted);
	font-size: 0.85em;
}
.prc-item-price {
	color: var(--prc-muted);
	font-size: 0.85em;
}
.prc-item-qty-edit label,
.prc-resale-price-edit label {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
}
.prc-item-qty-input {
	width: 4em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	padding: 0.35em 0.5em;
	font-size: 1em;
	line-height: 1.4;
}
.prc-resale-price-input {
	width: 6.5em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	padding: 0.35em 0.5em;
	font-size: 1em;
	line-height: 1.4;
}

.prc-kar-builder__checkout {
	margin-top: 1.6em;
	padding-top: 1.4em;
	border-top: 1px solid var(--prc-line);
	text-align: right;
}
.prc-headerboard {
	margin-bottom: 1.2em;
}
.prc-headerboard label {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	font-weight: 600;
	color: var(--prc-ink);
	font-size: 0.95em;
}
.prc-headerboard-qty-input {
	width: 4em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	padding: 0.35em 0.5em;
	font-size: 1em;
	line-height: 1.4;
}
.prc-headerboard p.description {
	margin: 0.35em 0 0;
	font-size: 0.85em;
	color: var(--prc-muted);
}
.prc-checkout-btn {
	display: inline-block;
	text-decoration: none !important;
	padding: 0.75em 1.6em !important;
	font-size: 1.05em !important;
}
.prc-checkout-btn:disabled {
	background: var(--prc-muted) !important;
	border-color: var(--prc-muted) !important;
	cursor: not-allowed;
	opacity: 0.75;
}
/* Why checkout is blocked: one tidy notice box above the (disabled) button,
   instead of a bulleted list squeezed in next to it. */
.prc-checkout-blockers {
	display: block;
	list-style: none !important;
	margin: 0 0 1em !important;
	padding: 0.9em 1.2em !important;
	text-align: left;
	background: #fbf3f3;
	border: 1px solid #efd5d6;
	border-left: 4px solid var(--prc-rose);
	border-radius: var(--prc-radius);
}
.prc-checkout-blockers li {
	list-style: none !important;
	margin: 0 0 0.45em !important;
	padding: 0 0 0 1.5em !important;
	position: relative;
	font-size: 0.9em;
	line-height: 1.5;
	color: #8a3d41;
}
.prc-checkout-blockers li::before {
	content: "!";
	position: absolute;
	left: 0;
	top: 0.15em;
	width: 1.1em;
	height: 1.1em;
	border-radius: 50%;
	background: var(--prc-rose);
	color: #fff;
	font-size: 0.8em;
	font-weight: 700;
	line-height: 1.1em;
	text-align: center;
}
.prc-checkout-blockers li:last-child {
	margin-bottom: 0 !important;
}

.link-button {
	background: none;
	border: none;
	color: var(--prc-rose);
	cursor: pointer;
	padding: 0;
	text-decoration: underline;
	font-size: 0.95em;
}
.link-button:hover {
	color: #954247;
}

/* Account-request / MIX-Kar-request forms */
.prc-account-request-form,
.prc-mix-kar-card {
	max-width: 480px;
	background: var(--prc-white);
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius-lg);
	padding: 1.7em 1.9em;
	box-shadow: var(--prc-shadow);
	margin-bottom: 1.2em;
}
.prc-account-request-form label {
	font-weight: 600;
	color: var(--prc-ink);
	font-size: 1em;
}
.prc-account-request-form input[type="text"],
.prc-account-request-form input[type="email"],
.prc-account-request-form input[type="number"],
.prc-account-request-form textarea,
.prc-account-request-form select {
	width: 100%;
	box-sizing: border-box;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	padding: 0.7em 0.8em;
	margin-top: 0.35em;
	font-size: 1em;
	font-family: inherit;
}
.prc-account-request-form button {
	margin-top: 0.5em;
}
.prc-account-request-form fieldset {
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	margin: 0 0 1.2em;
	padding: 0.2em 1em 0.9em;
}
.prc-account-request-form fieldset p:last-child {
	margin-bottom: 0;
}
.prc-account-request-form legend {
	padding: 0 0.4em;
	font-weight: 600;
	color: var(--prc-ink);
	font-size: 0.95em;
}

/* Responsive: stay usable on phone widths without any horizontal scroll. */
@media (max-width: 782px) {
	body:not(.prc-view-table) ul.products {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	body.prc-view-table ul.products li.product,
	body.prc-view-table ul.products li.product > a {
		flex-wrap: wrap;
	}
	body.prc-view-table .prc-quick-add {
		flex: 1 1 100%;
		flex-wrap: wrap;
	}
	body.prc-view-table .prc-quick-add .prc-kar-type {
		width: 100%;
	}
}
@media (max-width: 480px) {
	ul.products {
		grid-template-columns: 1fr !important;
	}
	.prc-karren-overzicht {
		grid-template-columns: 1fr;
	}
	.prc-quick-add,
	.prc-kar-builder__new {
		flex-direction: column;
		align-items: stretch;
	}
	.prc-account-request-form,
	.prc-mix-kar-card {
		padding: 1.2em;
		max-width: 100%;
	}
}

/* Resale price on the WooCommerce Cart/Checkout blocks (see
   prc-cc-kar-blocks-checkout.js): the added text comes through as a
   newline character after the price, which needs white-space: pre-line to
   actually break onto its own line instead of collapsing into one. */
.wc-block-components-order-summary-item .wc-block-components-product-price,
.wc-block-cart-item__prices .wc-block-components-product-price,
.wc-block-components-totals-item .wc-block-components-product-price {
	white-space: pre-line;
}

/* Collection name, small, under the rose name */
.prc-collection-tag {
	display: block;
	font-size: 0.75em;
	font-weight: 400;
	color: var(--prc-muted);
}

/* Low-stock hint */
.prc-limited-availability {
	color: #b45309;
	font-size: 0.85em;
	font-weight: 600;
}

/* Cart / checkout notices set by the admin */
.prc-cart-notice,
.prc-leverweek-info {
	margin: 0 0 1em;
}
/* The admin's alert text: red, so it is not overlooked. */
.prc-cart-notice,
.prc-cart-notice.woocommerce-info {
	color: #b42318 !important;
	background: #fef3f2 !important;
	border: 2px solid #d92d20 !important;
	border-radius: var(--prc-radius);
	padding: 0.9em 1.1em !important;
	font-weight: 700;
}
.prc-cart-notice::before {
	display: none !important;
}
.prc-cart-notice p {
	margin: 0;
	padding: 0;
	color: inherit;
}
.prc-cart-notice p + p {
	margin-top: 0.4em;
}

/* Weekly order deadline. */
.prc-cutoff-notice {
	margin: 0 0 1em;
	padding: 0.7em 1em;
	border-left: 4px solid var(--prc-gold);
	background: var(--prc-white);
	border-radius: var(--prc-radius);
	font-size: 0.95em;
	color: var(--prc-ink);
}
.prc-cutoff-notice.is-closed {
	border: 2px solid #d92d20;
	background: #fef3f2;
	color: #b42318;
	font-weight: 700;
}

/* Checkout: the eye-catching notice (invoice later, order deadline). */
.prc-checkout-alert {
	margin: 0 0 1.4em;
	padding: 1em 1.2em;
	border: 2px solid #d92d20;
	border-radius: var(--prc-radius);
	background: #fef3f2;
	color: #b42318;
	font-weight: 700;
	font-size: 1.05em;
	line-height: 1.45;
}
.prc-checkout-alert p {
	margin: 0;
	padding: 0;
	color: inherit;
}
.prc-checkout-alert p + p {
	margin-top: 0.5em;
}

/* Grid/table view switch ("Order roses" page) */
.prc-view-switch {
	display: flex;
	gap: 0.6em;
	margin: 0 0 1.2em;
}
.prc-view-switch a {
	padding: 0.5em 1em;
	border: 1px solid var(--prc-line);
	border-radius: 999px;
	font-size: 0.9em;
	color: var(--prc-muted);
	text-decoration: none;
	background: var(--prc-white);
}
.prc-view-switch a.is-active {
	color: var(--prc-white);
	background: var(--prc-green);
	border-color: var(--prc-green);
	font-weight: 600;
}
.prc-view-switch a:not(.is-active):hover {
	border-color: var(--prc-green);
	color: var(--prc-green);
}
/* Grid view filters */
.prc-filter {
	margin: 0 0 1.5em;
}
.prc-filter__groups {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6em;
	align-items: flex-start;
}
.prc-filter__group {
	position: relative;
	background: var(--prc-white);
	border: 1px solid var(--prc-line);
	border-radius: 8px;
	padding: 0.5em 0.9em;
	min-width: 150px;
}
.prc-filter__group summary {
	cursor: pointer;
	font-weight: 600;
	color: var(--prc-green);
}
.prc-filter__group label {
	display: block;
	margin-top: 0.35em;
	font-size: 0.9em;
	white-space: nowrap;
}
.prc-filter__actions {
	display: flex;
	gap: 1em;
	align-items: center;
	margin-top: 0.8em;
}
.prc-filter__actions button {
	background: var(--prc-green);
	color: #fff;
	border: 0;
	border-radius: 4px;
	padding: 0.5em 1.2em;
	font-weight: 600;
	cursor: pointer;
}
.prc-order-roses__cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1.2em;
}
.prc-order-roses__card {
	background: var(--prc-white);
	border-radius: 10px;
	padding: 0.8em;
	display: flex;
	flex-direction: column;
	gap: 0.4em;
}
.prc-order-roses__card img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
}
.prc-order-roses__card-title {
	font-weight: 700;
}

/* "Order roses" page: assortment in table view, grouped per collection */
.prc-order-roses__collection {
	margin: 1.8em 0 0.5em;
	padding-bottom: 0.3em;
	border-bottom: 2px solid var(--prc-green);
	color: var(--prc-green);
}
.prc-order-roses__table {
	width: 100%;
	border-collapse: collapse;
}
.prc-order-roses__table td {
	padding: 0.5em 0.75em;
	vertical-align: middle;
	border-bottom: 1px solid var(--prc-line);
}
.prc-order-roses__barcode {
	font-size: 0.85em;
	color: var(--prc-muted);
	white-space: nowrap;
}
.prc-order-roses__image {
	width: 72px;
}
.prc-order-roses__image img {
	display: block;
	width: 64px;
	height: auto;
}
.prc-order-roses__price,
.prc-order-roses__add {
	white-space: nowrap;
	text-align: right;
}
/* Row form on one line: type, quantity and button side by side, without the
   card-style divider line and spacing of the shop-loop version. */
.prc-order-roses__add .prc-quick-add {
	display: inline-flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.6em;
	margin: 0;
	padding: 0;
	border-top: 0;
	white-space: nowrap;
}
.prc-order-roses__add .prc-quick-add .prc-kar-type {
	width: 19em;
	max-width: none;
}
.prc-order-roses .prc-quick-add {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
}

/* Same width as the header: use all of Divi's own .container (the width the
   header uses too) by dropping the narrow column + (empty) sidebar with its
   divider line that Divi's default page layout reserves. */
body.prc-order-page #main-content .container::before {
	display: none;
}
body.prc-order-page #left-area {
	width: 100%;
	padding-right: 0;
	float: none;
}
body.prc-order-page #sidebar {
	display: none;
}
/* My account (container screens): slimmer menu column, wider content. */
body.prc-order-page.woocommerce-account .woocommerce-MyAccount-navigation {
	width: 18%;
}
body.prc-order-page.woocommerce-account .woocommerce-MyAccount-content {
	width: 78%;
}
@media (max-width: 980px) {
	body.prc-order-page.woocommerce-account .woocommerce-MyAccount-navigation,
	body.prc-order-page.woocommerce-account .woocommerce-MyAccount-content {
		width: 100%;
	}
}
.prc-order-roses .prc-quick-add .prc-qty {
	width: 5em;
}
@media (max-width: 680px) {
	.prc-order-roses__table td { display: block; text-align: left; border-bottom: 0; }
	.prc-order-roses__table tr { display: block; border-bottom: 1px solid var(--prc-line); padding: 0.5em 0; }
}

/* Primary-button menu item in the header navigation.

   Text colour: Divi colours menu links via "#top-menu a" and, once the header
   becomes fixed on scroll, via ".et-fixed-header #top-menu a" and its
   current-page variants (all !important, injected by the Customizer). The
   selectors below match that specificity (ID + classes, via the doubled
   class) and use !important so the text stays white in every state.

   Alignment: the green button is painted with a pseudo-element behind the
   text instead of padding on the link, so the text keeps exactly the same
   baseline as the other menu items (padding would push it down). */
body .prc-menu-button.prc-menu-button > a,
body #top-menu li.prc-menu-button.prc-menu-button > a,
body .et-fixed-header #top-menu li.prc-menu-button.prc-menu-button > a,
body #top-menu li.prc-menu-button.current-menu-item > a,
body #top-menu li.prc-menu-button.current_page_item > a,
body .et-fixed-header #top-menu li.prc-menu-button.current-menu-item > a,
body .et-fixed-header #top-menu li.prc-menu-button.current_page_item > a,
body .et-fixed-header #top-menu li.prc-menu-button.current-menu-ancestor > a,
body #top-menu li.prc-menu-button > a:hover,
body #top-menu li.prc-menu-button > a:focus,
body #top-menu li.prc-menu-button > a:active,
body #top-menu li.prc-menu-button > a:visited,
body .et-fixed-header #top-menu li.prc-menu-button > a:hover,
body .et-fixed-header #top-menu li.prc-menu-button > a:focus,
body .et-fixed-header #top-menu li.prc-menu-button > a:active,
body .et-fixed-header #top-menu li.prc-menu-button > a:visited {
	color: #ffffff !important;
	opacity: 1 !important;
	font-weight: 600;
}
body #top-menu li.prc-menu-button > a {
	position: relative;
	z-index: 1;
	line-height: 24px;
	padding-left: 0 !important;
	padding-right: 0 !important;
	background: none !important;
}
body #top-menu li.prc-menu-button > a::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -6px;
	left: -16px;
	right: -16px;
	height: 36px;
	border-radius: 4px;
	background: var(--prc-green);
	transition: background-color 0.2s ease;
}
body #top-menu li.prc-menu-button > a:hover::before {
	background: var(--prc-green-hover);
}
/* Give the button's own padding-right room so it doesn't touch the next item. */
body #top-menu li.prc-menu-button {
	margin-left: 16px;
}
/* Divi's hover underline/dot effects must not show on the button. */
body #top-menu li.prc-menu-button > a::after {
	display: none !important;
}

/* Mobile menu: plain full-width green item. */
body #mobile_menu li.prc-menu-button > a {
	background: var(--prc-green) !important;
	color: #ffffff !important;
}

/* Header: put the cart icon on the same horizontal axis as the menu text and
   the "Order roses" button (Divi's own margin-top of -2px leaves it a few px
   too high). */
@media (min-width: 981px) {
	/* margin-left: Divi's 22px, plus the 16px the button's background
	   extends past its text, so the visible gap is the usual 22px. */
	body #et-top-navigation .et-cart-info {
		margin-top: 2px;
		margin-left: 38px;
	}
}

/* Container type next to "add" */
.prc-quick-add .prc-kar-type {
	flex: 0 1 auto;
	width: auto;
	max-width: 22em;
	min-width: 0;
}

/* Toast notifications (e.g. "3 added") */
#prc-toasts {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-end;
	pointer-events: none;
}
.prc-toast {
	max-width: 360px;
	padding: 12px 18px;
	border-radius: var(--prc-radius-lg);
	background: var(--prc-green);
	color: #ffffff;
	font-size: 0.95em;
	font-weight: 600;
	line-height: 1.4;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}
.prc-toast::before {
	content: "\2713\00a0";
}
.prc-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.prc-toast--warning {
	background: #8a6d1d;
}
.prc-toast--warning::before {
	content: "\26A0\00a0";
}
.prc-toast--error {
	background: #a33a3a;
}
.prc-toast--error::before {
	content: "\2715\00a0";
}

/* WooCommerce error notices are shown as toasts instead (see prc-cc-kar.js). */
ul.woocommerce-error.prc-toasted,
.wc-block-components-notice-banner.is-error.prc-toasted {
	display: none !important;
}

/* ---------------------------------------------------------------
   Tablets (iPad portrait ≈ 810px up to landscape ≈ 1100px)
   --------------------------------------------------------------- */

/* Order table: the type select, quantity and button no longer fit on one
   line next to the name and price, so the form wraps onto two lines (select
   on top, quantity + button below) instead of pushing the table wider than
   the screen. The photo keeps its width instead of being squeezed shut. */
@media (max-width: 1100px) {
	.prc-order-roses__image {
		width: 72px;
		min-width: 72px;
	}
	.prc-order-roses__image img {
		min-width: 56px;
	}
	.prc-order-roses__add .prc-quick-add {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		white-space: normal;
		width: 300px;
		max-width: 100%;
		margin-left: auto;
	}
	.prc-order-roses__add .prc-quick-add .prc-kar-type {
		flex: 1 1 100%;
		width: 100%;
		min-width: 0;
	}
	.prc-order-roses__add .prc-quick-add .prc-qty {
		flex: 0 0 5em;
	}
	.prc-order-roses__add .prc-quick-add .prc-add-btn {
		flex: 1 1 auto;
	}
	.prc-order-roses__table {
		table-layout: auto;
	}
}

/* Touch screens: finger-sized controls (≥ 44px) and 16px text in fields, so
   iOS doesn't zoom into the page when a field is tapped. */
@media (pointer: coarse) {
	.prc-quick-add .prc-qty,
	.prc-quick-add select,
	.prc-item-qty-input,
	.prc-resale-price-input,
	.prc-headerboard-qty-input {
		min-height: 44px;
		font-size: 16px;
	}
	.prc-item-qty-input,
	.prc-resale-price-input {
		box-sizing: border-box;
		padding-top: 0.4em;
		padding-bottom: 0.4em;
	}
	.prc-remove-item,
	.prc-remove-kar {
		min-width: 44px;
		min-height: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.prc-view-switch a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
		padding-top: 0;
		padding-bottom: 0;
	}
	.prc-filter__group summary {
		min-height: 44px;
		display: flex;
		align-items: center;
	}
	.prc-filter__group label {
		display: flex;
		align-items: center;
		min-height: 40px;
	}
	.prc-filter__actions button,
	.prc-add-btn {
		min-height: 44px;
	}
}

/* Header logo: keep its proportions. The uploaded image carries explicit
   width/height attributes, Divi only caps the height — so a large logo got
   squashed to its full width × a capped height and overlapped the menu. */
#main-header #logo,
.et-fixed-header #logo {
	width: auto !important;
	height: auto !important;
	max-width: 100%;
}

/* Landscape tablets (≈ 981–1199px): the full desktop menu fits, but only just
   — tighten the space between the items so the logo keeps some air. */
@media (min-width: 981px) and (max-width: 1199px) {
	body #top-menu li {
		padding-right: 16px;
	}
	body #top-menu > li:last-child {
		padding-right: 0;
	}
}

/* Standard roses: fixed 5-layer container instead of a type dropdown. */
.prc-kar-fixed {
	display: inline-flex;
	align-items: center;
	min-height: 41px;
	padding: 0 0.8em;
	border: 1px dashed var(--prc-line);
	border-radius: var(--prc-radius);
	font-size: 0.95em;
	color: var(--prc-muted);
	background: #fafafa;
}
.prc-order-roses__add .prc-quick-add .prc-kar-fixed {
	flex: 1 1 auto;
}
@media (max-width: 1100px) {
	.prc-order-roses__add .prc-quick-add .prc-kar-fixed {
		flex: 1 1 100%;
	}
}

/* Landscape tablets: slightly smaller menu text, so logo + 7 items + button +
   cart icon always fit on ONE line (otherwise the cart icon wraps below the
   menu and the header grows). */
@media (min-width: 981px) and (max-width: 1199px) {
	body #top-menu li {
		font-size: 13px;
		padding-right: 14px;
	}
	body #top-menu > li:last-child {
		padding-right: 0;
	}
	body #et-top-navigation {
		white-space: nowrap;
	}
}

/* The type dropdown never makes a product card wider than the card. */
.prc-order-roses__card .prc-quick-add .prc-kar-type,
.prc-order-roses__card .prc-quick-add .prc-kar-fixed {
	flex: 1 1 100%;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

/* Shop / category page in table view on tablets: the row's form wraps under
   the name instead of running off the screen. */
@media (max-width: 1100px) {
	body.prc-view-table ul.products li.product {
		flex-wrap: wrap;
	}
	body.prc-view-table ul.products li.product .prc-quick-add {
		flex: 1 1 100%;
		flex-wrap: wrap;
		justify-content: flex-end;
		max-width: 100%;
	}
	body.prc-view-table ul.products li.product .prc-quick-add .prc-kar-type,
	body.prc-view-table ul.products li.product .prc-quick-add .prc-kar-fixed {
		flex: 1 1 100%;
		width: 100%;
		min-width: 0;
	}
}

/* Grid cards: type on its own line, quantity + button side by side below
   (a column-direction form made the wrapped items spill out to the right). */
.prc-order-roses__card .prc-quick-add {
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	box-sizing: border-box;
}
.prc-order-roses__card .prc-quick-add .prc-qty {
	flex: 0 0 5em;
}
.prc-order-roses__card .prc-quick-add .prc-add-btn {
	flex: 1 1 auto;
}

/* MIX discount: old price struck through, small badge with the percentage. */
.prc-item-price del {
	opacity: 0.55;
	margin-right: 0.3em;
}
.prc-mix-badge {
	display: inline-block;
	margin-left: 0.3em;
	padding: 0 0.45em;
	border-radius: 999px;
	background: var(--prc-green);
	color: #fff;
	font-size: 0.8em;
	font-weight: 600;
}

/* Single product, shop and category pages: there is no sidebar on this shop, so use the whole
   container instead of Divi's 79% content column (with its empty right-hand
   column and dividing line), and keep the add button on a single line. */
body.single-product #main-content .container #left-area,
body.post-type-archive-product #main-content .container #left-area,
body.tax-product_cat #main-content .container #left-area,
body.tax-product_tag #main-content .container #left-area {
	width: 100% !important;
	float: none !important;
	padding-right: 0 !important;
}
body.single-product #main-content .container:before,
body.post-type-archive-product #main-content .container:before,
body.tax-product_cat #main-content .container:before,
body.tax-product_tag #main-content .container:before {
	display: none !important;
}
body.single-product #sidebar,
body.post-type-archive-product #sidebar,
body.tax-product_cat #sidebar,
body.tax-product_tag #sidebar {
	display: none !important;
}
.prc-quick-add button,
.button.prc-add-btn {
	white-space: nowrap !important;
}
body.single-product .summary .prc-quick-add {
	flex-wrap: wrap !important;
}
body.single-product .summary .prc-quick-add .prc-kar-type {
	flex: 1 1 100%;
	width: 100%;
	min-width: 0;
}
@media (max-width: 1100px) {
	body.single-product .summary .prc-quick-add .prc-kar-type {
		flex: 1 1 100%;
		width: 100%;
	}
}

/* Sold out: the controls are disabled and say so up front. */
.prc-sold-out {
	color: #b91c1c;
	font-size: 0.85em;
	font-weight: 700;
	white-space: nowrap;
}
.prc-quick-add--soldout select,
.prc-quick-add--soldout .prc-qty {
	opacity: 0.5;
	cursor: not-allowed;
}
.prc-quick-add--soldout button,
.prc-quick-add--soldout .button.prc-add-btn {
	background: #9ca3af !important;
	border-color: #9ca3af !important;
	cursor: not-allowed !important;
}

/* Shop / category table rows: full rose names (wrapping onto a second line
   instead of being cut off with "…"), a slightly larger photo, and the fixed
   standard-rose label as narrow as the container dropdown of other roses. */
body.prc-view-table ul.products li.product .woocommerce-loop-product__title {
	white-space: normal !important;
	overflow: visible !important;
	text-overflow: clip !important;
	overflow-wrap: anywhere;
}
body.prc-view-table ul.products li.product img {
	width: 4em !important;
	height: 4em !important;
}
body.prc-view-table ul.products li.product .prc-quick-add .prc-kar-fixed {
	display: block;
	flex: 0 0 auto;
	width: 19em;
	min-height: 0;
	white-space: normal;
	line-height: 1.35;
	font-size: 0.85em;
	padding: 0.4em 0.8em;
}

/* ---------------------------------------------------------------
 * Container drawing (cart + summary above the order list)
 * ------------------------------------------------------------- */
.prc-cart-visual {
	display: flex;
	flex-direction: column;
	gap: 3px;
	width: 4.2em;
	flex: 0 0 auto;
	padding: 4px;
	border: 2px solid var(--prc-green);
	border-bottom-width: 3px;
	border-radius: 3px;
	position: relative;
	margin-bottom: 8px;
	background: var(--prc-white);
}
.prc-cart-visual__layer {
	height: 9px;
	background: var(--prc-paper);
	border: 1px solid var(--prc-line);
	border-radius: 2px;
	overflow: hidden;
}
/* Standard-rose layer: as tall as the layers its stems take up (9px each + 3px gaps). */
.prc-cart-visual__layer[style*="--prc-span"] {
	height: calc( var( --prc-span ) * 9px + ( var( --prc-span ) - 1 ) * 5px );
}
.prc-cart-visual__fill {
	display: block;
	height: 100%;
	background: var(--prc-gold);
	transition: width 0.3s ease;
}
.prc-cart-visual__layer.is-full .prc-cart-visual__fill {
	background: var(--prc-green);
}
.prc-cart-visual__layer.is-stamroos .prc-cart-visual__fill {
	background: var(--prc-rose);
}
.prc-cart-visual__wheels {
	position: absolute;
	left: 3px;
	right: 3px;
	bottom: -9px;
	display: flex;
	justify-content: space-between;
}
.prc-cart-visual__wheels span {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--prc-green);
}

/* Container card in the cart: drawing next to the title and bar. */
.prc-kar__header {
	display: flex;
	gap: 1em;
	align-items: flex-start;
}
.prc-kar__header-main {
	flex: 1 1 auto;
	min-width: 0;
}
.prc-kar__header .prc-kar__total {
	display: block;
	margin-top: 0.2em;
	color: var(--prc-ink);
}
.prc-kar-builder__total {
	font-size: 1.15em;
	margin: 0 0 0.8em;
}
.prc-kar-builder__total strong {
	color: var(--prc-green);
}

/* Summary block above the "Order roses" list. */
.prc-order-summary {
	border: 2px solid var(--prc-green);
	border-radius: var(--prc-radius-lg);
	background: var(--prc-paper);
	padding: 1.2em 1.4em;
	margin: 1.2em 0 1.6em;
}
.prc-order-summary__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1em;
	flex-wrap: wrap;
	margin-bottom: 0.8em;
}
.prc-order-summary__head h2 {
	margin: 0;
	padding: 0;
	color: var(--prc-green);
	font-size: 1.4em;
}
.prc-order-summary__head a {
	color: var(--prc-green);
	font-weight: 600;
}
.prc-order-summary__empty {
	margin: 0;
	color: var(--prc-ink);
}
.prc-order-summary__karren {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 13em, 1fr ) );
	gap: 0.8em;
}
.prc-order-summary__kar {
	display: flex;
	gap: 0.9em;
	align-items: flex-start;
	padding: 0.8em;
	background: var(--prc-white);
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	color: var(--prc-ink) !important;
	text-decoration: none !important;
}
.prc-order-summary__kar:hover {
	border-color: var(--prc-green);
}
.prc-order-summary__kar.is-full {
	border-color: var(--prc-green);
}
.prc-order-summary__info {
	display: flex;
	flex-direction: column;
	line-height: 1.35;
	min-width: 0;
}
.prc-order-summary__info strong {
	color: var(--prc-green);
}
.prc-order-summary__info small {
	color: var(--prc-muted);
}
.prc-order-summary__price {
	font-weight: 600;
}
.prc-order-summary__foot {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1.2em;
	flex-wrap: wrap;
	margin-top: 1em;
}
.prc-order-summary__total {
	font-size: 1.15em;
}
.prc-order-summary__total strong {
	color: var(--prc-green);
}
.prc-order-summary__todo {
	color: var(--prc-rose) !important;
	font-weight: 600;
}

/* MIX-Container: the eye-catcher on the order page. */
.prc-mix-button,
a.button.prc-mix-button {
	display: inline-block;
	background: var(--prc-gold) !important;
	color: var(--prc-green) !important;
	border: 2px solid var(--prc-gold) !important;
	border-radius: var(--prc-radius) !important;
	padding: 0.8em 1.5em !important;
	font-size: 1.1em !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	box-shadow: var(--prc-shadow);
}
.prc-mix-button:hover,
a.button.prc-mix-button:hover {
	background: var(--prc-white) !important;
	border-color: var(--prc-gold) !important;
}

/* "Request an account" under the login form, and the sales contact. */
.prc-request-account {
	margin-top: 2em;
	padding: 1.2em 1.4em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius-lg);
	background: var(--prc-paper);
}
.prc-request-account h2 {
	margin-top: 0;
	color: var(--prc-green);
}
.prc-request-account summary {
	cursor: pointer;
	display: inline-block;
	list-style: none;
	margin-bottom: 0.8em;
	background: var(--prc-green);
	color: var(--prc-white) !important;
	border: 1px solid var(--prc-green);
	border-radius: var(--prc-radius);
	padding: 0.6em 1.3em;
	font-weight: 600;
}
.prc-request-account summary:hover {
	background: var(--prc-green-hover);
}
.prc-request-account details[open] summary {
	display: none;
}
.prc-request-account summary::-webkit-details-marker {
	display: none;
}
.prc-sales-contact {
	padding: 1em 1.2em;
	margin-bottom: 1.4em;
	border: 1px solid var(--prc-line);
	border-left: 4px solid var(--prc-green);
	border-radius: var(--prc-radius);
	background: var(--prc-white);
}
.prc-sales-contact h3 {
	margin: 0 0 0.3em;
	padding: 0;
	font-size: 1.05em;
	color: var(--prc-green);
}
.prc-sales-contact p {
	margin: 0;
	padding: 0;
}

@media (max-width: 480px) {
	.prc-kar__header {
		flex-direction: column;
	}
	.prc-order-summary {
		padding: 1em;
	}
	.prc-order-summary__foot {
		justify-content: stretch;
	}
	.prc-order-summary__foot .prc-checkout-btn {
		width: 100%;
		text-align: center;
	}
}

/* ---------------------------------------------------------------
 * Progress bar along the order list (fixed at the bottom once the
 * summary block above the list is scrolled out of view).
 * ------------------------------------------------------------- */
.prc-order-progress {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9990;
	display: flex;
	align-items: center;
	gap: 1em;
	padding: 0.6em 1.2em;
	background: var(--prc-white);
	border-top: 3px solid var(--prc-green);
	box-shadow: 0 -2px 10px rgba(31, 61, 43, 0.15);
	font-size: 15px;
	line-height: 1.3;
	transform: translateY(110%);
	transition: transform 0.25s ease;
}
body.prc-progress-visible .prc-order-progress {
	transform: none;
}
.prc-order-progress__karren {
	display: flex;
	gap: 0.6em;
	flex: 1 1 auto;
	min-width: 0;
	overflow-x: auto;
}
.prc-order-progress__kar {
	display: grid;
	grid-template-columns: auto auto;
	column-gap: 0.6em;
	align-items: baseline;
	flex: 0 0 auto;
	padding: 0.35em 0.7em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
	color: var(--prc-ink) !important;
	text-decoration: none !important;
	background: var(--prc-paper);
}
.prc-order-progress__kar.is-full {
	border-color: var(--prc-green);
}
.prc-order-progress__label {
	font-size: 0.85em;
	color: var(--prc-muted);
}
.prc-order-progress__count {
	font-weight: 700;
	color: var(--prc-green);
}
.prc-order-progress__bar {
	grid-column: 1 / -1;
	height: 4px;
	margin-top: 0.3em;
	background: var(--prc-line);
	border-radius: 2px;
	overflow: hidden;
}
.prc-order-progress__bar span {
	display: block;
	height: 100%;
	background: var(--prc-gold);
}
.prc-order-progress__kar.is-full .prc-order-progress__bar span {
	background: var(--prc-green);
}
.prc-order-progress__foot {
	display: flex;
	align-items: center;
	gap: 1em;
	flex: 0 0 auto;
}
.prc-order-progress__foot strong {
	color: var(--prc-green);
	font-size: 1.1em;
}
.prc-order-progress .prc-checkout-btn {
	margin: 0 !important;
}
/* Room at the bottom so the bar never hides the last rose of the list. */
body.prc-progress-visible {
	padding-bottom: 5em;
}
@media (max-width: 600px) {
	.prc-order-progress {
		flex-wrap: wrap;
		gap: 0.5em;
		padding: 0.5em 0.8em;
	}
	.prc-order-progress__foot {
		width: 100%;
		justify-content: space-between;
	}
	body.prc-progress-visible {
		padding-bottom: 8em;
	}
}

/* ---------------------------------------------------------------
 * My Account → Retail prices.
 * ------------------------------------------------------------- */
.prc-retail-prices__group {
	margin: 0 0 1.4em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius-lg);
	padding: 0.6em 1em 1em;
	background: var(--prc-white);
}
.prc-retail-prices__group summary {
	cursor: pointer;
}
.prc-retail-prices__group summary h3 {
	display: inline;
	color: var(--prc-green);
	padding: 0;
}
.prc-retail-prices__fill {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6em;
	margin: 0.6em 0;
	font-size: 0.9em;
}
.prc-retail-prices__fill input {
	width: 7em;
}
.prc-retail-prices__table {
	width: 100%;
	border-collapse: collapse;
}
.prc-retail-prices__table th,
.prc-retail-prices__table td {
	padding: 0.4em 0.5em;
	border-bottom: 1px solid var(--prc-line);
	text-align: left;
}
.prc-retail-prices__table td:nth-child(2) {
	white-space: nowrap;
	color: var(--prc-muted);
}
.prc-retail-prices__table input {
	width: 7em;
}
.prc-retail-prices__save {
	position: sticky;
	bottom: 0;
	padding: 0.8em 0;
	background: var(--prc-white);
}

/* ---------------------------------------------------------------
 * Checkout: per rose only quantity and price (replaces the per-container lines).
 * ------------------------------------------------------------- */
.prc-checkout-has-summary .wp-block-woocommerce-checkout-order-summary-cart-items-block .wc-block-components-order-summary {
	display: none !important;
}
.prc-checkout-summary {
	padding: 0 16px 8px;
}
.prc-checkout-summary__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9em;
	margin: 0;
}
.prc-checkout-summary__table th,
.prc-checkout-summary__table td {
	padding: 0.45em 0.3em;
	border: 0;
	border-bottom: 1px solid var(--prc-line);
	text-align: left;
	vertical-align: top;
}
.prc-checkout-summary__table th {
	font-size: 0.85em;
	color: var(--prc-muted);
	font-weight: 600;
}
.prc-checkout-summary__table .is-num {
	text-align: right;
	white-space: nowrap;
}

/* Retail price still missing: required before checkout. */
.prc-resale-price-input.is-missing {
	border-color: #d92d20 !important;
	background: #fef3f2 !important;
}

/* Standard-rose container: an optional layer of regular roses still fits. */
.prc-kar__extra-laag {
	margin: 0 0 0.8em;
	padding: 0.6em 0.9em;
	border-left: 4px solid var(--prc-gold);
	background: var(--prc-paper);
	border-radius: var(--prc-radius);
	font-size: 0.95em;
}

/* "I have checked my retail prices" above the checkout button. */
.prc-retail-confirm {
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 0.5em;
	margin: 0 0 0.9em;
	font-weight: 600;
	color: var(--prc-ink);
	cursor: pointer;
	text-align: left;
}
.prc-retail-confirm input {
	margin-top: 0.25em;
	width: 1.1em;
	height: 1.1em;
	accent-color: var(--prc-green);
}

/* Checkout: when WooCommerce scrolls to a field with an error, keep it clear
 * of Divi's fixed header (the error was hidden behind it). */
.wc-block-checkout input,
.wc-block-checkout select,
.wc-block-checkout .wc-block-components-validation-error {
	scroll-margin-top: 140px;
}

/* Toasts stay above the progress bar at the bottom of the order page. */
body.prc-progress-visible #prc-toasts {
	bottom: 110px;
}

/* Retail price fields: the customer's currency (£ or €) in front of the input. */
.prc-currency {
	display: inline-flex;
	align-items: stretch;
	vertical-align: middle;
	max-width: 100%;
}
.prc-currency__symbol {
	display: flex;
	align-items: center;
	padding: 0 0.55em;
	border: 1px solid var(--prc-line);
	border-right: 0;
	border-radius: var(--prc-radius) 0 0 var(--prc-radius);
	background: var(--prc-paper);
	color: var(--prc-ink);
	font-weight: 600;
	line-height: 1;
}
.prc-currency input {
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	margin: 0;
	min-width: 0;
}
.prc-retail-prices__currency select,
.prc-retail-currency select {
	max-width: 100%;
	padding: 0.4em 0.5em;
	border: 1px solid var(--prc-line);
	border-radius: var(--prc-radius);
}
.prc-retail-prices__currency label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.25em;
}

/* "Order roses" grid view: every card the same height, with image, title
   and order form at the same height in every card. */
.prc-order-roses__cards {
	grid-auto-rows: 1fr;
}
.prc-order-roses__card {
	height: 100%;
	box-sizing: border-box;
	min-width: 0;
}
.prc-order-roses__card > a:first-child {
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 8px;
	background: var(--prc-paper);
}
.prc-order-roses__card > a:first-child img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}
.prc-order-roses__card-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	line-height: 1.3;
}
.prc-order-roses__card .prc-collection-tag {
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.prc-order-roses__card .prc-order-roses__barcode {
	height: 20px;
	line-height: 20px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.prc-order-roses__card .prc-quick-add {
	margin-top: auto;
}
/* The availability line ("Temporarily out of stock", "Limited availability")
   gets the same room in every card, also when there is none. */
.prc-order-roses__card .prc-sold-out,
.prc-order-roses__card .prc-limited-availability,
.prc-order-roses__card .prc-quick-add:not(:has(.prc-sold-out, .prc-limited-availability))::before {
	flex: 1 1 100%;
	height: 20px;
	line-height: 20px;
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.prc-order-roses__card .prc-quick-add:not(:has(.prc-sold-out, .prc-limited-availability))::before {
	content: "";
}
.prc-order-roses__card .prc-quick-add .prc-kar-type {
	box-sizing: border-box;
	height: 41px;
}
/* Standard roses have a fixed container type instead of a select: same height. */
.prc-order-roses__card .prc-kar-fixed {
	flex: 1 1 100%;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	gap: 0 0.3em;
	box-sizing: border-box;
	height: 41px;
	min-height: 41px;
	overflow: hidden;
	font-size: 0.85em;
	line-height: 1.2;
}
.prc-retail-prices__table .prc-currency input {
	width: 5.5em;
}
@media (max-width: 480px) {
	.prc-retail-prices__table th,
	.prc-retail-prices__table td {
		padding-left: 0.3em;
		padding-right: 0.3em;
	}
	.prc-retail-prices__table .prc-currency input {
		width: 4.6em;
	}
}