/**
 * ShopFlow WP — front-end styles.
 * Every selector is namespaced with .sfwp so themes stay untouched.
 */

.sfwp,
.sfwp-inline,
.sfwp-btn,
.sfwp-woo {
	--sfwp-brand: #1f9d55;
	--sfwp-brand-soft: #eaf5ef;
	--sfwp-on-brand: #ffffff;
	--sfwp-size: 60px;
	--sfwp-radius: 18px;
	--sfwp-x: 20px;
	--sfwp-y: 20px;
	--sfwp-y-mobile: 16px;
	--sfwp-z: 99999;
	--sfwp-surface: #ffffff;
	--sfwp-surface-2: #f6f8fa;
	--sfwp-ink: #16202a;
	--sfwp-ink-soft: #5d6b7a;
	--sfwp-line: rgba(22, 32, 42, 0.09);
	--sfwp-shadow: 0 18px 45px -18px rgba(15, 25, 35, 0.42);
	--sfwp-online: #22c55e;
	--sfwp-offline: #b0b8c1;
	font-family: inherit;
	box-sizing: border-box;
}

.sfwp *,
.sfwp *::before,
.sfwp *::after,
.sfwp-inline *,
.sfwp-btn * {
	box-sizing: border-box;
}

.sfwp--theme-dark,
.sfwp-inline.sfwp--theme-dark {
	--sfwp-surface: #161b22;
	--sfwp-surface-2: #1d242d;
	--sfwp-ink: #eef2f6;
	--sfwp-ink-soft: #9aa7b4;
	--sfwp-line: rgba(255, 255, 255, 0.1);
	--sfwp-shadow: 0 18px 45px -18px rgba(0, 0, 0, 0.75);
}

/* ------------------------------------------------------------------ */
/* Shell                                                               */
/* ------------------------------------------------------------------ */

.sfwp {
	position: fixed;
	bottom: var(--sfwp-y);
	z-index: var(--sfwp-z);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
	line-height: 1.45;
	color: var(--sfwp-ink);
}

.sfwp--right {
	right: var(--sfwp-x);
}

.sfwp--left {
	left: var(--sfwp-x);
	align-items: flex-start;
}

.sfwp[hidden] {
	display: none;
}

.sfwp.is-ready {
	animation: sfwp-fade-up 0.35s ease both;
}

/* ------------------------------------------------------------------ */
/* Toggle button                                                       */
/* ------------------------------------------------------------------ */

.sfwp-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: var(--sfwp-size);
	height: var(--sfwp-size);
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background: var(--sfwp-brand);
	color: var(--sfwp-on-brand);
	cursor: pointer;
	box-shadow: 0 12px 28px -10px rgba(15, 25, 35, 0.55);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
	-webkit-appearance: none;
	appearance: none;
}

.sfwp-toggle:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 34px -12px rgba(15, 25, 35, 0.6);
}

.sfwp-toggle:focus-visible {
	outline: 3px solid var(--sfwp-brand);
	outline-offset: 3px;
}

.sfwp-toggle__label {
	padding-right: 20px;
	font-size: 15px;
	font-weight: 600;
	white-space: nowrap;
}

.sfwp-toggle__label:first-child {
	padding-left: 20px;
}

.sfwp-toggle .sfwp-toggle__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--sfwp-size);
	height: var(--sfwp-size);
	transition: transform 0.2s ease, opacity 0.15s ease;
}

.sfwp-toggle__icon img {
	width: 28px;
	height: 28px;
	object-fit: contain;
}

.sfwp-toggle__icon--close {
	position: absolute;
	inset: 0;
	margin: auto;
	opacity: 0;
	transform: rotate(-45deg) scale(0.6);
}

.sfwp.is-open .sfwp-toggle__icon--open {
	opacity: 0;
	transform: rotate(45deg) scale(0.6);
}

.sfwp.is-open .sfwp-toggle__icon--close {
	opacity: 1;
	transform: rotate(0) scale(1);
}

.sfwp.is-open .sfwp-toggle__label {
	display: none;
}

/* Attention animations. */
.sfwp--anim-pulse .sfwp-toggle::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--sfwp-brand);
	opacity: 0.55;
	z-index: -1;
	animation: sfwp-pulse 2.4s ease-out infinite;
}

.sfwp--anim-bounce .sfwp-toggle {
	animation: sfwp-bounce 2.8s ease-in-out infinite;
}

.sfwp--anim-shake .sfwp-toggle {
	animation: sfwp-shake 4s ease-in-out infinite;
}

.sfwp.is-open .sfwp-toggle {
	animation: none;
}

.sfwp.is-open .sfwp-toggle::after {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Teaser                                                              */
/* ------------------------------------------------------------------ */

.sfwp-teaser {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 230px;
	padding: 11px 34px 11px 14px;
	border-radius: 14px;
	background: var(--sfwp-surface);
	color: var(--sfwp-ink);
	font-size: 14px;
	box-shadow: var(--sfwp-shadow);
	cursor: pointer;
	animation: sfwp-fade-up 0.3s ease both;
}

.sfwp-teaser[hidden] {
	display: none;
}

.sfwp-teaser__close {
	position: absolute;
	top: 4px;
	right: 6px;
	padding: 2px 5px;
	border: 0;
	background: none;
	color: var(--sfwp-ink-soft);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}

/* ------------------------------------------------------------------ */
/* Panel                                                               */
/* ------------------------------------------------------------------ */

.sfwp-panel {
	width: min(340px, calc(100vw - 32px));
	max-height: min(560px, calc(100vh - 140px));
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--sfwp-radius);
	background: var(--sfwp-surface);
	box-shadow: var(--sfwp-shadow);
	transform-origin: bottom right;
	animation: sfwp-panel-in 0.26s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.sfwp--left .sfwp-panel {
	transform-origin: bottom left;
}

.sfwp-panel[hidden] {
	display: none;
}

.sfwp-panel__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 18px 18px 16px;
	background: var(--sfwp-brand);
	color: var(--sfwp-on-brand);
}

.sfwp-panel__title {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: inherit;
}

.sfwp-panel__subtitle {
	margin: 3px 0 0;
	font-size: 13px;
	opacity: 0.85;
	color: inherit;
}

.sfwp-panel__close {
	flex: none;
	display: inline-flex;
	padding: 4px;
	border: 0;
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.16);
	color: inherit;
	cursor: pointer;
}

.sfwp-panel__close:hover {
	background: rgba(255, 255, 255, 0.28);
}

.sfwp-panel__body {
	padding: 14px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	background: var(--sfwp-surface-2);
}

.sfwp-panel__intro {
	margin: 2px 4px 12px;
	font-size: 13px;
	color: var(--sfwp-ink-soft);
}

.sfwp-panel__foot {
	padding: 10px 16px;
	border-top: 1px solid var(--sfwp-line);
	background: var(--sfwp-surface);
	font-size: 12px;
	color: var(--sfwp-ink-soft);
	text-align: center;
}

/* ------------------------------------------------------------------ */
/* Agent rows                                                          */
/* ------------------------------------------------------------------ */

.sfwp-agents {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.sfwp-agents li::before {
	display: none;
}

.sfwp-agent__link {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 12px;
	border-radius: calc(var(--sfwp-radius) - 6px);
	background: var(--sfwp-surface);
	border: 1px solid var(--sfwp-line);
	box-shadow: none;
	text-decoration: none;
	color: var(--sfwp-ink);
	overflow: hidden;
	transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.sfwp-agent__link::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 3px;
	background: var(--sfwp-channel, var(--sfwp-brand));
	opacity: 0;
	transition: opacity 0.15s ease;
}

.sfwp-agent__link:hover {
	transform: translateX(2px);
	border-color: var(--sfwp-channel, var(--sfwp-brand));
	box-shadow: 0 10px 22px -16px rgba(15, 25, 35, 0.9);
	color: var(--sfwp-ink);
}

.sfwp-agent__link:hover::before {
	opacity: 1;
}

.sfwp-agent__link:focus-visible {
	outline: 2px solid var(--sfwp-channel, var(--sfwp-brand));
	outline-offset: 2px;
}

.sfwp-agent.is-disabled .sfwp-agent__link {
	opacity: 0.55;
	pointer-events: none;
}

.sfwp-agent__figure {
	position: relative;
	flex: none;
}

.sfwp-agent__avatar {
	display: block;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	object-fit: cover;
}

.sfwp-agent__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	color: #fff;
}

.sfwp-agent__dot {
	position: absolute;
	right: -1px;
	bottom: -1px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 2px solid var(--sfwp-surface);
	background: var(--sfwp-offline);
}

.sfwp-agent.is-online .sfwp-agent__dot {
	background: var(--sfwp-online);
	animation: sfwp-blink 2.6s ease-in-out infinite;
}

.sfwp-agent__meta {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1;
}

.sfwp-agent__name {
	font-size: 14px;
	font-weight: 650;
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sfwp-agent__role {
	font-size: 12.5px;
	color: var(--sfwp-ink-soft);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sfwp-agent__status {
	margin-top: 2px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--sfwp-offline);
}

.sfwp-agent.is-online .sfwp-agent__status {
	color: var(--sfwp-online);
}

.sfwp-agent__chevron {
	flex: none;
	display: inline-flex;
	color: var(--sfwp-channel, var(--sfwp-brand));
	opacity: 0.9;
}

/* ------------------------------------------------------------------ */
/* Pre-chat form                                                       */
/* ------------------------------------------------------------------ */

.sfwp-prechat {
	margin-bottom: 12px;
	padding: 12px;
	border-radius: calc(var(--sfwp-radius) - 6px);
	background: var(--sfwp-surface);
	border: 1px solid var(--sfwp-line);
}

.sfwp-field {
	display: block;
	margin-bottom: 9px;
}

.sfwp-field__label {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 600;
	color: var(--sfwp-ink-soft);
}

.sfwp-field__input {
	width: 100%;
	padding: 9px 11px;
	border: 1px solid var(--sfwp-line);
	border-radius: 10px;
	background: var(--sfwp-surface-2);
	color: var(--sfwp-ink);
	font: inherit;
	font-size: 14px;
}

.sfwp-field__input:focus {
	outline: none;
	border-color: var(--sfwp-brand);
	box-shadow: 0 0 0 3px var(--sfwp-brand-soft);
}

.sfwp-field__input.is-invalid {
	border-color: #dc2626;
}

.sfwp-consent {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	font-size: 12px;
	color: var(--sfwp-ink-soft);
}

.sfwp-prechat__error {
	margin: 8px 0 0;
	font-size: 12px;
	color: #dc2626;
}

.sfwp-prechat__error[hidden] {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Edge menu                                                           */
/* ------------------------------------------------------------------ */

.sfwp-edge {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	gap: 2px;
	z-index: var(--sfwp-z);
}

.sfwp--right .sfwp-edge {
	right: 0;
}

.sfwp--left .sfwp-edge {
	left: 0;
}

.sfwp-edge__item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 46px;
	padding: 12px;
	background: var(--sfwp-channel, var(--sfwp-brand));
	color: #fff;
	text-decoration: none;
	overflow: hidden;
	white-space: nowrap;
	transition: width 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

.sfwp--right .sfwp-edge__item:first-child {
	border-top-left-radius: 12px;
}

.sfwp--right .sfwp-edge__item:last-child {
	border-bottom-left-radius: 12px;
}

.sfwp--left .sfwp-edge__item:first-child {
	border-top-right-radius: 12px;
}

.sfwp--left .sfwp-edge__item:last-child {
	border-bottom-right-radius: 12px;
}

.sfwp-edge__item:hover,
.sfwp-edge__item:focus-visible {
	width: 175px;
	color: #fff;
}

.sfwp-edge__label {
	font-size: 13.5px;
	font-weight: 600;
	opacity: 0;
	transition: opacity 0.18s ease 0.04s;
}

.sfwp-edge__item:hover .sfwp-edge__label,
.sfwp-edge__item:focus-visible .sfwp-edge__label {
	opacity: 1;
}

.sfwp-edge .sfwp-icon {
	flex: none;
}

/* ------------------------------------------------------------------ */
/* Inline shortcode card                                               */
/* ------------------------------------------------------------------ */

.sfwp-inline {
	max-width: 520px;
	padding: 18px;
	border-radius: var(--sfwp-radius);
	background: var(--sfwp-surface-2);
	border: 1px solid var(--sfwp-line);
	color: var(--sfwp-ink);
}

.sfwp-inline__head {
	margin-bottom: 10px;
}

.sfwp-inline .sfwp-panel__title {
	color: var(--sfwp-ink);
}

.sfwp-inline .sfwp-panel__subtitle {
	color: var(--sfwp-ink-soft);
	opacity: 1;
}

.sfwp-inline--grid .sfwp-agents {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

/* ------------------------------------------------------------------ */
/* Buttons (shortcode + WooCommerce)                                   */
/* ------------------------------------------------------------------ */

.sfwp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 11px 18px;
	border-radius: 10px;
	border: 1px solid transparent;
	background: var(--sfwp-channel, var(--sfwp-brand));
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: filter 0.15s ease, transform 0.15s ease;
}

.sfwp-btn:hover {
	filter: brightness(0.93);
	transform: translateY(-1px);
	color: #fff;
}

.sfwp-btn:focus-visible {
	outline: 3px solid var(--sfwp-channel, var(--sfwp-brand));
	outline-offset: 2px;
}

.sfwp-btn--solid {
	background: var(--sfwp-brand);
}

.sfwp-btn--outline {
	background: transparent;
	border-color: var(--sfwp-channel, var(--sfwp-brand));
	color: var(--sfwp-channel, var(--sfwp-brand));
}

.sfwp-btn--outline:hover {
	background: var(--sfwp-channel, var(--sfwp-brand));
	color: #fff;
}

.sfwp-btn--large {
	width: 100%;
	padding: 14px 20px;
	font-size: 16px;
}

.sfwp-btn--loop {
	width: auto;
	margin-top: 6px;
	padding: 7px 12px;
	font-size: 13px;
}

.sfwp-woo {
	margin: 14px 0;
}

.sfwp-quickorder {
	margin-bottom: 12px;
	padding: 14px;
	border: 1px solid var(--sfwp-line);
	border-radius: 12px;
	background: var(--sfwp-surface-2);
	max-width: 420px;
}

.sfwp-quickorder .sfwp-field:last-child {
	margin-bottom: 0;
}

/* ------------------------------------------------------------------ */
/* Device visibility                                                   */
/* ------------------------------------------------------------------ */

@media (max-width: 782px) {
	.sfwp {
		bottom: var(--sfwp-y-mobile);
	}

	.sfwp--no-mobile,
	.sfwp-only-desktop {
		display: none !important;
	}

	.sfwp-panel {
		width: calc(100vw - 28px);
		max-height: calc(100vh - 120px);
	}

	.sfwp-edge__item {
		width: 42px;
		padding: 10px;
	}

	.sfwp-edge__item:hover,
	.sfwp-edge__item:focus-visible {
		width: 150px;
	}
}

@media (min-width: 783px) {
	.sfwp--no-desktop,
	.sfwp-only-mobile {
		display: none !important;
	}
}

/* ------------------------------------------------------------------ */
/* Motion                                                              */
/* ------------------------------------------------------------------ */

@keyframes sfwp-fade-up {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes sfwp-panel-in {
	from {
		opacity: 0;
		transform: translateY(14px) scale(0.96);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes sfwp-pulse {
	0% {
		transform: scale(1);
		opacity: 0.5;
	}
	70% {
		transform: scale(1.55);
		opacity: 0;
	}
	100% {
		transform: scale(1.55);
		opacity: 0;
	}
}

@keyframes sfwp-bounce {
	0%, 82%, 100% {
		transform: translateY(0);
	}
	88% {
		transform: translateY(-9px);
	}
	94% {
		transform: translateY(-4px);
	}
}

@keyframes sfwp-shake {
	0%, 88%, 100% {
		transform: rotate(0);
	}
	90% {
		transform: rotate(-11deg);
	}
	92% {
		transform: rotate(9deg);
	}
	94% {
		transform: rotate(-7deg);
	}
	96% {
		transform: rotate(5deg);
	}
}

@keyframes sfwp-blink {
	0%, 100% {
		box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
	}
	60% {
		box-shadow: 0 0 0 6px rgba(34, 197, 94, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.sfwp *,
	.sfwp *::before,
	.sfwp *::after {
		animation: none !important;
		transition-duration: 0.01ms !important;
	}
}

/* ------------------------------------------------------------------ */
/* Social share                                                        */
/* ------------------------------------------------------------------ */

.sfwp-share {
	--sfwp-share-size: 40px;
	margin: 18px 0;
	color: var(--sfwp-ink);
}

.sfwp-share__title {
	margin: 0 0 9px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--sfwp-ink-soft);
}

.sfwp-share__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sfwp-share__list > li {
	margin: 0;
	padding: 0;
}

.sfwp-share__list > li::before {
	display: none;
}

.sfwp-share__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: var(--sfwp-share-size);
	height: var(--sfwp-share-size);
	padding: 0;
	border: 0;
	background: var(--sfwp-channel, var(--sfwp-brand));
	color: #fff;
	font: inherit;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.15s ease, filter 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.sfwp-share__item:hover {
	transform: translateY(-2px);
	filter: brightness(0.92);
	color: #fff;
}

.sfwp-share__item:focus-visible {
	outline: 3px solid var(--sfwp-channel, var(--sfwp-brand));
	outline-offset: 2px;
}

.sfwp-share__item.is-copied {
	background: #16a34a;
}

/* Shapes. */
.sfwp-share--round .sfwp-share__item {
	border-radius: 50%;
}

.sfwp-share--square .sfwp-share__item {
	border-radius: 10px;
}

.sfwp-share--pill .sfwp-share__item {
	border-radius: 999px;
}

/* Icons only. */
.sfwp-share--icons .sfwp-share__label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Icons with labels. */
.sfwp-share--buttons .sfwp-share__item {
	width: auto;
	padding: 0 16px;
	border-radius: 10px;
}

.sfwp-share--buttons.sfwp-share--round .sfwp-share__item,
.sfwp-share--buttons.sfwp-share--pill .sfwp-share__item {
	border-radius: 999px;
}

/* Placement variants. */
.sfwp-share--panel {
	margin: 14px 2px 2px;
	padding-top: 14px;
	border-top: 1px solid var(--sfwp-line);
}

.sfwp-share--panel .sfwp-share__item {
	--sfwp-share-size: 36px;
}

.sfwp-share--content {
	padding: 16px 0;
	border-top: 1px solid var(--sfwp-line);
	border-bottom: 1px solid var(--sfwp-line);
}

.sfwp-share__native[hidden] {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Wallet checkout fields                                              */
/* ------------------------------------------------------------------ */

.sfwp-pay {
	padding: 4px 0 2px;
	color: var(--sfwp-ink);
}

.sfwp-pay__desc {
	margin: 0 0 10px;
	font-size: 14px;
}

.sfwp-pay__qr {
	display: block;
	width: 150px;
	height: auto;
	margin: 0 0 12px;
	border-radius: 10px;
	border: 1px solid var(--sfwp-line);
}

.sfwp-pay__account {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-bottom: 12px;
	padding: 12px 14px;
	border-radius: 12px;
	border: 1px solid var(--sfwp-channel, var(--sfwp-brand));
	background: var(--sfwp-surface-2);
}

.sfwp-pay__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--sfwp-channel, var(--sfwp-brand));
}

.sfwp-pay__number {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.2;
	-webkit-user-select: all;
	user-select: all;
}

.sfwp-pay__holder {
	font-size: 13px;
	color: var(--sfwp-ink-soft);
}

.sfwp-pay__steps {
	margin: 0 0 14px;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--sfwp-ink-soft);
}

.sfwp-pay__hint {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	color: var(--sfwp-ink-soft);
}

.sfwp-pay__note {
	margin: 12px 0;
	padding: 12px 14px;
	border-radius: 10px;
	background: var(--sfwp-surface-2);
	border: 1px solid var(--sfwp-line);
	font-size: 14px;
}

.sfwp-receipt {
	max-width: 420px;
}

.sfwp-receipt p {
	margin: 0 0 10px;
	font-size: 14px;
}

/* ------------------------------------------------------------------ */
/* One-click order                                                     */
/* ------------------------------------------------------------------ */

.sfwp-oneclick {
	max-width: 460px;
	margin: 0 0 26px;
	padding: 18px;
	border-radius: var(--sfwp-radius);
	border: 1px solid var(--sfwp-channel, var(--sfwp-brand));
	background: var(--sfwp-surface-2);
	color: var(--sfwp-ink);
}

.sfwp-oneclick__head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin-bottom: 14px;
}

.sfwp-oneclick__icon {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--sfwp-channel, var(--sfwp-brand));
	color: #fff;
}

.sfwp-oneclick__title {
	display: block;
	font-size: 16px;
	line-height: 1.3;
}

.sfwp-oneclick__note {
	margin: 3px 0 0;
	font-size: 13.5px;
	color: var(--sfwp-ink-soft);
}

.sfwp-oneclick__fields {
	margin-bottom: 14px;
}

.sfwp-oneclick .sfwp-btn--large {
	width: 100%;
}

.sfwp-oneclick .sfwp-btn.is-busy {
	opacity: 0.7;
	pointer-events: none;
}

.sfwp-oneclick__error {
	margin: 10px 0 0;
	font-size: 13px;
	color: #dc2626;
}

.sfwp-oneclick__error[hidden] {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Floating cart                                                       */
/* ------------------------------------------------------------------ */

.sfwp-cart {
	--sfwp-cart-y: 20px;
	position: fixed;
	bottom: var(--sfwp-cart-y);
	z-index: calc(var(--sfwp-z) - 1);
	color: var(--sfwp-ink);
	font-family: inherit;
}

.sfwp-cart[hidden] {
	display: none;
}

.sfwp-cart--right {
	right: var(--sfwp-x);
}

.sfwp-cart--left {
	left: var(--sfwp-x);
}

/* Lift above the chat bubble when they share a side. */
.sfwp-cart--stacked {
	bottom: calc(var(--sfwp-cart-y) + var(--sfwp-size) + 14px);
}

.sfwp-cart__button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: var(--sfwp-size);
	height: var(--sfwp-size);
	padding: 0 6px;
	border: 0;
	border-radius: 999px;
	background: var(--sfwp-surface);
	color: var(--sfwp-ink);
	box-shadow: 0 12px 28px -10px rgba(15, 25, 35, 0.5);
	cursor: pointer;
	text-decoration: none;
	transition: transform 0.18s ease;
	-webkit-appearance: none;
	appearance: none;
}

.sfwp-cart__button:hover {
	transform: translateY(-2px);
	color: var(--sfwp-ink);
}

.sfwp-cart__button:focus-visible {
	outline: 3px solid var(--sfwp-brand);
	outline-offset: 3px;
}

.sfwp-cart__count {
	position: absolute;
	top: 2px;
	right: 2px;
	min-width: 21px;
	height: 21px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--sfwp-brand);
	color: var(--sfwp-on-brand);
	font-size: 12px;
	font-weight: 700;
	line-height: 21px;
	text-align: center;
}

.sfwp-cart__count[hidden] {
	display: none;
}

.sfwp-cart__total {
	padding-right: 12px;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
}

/* Panel shell */
.sfwp-cart__panel {
	display: flex;
	flex-direction: column;
	background: var(--sfwp-surface);
	color: var(--sfwp-ink);
	box-shadow: var(--sfwp-shadow);
	overflow: hidden;
}

.sfwp-cart__panel[hidden] {
	display: none;
}

.sfwp-cart__overlay {
	position: fixed;
	inset: 0;
	background: rgba(12, 20, 28, 0.45);
	animation: sfwp-fade-in 0.2s ease both;
}

.sfwp-cart__overlay[hidden] {
	display: none;
}

/* Drawer */
.sfwp-cart--drawer .sfwp-cart__panel {
	position: fixed;
	top: 0;
	bottom: 0;
	width: min(390px, 92vw);
	border-radius: 0;
	animation: sfwp-slide-in 0.28s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.sfwp-cart--drawer.sfwp-cart--right .sfwp-cart__panel {
	right: 0;
}

.sfwp-cart--drawer.sfwp-cart--left .sfwp-cart__panel {
	left: 0;
	animation-name: sfwp-slide-in-left;
}

/* Popup */
.sfwp-cart--popup .sfwp-cart__panel {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(420px, 92vw);
	max-height: min(80vh, 620px);
	border-radius: var(--sfwp-radius);
	animation: sfwp-panel-in 0.24s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Dropdown */
.sfwp-cart--dropdown .sfwp-cart__panel {
	position: absolute;
	bottom: calc(var(--sfwp-size) + 12px);
	width: min(340px, calc(100vw - 32px));
	max-height: min(70vh, 520px);
	border-radius: var(--sfwp-radius);
	animation: sfwp-panel-in 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.sfwp-cart--dropdown.sfwp-cart--right .sfwp-cart__panel {
	right: 0;
}

.sfwp-cart--dropdown.sfwp-cart--left .sfwp-cart__panel {
	left: 0;
}

/* Panel contents */
.sfwp-cart__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 18px;
	border-bottom: 1px solid var(--sfwp-line);
}

.sfwp-cart__title {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
}

.sfwp-cart__close {
	display: inline-flex;
	padding: 5px;
	border: 0;
	border-radius: 8px;
	background: var(--sfwp-surface-2);
	color: var(--sfwp-ink);
	cursor: pointer;
}

.sfwp-cart__body {
	position: relative;
	flex: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 14px 18px;
}

.sfwp-cart.is-loading .sfwp-cart__body {
	opacity: 0.55;
	pointer-events: none;
}

.sfwp-cart__empty {
	padding: 30px 0;
	text-align: center;
	color: var(--sfwp-ink-soft);
}

.sfwp-cart__empty p {
	margin: 0 0 14px;
}

.sfwp-cart__items {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sfwp-cart__items > li::before {
	display: none;
}

.sfwp-cart__item {
	position: relative;
	display: flex;
	gap: 12px;
	padding: 12px 22px 12px 0;
	border-bottom: 1px solid var(--sfwp-line);
}

.sfwp-cart__thumb img {
	display: block;
	width: 58px;
	height: 58px;
	border-radius: 10px;
	object-fit: cover;
}

.sfwp-cart__details {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	flex: 1;
}

.sfwp-cart__name {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
}

.sfwp-cart__name a {
	color: inherit;
	text-decoration: none;
}

.sfwp-cart__meta,
.sfwp-cart__qty-static {
	font-size: 12px;
	color: var(--sfwp-ink-soft);
}

.sfwp-cart__price {
	font-size: 13.5px;
	font-weight: 600;
}

.sfwp-cart__qty {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin-top: 4px;
	border: 1px solid var(--sfwp-line);
	border-radius: 999px;
	overflow: hidden;
	width: fit-content;
}

.sfwp-cart__step {
	width: 28px;
	height: 28px;
	border: 0;
	background: var(--sfwp-surface-2);
	color: var(--sfwp-ink);
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
}

.sfwp-cart__step:hover {
	background: var(--sfwp-brand);
	color: var(--sfwp-on-brand);
}

.sfwp-cart__qty-value {
	min-width: 30px;
	text-align: center;
	font-size: 13px;
	font-weight: 600;
}

.sfwp-cart__remove {
	position: absolute;
	top: 12px;
	right: 0;
	padding: 2px 6px;
	border: 0;
	background: none;
	color: var(--sfwp-ink-soft);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
}

.sfwp-cart__remove:hover {
	color: #dc2626;
}

.sfwp-cart__foot {
	padding: 14px 18px 18px;
	border-top: 1px solid var(--sfwp-line);
	background: var(--sfwp-surface-2);
}

.sfwp-cart__subtotal {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: 12px;
	font-size: 15px;
}

.sfwp-cart__link {
	display: block;
	margin-top: 10px;
	font-size: 13.5px;
	text-align: center;
	color: var(--sfwp-ink-soft);
}

/* Free delivery meter */
.sfwp-cart__meter {
	margin-bottom: 14px;
	padding: 12px 14px;
	border-radius: 12px;
	background: var(--sfwp-surface-2);
}

.sfwp-cart__meter-text {
	margin: 0 0 8px;
	font-size: 13px;
	color: var(--sfwp-ink-soft);
}

.sfwp-cart__meter.is-reached .sfwp-cart__meter-text {
	color: var(--sfwp-online);
	font-weight: 600;
}

.sfwp-cart__meter-track {
	display: block;
	height: 6px;
	border-radius: 999px;
	background: var(--sfwp-line);
	overflow: hidden;
}

.sfwp-cart__meter-fill {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: var(--sfwp-brand);
	transition: width 0.4s ease;
}

.sfwp-cart__meter.is-reached .sfwp-cart__meter-fill {
	background: var(--sfwp-online);
}

html.sfwp-cart-locked,
html.sfwp-cart-locked body {
	overflow: hidden;
}

@media (max-width: 782px) {
	.sfwp-cart--popup .sfwp-cart__panel {
		width: calc(100vw - 28px);
	}
}

@keyframes sfwp-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes sfwp-slide-in {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}

@keyframes sfwp-slide-in-left {
	from { transform: translateX(-100%); }
	to { transform: translateX(0); }
}

/* ================================================================== */
/* Refinements                                                         */
/* Later in the file, same specificity, so these values win.            */
/* ================================================================== */

.sfwp,
.sfwp-inline,
.sfwp-btn,
.sfwp-woo,
.sfwp-cart,
.sfwp-oneclick,
.sfwp-pay,
.sfwp-share {
	--sfwp-ease: cubic-bezier(0.16, 1, 0.3, 1);
	/* Two layers: a tight contact shadow and a wide soft one. Single
	   shadows are what make a floating panel look pasted on. */
	--sfwp-shadow:
		0 1px 2px rgba(12, 20, 32, 0.16),
		0 18px 48px -20px rgba(12, 20, 32, 0.42);
	--sfwp-ring: color-mix(in srgb, var(--sfwp-brand) 24%, transparent);
}

/* Dark theme shares the admin panel's blue-shifted ground. */
.sfwp--theme-dark,
.sfwp-inline.sfwp--theme-dark,
.sfwp-share.sfwp--theme-dark {
	--sfwp-surface: #141b27;
	--sfwp-surface-2: #0f1622;
	--sfwp-ink: #e6ecf5;
	--sfwp-ink-soft: #8a99ae;
	--sfwp-line: rgba(255, 255, 255, 0.09);
	--sfwp-shadow:
		0 1px 2px rgba(0, 0, 0, 0.4),
		0 22px 55px -24px rgba(0, 0, 0, 0.8);
}

/* Bubble: a light sheen along the top edge reads as a physical object. */
.sfwp-toggle {
	background: var(--sfwp-brand);
	background: linear-gradient(160deg, color-mix(in srgb, #fff 14%, var(--sfwp-brand)), var(--sfwp-brand));
	box-shadow:
		0 1px 2px rgba(12, 20, 32, 0.2),
		0 14px 30px -12px color-mix(in srgb, var(--sfwp-brand) 70%, transparent);
	transition: transform 0.2s var(--sfwp-ease), box-shadow 0.2s var(--sfwp-ease);
}

.sfwp-toggle:hover {
	transform: translateY(-2px) scale(1.02);
	box-shadow:
		0 2px 4px rgba(12, 20, 32, 0.22),
		0 20px 38px -14px color-mix(in srgb, var(--sfwp-brand) 78%, transparent);
}

.sfwp-toggle:active {
	transform: translateY(0) scale(0.98);
}

/* Panel: hairline highlight on top, so the header does not sit flat. */
.sfwp-panel,
.sfwp-cart__panel {
	border: 1px solid var(--sfwp-line);
}

.sfwp-panel__head {
	background: var(--sfwp-brand);
	background:
		radial-gradient(120% 200% at 0% 0%, rgba(255, 255, 255, 0.22) 0%, transparent 60%),
		var(--sfwp-brand);
}

.sfwp-panel__title,
.sfwp-cart__title {
	letter-spacing: -0.012em;
}

/* Channel rows: calmer resting state, decisive hover. */
.sfwp-agent__link {
	border-radius: calc(var(--sfwp-radius) - 4px);
	transition:
		transform 0.18s var(--sfwp-ease),
		border-color 0.18s ease,
		box-shadow 0.18s ease;
}

.sfwp-agent__link:hover {
	transform: translateX(3px);
	box-shadow:
		0 1px 2px rgba(12, 20, 32, 0.08),
		0 12px 24px -18px rgba(12, 20, 32, 0.9);
}

.sfwp-agent__link::before {
	width: 3px;
	border-radius: 0 3px 3px 0;
}

.sfwp-agent__name {
	letter-spacing: -0.008em;
}

.sfwp-agent__status {
	font-size: 10.5px;
	letter-spacing: 0.06em;
}

/* Buttons: same contact-plus-soft shadow language as the bubble. */
.sfwp-btn {
	border-radius: 11px;
	letter-spacing: -0.005em;
	transition: transform 0.16s var(--sfwp-ease), filter 0.16s ease, box-shadow 0.16s ease;
}

.sfwp-btn--brand,
.sfwp-btn--solid {
	box-shadow: 0 10px 22px -14px var(--sfwp-channel, var(--sfwp-brand));
}

.sfwp-btn:active {
	transform: translateY(0) scale(0.99);
}

/* Inputs: one consistent focus ring everywhere. */
.sfwp-field__input {
	border-radius: 11px;
	transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.sfwp-field__input:focus {
	box-shadow: 0 0 0 3px var(--sfwp-ring);
}

/* Cart panel head picks up the same treatment as the chat panel. */
.sfwp-cart__head {
	background: linear-gradient(180deg, color-mix(in srgb, var(--sfwp-brand) 7%, transparent), transparent);
}

.sfwp-cart__count {
	box-shadow: 0 0 0 2px var(--sfwp-surface);
	font-variant-numeric: tabular-nums;
}

.sfwp-cart__item {
	transition: background 0.16s ease;
}

.sfwp-cart__item:hover {
	background: color-mix(in srgb, var(--sfwp-brand) 4%, transparent);
}

/* Wallet number: the one thing on the checkout the buyer must copy. */
.sfwp-pay__number {
	font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
	font-size: 23px;
	letter-spacing: 0.06em;
}

.sfwp-pay__account {
	background: linear-gradient(180deg, color-mix(in srgb, var(--sfwp-channel, var(--sfwp-brand)) 8%, transparent), transparent), var(--sfwp-surface-2);
}

/* Share row: lift on hover rather than only darkening. */
.sfwp-share__item {
	transition: transform 0.16s var(--sfwp-ease), filter 0.16s ease, box-shadow 0.16s ease;
}

.sfwp-share__item:hover {
	box-shadow: 0 10px 20px -12px var(--sfwp-channel, var(--sfwp-brand));
}

/* Teaser: match the panel's shadow language. */
.sfwp-teaser {
	border: 1px solid var(--sfwp-line);
	border-radius: 15px;
}

.sfwp-oneclick {
	box-shadow: 0 1px 2px rgba(12, 20, 32, 0.06);
}
