.dtfshop-pl-wrap {
	width: 100%;
	max-width: 760px;
	margin: 0 auto 28px;
	padding: 24px;
	border: 1px solid rgba(15, 23, 42, .12);
	border-radius: 18px;
	background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
	box-shadow: 0 16px 38px rgba(15, 23, 42, .08);
	box-sizing: border-box;
}
.dtfshop-pl-heading { text-align: center; margin-bottom: 20px; }
.dtfshop-pl-heading h2 { margin: 5px 0 8px; font-size: clamp(24px, 4vw, 34px); line-height: 1.15; }
.dtfshop-pl-heading p { margin: 0; color: #64748b; }
.dtfshop-pl-kicker {
	display: inline-flex;
	padding: 5px 10px;
	border-radius: 999px;
	background: #ecfdf5;
	color: #047857;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.dtfshop-pl-wrap label { display: block; margin: 0 0 7px; font-weight: 700; color: #0f172a; }
.dtfshop-pl-phone-row,
.dtfshop-pl-otp-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: stretch;
	gap: 10px;
}
.dtfshop-pl-otp-row { grid-template-columns: minmax(0, 1fr) auto; }
.dtfshop-pl-code {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 58px;
	padding: 0 12px;
	border: 1px solid #cbd5e1;
	border-radius: 12px;
	background: #f1f5f9;
	font-weight: 800;
	color: #0f172a;
}
.dtfshop-pl-wrap input[type="tel"],
.dtfshop-pl-wrap input[type="text"] {
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 10px 14px;
	border: 1px solid #cbd5e1;
	border-radius: 12px;
	background: #fff;
	box-sizing: border-box;
	font-size: 16px;
}
.dtfshop-pl-wrap input:focus { border-color: #2563eb; outline: 3px solid rgba(37, 99, 235, .12); }
.dtfshop-pl-wrap .button {
	min-height: 48px;
	padding: 0 18px !important;
	border-radius: 12px !important;
	white-space: nowrap;
	font-weight: 800 !important;
}
.dtfshop-pl-otp-step { margin-top: 16px; }
.dtfshop-pl-resend {
	margin-top: 9px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #2563eb;
	font-weight: 700;
	cursor: pointer;
}
.dtfshop-pl-resend:disabled { color: #94a3b8; cursor: not-allowed; }
.dtfshop-pl-message {
	display: none;
	margin: 0 0 14px;
	padding: 11px 13px;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 650;
}
.dtfshop-pl-message:not(:empty) { display: block; }
.dtfshop-pl-message.is-success { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.dtfshop-pl-message.is-error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.dtfshop-pl-message.is-info { background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe; }
.dtfshop-pl-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: #94a3b8; }
.dtfshop-pl-divider::before,
.dtfshop-pl-divider::after { content: ""; height: 1px; flex: 1; background: #e2e8f0; }
.dtfshop-google-button { display: flex; justify-content: center; min-height: 44px; }
.dtfshop-pl-fallback { margin: 18px 0 0; text-align: center; color: #64748b; font-size: 13px; }
.dtfshop-pl-checkout-box {
	margin: 0 0 20px;
	border: 1px solid #dbe3ec;
	border-radius: 14px;
	background: #fff;
	overflow: hidden;
}
.dtfshop-pl-checkout-box > summary {
	padding: 14px 16px;
	font-weight: 800;
	cursor: pointer;
	color: #0f172a;
	background: #f8fafc;
}
.dtfshop-pl-checkout-box .dtfshop-pl-wrap { margin: 0; max-width: none; border: 0; border-radius: 0; box-shadow: none; background: #fff; }
.dtfshop-pl-compact { padding: 18px; }
.dtfshop-pl-account-prompt { margin-bottom: 20px !important; }
@media (max-width: 640px) {
	.dtfshop-pl-wrap { padding: 18px 14px; border-radius: 14px; }
	.dtfshop-pl-phone-row { grid-template-columns: 62px minmax(0, 1fr); }
	.dtfshop-pl-phone-row .dtfshop-pl-send { grid-column: 1 / -1; width: 100%; }
	.dtfshop-pl-otp-row { grid-template-columns: 1fr; }
	.dtfshop-pl-otp-row .dtfshop-pl-verify { width: 100%; }
}
