Initial commit

2026-03-02 13:22:47 +05:30
commit e4c373f050
36 changed files with 7304 additions and 0 deletions
@@ -0,0 +1,165 @@
+/* ── PAGE BASE ── */
+body {
+	background: #f8fafc;
+}
+
+.checkout-page {
+	max-width: 100rem;
+	margin: 0 auto;
+	padding: var(--space-6);
+}
+
+/* ── PAGE TITLE ── */
+.checkout-page-title {
+	margin: 0 auto var(--space-6);
+	display: flex;
+	align-items: center;
+	gap: var(--space-3);
+}
+
+.checkout-page-title h1 {
+	font-size: var(--text-deal, 2.125rem);
+	font-weight: 900;
+	color: var(--gray-800);
+	letter-spacing: -0.04em;
+}
+
+.checkout-layout {
+	margin: 0 auto;
+	display: grid;
+	grid-template-columns: 3fr 1fr;
+	gap: var(--space-4);
+	align-items: start;
+}
+
+.checkout-form-card,
+.checkout-summary-card {
+	background: white;
+	border: 0.0625rem solid var(--gray-200);
+	border-radius: var(--radius-xl);
+	padding: var(--space-6);
+}
+
+.checkout-title {
+	font-size: var(--text-3xl);
+	font-weight: 800;
+	margin-bottom: var(--space-4);
+	color: var(--gray-800);
+}
+
+.checkout-form {
+	display: flex;
+	flex-direction: column;
+	gap: var(--space-3);
+}
+
+.checkout-form input {
+	border: 0.0625rem solid var(--gray-200);
+	border-radius: var(--radius-md);
+	padding: var(--space-3);
+	font-size: var(--text-md);
+	font-family: inherit;
+	outline: none;
+	transition: border-color 0.2s;
+}
+
+.checkout-form input:focus {
+	border-color: var(--blue);
+}
+
+.form-group {
+	display: flex;
+	flex-direction: column;
+	gap: var(--space-1);
+	flex: 1;
+}
+
+.form-group label {
+	font-size: var(--text-sm);
+	font-weight: 600;
+	color: var(--gray-700);
+}
+
+.form-group label span {
+	color: var(--red);
+	font-weight: 700;
+}
+
+.form-group input {
+	border: 0.0625rem solid var(--gray-200);
+	border-radius: var(--radius-md);
+	padding: var(--space-3);
+	font-size: var(--text-md);
+	font-family: inherit;
+	outline: none;
+	transition: border-color 0.2s, box-shadow 0.2s;
+}
+
+.form-group input:focus {
+	border-color: var(--blue);
+	box-shadow: 0 0 0 0.125rem rgba(26, 111, 212, 0.15);
+}
+
+.form-row {
+	display: flex;
+	gap: var(--space-4);
+}
+
+@media (max-width: 56.25rem) {
+	.form-row {
+		flex-direction: column;
+	}
+}
+
+.checkout-continue {
+	margin-top: var(--space-4);
+}
+
+.checkout-summary {
+	margin-top: var(--space-4);
+	display: flex;
+	flex-direction: column;
+	gap: var(--space-3);
+}
+
+.summary-row {
+	display: flex;
+	justify-content: space-between;
+	font-size: var(--text-md);
+}
+
+.total-row {
+	font-size: var(--text-xl);
+	font-weight: 800;
+	color: var(--red);
+}
+
+.qr-section {
+	margin-top: var(--space-6);
+	text-align: center;
+}
+
+.qr-wrapper {
+	margin-top: var(--space-3);
+	border-radius: var(--radius-lg);
+	overflow: hidden;
+	transition: filter 0.3s ease;
+}
+
+.qr-wrapper img {
+	width: 100%;
+	height: auto;
+	display: block;
+}
+
+.qr-wrapper.blurred {
+	filter: blur(12px);
+	pointer-events: none;
+}
+
+/* Responsive */
+@media (max-width: 56.25rem) {
+	.checkout-layout {
+		grid-template-columns: 1fr;
+	}
+}