:root {
	--wccm-blue: #2447ff;
	--wccm-blue-hover: #1736e8;
	--wccm-ink: #111425;
	--wccm-muted: #6b7180;
	--wccm-border: #e5e7ee;
	--wccm-surface: #ffffff;
	--wccm-soft: #f6f7fb;
}

.wccm-checkout-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	box-sizing: border-box;
	padding: 0 22px;
	border-radius: 8px;
	background: var(--wccm-blue);
	color: #fff !important;
	font-weight: 700;
	text-decoration: none !important;
	transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.wccm-checkout-button:hover {
	background: var(--wccm-blue-hover);
	box-shadow: 0 8px 20px rgba( 36, 71, 255, 0.2 );
	transform: translateY( -1px );
}

.wccm-launcher {
	position: fixed;
	z-index: 2147483000;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 56px;
	height: 100vh;
	height: 100dvh;
	opacity: 0;
	transition: opacity 0.2s ease;
}

.wccm-launcher.is-visible {
	opacity: 1;
}

.wccm-launcher.is-closing {
	opacity: 0;
}

.wccm-launcher__shade {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: rgba( 7, 9, 18, 0.34 ) !important;
	backdrop-filter: blur( 2px ) saturate( 0.92 );
	-webkit-backdrop-filter: blur( 2px ) saturate( 0.92 );
	cursor: pointer;
}

.wccm-launcher__panel {
	position: relative;
	box-sizing: border-box;
	min-width: 0;
	min-height: 0;
	max-width: 100%;
	max-height: 100%;
	width: min( 1080px, calc( 100vw - 112px ) );
	height: min( 760px, calc( 100vh - 112px ) );
	height: min( 760px, calc( 100dvh - 112px ) );
	overflow: hidden;
	border: 1px solid rgba( 255, 255, 255, 0.42 );
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 30px 80px rgba( 0, 0, 0, 0.3 );
	transform: translateY( 14px ) scale( 0.99 );
	transition: transform 0.24s cubic-bezier( 0.22, 1, 0.36, 1 );
}

.wccm-launcher.is-visible .wccm-launcher__panel {
	transform: translateY( 0 ) scale( 1 );
}

.wccm-launcher__frame {
	position: absolute;
	z-index: 2;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	background: #fff;
	opacity: 0;
	transition: opacity 0.2s ease;
}

.wccm-launcher__panel.is-loaded .wccm-launcher__frame {
	opacity: 1;
}

.wccm-launcher__loader {
	position: absolute;
	z-index: 1;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #fff;
	color: var(--wccm-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.wccm-launcher__logo {
	position: relative;
	flex: 0 0 auto;
	width: 240px;
	width: clamp( 190px, 24vw, 270px );
	max-width: calc( 100% - 64px );
	line-height: 0;
	filter: drop-shadow( 0 8px 20px rgba( 36, 71, 255, 0.08 ) );
}

.wccm-launcher .wccm-launcher__logo-image {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	visibility: inherit;
	object-fit: contain;
}

.wccm-launcher__logo-base {
	filter: grayscale( 1 );
	opacity: 0.25;
}

.wccm-launcher__logo-wave {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 1;
	filter: saturate( 1.2 );
	animation: wccm-logo-wave 1.65s cubic-bezier( 0.45, 0, 0.55, 1 ) infinite;
}

.wccm-launcher__panel.is-loaded .wccm-launcher__loader {
	visibility: hidden;
}

.wccm-launcher__panel.is-loaded .wccm-launcher__logo-wave {
	animation: none;
}

.wccm-launcher__sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect( 0, 0, 0, 0 ) !important;
	white-space: nowrap !important;
	border: 0 !important;
	padding: 0 !important;
}

.wccm-launcher .wccm-launcher__close {
	all: unset !important;
	position: absolute !important;
	z-index: 2147483647 !important;
	top: 14px !important;
	right: 14px !important;
	display: grid !important;
	place-items: center !important;
	width: 42px !important;
	height: 42px !important;
	box-sizing: border-box !important;
	border: 1px solid rgba( 255, 255, 255, 0.16 ) !important;
	border-radius: 999px !important;
	background: #111425 !important;
	box-shadow: 0 7px 24px rgba( 8, 11, 24, 0.24 ) !important;
	color: #fff !important;
	cursor: pointer !important;
	transition: transform 0.18s ease, background 0.18s ease !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.wccm-launcher .wccm-launcher__close:hover {
	background: var(--wccm-blue) !important;
	transform: scale( 1.06 ) !important;
}

.wccm-launcher .wccm-launcher__close:focus-visible {
	outline: 3px solid rgba( 255, 255, 255, 0.95 ) !important;
	outline-offset: 3px !important;
}

.wccm-launcher__close-icon,
.wccm-launcher__close-icon::before,
.wccm-launcher__close-icon::after {
	display: block !important;
	box-sizing: border-box !important;
}

.wccm-launcher__close-icon {
	position: relative !important;
	width: 18px !important;
	height: 18px !important;
}

.wccm-launcher__close-icon::before,
.wccm-launcher__close-icon::after {
	position: absolute !important;
	top: 8px !important;
	left: 1px !important;
	width: 16px !important;
	height: 2px !important;
	border: 0 !important;
	border-radius: 2px !important;
	background: currentColor !important;
	content: "" !important;
}

.wccm-launcher__close-icon::before {
	transform: rotate( 45deg ) !important;
}

.wccm-launcher__close-icon::after {
	transform: rotate( -45deg ) !important;
}

@keyframes wccm-logo-wave {
	0% {
		-webkit-clip-path: polygon( -80% 0, -20% 0, -26% 25%, -20% 50%, -26% 75%, -32% 100%, -92% 100%, -86% 75%, -80% 50%, -86% 25% );
		clip-path: polygon( -80% 0, -20% 0, -26% 25%, -20% 50%, -26% 75%, -32% 100%, -92% 100%, -86% 75%, -80% 50%, -86% 25% );
	}
	100% {
		-webkit-clip-path: polygon( 140% 0, 200% 0, 194% 25%, 200% 50%, 194% 75%, 188% 100%, 128% 100%, 134% 75%, 140% 50%, 134% 25% );
		clip-path: polygon( 140% 0, 200% 0, 194% 25%, 200% 50%, 194% 75%, 188% 100%, 128% 100%, 134% 75%, 140% 50%, 134% 25% );
	}
}

body.wccm-checkout-page {
	min-height: 100vh;
	margin: 0;
	padding: 24px;
	box-sizing: border-box;
	background: #111425;
	color: var(--wccm-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.wccm-checkout-page *,
.wccm-checkout-page *::before,
.wccm-checkout-page *::after {
	box-sizing: border-box;
}

.wccm-checkout-backdrop {
	position: fixed;
	inset: 0;
	background:
		radial-gradient( circle at 15% 12%, rgba( 36, 71, 255, 0.3 ), transparent 38% ),
		radial-gradient( circle at 90% 90%, rgba( 78, 39, 255, 0.2 ), transparent 40% ),
		#111425;
}

.wccm-checkout-shell {
	position: relative;
	z-index: 1;
	width: min( 1180px, 100% );
	min-height: calc( 100vh - 48px );
	margin: 0 auto;
	overflow: hidden;
	border: 1px solid rgba( 255, 255, 255, 0.15 );
	border-radius: 18px;
	background: var(--wccm-surface);
	box-shadow: 0 30px 90px rgba( 0, 0, 0, 0.35 );
}

.wccm-checkout-header {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 24px;
	min-height: 88px;
	padding: 14px 68px 14px 30px;
	border-bottom: 1px solid var(--wccm-border);
	background: rgba( 255, 255, 255, 0.96 );
}

.wccm-checkout-brand {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}

.wccm-site-logo img,
.wccm-site-logo .custom-logo {
	display: block;
	width: auto;
	max-width: 150px;
	height: 38px;
	object-fit: contain;
}

.wccm-site-name {
	overflow: hidden;
	color: var(--wccm-ink);
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.02em;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wccm-secure-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #777d8b;
	font-size: 11px;
	font-weight: 650;
	white-space: nowrap;
}

.wccm-secure-label svg {
	width: 15px;
	height: 15px;
	fill: #239566;
}

.wccm-checkout-product {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 430px;
	min-width: 0;
}

.wccm-checkout-thumb {
	flex: 0 0 54px;
	width: 54px;
	height: 54px;
	overflow: hidden;
	border-radius: 9px;
	background: var(--wccm-soft);
}

.wccm-checkout-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
}

.wccm-checkout-product > div:last-child {
	min-width: 0;
}

.wccm-checkout-product span,
.wccm-checkout-product strong,
.wccm-checkout-product small {
	display: block;
}

.wccm-checkout-product span,
.wccm-checkout-product small {
	color: var(--wccm-muted);
	font-size: 10px;
}

.wccm-checkout-product strong {
	overflow: hidden;
	max-width: 330px;
	margin: 2px 0;
	font-size: 13px;
	line-height: 1.25;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wccm-checkout-close {
	position: absolute;
	top: 50%;
	right: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 1px solid var(--wccm-border);
	border-radius: 50%;
	background: #fff;
	transform: translateY( -50% );
	transition: background 0.18s ease, border-color 0.18s ease;
}

.wccm-checkout-close:hover {
	border-color: #ccd0db;
	background: var(--wccm-soft);
}

.wccm-checkout-close svg {
	width: 20px;
	height: 20px;
	fill: var(--wccm-ink);
}

.wccm-checkout-content {
	padding: 34px 38px 48px;
}

.wccm-checkout-content .woocommerce {
	width: 100%;
	max-width: none;
}

.wccm-checkout-content .woocommerce-error,
.wccm-checkout-content .woocommerce-info,
.wccm-checkout-content .woocommerce-message {
	margin: 0 0 24px;
	padding: 15px 18px 15px 48px;
	border: 0;
	border-left: 3px solid var(--wccm-blue);
	border-radius: 8px;
	background: #f1f3ff;
	color: var(--wccm-ink);
}

.wccm-checkout-content form.checkout {
	display: grid;
	grid-template-columns: minmax( 0, 1.35fr ) minmax( 320px, 0.85fr );
	grid-template-rows: auto 1fr;
	gap: 34px;
	align-items: start;
}

.wccm-checkout-content form.checkout > .col2-set {
	grid-row: 1 / span 2;
	width: 100%;
	float: none;
}

.wccm-checkout-content form.checkout > .col2-set .col-1,
.wccm-checkout-content form.checkout > .col2-set .col-2 {
	width: 100%;
	float: none;
}

.wccm-checkout-content form.checkout > h3,
.wccm-checkout-content form.checkout > #order_review {
	grid-column: 2;
}

.wccm-checkout-content form.checkout > h3 {
	grid-row: 1;
	margin: 0 0 -22px;
}

.wccm-checkout-content form.checkout > #order_review {
	grid-row: 2;
}

.wccm-checkout-content #order_review {
	position: sticky;
	top: 20px;
	padding: 24px;
	border: 1px solid var(--wccm-border);
	border-radius: 14px;
	background: var(--wccm-soft);
}

.wccm-checkout-content h3 {
	margin: 0 0 20px;
	color: var(--wccm-ink);
	font-size: 19px;
	font-weight: 750;
	letter-spacing: -0.02em;
}

.wccm-checkout-content .form-row {
	margin: 0 0 15px;
	padding: 0;
}

.wccm-checkout-content .form-row label {
	margin-bottom: 6px;
	color: #303545;
	font-size: 12px;
	font-weight: 650;
}

.wccm-checkout-content .input-text,
.wccm-checkout-content select,
.wccm-checkout-content .select2-selection {
	min-height: 44px;
	border: 1px solid #d6d9e2;
	border-radius: 8px;
	background: #fff;
	box-shadow: none;
}

.wccm-checkout-content .input-text {
	padding: 10px 12px;
}

.wccm-checkout-content .input-text:focus,
.wccm-checkout-content select:focus {
	border-color: var(--wccm-blue);
	outline: 0;
	box-shadow: 0 0 0 2px rgba( 36, 71, 255, 0.12 );
}

.wccm-checkout-content table.shop_table {
	border: 0;
	border-collapse: collapse;
	background: transparent;
}

.wccm-checkout-content table.shop_table th,
.wccm-checkout-content table.shop_table td {
	padding: 12px 5px;
	border-color: #dfe2e9;
	font-size: 12px;
}

.wccm-checkout-content #payment {
	background: transparent;
}

.wccm-checkout-content #payment ul.payment_methods {
	padding: 18px 0;
	border-color: #dfe2e9;
}

.wccm-checkout-content #payment div.payment_box {
	border-radius: 8px;
	background: #e9ecf4;
	color: var(--wccm-ink);
}

.wccm-checkout-content #payment div.form-row {
	padding: 18px 0 0;
}

.wccm-checkout-content #place_order,
.wccm-checkout-content .button.alt {
	width: 100%;
	min-height: 50px;
	padding: 12px 20px;
	border: 0;
	border-radius: 9px;
	background: var(--wccm-blue);
	color: #fff;
	font-size: 14px;
	font-weight: 750;
	text-transform: none;
	transition: background 0.18s ease, transform 0.18s ease;
}

.wccm-checkout-content #place_order:hover,
.wccm-checkout-content .button.alt:hover {
	background: var(--wccm-blue-hover);
	transform: translateY( -1px );
}

.wccm-checkout-content a {
	color: var(--wccm-blue);
}

body.wccm-checkout-embedded {
	min-height: 100%;
	padding: 0;
	background: #fff;
}

.wccm-checkout-embedded .wccm-checkout-backdrop {
	display: none;
}

.wccm-checkout-embedded .wccm-checkout-shell {
	width: 100%;
	min-height: 100vh;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.wccm-checkout-embedded .wccm-checkout-close {
	display: none;
}

@media ( max-width: 900px ) {
	.wccm-launcher {
		padding: 32px;
	}

	.wccm-launcher__panel {
		width: calc( 100vw - 64px );
		height: calc( 100vh - 64px );
		height: calc( 100dvh - 64px );
	}

	.wccm-checkout-header {
		grid-template-columns: 1fr auto;
	}

	.wccm-checkout-product {
		display: none;
	}

	.wccm-checkout-content form.checkout {
		display: block;
	}

	.wccm-checkout-content form.checkout > h3 {
		margin-top: 30px;
	}

	.wccm-checkout-content #order_review {
		position: static;
		margin-top: 18px;
	}
}

@media ( max-width: 767px ), ( max-width: 1024px ) and ( max-height: 600px ) and ( orientation: landscape ) and ( pointer: coarse ) {
	.wccm-launcher {
		padding: 20px;
	}

	.wccm-launcher__panel {
		width: calc( 100vw - 40px );
		height: calc( 100vh - 40px );
		height: calc( 100dvh - 40px );
		border: 0;
		border-radius: 16px;
		transform: translateY( 20px );
	}

	.wccm-launcher .wccm-launcher__close {
		top: 12px !important;
		right: 12px !important;
	}
}

@media ( max-width: 600px ) {
	body.wccm-checkout-page {
		padding: 0;
		background: #fff;
	}

	.wccm-checkout-backdrop {
		display: none;
	}

	.wccm-checkout-shell {
		width: 100%;
		min-height: 100vh;
		border: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.wccm-checkout-header {
		position: sticky;
		z-index: 20;
		top: 0;
		min-height: 68px;
		padding: 10px 58px 10px 16px;
		background: rgba( 255, 255, 255, 0.97 );
		backdrop-filter: blur( 10px );
	}

	.wccm-site-logo img,
	.wccm-site-logo .custom-logo {
		max-width: 112px;
		height: 31px;
	}

	.wccm-site-name {
		font-size: 15px;
	}

	.wccm-secure-label {
		display: none;
	}

	.wccm-checkout-close {
		right: 12px;
		width: 38px;
		height: 38px;
	}

	.wccm-checkout-content {
		padding: 22px 16px 38px;
	}

	.wccm-checkout-content h3 {
		font-size: 17px;
	}

	.wccm-checkout-content #order_review {
		padding: 18px 14px;
		border-radius: 11px;
	}

	.wccm-checkout-content .form-row-first,
	.wccm-checkout-content .form-row-last {
		width: 100%;
		float: none;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.wccm-launcher,
	.wccm-launcher__panel,
	.wccm-launcher__frame,
	.wccm-checkout-button,
	.wccm-checkout-content #place_order {
		transition: none !important;
	}

	.wccm-launcher__logo-wave {
		animation: none;
		-webkit-clip-path: none;
		clip-path: none;
	}
}
