/* =========================================================================
   Pagemix Shop — Storefront
   Design direction: modern portal, editorial rhythm, quiet confidence.
   Palette leans on theme variables when present, has sensible fallbacks.
   ========================================================================= */

:root {
	--pmx-bg:         var(--pagemix-bg,         #f7f5f0);
	--pmx-surface:    var(--pagemix-surface,    #ffffff);
	--pmx-surface-2:  var(--pagemix-surface-2,  #f1ede4);
	--pmx-ink:        var(--pagemix-ink,        #161515);
	--pmx-ink-soft:   var(--pagemix-ink-soft,   #55504a);
	--pmx-ink-mute:   var(--pagemix-ink-mute,   #8a8278);
	--pmx-line:       var(--pagemix-line,       #e2dcce);
	/* Accent is set by admin settings → takes a direct hex, never chains
	   through --pagemix-accent. Admin UI is the single source of truth. */
	--pmx-accent:     #ea5f2c;
	--pmx-accent-ink: #ffffff;
	--pmx-ok:         #2f8f4f;
	--pmx-warn:       #c77200;
	--pmx-err:        #c23b3b;
	--pmx-radius:     10px;
	--pmx-radius-sm:  6px;
	--pmx-shadow:     0 1px 0 rgba(22, 21, 21, 0.04),
	                  0 8px 24px -12px rgba(22, 21, 21, 0.12);
	--pmx-shadow-lg:  0 2px 0 rgba(22, 21, 21, 0.04),
	                  0 24px 48px -24px rgba(22, 21, 21, 0.18);
	--pmx-font-ui:    var(--pagemix-font-ui,    "Inter Tight", "Inter", system-ui, -apple-system, sans-serif);
	--pmx-font-disp:  var(--pagemix-font-display, "Fraunces", "Canela", Georgia, serif);
}

@media (prefers-color-scheme: dark) {
	:root {
		--pmx-bg:         var(--pagemix-bg,         #141210);
		--pmx-surface:    var(--pagemix-surface,    #1c1a18);
		--pmx-surface-2:  var(--pagemix-surface-2,  #252220);
		--pmx-ink:        var(--pagemix-ink,        #f2eee6);
		--pmx-ink-soft:   var(--pagemix-ink-soft,   #c2bdb3);
		--pmx-ink-mute:   var(--pagemix-ink-mute,   #807a70);
		--pmx-line:       var(--pagemix-line,       #363230);
		--pmx-shadow:     0 1px 0 rgba(0,0,0,0.3), 0 8px 24px -12px rgba(0,0,0,0.6);
	}
}

.pmx-buybox, .pmx-shop, .pmx-cart, .pmx-checkout, .pmx-thankyou, .pmx-account, .pmx-mini-cart, .pmx-colleague-shop, .pmx-colleague-gate, .pmx-colleague-simple {
	font-family: var(--pmx-font-ui);
	color: var(--pmx-ink);
	-webkit-font-smoothing: antialiased;
}

/* Card */
.pmx-card {
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
	padding: 1.5rem;
	margin-bottom: 1.25rem;
	box-shadow: var(--pmx-shadow);
}
.pmx-card h2, .pmx-card h3 {
	margin: 0 0 .75rem;
	font-family: var(--pmx-font-disp);
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--pmx-ink);
}

/* Fields */
.pmx-field { display: block; margin-bottom: .9rem; }
.pmx-field label, .pmx-field > span {
	display: block;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--pmx-ink-mute);
	margin-bottom: .35rem;
}
.pmx-checkout input[type=text],
.pmx-checkout input[type=email],
.pmx-checkout input[type=tel],
.pmx-checkout input[type=url],
.pmx-checkout input[type=number],
.pmx-checkout textarea,
.pmx-field input[type=text],
.pmx-field input[type=email],
.pmx-field input[type=tel],
.pmx-field input[type=url],
.pmx-field input[type=number],
.pmx-field select,
.pmx-field textarea {
	width: 100%;
	padding: .65rem .8rem;
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	background: var(--pmx-surface);
	color: var(--pmx-ink);
	font: inherit;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.pmx-field input:focus, .pmx-field select:focus, .pmx-field textarea:focus,
.pmx-checkout input:focus, .pmx-checkout textarea:focus {
	outline: none;
	border-color: var(--pmx-accent);
	box-shadow: 0 0 0 3px color-mix(in oklab, var(--pmx-accent) 25%, transparent);
}
.pmx-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1rem; }

.pmx-check { display: inline-flex; gap: .5rem; align-items: flex-start; margin-right: 1rem; }

/* Buttons */
.pmx-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	padding: .6rem 1rem;
	font: 500 .95rem/1 var(--pmx-font-ui);
	border: 1px solid transparent;
	border-radius: var(--pmx-radius-sm);
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
	transition: transform .08s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.pmx-btn > span { white-space: nowrap; }
.pmx-btn:active { transform: translateY(1px); }

/* Text-link utilities — for secondary actions like "Back", "Cancel", "Empty cart" */
.pmx-link {
	display: inline-block;
	background: transparent;
	border: 0;
	padding: .35rem 0;
	font: inherit;
	color: var(--pmx-ink-mute);
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.pmx-link:hover   { color: var(--pmx-ink); }
.pmx-link--danger { color: var(--pmx-err); }
.pmx-link--danger:hover { filter: brightness(.9); }
.pmx-link--back   { color: var(--pmx-ink-soft); font-size: .9rem; }
.pmx-link--back:hover { color: var(--pmx-accent); }

.pmx-checkout__back { margin: 0 0 1rem; }
.pmx-swish-instructions__cancel {
	text-align: center;
	margin: 1rem 0 0;
	padding-top: .75rem;
	border-top: 1px dashed var(--pmx-line);
}
.pmx-btn-primary { background: var(--pmx-accent); color: var(--pmx-accent-ink); }
.pmx-btn-primary:hover { filter: brightness(.96); }
.pmx-btn-ghost {
	background: transparent; color: var(--pmx-ink);
	border-color: var(--pmx-line);
}
.pmx-btn-ghost:hover { background: var(--pmx-surface-2); }
.pmx-btn-sm { padding: .4rem .7rem; font-size: .85rem; }
.pmx-btn-lg { padding: .85rem 1.25rem; font-size: 1rem; }
.pmx-btn-block { display: flex; width: 100%; margin-top: .5rem; }
.pmx-btn-paypal { background: #ffc439; color: #111; border-color: #e9b02f; }

/* Mini cart */
.pmx-mini-cart {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .4rem .6rem;
	border-radius: 99px;
	color: var(--pmx-ink);
	text-decoration: none;
	background: var(--pmx-surface-2);
	border: 1px solid var(--pmx-line);
	font: 600 .9rem var(--pmx-font-ui);
}
.pmx-mini-cart__count {
	min-width: 1.25rem; padding: 0 .35rem;
	border-radius: 99px;
	background: var(--pmx-accent); color: var(--pmx-accent-ink);
	font-size: .75rem; font-weight: 700;
	text-align: center;
}

/* -------- Shop grid -------- */
.pmx-shop .pmx-grid {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(var(--cols, 3), 1fr);
}
.pmx-shop--cols-1 .pmx-grid { --cols: 1; }
.pmx-shop--cols-2 .pmx-grid { --cols: 2; }
.pmx-shop--cols-3 .pmx-grid { --cols: 3; }
.pmx-shop--cols-4 .pmx-grid { --cols: 4; }
.pmx-shop--cols-5 .pmx-grid { --cols: 5; }
.pmx-shop--cols-6 .pmx-grid { --cols: 6; }
@media (max-width: 900px) { .pmx-shop .pmx-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pmx-shop .pmx-grid { grid-template-columns: 1fr; } }

.pmx-product-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.pmx-product-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--pmx-surface-2);
	overflow: hidden;
}
.pmx-product-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.pmx-product-card:hover .pmx-product-card__media img { transform: scale(1.04); }
.pmx-product-card__placeholder {
	display: grid; place-items: center; height: 100%;
	font-family: var(--pmx-font-disp); font-size: 3rem; color: var(--pmx-ink-mute);
}
.pmx-badge-sale {
	position: absolute; top: .75rem; left: .75rem;
	padding: .25rem .5rem;
	background: var(--pmx-accent); color: var(--pmx-accent-ink);
	font-size: .75rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
	border-radius: 99px;
}
.pmx-product-card__body { padding: 1rem; display: flex; flex-direction: column; gap: .5rem; }
.pmx-product-card__title {
	margin: 0; font: 600 1.05rem/1.25 var(--pmx-font-disp); letter-spacing: -.01em;
}
.pmx-product-card__title a { color: var(--pmx-ink); text-decoration: none; }
.pmx-product-card__price { color: var(--pmx-ink-soft); font-weight: 600; }
.pmx-price--sale { color: var(--pmx-accent); font-weight: 700; }
.pmx-price--strike { color: var(--pmx-ink-mute); text-decoration: line-through; margin-left: .35rem; }

/* Pagination */
.pmx-pagination { display: flex; gap: .4rem; justify-content: center; margin: 1.5rem 0; }
.pmx-pagination .page-numbers {
	padding: .4rem .7rem; border-radius: var(--pmx-radius-sm);
	border: 1px solid var(--pmx-line); color: var(--pmx-ink); text-decoration: none;
}
.pmx-pagination .current { background: var(--pmx-ink); color: var(--pmx-bg); }

/* -------- Buy box -------- */
.pmx-buybox {
	margin-top: 1.5rem; padding: 1.25rem;
	border: 1px solid var(--pmx-line); border-radius: var(--pmx-radius);
	background: var(--pmx-surface);
	box-shadow: var(--pmx-shadow);
}
.pmx-buybox__head {
	display: flex; justify-content: space-between; align-items: baseline;
	gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem;
}
.pmx-buybox__price { font: 600 1.5rem var(--pmx-font-disp); color: var(--pmx-ink); }
.pmx-buybox__variant select {
	padding: .5rem .7rem; border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm); background: var(--pmx-surface); color: var(--pmx-ink);
}
.pmx-buybox__controls {
	display: flex; gap: .75rem; align-items: stretch; flex-wrap: wrap;
}
.pmx-buybox__controls .pmx-qty { flex: 0 0 auto; }
.pmx-buybox__controls .pmx-btn {
	flex: 1 1 auto;
	min-width: 180px;
}
.pmx-buybox__meta { margin: .75rem 0 0; color: var(--pmx-ink-soft); font-size: .9rem; }

/* Qty control */
.pmx-qty { display: flex; border: 1px solid var(--pmx-line); border-radius: var(--pmx-radius-sm); overflow: hidden; }
.pmx-qty__btn {
	width: 2.25rem; border: 0; background: var(--pmx-surface-2);
	cursor: pointer; color: var(--pmx-ink); font-size: 1.1rem;
}
.pmx-qty__btn:hover { background: var(--pmx-line); }
.pmx-qty input { width: 3rem; border: 0; text-align: center; background: var(--pmx-surface); color: var(--pmx-ink); font: inherit; -moz-appearance: textfield; appearance: textfield; }
.pmx-qty input::-webkit-outer-spin-button,
.pmx-qty input::-webkit-inner-spin-button { -webkit-appearance: none; appearance: none; margin: 0; }
.pmx-qty input:focus { outline: none; }

/* -------- Cart -------- */
.pmx-cart__layout {
	display: grid; gap: 1.5rem;
	grid-template-columns: 1fr 340px;
}
@media (max-width: 860px) { .pmx-cart__layout { grid-template-columns: 1fr; } }

.pmx-cart-item {
	display: grid;
	grid-template-columns: 80px 1fr auto auto auto;
	gap: 1rem; align-items: center;
	padding: 1rem; margin-bottom: .75rem;
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
}
.pmx-cart-item__thumb {
	display: block;
	width: 80px; height: 80px;
	aspect-ratio: 1;
	border-radius: var(--pmx-radius-sm);
	background: var(--pmx-surface-2);
	overflow: hidden;
	flex-shrink: 0;
}
.pmx-cart-item__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pmx-cart-item__placeholder { display: grid; place-items: center; height: 100%; color: var(--pmx-ink-mute); font-family: var(--pmx-font-disp); font-size: 1.5rem; }
.pmx-cart-item__body h3 { margin: 0 0 .25rem; font: 600 1rem/1.25 var(--pmx-font-disp); }
.pmx-cart-item__body h3 a { color: var(--pmx-ink); text-decoration: none; }
.pmx-cart-item__meta { margin: 0; color: var(--pmx-ink-mute); font-size: .85rem; }
.pmx-cart-item__unit { margin: .35rem 0 0; color: var(--pmx-ink-soft); font-size: .9rem; }
.pmx-cart-item__line { font-weight: 600; }
.pmx-cart-item__remove {
	background: transparent; border: 0; color: var(--pmx-ink-mute);
	font-size: 1.5rem; cursor: pointer; padding: .2rem .5rem;
	border-radius: 99px; transition: background .15s ease, color .15s ease;
}
.pmx-cart-item__remove:hover { color: var(--pmx-err); background: color-mix(in oklab, var(--pmx-err) 10%, transparent); }
@media (max-width: 560px) {
	.pmx-cart-item { grid-template-columns: 64px 1fr; row-gap: .75rem; }
	.pmx-cart-item__qty, .pmx-cart-item__line, .pmx-cart-item__remove { grid-column: 1 / -1; justify-self: start; }
}

.pmx-cart__summary .pmx-summary-row {
	display: flex; justify-content: space-between;
	padding: .4rem 0; border-bottom: 1px dashed var(--pmx-line);
}
.pmx-summary-note { color: var(--pmx-ink-mute); font-size: .85rem; margin: .5rem 0 1rem; }

/* -------- Checkout -------- */
.pmx-checkout__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 1.5rem;
	align-items: start;
}
@media (max-width: 900px) { .pmx-checkout__layout { grid-template-columns: 1fr; } }
.pmx-checkout__summary { position: sticky; top: 1rem; }

.pmx-shipping-methods { display: flex; flex-direction: column; gap: .5rem; }
.pmx-shipping-method {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: .75rem; row-gap: .25rem;
	padding: .75rem 1rem;
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	cursor: pointer;
	transition: border-color .15s ease, background .15s ease;
}
.pmx-shipping-method:hover { background: var(--pmx-surface-2); }
.pmx-shipping-method input { grid-row: 1 / span 2; align-self: start; margin-top: .2rem; }
.pmx-shipping-method__label { display: flex; justify-content: space-between; gap: 1rem; }
.pmx-shipping-method__cost { color: var(--pmx-accent); font-weight: 600; }
.pmx-shipping-method__desc { color: var(--pmx-ink-mute); font-size: .85rem; grid-column: 2; }
.pmx-shipping-method:has(input:checked) { border-color: var(--pmx-accent); background: color-mix(in oklab, var(--pmx-accent) 6%, var(--pmx-surface)); }

.pmx-summary-items { list-style: none; padding: 0; margin: 0 0 1rem; }
.pmx-summary-items li {
	display: grid; grid-template-columns: 1fr auto; gap: .25rem 1rem;
	padding: .5rem 0; border-bottom: 1px dashed var(--pmx-line);
	font-size: .9rem;
}
.pmx-summary-items__title { grid-column: 1; font-weight: 600; }
.pmx-summary-items__meta  { grid-column: 1; color: var(--pmx-ink-mute); font-size: .8rem; }
.pmx-summary-items__price { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-weight: 600; }

.pmx-summary-row {
	display: flex; justify-content: space-between; padding: .35rem 0;
}
.pmx-summary-row--muted {
	color: var(--pmx-ink-mute);
	font-size: .85rem;
	font-style: italic;
}
.pmx-summary-row--total {
	margin-top: .75rem; padding-top: .75rem;
	border-top: 1px solid var(--pmx-ink);
	font-size: 1.1rem; font-weight: 700; font-family: var(--pmx-font-disp);
}

.pmx-pay-methods { margin-top: 1rem; }
#pmx-paypal-buttons { min-height: 50px; }
.pmx-checkout__error {
	color: var(--pmx-err); background: color-mix(in oklab, var(--pmx-err) 10%, transparent);
	padding: .6rem .8rem; border-radius: var(--pmx-radius-sm); margin-top: .75rem;
}

/* -------- Thank you -------- */
.pmx-thankyou__head { text-align: center; margin: 2rem 0 1.5rem; }
.pmx-thankyou__seal {
	width: 64px; height: 64px; margin: 0 auto 1rem;
	display: grid; place-items: center;
	background: var(--pmx-ok); color: #fff;
	border-radius: 99px; font-size: 2rem; font-weight: 700;
	line-height: 1;
}
.pmx-thankyou__seal--ok   { background: var(--pmx-ok); }
.pmx-thankyou__seal--err  { background: var(--pmx-err); }
.pmx-thankyou__seal--wait {
	background: var(--pmx-surface-2);
	color: var(--pmx-ink-soft);
	border: 1px dashed var(--pmx-ink-mute);
	font-size: 1.75rem;
	padding-bottom: .35rem;
}
.pmx-thankyou__head--wait h1 { color: var(--pmx-ink); }
.pmx-thankyou__head--wait p  { color: var(--pmx-ink-soft); }
.pmx-thankyou h1 { font-family: var(--pmx-font-disp); font-size: 2.5rem; margin: 0; }
.pmx-downloads { list-style: none; padding: 0; margin: 0; }
.pmx-download {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: .9rem 0; border-bottom: 1px dashed var(--pmx-line); flex-wrap: wrap;
}
.pmx-download__title { font-weight: 600; }
.pmx-download__meta { color: var(--pmx-ink-mute); font-size: .85rem; }

/* -------- Tables -------- */
.pmx-table { width: 100%; border-collapse: collapse; }
.pmx-table th, .pmx-table td { padding: .6rem .5rem; text-align: left; border-bottom: 1px solid var(--pmx-line); }
.pmx-table th { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--pmx-ink-mute); }
.pmx-table tfoot td { font-weight: 600; }

/* Empty state */
.pmx-empty-state {
	text-align: center; padding: 3rem 1rem;
	color: var(--pmx-ink-soft);
}
.pmx-empty-state h1, .pmx-empty-state h2 { font-family: var(--pmx-font-disp); }
.pmx-empty-state__mark { color: var(--pmx-ink-mute); margin-bottom: 1rem; }
.pmx-empty-state .pmx-btn {
	width: auto; min-width: 160px;
	margin-top: 1rem;
}

/* Toast */
.pmx-toast {
	position: fixed; bottom: 1.25rem; right: 1.25rem; z-index: 9999;
	padding: .75rem 1rem; border-radius: var(--pmx-radius);
	background: var(--pmx-ink); color: var(--pmx-bg);
	font: 500 .9rem var(--pmx-font-ui);
	box-shadow: var(--pmx-shadow-lg);
	opacity: 0; transform: translateY(10px);
	transition: opacity .2s ease, transform .2s ease;
	pointer-events: none;
}
.pmx-toast.is-visible { opacity: 1; transform: translateY(0); }
.pmx-toast--ok { background: var(--pmx-ok); }
.pmx-toast--err { background: var(--pmx-err); }

/* =========================================================================
   Cart modal — post-add-to-cart dialog
   ========================================================================= */
body.pmx-modal-open { overflow: hidden; }

.pmx-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: grid;
	place-items: center;
	padding: 1rem;
	opacity: 0;
	transition: opacity .18s ease;
}
.pmx-modal.is-open { opacity: 1; }

.pmx-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(22, 21, 21, var(--pmx-modal-backdrop-opacity, 0.55));
	backdrop-filter: blur(4px);
	cursor: pointer;
}

.pmx-modal__dialog {
	position: relative;
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
	box-shadow: var(--pmx-shadow-lg);
	padding: 1.75rem;
	width: min(100%, 460px);
	max-height: 90vh;
	overflow-y: auto;
	transform: translateY(16px) scale(.98);
	transition: transform .2s cubic-bezier(.2, .9, .3, 1.2);
}
.pmx-modal.is-open .pmx-modal__dialog { transform: translateY(0) scale(1); }

.pmx-modal__close {
	position: absolute; top: .5rem; right: .5rem;
	width: 2rem; height: 2rem;
	border: 0; background: transparent;
	color: var(--pmx-ink-mute); font-size: 1.5rem;
	cursor: pointer; border-radius: 99px;
	transition: background .15s, color .15s;
}
.pmx-modal__close:hover { background: var(--pmx-surface-2); color: var(--pmx-ink); }

.pmx-modal__head {
	display: flex; align-items: center; gap: .75rem;
	margin-bottom: 1.25rem;
}
.pmx-modal__seal {
	width: 36px; height: 36px;
	display: grid; place-items: center;
	background: var(--pmx-ok); color: #fff;
	border-radius: 99px; font-weight: 700; font-size: 1.1rem;
	flex-shrink: 0;
}
.pmx-modal__head h2 {
	margin: 0; font-family: var(--pmx-font-disp);
	font-size: 1.35rem; font-weight: 600; letter-spacing: -.01em;
}

.pmx-modal__item {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	gap: 1rem;
	align-items: center;
	padding: .9rem;
	margin-bottom: 1rem;
	background: var(--pmx-surface-2);
	border-radius: var(--pmx-radius-sm);
}
.pmx-modal__thumb {
	width: 56px; height: 56px;
	border-radius: var(--pmx-radius-sm);
	overflow: hidden;
	background: var(--pmx-surface);
	display: grid; place-items: center;
}
.pmx-modal__thumb img { width: 100%; height: 100%; object-fit: cover; }
.pmx-modal__thumb-fallback {
	font-family: var(--pmx-font-disp); font-size: 1.5rem;
	color: var(--pmx-ink-mute);
}
.pmx-modal__item-body { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.pmx-modal__item-body strong { font-weight: 600; }
.pmx-modal__item-body span { color: var(--pmx-ink-mute); font-size: .85rem; }
.pmx-modal__price { font-weight: 600; font-size: .95rem; }

.pmx-modal__sub {
	margin: 0 0 .25rem;
	color: var(--pmx-ink);
	font-size: .95rem;
}
.pmx-modal__count {
	margin: 0 0 1.25rem;
	color: var(--pmx-ink-mute);
	font-size: .85rem;
}

.pmx-modal__actions {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}
.pmx-modal__actions .pmx-btn,
.pmx-modal .pmx-btn {
	width: 100%;
	min-width: 0;
	max-width: none;
	justify-content: center;
	text-align: center;
	box-sizing: border-box;
	border-radius: var(--pmx-radius-sm);
	height: auto;
}
@media (min-width: 480px) {
	.pmx-modal__actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: .5rem;
	}
	.pmx-modal__actions .pmx-btn-primary {
		grid-column: 1 / -1;
	}
}

/* Account */
.pmx-account__head { margin: 1rem 0 1.5rem; }
.pmx-account__head h1 { font-family: var(--pmx-font-disp); font-size: 2rem; margin: 0; }
.pmx-account__head p { color: var(--pmx-ink-mute); margin: .25rem 0 0; }

/* Badges (status) */
.pmx-badge {
	display: inline-block; padding: .25rem .5rem;
	font-size: .75rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
	border-radius: 99px; border: 1px solid var(--pmx-line);
}
.pmx-badge--pending    { background: #fff7e6; color: #a55f00; border-color: #f0d9a5; }
.pmx-badge--processing { background: #e8f1ff; color: #1f4aa0; border-color: #c4d6f3; }
.pmx-badge--completed  { background: #e6f7ec; color: #186a3b; border-color: #b5e0c4; }
.pmx-badge--cancelled  { background: #f4f4f4; color: #555;    border-color: #d9d9d9; }
.pmx-badge--refunded   { background: #f4e8ff; color: #5e2a9c; border-color: #dfc8f2; }
.pmx-badge--failed     { background: #fde8e8; color: #9c2a2a; border-color: #f2c8c8; }

/* =========================================================================
   Gateway picker
   ========================================================================= */
.pmx-gateway-picker {
	display: grid;
	gap: .5rem;
	margin-bottom: 1rem;
}
.pmx-gateway {
	display: grid;
	grid-template-columns: auto auto 1fr;
	align-items: center;
	gap: .75rem;
	padding: .75rem 1rem;
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	cursor: pointer;
	background: var(--pmx-surface);
	transition: border-color .15s ease, background .15s ease;
}
.pmx-gateway:hover { background: var(--pmx-surface-2); }
.pmx-gateway:has(input:checked) {
	border-color: var(--pmx-accent);
	background: color-mix(in oklab, var(--pmx-accent) 6%, var(--pmx-surface));
}
.pmx-gateway__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex-shrink: 0;
}
.pmx-gateway__mark img,
.pmx-gateway__mark svg { max-width: 100%; max-height: 100%; width: auto; height: auto; }

/* Admin-uploaded gateway icon inside buttons and gateway cards.
   Force a consistent square footprint so images with extra ornamentation
   (wordmarks, ® symbols, whitespace) sit visually centered in the row. */
.pmx-gateway-icon-img {
	display: block;
	width: 22px;
	height: 22px;
	object-fit: contain;
	flex-shrink: 0;
}
.pmx-btn .pmx-gateway-icon-img {
	width: 22px;
	height: 22px;
	/* Optical centering — most gateway logos (Swish, PayPal) include a
	   wordmark under the main mark, making the bounding-box center too
	   high. A tiny downward nudge aligns the optical center with text. */
	transform: translateY(1px);
}
.pmx-gateway__body { display: flex; flex-direction: column; line-height: 1.25; }
.pmx-gateway__body strong { font-weight: 600; }
.pmx-gateway__body small  { color: var(--pmx-ink-mute); font-size: .8rem; }

.pmx-gateway-ui { margin-top: .75rem; }
.pmx-gateway-ui[hidden] { display: none; }

/* =========================================================================
   Swish — checkout button area
   ========================================================================= */
.pmx-swish-checkout__hint {
	color: var(--pmx-ink-soft);
	font-size: .9rem;
	margin: 0 0 .75rem;
}

/* =========================================================================
   Swish — thank-you instructions
   ========================================================================= */
.pmx-swish-instructions {
	background: linear-gradient(180deg, color-mix(in oklab, var(--pmx-swish-tint, #EF2E7F) 6%, var(--pmx-surface)) 0%, var(--pmx-surface) 100%);
	border-color: color-mix(in oklab, var(--pmx-swish-tint, #EF2E7F) 30%, var(--pmx-line));
}
.pmx-swish-instructions--error {
	background: color-mix(in oklab, var(--pmx-warn) 6%, var(--pmx-surface));
	border-color: color-mix(in oklab, var(--pmx-warn) 30%, var(--pmx-line));
}
.pmx-swish-instructions h2 {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin-bottom: .25rem;
}

.pmx-swish-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: .75rem;
	margin: 1.25rem 0;
}
.pmx-swish-field {
	display: flex;
	flex-direction: column;
	padding: .75rem 1rem;
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
}
.pmx-swish-field__label {
	font-size: .72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--pmx-ink-mute);
	margin-bottom: .25rem;
}
.pmx-swish-field__value {
	font-family: var(--pmx-font-disp);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--pmx-ink);
	letter-spacing: -.005em;
	word-break: break-all;
}

.pmx-copy {
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
	text-align: left;
	position: relative;
	appearance: none;
	-webkit-appearance: none;
	font: inherit;
	color: inherit;
	transition: color .15s ease;
}
.pmx-copy::after {
	content: "⧉";
	position: absolute;
	right: -1.25rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--pmx-ink-mute);
	font-size: .9rem;
	opacity: 0;
	transition: opacity .15s ease;
}
.pmx-copy:hover { color: var(--pmx-accent); }
.pmx-copy:hover::after { opacity: 1; }
.pmx-copy.is-copied::after {
	content: "✓";
	color: var(--pmx-ok);
	opacity: 1;
}

.pmx-swish-qr {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 1.5rem 0 .5rem;
	padding: 1.25rem;
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
}
.pmx-swish-qr--fallback {
	border-style: dashed;
}
.pmx-swish-qr--fallback .pmx-btn {
	min-width: 200px;
}
.pmx-admin-debug {
	margin-top: 1rem;
	padding: .75rem 1rem;
	background: #fff7e6;
	border: 1px dashed #c77200;
	border-radius: var(--pmx-radius-sm);
	font-size: .8rem;
	color: #664400;
	text-align: left;
	max-width: 100%;
	word-break: break-word;
}
.pmx-admin-debug code {
	background: rgba(0,0,0,.06);
	padding: .1rem .3rem;
	border-radius: 3px;
	font-size: .85em;
}
.pmx-admin-debug small { color: #7a5a00; }
.pmx-swish-qr img {
	max-width: 260px;
	height: auto;
	border-radius: var(--pmx-radius-sm);
}
.pmx-swish-qr__hint {
	margin: .75rem 0 0;
	color: var(--pmx-ink-mute);
	font-size: .85rem;
}
.pmx-swish-qr__deeplink {
	display: inline-block;
	margin-top: .5rem;
	color: var(--pmx-accent);
	font-size: .85rem;
	text-decoration: underline;
}
.pmx-swish-qr__deeplink:hover { filter: brightness(.9); }

.pmx-swish-instructions__note {
	margin: 1rem 0 0;
	padding-top: 1rem;
	border-top: 1px dashed var(--pmx-line);
	color: var(--pmx-ink-soft);
	font-size: .85rem;
	text-align: center;
}


/* Private colleague ordering */
.pmx-colleague-gate {
	max-width: 620px;
	margin: 2rem auto;
	padding: clamp(1.25rem, 3vw, 2rem);
}
.pmx-colleague-gate__form { margin-top: 1.25rem; }
.pmx-colleague-kicker {
	margin: 0 0 .35rem;
	font-size: .78rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--pmx-accent);
}
.pmx-colleague-note {
	padding: .75rem .9rem;
	border: 1px dashed var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	background: var(--pmx-surface-2);
	color: var(--pmx-ink-soft);
}
.pmx-colleague-simple {
	max-width: 820px;
	margin: 1.75rem auto;
}
.pmx-colleague-simple__hero {
	padding: clamp(1.25rem, 3vw, 2rem);
	margin-bottom: 1rem;
}
.pmx-colleague-simple__hero h2 {
	margin: .15rem 0 .6rem;
	font-size: clamp(2rem, 6vw, 4rem);
	line-height: .95;
	letter-spacing: -.05em;
}
.pmx-colleague-simple__lead {
	max-width: 58ch;
	color: var(--pmx-ink-soft);
}
.pmx-colleague-simple__step {
	margin: 1.15rem 0;
	padding: 1rem 1.1rem;
	border-left: 4px solid var(--pmx-accent);
	border-radius: var(--pmx-radius-sm);
	background: color-mix(in srgb, var(--pmx-accent) 8%, var(--pmx-surface));
	color: var(--pmx-ink);
}
.pmx-colleague-simple__step strong { margin-right: .25rem; }
.pmx-colleague-simple__swish-number {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	margin: .25rem 0 1rem;
	padding: .55rem .7rem;
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	background: var(--pmx-surface-2);
}
.pmx-colleague-simple__swish-number span {
	font-size: .8rem;
	color: var(--pmx-ink-mute);
}
.pmx-colleague-simple__swish-number button,
.pmx-colleague-simple-choice__message button {
	appearance: none;
	border: 0;
	background: transparent;
	padding: 0;
	color: var(--pmx-ink);
	font: inherit;
	font-weight: 800;
	text-decoration: underline;
	text-decoration-style: dotted;
	cursor: pointer;
}
.pmx-colleague-simple__lock {
	display: inline-block;
	margin-top: .5rem;
	font-size: .82rem;
	color: var(--pmx-ink-mute);
	text-decoration: underline;
}
.pmx-colleague-simple__list {
	display: grid;
	gap: 1rem;
}
.pmx-colleague-simple-card {
	display: grid;
	grid-template-columns: minmax(95px, 150px) 1fr;
	gap: clamp(1rem, 3vw, 1.5rem);
	align-items: start;
	padding: clamp(1rem, 3vw, 1.4rem);
}
.pmx-colleague-simple-card__media {
	text-align: center;
}
.pmx-colleague-simple-card__media img {
	max-width: 100%;
	height: auto;
	max-height: 230px;
	object-fit: contain;
	border-radius: var(--pmx-radius-sm);
}
.pmx-colleague-simple-card__body {
	display: flex;
	flex-direction: column;
	gap: .75rem;
}
.pmx-colleague-simple-card__body h3 {
	margin: 0;
	font-size: clamp(1.25rem, 3vw, 2rem);
	line-height: 1;
	letter-spacing: -.035em;
}
.pmx-colleague-simple-card__excerpt {
	margin: 0;
	color: var(--pmx-ink-soft);
}
.pmx-colleague-simple-card__variants {
	display: grid;
	gap: .75rem;
}
.pmx-colleague-simple-choice {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .9rem 1rem;
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
	background: var(--pmx-surface-2);
}
.pmx-colleague-simple-choice__main {
	display: grid;
	gap: .35rem;
}
.pmx-colleague-simple-choice__label {
	font-size: .82rem;
	font-weight: 800;
	color: var(--pmx-ink-soft);
}
.pmx-colleague-simple-choice__price {
	display: flex;
	align-items: baseline;
	gap: .55rem;
	line-height: 1;
}
.pmx-colleague-simple-choice__price strong {
	font-size: clamp(1.3rem, 4vw, 2.25rem);
	color: var(--pmx-accent);
}
.pmx-colleague-simple-choice__price del {
	color: var(--pmx-ink-mute);
}
.pmx-colleague-simple-choice__message {
	margin: 0;
	color: var(--pmx-ink-soft);
	font-size: .92rem;
}
.pmx-colleague-simple-choice__message span { margin-right: .25rem; }
.pmx-colleague-simple-choice__pay {
	white-space: nowrap;
}
.pmx-colleague-simple-card__small {
	margin: .1rem 0 0;
	color: var(--pmx-ink-mute);
	font-size: .86rem;
}
.pmx-price-note {
	display: inline-flex;
	align-items: center;
	margin-left: .35rem;
	padding: .12rem .45rem;
	border-radius: 999px;
	background: var(--pmx-surface-2);
	color: var(--pmx-accent);
	font-size: .72rem;
	font-weight: 800;
	vertical-align: middle;
}
@supports not (background: color-mix(in srgb, #000 50%, #fff)) {
	.pmx-colleague-simple__step { background: var(--pmx-surface-2); }
}
@media (max-width: 720px) {
	.pmx-colleague-simple-card {
		grid-template-columns: 1fr;
	}
	.pmx-colleague-simple-card__media {
		max-width: 160px;
	}
	.pmx-colleague-simple-choice {
		align-items: stretch;
		flex-direction: column;
	}
	.pmx-colleague-simple-choice__pay {
		width: 100%;
		justify-content: center;
	}
}

/* Colleague Swish buttons + modal checkout (no cart flow) */
.pmx-colleague-buttons,
.pmx-colleague-button,
.pmx-colleague-modal {
	font-family: var(--pmx-font-ui);
	color: var(--pmx-ink);
	-webkit-font-smoothing: antialiased;
}
.pmx-colleague-buttons {
	max-width: 760px;
	margin: 1.25rem auto;
}
.pmx-colleague-buttons__head h2 {
	margin: 0 0 .9rem;
	font-size: clamp(1.35rem, 3vw, 2rem);
	letter-spacing: -.03em;
}
.pmx-colleague-buttons__list {
	display: flex;
	flex-wrap: wrap;
	gap: .7rem;
}
.pmx-colleague-button {
	appearance: none;
	border: 1px solid color-mix(in srgb, var(--pmx-accent) 45%, var(--pmx-line));
	background: var(--pmx-accent);
	color: var(--pmx-accent-ink);
	border-radius: 999px;
	box-shadow: 0 10px 26px -18px color-mix(in srgb, var(--pmx-accent) 70%, #000);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	font: inherit;
	font-weight: 800;
	line-height: 1;
	padding: .75rem 1rem;
	text-decoration: none;
	transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}
.pmx-colleague-button:hover,
.pmx-colleague-button:focus-visible {
	transform: translateY(-1px);
	box-shadow: 0 14px 32px -20px color-mix(in srgb, var(--pmx-accent) 80%, #000);
}
.pmx-colleague-button:disabled { opacity: .65; cursor: wait; }
.pmx-swish-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	height: 1.25em;
	line-height: 0;
	width: 1.25em;
}
.pmx-swish-icon svg,
.pmx-swish-icon img {
	display: block;
	height: 100%;
	object-fit: contain;
	width: 100%;
}
.pmx-colleague-button__icon {
	height: 1.15em;
	width: 1.15em;
}
.pmx-colleague-button__swish {
	background: rgba(255,255,255,.18);
	border-radius: 999px;
	font-size: .74em;
	letter-spacing: .04em;
	padding: .28rem .45rem;
	text-transform: uppercase;
}
.pmx-colleague-button--card {
	font-size: .9rem;
	padding: .62rem .82rem;
}
.pmx-colleague-button--single,
.pmx-colleague-button--page {
	font-size: 1rem;
	padding: .82rem 1.05rem;
}
.pmx-colleague-button-note {
	display: inline-block;
	font-size: .85rem;
	color: var(--pmx-err);
}
.pmx-colleague-modal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s ease;
}
.pmx-colleague-modal.is-open {
	opacity: 1;
	pointer-events: auto;
}
.pmx-colleague-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(18, 17, 16, .52);
	backdrop-filter: blur(6px);
}
.pmx-colleague-modal__dialog {
	position: relative;
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: calc(var(--pmx-radius) + 8px);
	box-shadow: var(--pmx-shadow-lg);
	margin: min(8vh, 56px) auto;
	max-height: calc(100vh - 48px);
	max-width: 720px;
	overflow: auto;
	padding: clamp(1.1rem, 3vw, 1.75rem);
	width: min(calc(100vw - 28px), 720px);
	transform: translateY(10px) scale(.98);
	transition: transform .18s ease;
}
.pmx-colleague-modal.is-open .pmx-colleague-modal__dialog {
	transform: none;
}
.pmx-colleague-modal__close {
	appearance: none;
	background: var(--pmx-surface-2);
	border: 1px solid var(--pmx-line);
	border-radius: 999px;
	color: var(--pmx-ink);
	cursor: pointer;
	font-size: 1.25rem;
	font-weight: 700;
	height: 2.15rem;
	line-height: 1;
	position: absolute;
	right: .8rem;
	top: .8rem;
	width: 2.15rem;
}
.pmx-colleague-modal__kicker {
	align-items: center;
	color: var(--pmx-accent);
	display: inline-flex;
	font-size: .75rem;
	font-weight: 900;
	gap: .45rem;
	letter-spacing: .12em;
	margin: 0 2.5rem .3rem 0;
	text-transform: uppercase;
}
.pmx-colleague-modal__kicker .pmx-swish-icon {
	height: 1.35em;
	letter-spacing: 0;
	text-transform: none;
	width: 1.35em;
}
.pmx-colleague-code h2,
.pmx-colleague-pay h2 {
	font-family: var(--pmx-font-disp);
	font-size: clamp(1.5rem, 4vw, 2.35rem);
	letter-spacing: -.04em;
	line-height: 1;
	margin: 0 2.5rem .6rem 0;
}
.pmx-colleague-modal__lead,
.pmx-colleague-code__book {
	color: var(--pmx-ink-soft);
	margin: 0 0 1rem;
}
.pmx-colleague-code__book {
	background: var(--pmx-surface-2);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	padding: .7rem .8rem;
}
.pmx-colleague-code__form .pmx-btn { margin-top: .2rem; }
.pmx-colleague-pay__head {
	display: grid;
	grid-template-columns: minmax(86px, var(--pmx-colleague-cover-size, 112px)) 1fr;
	gap: clamp(.9rem, 2.6vw, 1.25rem);
	margin-bottom: 1rem;
	align-items: center;
}
.pmx-colleague-pay__cover {
	align-self: start;
	background: var(--pmx-surface-2);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	padding: .35rem;
	text-align: center;
}
.pmx-colleague-pay__cover img,
.pmx-colleague-pay__cover .rmp-cover-placeholder {
	display: block;
	height: auto;
	max-height: calc(var(--pmx-colleague-cover-size, 112px) * 1.55);
	max-width: 100%;
	object-fit: contain;
	width: var(--pmx-colleague-cover-size, 112px);
}
.pmx-colleague-pay__selected {
	background: var(--pmx-surface-2);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	font-weight: 800;
	margin: 0 0 .9rem;
	padding: .75rem .85rem;
}
.pmx-colleague-pay__grid {
	display: grid;
	grid-template-columns: 1fr 120px;
	gap: .8rem;
}
.pmx-colleague-modal input[type=text],
.pmx-colleague-modal input[type=password],
.pmx-colleague-modal input[type=number],
.pmx-colleague-modal select {
	background: var(--pmx-surface);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius-sm);
	box-sizing: border-box;
	color: var(--pmx-ink);
	font: inherit;
	font-size: 1rem;
	min-height: 2.75rem;
	padding: .65rem .75rem;
	width: 100%;
}
.pmx-colleague-modal input:focus,
.pmx-colleague-modal select:focus {
	border-color: var(--pmx-accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--pmx-accent) 16%, transparent);
	outline: none;
}
.pmx-colleague-pay__summary {
	background: var(--pmx-surface-2);
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
	display: grid;
	gap: .65rem;
	margin: .25rem 0 1rem;
	padding: .95rem;
}
.pmx-colleague-pay__summary > div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
}
.pmx-colleague-pay__summary span {
	color: var(--pmx-ink-mute);
	font-size: .8rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.pmx-colleague-pay__label {
	align-items: center;
	display: inline-flex;
	gap: .45rem;
}
.pmx-colleague-pay__label .pmx-swish-icon {
	font-size: 1rem;
	height: 1.2em;
	letter-spacing: 0;
	text-transform: none;
	width: 1.2em;
}
.pmx-colleague-pay__summary strong {
	color: var(--pmx-accent);
	font-size: clamp(1.55rem, 4vw, 2.15rem);
	line-height: 1;
}
.pmx-colleague-pay__discount-row em {
	color: var(--pmx-ink);
	font-style: normal;
	font-weight: 900;
}
.pmx-colleague-pay__discount-row[hidden] {
	display: none !important;
}
.pmx-colleague-pay__number,
.pmx-colleague-pay__message {
	appearance: none;
	background: transparent;
	border: 0;
	color: var(--pmx-ink);
	cursor: pointer;
	font: inherit;
	font-weight: 900;
	padding: 0;
	text-align: right;
	text-decoration: underline;
	text-decoration-style: dotted;
}
.pmx-colleague-pay__message-row {
	align-items: flex-start !important;
}
.pmx-colleague-pay__qr-wrap {
	align-items: center;
	display: grid;
	gap: .55rem;
	justify-items: center;
	margin: .4rem 0 1rem;
	text-align: center;
}
.pmx-colleague-pay__qr {
	background: #fff;
	border: 1px solid var(--pmx-line);
	border-radius: var(--pmx-radius);
	box-shadow: var(--pmx-shadow);
	max-width: min(var(--pmx-colleague-qr-size, 280px), 100%);
	padding: .5rem;
}
.pmx-colleague-pay__qr-wrap p {
	color: var(--pmx-ink-soft);
	font-size: .9rem;
	margin: 0;
}
.pmx-colleague-pay__open {
	width: 100%;
	justify-content: center;
}
.pmx-colleague-pay__open .pmx-swish-icon {
	height: 1.15em;
	width: 1.15em;
}
@supports not (border-color: color-mix(in srgb, #000 50%, #fff)) {
	.pmx-colleague-button { border-color: var(--pmx-accent); }
	.pmx-colleague-modal input:focus,
	.pmx-colleague-modal select:focus { box-shadow: 0 0 0 3px rgba(234,95,44,.16); }
}
@media (max-width: 640px) {
	.pmx-colleague-pay__head {
		grid-template-columns: minmax(72px, min(var(--pmx-colleague-cover-size, 112px), 30vw)) 1fr;
	}
	.pmx-colleague-pay__grid {
		grid-template-columns: 1fr;
	}
	.pmx-colleague-pay__summary > div {
		align-items: flex-start;
		flex-direction: column;
		gap: .25rem;
	}
	.pmx-colleague-pay__number,
	.pmx-colleague-pay__message { text-align: left; }
}
.pmx-colleague-pay__head--no-cover { grid-template-columns: 1fr; }

/* RMP theme integration: let the colleague Swish modal button match RMP book buttons. */
body.rmp-theme .pmx-colleague-button.rmp-colleague-swish-button {
	--rmp-commerce-color: var(--rmp-colleague-swish-bg, var(--rmp-general-purchase-accent, var(--rmp-accent)));
	border-radius: var(--rmp-colleague-swish-radius, var(--rmp-radius-button, 999px));
	font-family: inherit;
}
body.rmp-theme .pmx-colleague-button.rmp-colleague-swish-button .pmx-colleague-button__swish {
	display: var(--rmp-colleague-swish-badge-display, none);
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-button.rmp-text-link,
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-button.rmp-commerce-link {
	appearance: none;
	align-items: center;
	background: color-mix(in srgb, var(--rmp-commerce-color) 10%, white 90%);
	border: 1px solid color-mix(in srgb, var(--rmp-colleague-swish-border, var(--rmp-commerce-color)) 28%, transparent);
	box-shadow: none;
	color: color-mix(in srgb, var(--rmp-commerce-color) 78%, var(--rmp-ink));
	cursor: pointer;
	display: inline-flex;
	font-size: .86rem;
	font-weight: 900;
	gap: var(--rmp-commerce-icon-gap, .5rem);
	justify-content: center;
	line-height: 1;
	min-height: 34px;
	padding: .4rem .7rem;
	text-decoration: none;
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-button.rmp-text-link::before,
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-button.rmp-commerce-link::before {
	content: "";
	background: var(--rmp-commerce-color);
	border-radius: 999px;
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--rmp-commerce-color) 12%, transparent);
	flex: 0 0 auto;
	height: .5rem;
	width: .5rem;
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-button.pmx-colleague-button--has-icon::before {
	display: none;
}
body.rmp-theme .pmx-colleague-button.rmp-colleague-swish-button .pmx-colleague-button__icon {
	height: 1.05em;
	width: 1.05em;
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-style-primary,
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-style-match.rmp-commerce-card-style-buttons {
	background: var(--rmp-colleague-swish-bg, var(--rmp-commerce-color));
	border-color: var(--rmp-colleague-swish-border, var(--rmp-commerce-color));
	color: var(--rmp-colleague-swish-text, #fff);
	box-shadow: 0 12px 28px color-mix(in srgb, var(--rmp-commerce-color) 22%, transparent);
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-style-primary::before,
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-style-match.rmp-commerce-card-style-buttons::before {
	background: rgba(255,255,255,.9);
	box-shadow: 0 0 0 4px rgba(255,255,255,.16);
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-style-minimal {
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	padding-inline: .2rem;
}
body.rmp-theme .rmp-card-actions .pmx-colleague-button.rmp-colleague-swish-style-minimal::before {
	box-shadow: none;
}
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button.rmp-button {
	background: linear-gradient(135deg, color-mix(in srgb, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)) 82%, var(--rmp-dark)), var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)));
	border-color: var(--rmp-colleague-swish-border, var(--rmp-commerce-color));
	color: var(--rmp-colleague-swish-text, #fff);
	box-shadow: 0 18px 44px color-mix(in srgb, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)) 26%, transparent);
}
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button:hover,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button.rmp-button:hover {
	color: var(--rmp-colleague-swish-text, #fff);
	box-shadow: 0 22px 52px color-mix(in srgb, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)) 34%, transparent);
}
body.rmp-theme .pmx-colleague-button.rmp-colleague-swish-style-soft {
	background: color-mix(in srgb, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)) 10%, white 90%);
	border-color: color-mix(in srgb, var(--rmp-colleague-swish-border, var(--rmp-commerce-color)) 28%, transparent);
	color: color-mix(in srgb, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)) 78%, var(--rmp-ink));
	box-shadow: none;
}
body.rmp-theme .pmx-colleague-button.rmp-colleague-swish-style-text,
body.rmp-theme .pmx-colleague-button.rmp-colleague-swish-style-minimal {
	color: var(--rmp-colleague-swish-bg, var(--rmp-commerce-color));
}

/* RMP 6.10.31 / Pagemix Shop 1.1.8 — make single-page colleague Swish style controls win over the generic single-action fill. */
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-soft,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-soft.rmp-button,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-soft,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-soft.rmp-button,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-soft,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-soft.rmp-button {
	background: color-mix(in srgb, var(--rmp-colleague-swish-single-bg, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color))) 10%, white 90%);
	border-color: color-mix(in srgb, var(--rmp-colleague-swish-single-border, var(--rmp-colleague-swish-border, var(--rmp-commerce-color))) 32%, transparent);
	color: color-mix(in srgb, var(--rmp-colleague-swish-single-bg, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color))) 80%, var(--rmp-ink));
	box-shadow: none;
}
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-soft:hover,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-soft.rmp-button:hover,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-soft:hover,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-soft.rmp-button:hover,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-soft:hover,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-soft.rmp-button:hover {
	color: color-mix(in srgb, var(--rmp-colleague-swish-single-bg, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color))) 86%, var(--rmp-ink));
	box-shadow: 0 10px 28px color-mix(in srgb, var(--rmp-colleague-swish-single-bg, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color))) 14%, transparent);
}
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-text,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-text.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-text,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-text.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-text,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-text.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-minimal,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-minimal.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-minimal,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-minimal.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-minimal,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-minimal.rmp-text-link {
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	color: var(--rmp-colleague-swish-single-bg, var(--rmp-colleague-swish-bg, var(--rmp-commerce-color)));
	min-height: 0;
	padding: .35rem .2rem;
}
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-minimal,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-single.rmp-colleague-swish-style-minimal.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-minimal,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-page.rmp-colleague-swish-style-minimal.rmp-text-link,
body.rmp-theme .rmp-commerce-actions-single .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-minimal,
body.rmp-theme .rmp-actions .pmx-colleague-button.rmp-colleague-swish-button-inline.rmp-colleague-swish-style-minimal.rmp-text-link {
	font-weight: 900;
	letter-spacing: 0;
}

/* Pagemix Shop 1.1.9 — Swish icon image, sizing, and placement controls. */
.pmx-swish-icon {
	--pmx-swish-icon-size: 1.25em;
	height: var(--pmx-swish-icon-size);
	width: var(--pmx-swish-icon-size);
}
.pmx-colleague-button__icon,
.pmx-colleague-button-wrap__icon {
	--pmx-swish-icon-size: var(--pmx-colleague-button-icon-size, 18px);
	height: var(--pmx-swish-icon-size);
	width: var(--pmx-swish-icon-size);
}
.pmx-swish-icon--image img {
	border-radius: 0;
	max-height: 100%;
	max-width: 100%;
	object-fit: contain;
}
.pmx-colleague-button-wrap {
	--pmx-colleague-button-icon-size: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .48rem;
	vertical-align: middle;
}
.pmx-colleague-button-wrap--outside-right {
	flex-direction: row-reverse;
}
.pmx-colleague-button-wrap__icon {
	filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .08));
}
.pmx-colleague-button--icon-inside-right .pmx-colleague-button__icon {
	margin-inline-start: .08rem;
}
.pmx-colleague-button--icon-inside-left .pmx-colleague-button__icon {
	margin-inline-end: .08rem;
}
.pmx-colleague-code,
.pmx-colleague-pay {
	--pmx-swish-modal-icon-size: 22px;
	--pmx-swish-summary-icon-size: 18px;
	--pmx-swish-open-icon-size: 18px;
}
.pmx-colleague-modal__kicker .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-modal-icon-size, 22px);
}
.pmx-colleague-pay__label .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-summary-icon-size, 18px);
}
.pmx-colleague-pay__open .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-open-icon-size, 18px);
}


/* Pagemix Shop 1.1.11 — correctly render uploaded Swish wordmarks and enforce icon-size controls. */
.pmx-colleague-button .pmx-colleague-button__icon,
.pmx-colleague-button-wrap .pmx-colleague-button-wrap__icon {
	--pmx-swish-icon-size: var(--pmx-colleague-button-icon-size, 18px) !important;
	height: var(--pmx-swish-icon-size) !important;
	width: var(--pmx-swish-icon-size) !important;
}
.pmx-swish-icon--image {
	height: var(--pmx-swish-icon-size, 18px) !important;
	width: auto !important;
	min-width: var(--pmx-swish-icon-size, 18px);
	max-width: min(calc(var(--pmx-swish-icon-size, 18px) * 6), 12rem);
}
.pmx-swish-icon--image img {
	display: block !important;
	height: var(--pmx-swish-icon-size, 18px) !important;
	max-height: var(--pmx-swish-icon-size, 18px) !important;
	max-width: min(calc(var(--pmx-swish-icon-size, 18px) * 6), 12rem) !important;
	object-fit: contain !important;
	width: auto !important;
}
.pmx-colleague-button .pmx-swish-icon--image,
.pmx-colleague-button-wrap .pmx-swish-icon--image {
	max-width: min(calc(var(--pmx-swish-icon-size, 18px) * 5.5), 9rem);
}
.pmx-colleague-modal__kicker .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-modal-icon-size, 22px) !important;
	height: var(--pmx-swish-icon-size) !important;
	width: var(--pmx-swish-icon-size) !important;
}
.pmx-colleague-modal__kicker .pmx-swish-icon--image {
	width: auto !important;
}
.pmx-colleague-pay__label .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-summary-icon-size, 18px) !important;
	height: var(--pmx-swish-icon-size) !important;
	width: var(--pmx-swish-icon-size) !important;
}
.pmx-colleague-pay__label .pmx-swish-icon--image {
	width: auto !important;
}
.pmx-colleague-pay__open .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-open-icon-size, 18px) !important;
	height: var(--pmx-swish-icon-size) !important;
	width: var(--pmx-swish-icon-size) !important;
}
.pmx-colleague-pay__open .pmx-swish-icon--image {
	width: auto !important;
}
.pmx-colleague-button .pmx-colleague-button__icon.pmx-swish-icon--image,
.pmx-colleague-button-wrap .pmx-colleague-button-wrap__icon.pmx-swish-icon--image {
	width: auto !important;
}


/* Pagemix Shop 1.1.11 — final Swish media-image sizing path used by button and modal output. */
.pmx-colleague-button .pmx-swish-icon,
.pmx-colleague-button-wrap .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-colleague-button-icon-size, 18px) !important;
}
.pmx-colleague-button .pmx-swish-icon:not(.pmx-swish-icon--image),
.pmx-colleague-button-wrap .pmx-swish-icon:not(.pmx-swish-icon--image) {
	height: var(--pmx-swish-icon-size) !important;
	width: var(--pmx-swish-icon-size) !important;
}
.pmx-colleague-button .pmx-swish-icon--image,
.pmx-colleague-button-wrap .pmx-swish-icon--image,
.pmx-colleague-modal .pmx-swish-icon--image {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	height: var(--pmx-swish-icon-size, 18px) !important;
	line-height: 0 !important;
	overflow: visible !important;
	width: auto !important;
}
.pmx-colleague-button .pmx-swish-icon--image img,
.pmx-colleague-button-wrap .pmx-swish-icon--image img,
.pmx-colleague-modal .pmx-swish-icon--image img {
	display: block !important;
	height: var(--pmx-swish-icon-size, 18px) !important;
	max-height: var(--pmx-swish-icon-size, 18px) !important;
	max-width: min(calc(var(--pmx-swish-icon-size, 18px) * 7), 14rem) !important;
	object-fit: contain !important;
	width: auto !important;
}
.pmx-colleague-modal__kicker .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-modal-icon-size, 22px) !important;
}
.pmx-colleague-pay__label .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-summary-icon-size, 18px) !important;
}
.pmx-colleague-pay__open .pmx-swish-icon {
	--pmx-swish-icon-size: var(--pmx-swish-open-icon-size, 18px) !important;
}

/* Pagemix Shop 1.1.12 — attachment-ID Swish logo path and hard final sizing. */
.pmx-colleague-button .pmx-swish-icon--image,
.pmx-colleague-button-wrap .pmx-swish-icon--image,
.pmx-colleague-modal .pmx-swish-icon--image {
	width: auto !important;
	min-width: var(--pmx-swish-icon-size, var(--pmx-colleague-button-icon-size, 18px)) !important;
	max-width: min(calc(var(--pmx-swish-icon-size, var(--pmx-colleague-button-icon-size, 18px)) * 8), 16rem) !important;
}
.pmx-colleague-button .pmx-swish-icon--image img,
.pmx-colleague-button-wrap .pmx-swish-icon--image img,
.pmx-colleague-modal .pmx-swish-icon--image img {
	width: auto !important;
	min-width: auto !important;
	max-width: min(calc(var(--pmx-swish-icon-size, var(--pmx-colleague-button-icon-size, 18px)) * 8), 16rem) !important;
}
.pmx-colleague-button--icon-outside + .pmx-swish-icon--image,
.pmx-colleague-button-wrap__icon.pmx-swish-icon--image {
	align-self: center !important;
}

/* Pagemix Shop 1.1.14 — mobile colleague Swish modal scroll + stronger Swish-logo contrast on colored buttons. */
.pmx-colleague-modal {
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	padding: max(10px, env(safe-area-inset-top)) 0 max(14px, env(safe-area-inset-bottom));
}
.pmx-colleague-modal__dialog {
	box-sizing: border-box;
	max-height: calc(100vh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
	-webkit-overflow-scrolling: touch;
	overflow-y: auto;
	overscroll-behavior: contain;
}
@supports (height: 100dvh) {
	.pmx-colleague-modal__dialog {
		max-height: calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
	}
}
.pmx-colleague-button.pmx-colleague-button--has-icon .pmx-swish-icon,
.pmx-colleague-pay__open .pmx-swish-icon {
	background: rgba(255, 255, 255, .96);
	border: 1px solid rgba(0, 0, 0, .08);
	border-radius: 999px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .14);
	box-sizing: content-box;
	padding: .14em .24em;
}
.pmx-colleague-button.pmx-colleague-button--has-icon .pmx-swish-icon:not(.pmx-swish-icon--image),
.pmx-colleague-pay__open .pmx-swish-icon:not(.pmx-swish-icon--image) {
	padding: .14em;
}
.pmx-colleague-button.pmx-colleague-button--has-icon .pmx-swish-icon img,
.pmx-colleague-pay__open .pmx-swish-icon img,
.pmx-colleague-button.pmx-colleague-button--has-icon .pmx-swish-icon svg,
.pmx-colleague-pay__open .pmx-swish-icon svg {
	filter: none !important;
	opacity: 1 !important;
}
@media (max-width: 640px) {
	.pmx-colleague-modal {
		align-items: flex-start;
		padding: max(8px, env(safe-area-inset-top)) 0 max(16px, env(safe-area-inset-bottom));
		touch-action: pan-y;
	}
	.pmx-colleague-modal__dialog {
		border-radius: max(16px, var(--pmx-radius));
		margin: 0 auto;
		max-height: calc(100vh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
		padding: .95rem .9rem calc(1rem + env(safe-area-inset-bottom));
		width: min(calc(100vw - 16px), 720px);
	}
	@supports (height: 100dvh) {
		.pmx-colleague-modal__dialog {
			max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
		}
	}
	.pmx-colleague-pay__head {
		gap: .75rem;
		margin-bottom: .8rem;
	}
	.pmx-colleague-code h2,
	.pmx-colleague-pay h2 {
		font-size: clamp(1.45rem, 8vw, 2rem);
	}
	.pmx-colleague-pay__summary {
		margin-bottom: .7rem;
		padding: .8rem;
	}
	.pmx-colleague-pay__qr-wrap {
		gap: .4rem;
		margin: .25rem 0 .65rem;
	}
	.pmx-colleague-pay__qr {
		max-width: min(var(--pmx-colleague-qr-size, 280px), 78vw, 230px);
		padding: .42rem;
	}
	.pmx-colleague-pay__open {
		min-height: 48px;
		position: sticky;
		bottom: calc(.35rem + env(safe-area-inset-bottom));
		z-index: 2;
	}
}
@media (max-width: 420px), (max-height: 680px) {
	.pmx-colleague-pay__qr {
		max-width: min(var(--pmx-colleague-qr-size, 280px), 74vw, 205px);
	}
}


/* Pagemix Shop 1.1.15 — Customizer-controlled colleague Swish modal height. */
.pmx-colleague-modal__dialog {
	max-height: calc(var(--pmx-colleague-modal-height, 92vh) - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
}
@supports (height: 100dvh) {
	.pmx-colleague-modal__dialog {
		max-height: calc(var(--pmx-colleague-modal-height-dvh, 92dvh) - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
	}
}
@media (max-width: 640px) {
	.pmx-colleague-modal__dialog {
		max-height: calc(var(--pmx-colleague-modal-height, 92vh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
	}
	@supports (height: 100dvh) {
		.pmx-colleague-modal__dialog {
			max-height: calc(var(--pmx-colleague-modal-height-dvh, 92dvh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
		}
	}
}

/* Pagemix Shop 1.1.16 — adaptive colleague Swish modal fitting for short/zoomed viewports. */
.pmx-colleague-modal {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	box-sizing: border-box;
	min-height: 100vh;
	min-height: 100dvh;
	padding: max(10px, env(safe-area-inset-top)) 0 max(14px, env(safe-area-inset-bottom));
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-gutter: stable both-edges;
}
.pmx-colleague-modal__dialog {
	margin: auto 0 !important;
	scroll-padding-block: 1rem calc(5rem + env(safe-area-inset-bottom));
}
.pmx-colleague-modal__dialog--sticky-action .pmx-colleague-pay__open {
	position: sticky;
	bottom: max(.55rem, env(safe-area-inset-bottom));
	z-index: 6;
	box-shadow: 0 12px 26px rgba(0, 0, 0, .16);
}
.pmx-colleague-modal__dialog--hide-qr-hint .pmx-colleague-pay__qr-wrap p {
	display: none !important;
}
.pmx-colleague-modal--comfortable .pmx-colleague-modal__dialog {
	padding: clamp(1.2rem, 3vw, 1.85rem) !important;
}
.pmx-colleague-modal--balanced .pmx-colleague-modal__dialog {
	padding: clamp(1rem, 2.6vw, 1.55rem) !important;
}
.pmx-colleague-modal--compact .pmx-colleague-modal__dialog {
	padding: clamp(.78rem, 2vh, 1.05rem) !important;
}
.pmx-colleague-modal--compact .pmx-colleague-modal__close {
	height: 1.95rem;
	right: .62rem;
	top: .62rem;
	width: 1.95rem;
}
.pmx-colleague-modal--compact .pmx-colleague-modal__kicker {
	font-size: .68rem;
	gap: .35rem;
	margin-bottom: .12rem;
}
.pmx-colleague-modal--compact .pmx-colleague-code h2,
.pmx-colleague-modal--compact .pmx-colleague-pay h2 {
	font-size: clamp(1.35rem, 4.5vw, 2rem);
	margin-bottom: .38rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__head {
	gap: .7rem;
	margin-bottom: .58rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__cover {
	padding: .25rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__cover img,
.pmx-colleague-modal--compact .pmx-colleague-pay__cover .rmp-cover-placeholder {
	max-height: min(calc(var(--pmx-colleague-cover-size, 112px) * 1.35), 19vh);
}
.pmx-colleague-modal--compact .pmx-colleague-pay__selected,
.pmx-colleague-modal--compact .pmx-colleague-code__book {
	margin-bottom: .55rem;
	padding: .55rem .7rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__grid {
	gap: .55rem;
}
.pmx-colleague-modal--compact .pmx-field span {
	font-size: .74rem;
}
.pmx-colleague-modal--compact input[type=text],
.pmx-colleague-modal--compact input[type=password],
.pmx-colleague-modal--compact input[type=number],
.pmx-colleague-modal--compact select {
	min-height: 2.35rem;
	padding: .48rem .62rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__summary {
	gap: .42rem;
	margin: .12rem 0 .55rem;
	padding: .72rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__summary > div {
	gap: .55rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__summary span {
	font-size: .72rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__summary strong {
	font-size: clamp(1.45rem, 4vh, 1.95rem);
}
.pmx-colleague-modal--compact .pmx-colleague-pay__qr-wrap {
	gap: .32rem;
	margin: .08rem 0 .5rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__qr {
	max-width: min(var(--pmx-colleague-qr-size, 280px), var(--pmx-colleague-compact-qr-size, 230px), 66vh, 74vw) !important;
	padding: .36rem;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__qr-wrap p {
	font-size: .82rem;
	line-height: 1.3;
}
.pmx-colleague-modal--compact .pmx-colleague-pay__open {
	min-height: 46px;
}
@media (max-height: 760px) {
	.pmx-colleague-modal__dialog--fit-auto .pmx-colleague-pay__qr {
		max-width: min(var(--pmx-colleague-qr-size, 280px), var(--pmx-colleague-compact-qr-size, 230px), 66vh, 74vw) !important;
	}
}
@media (max-width: 640px) {
	.pmx-colleague-modal {
		padding: max(6px, env(safe-area-inset-top)) 0 max(10px, env(safe-area-inset-bottom));
	}
	.pmx-colleague-modal__dialog {
		margin: 0 auto !important;
		scroll-padding-block: .75rem calc(5.25rem + env(safe-area-inset-bottom));
	}
	.pmx-colleague-modal__dialog--sticky-action .pmx-colleague-pay__open {
		bottom: calc(.35rem + env(safe-area-inset-bottom));
	}
	.pmx-colleague-modal--compact .pmx-colleague-pay__qr {
		max-width: min(var(--pmx-colleague-qr-size, 280px), var(--pmx-colleague-compact-qr-size, 230px), 58vh, 76vw) !important;
	}
}
@media (max-width: 420px), (max-height: 640px) {
	.pmx-colleague-modal--compact .pmx-colleague-pay__qr,
	.pmx-colleague-modal__dialog--fit-auto .pmx-colleague-pay__qr {
		max-width: min(var(--pmx-colleague-qr-size, 280px), var(--pmx-colleague-compact-qr-size, 230px), 54vh, 74vw) !important;
	}
}
