:root { --primary-color: #2563eb; --button-color: #2563eb; }
* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, Segoe UI, Roboto, sans-serif; background: #f4f6fb; color: #1e293b; }

.order-page { max-width: 640px; margin: 0 auto; padding: 40px 16px; }
.site-credit { text-align: center; font-size: 12px; color: #94a3b8; margin: -16px 0 24px; }
.site-credit a { color: #64748b; }
.order-top-text { text-align: center; margin-bottom: 20px; color: #475569; }
.order-card { background: #fff; border-radius: 14px; padding: 32px; box-shadow: 0 4px 24px rgba(0,0,0,.06); }
.order-header-image { max-width: 100%; display: block; margin: 0 auto 20px; }
.order-intro-text { color: #475569; margin-bottom: 16px; }
.order-product-name { color: var(--primary-color); margin: 0 0 8px; font-size: 26px; }
.order-product-description { color: #475569; }
.order-product-price { font-size: 22px; font-weight: 700; margin-bottom: 24px; }

.form-row { margin-bottom: 14px; display: flex; flex-direction: column; gap: 4px; }
.form-row label { font-size: 13px; font-weight: 600; color: #475569; }
.field-label { display: block; }
.field-label .required-mark { font-size: 13px; font-weight: 600; color: #475569; margin-left: 2px; }

.required-note { font-size: 12px; color: #64748b; margin: -6px 0 16px; }
.required-note .required-mark { color: #64748b; }
.checkbox-row .required-mark { color: #475569; margin-left: 2px; }

.form-errors { background: #fee2e2; color: #991b1b; border-radius: 8px; padding: 10px 16px 10px 32px; margin: 0 0 14px; font-size: 13px; }
.form-errors li { margin: 2px 0; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
input, textarea, select {
	padding: 10px 12px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 15px; width: 100%;
}
.checkbox-row { display: block; font-size: 14px; margin: 6px 0; }
.checkbox-row input { width: auto; display: inline; margin-right: 8px; }
.order-checkboxes { margin: 16px 0; }

.order-submit-btn {
	display: block; width: 100%; padding: 14px; margin-top: 20px;
	background: var(--button-color); color: #fff; border: none; border-radius: 8px;
	font-size: 16px; font-weight: 600; cursor: pointer;
}
.order-submit-btn:hover { opacity: .92; }

.summary-table { width: 100%; margin: 20px 0; border-collapse: collapse; }
.summary-table td { padding: 8px 0; border-bottom: 1px solid #e2e8f0; }
.summary-table td:first-child { color: #64748b; }

.qr-box { text-align: center; margin-top: 24px; }
.qr-box img { border: 1px solid #e2e8f0; border-radius: 12px; padding: 12px; }
