@anker-in/ui 0.1.10 → 0.1.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/demo-room.js +107 -94
  2. package/dist/demo-room.js.map +1 -1
  3. package/dist/demo-room.mjs +107 -94
  4. package/dist/demo-room.mjs.map +1 -1
  5. package/dist/index.d.mts +3 -2
  6. package/dist/index.d.ts +3 -2
  7. package/dist/index.js +262 -212
  8. package/dist/index.js.map +1 -1
  9. package/dist/index.mjs +262 -212
  10. package/dist/index.mjs.map +1 -1
  11. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -74,7 +74,7 @@ var StudioCard = ({
74
74
  {
75
75
  ...props,
76
76
  className: cn(
77
- "p-6 cursor-pointer transition-colors duration-200",
77
+ "p-6 cursor-pointer transition-colors duration-200 border-b border-[#E4E5E6] last:border-b-0",
78
78
  className
79
79
  ),
80
80
  style: {
@@ -91,8 +91,8 @@ var StudioCard = ({
91
91
  },
92
92
  children: [
93
93
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between mb-4", children: [
94
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-semibold text-gray-900", children: name }),
95
- distance !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-medium text-[#2E8B57] bg-[#E8F5E9] px-3 py-1 rounded-full whitespace-nowrap ml-2", children: [
94
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[24px] l:text-[20px] font-bold text-[#080A0F]", children: name }),
95
+ distance !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[16px] l:text-[14px] font-medium text-[#2E8B57] bg-[#E8F5E9] px-3 py-1 rounded-full whitespace-nowrap ml-2", children: [
96
96
  formatDistance(distance),
97
97
  " ",
98
98
  pageData.away
@@ -151,7 +151,7 @@ var StudioCard = ({
151
151
  ]
152
152
  }
153
153
  ),
154
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm text-gray-600", children: [
154
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[16px] l:text-[12px] text-[#2A2C32]", children: [
155
155
  availableTime === pageData.noAvailableTime ? "" : pageData.available,
156
156
  " ",
157
157
  availableTime
@@ -187,7 +187,7 @@ var StudioCard = ({
187
187
  ]
188
188
  }
189
189
  ),
190
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-600 break-words", children: address }) })
190
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[16px] l:text-[14px] text-[#2A2C32] break-words", children: address }) })
191
191
  ] }),
192
192
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3 mb-6", children: [
193
193
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -195,55 +195,44 @@ var StudioCard = ({
195
195
  {
196
196
  width: "20",
197
197
  height: "20",
198
- viewBox: "0 0 20 20",
198
+ viewBox: "0 0 24 24",
199
199
  fill: "none",
200
200
  xmlns: "http://www.w3.org/2000/svg",
201
201
  className: "flex-shrink-0 mt-0.5",
202
202
  children: [
203
- /* @__PURE__ */ jsxRuntime.jsx(
204
- "rect",
205
- {
206
- x: "3",
207
- y: "5",
208
- width: "14",
209
- height: "10",
210
- rx: "1.5",
211
- stroke: "currentColor",
212
- strokeWidth: "1.5"
213
- }
214
- ),
215
203
  /* @__PURE__ */ jsxRuntime.jsx(
216
204
  "path",
217
205
  {
218
- d: "M7 15V17",
206
+ d: "M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z",
219
207
  stroke: "currentColor",
220
- strokeWidth: "1.5",
221
- strokeLinecap: "round"
208
+ strokeWidth: "2",
209
+ strokeLinecap: "round",
210
+ strokeLinejoin: "round"
222
211
  }
223
212
  ),
224
213
  /* @__PURE__ */ jsxRuntime.jsx(
225
214
  "path",
226
215
  {
227
- d: "M13 15V17",
216
+ d: "M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325",
228
217
  stroke: "currentColor",
229
- strokeWidth: "1.5",
230
- strokeLinecap: "round"
218
+ strokeWidth: "2",
219
+ strokeLinecap: "round",
220
+ strokeLinejoin: "round"
231
221
  }
232
- ),
233
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "10", cy: "10", r: "1.5", fill: "currentColor" })
222
+ )
234
223
  ]
235
224
  }
236
225
  ),
237
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-600", children: euifyMakeModel }) })
226
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[16px] l:text-[14px] text-[#2A2C32]", children: euifyMakeModel }) })
238
227
  ] }),
239
228
  /* @__PURE__ */ jsxRuntime.jsx(
240
229
  "button",
241
230
  {
242
231
  onClick: handleScheduleClick,
243
232
  className: cn(
244
- "w-full px-6 py-3 rounded-full",
245
- "bg-white text-gray-900 border border-gray-900",
246
- "font-medium text-sm",
233
+ "w-fit px-[28px] l:px-[20px] l:py-[8px] py-3 rounded-full",
234
+ "bg-white text-gray-900 border-2 border-gray-900",
235
+ "font-bold text-[16px] l:text-[14px]",
247
236
  "hover:bg-gray-900 hover:text-white",
248
237
  "transition-all duration-200"
249
238
  ),
@@ -363,14 +352,12 @@ var StudioMap = ({
363
352
  const lng = Number(location.lng);
364
353
  const svgIcon = {
365
354
  url: `data:image/svg+xml;charset=UTF-8,${encodeURIComponent(`
366
- <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
367
- <circle cx="24" cy="24" r="22" fill="#00000010"/>
368
- <circle cx="24" cy="24" r="10" fill="#000000"/>
369
- <circle cx="24" cy="24" r="5" fill="#3ADB67"/>
355
+ <svg xmlns="http://www.w3.org/2000/svg" width="34" height="44" viewBox="0 0 17 22" fill="none">
356
+ <path d="M8.5 0C13.1944 0 17 3.80557 17 8.5C17 12.1044 14.94 15.4573 13.0264 17.8174C12.0543 19.0162 11.0847 20.0016 10.3584 20.6875C9.99466 21.031 9.69081 21.3018 9.47559 21.4873C9.36796 21.5801 9.28226 21.6518 9.22266 21.7012C9.19285 21.7259 9.16878 21.7444 9.15234 21.7578C9.14444 21.7642 9.13843 21.7697 9.13379 21.7734C9.13156 21.7752 9.12935 21.7772 9.12793 21.7783L9.12598 21.7803H9.125C9.12232 21.7774 9.08429 21.7304 8.5 21L9.125 21.7812C8.75978 22.0734 8.24022 22.0734 7.875 21.7812L8.5 21C7.91571 21.7304 7.87768 21.7774 7.875 21.7803H7.87402L7.87207 21.7783C7.87065 21.7772 7.86844 21.7752 7.86621 21.7734C7.86157 21.7697 7.85556 21.7642 7.84766 21.7578C7.83122 21.7444 7.80715 21.7259 7.77734 21.7012C7.71774 21.6518 7.63204 21.5801 7.52441 21.4873C7.30919 21.3018 7.00534 21.031 6.6416 20.6875C5.91533 20.0016 4.94566 19.0162 3.97363 17.8174C2.06001 15.4573 0 12.1044 0 8.5C0 3.80557 3.80557 0 8.5 0ZM8.5 2C4.91013 2 2 4.91013 2 8.5C2 11.3955 3.69006 14.2928 5.52637 16.5576C6.4292 17.6711 7.33473 18.5922 8.01465 19.2344C8.19381 19.4036 8.3573 19.5526 8.5 19.6807C8.6427 19.5526 8.80619 19.4036 8.98535 19.2344C9.66527 18.5922 10.5708 17.6711 11.4736 16.5576C13.3099 14.2928 15 11.3955 15 8.5C15 4.91013 12.0899 2 8.5 2ZM8.5 4.59961C10.6539 4.59961 12.4004 6.34609 12.4004 8.5C12.4004 10.6539 10.6539 12.4004 8.5 12.4004C6.34609 12.4004 4.59961 10.6539 4.59961 8.5C4.59961 6.34609 6.34609 4.59961 8.5 4.59961ZM8.5 6.40039C7.34021 6.40039 6.40039 7.34021 6.40039 8.5C6.40039 9.65979 7.34021 10.5996 8.5 10.5996C9.65979 10.5996 10.5996 9.65979 10.5996 8.5C10.5996 7.34021 9.65979 6.40039 8.5 6.40039Z" fill="#3D3D3F"/>
370
357
  </svg>
371
358
  `)}`,
372
- scaledSize: { width: 48, height: 48 },
373
- anchor: { x: 24, y: 24 }
359
+ scaledSize: { width: 34, height: 44 },
360
+ anchor: { x: 17, y: 44 }
374
361
  };
375
362
  const marker = new google.maps.Marker({
376
363
  position: { lat, lng },
@@ -381,41 +368,53 @@ var StudioMap = ({
381
368
  marker.addListener("click", () => {
382
369
  setSelectedLocation(location);
383
370
  const content = `
384
- <div style="padding: 16px; max-width: 300px; font-family: system-ui, sans-serif;">
385
- <h3 style="margin: 0 0 12px 0; font-size: 18px; font-weight: 600;">${location.name}</h3>
386
- ${location.availableTime ? `<div style="margin-bottom: 8px; color: #666;">
387
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
388
- <path d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"/>
371
+ <div style="padding: 0 16px 16px 16px; font-weight: 700; font-family: 'MontForAnker'; max-width: 420px;">
372
+ <h3 style="margin: 0 0 16px 0; font-size: 24px; color: #080A0F;">${location.name}</h3>
373
+ ${location.availableTime ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
374
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
375
+ <rect x="3" y="4" width="14" height="13" rx="2" stroke="currentColor" stroke-width="1.5"/>
376
+ <path d="M3 8H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
377
+ <path d="M6 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
378
+ <path d="M14 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
389
379
  </svg>
390
- <span style="vertical-align: middle;"> ${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</span>
380
+ <div>
381
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</p>
382
+ </div>
391
383
  </div>` : ""}
392
- <div style="margin-bottom: 8px; color: #666;">
393
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
394
- <path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"/>
384
+ <div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
385
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
386
+ <path d="M10 10C11.1046 10 12 9.10457 12 8C12 6.89543 11.1046 6 10 6C8.89543 6 8 6.89543 8 8C8 9.10457 8.89543 10 10 10Z" stroke="currentColor" stroke-width="1.5"/>
387
+ <path d="M10 18C10 18 16 13 16 8C16 4.68629 13.3137 2 10 2C6.68629 2 4 4.68629 4 8C4 13 10 18 10 18Z" stroke="currentColor" stroke-width="1.5"/>
395
388
  </svg>
396
- <span style="vertical-align: middle;">${location.address}</span>
389
+ <div style="flex: 1;">
390
+ <p style="margin: 0; font-size: 16px; color: #2A2C32; word-wrap: break-word;">${location.address}</p>
391
+ </div>
397
392
  </div>
398
- ${location.euifyMakeModel ? `<div style="margin-bottom: 12px; color: #666;">
399
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
400
- <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
393
+ ${location.euifyMakeModel ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px;">
394
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
395
+ <path d="M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
396
+ <path d="M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
401
397
  </svg>
402
- <span style="vertical-align: middle;">${location.euifyMakeModel}</span>
398
+ <div>
399
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.euifyMakeModel}</p>
400
+ </div>
403
401
  </div>` : ""}
404
402
  <button
405
403
  id="schedule-btn-${location.id}"
406
404
  style="
407
- width: 100%;
408
- padding: 10px 16px;
409
- background: #000;
410
- color: #fff;
411
- border: none;
412
- border-radius: 6px;
413
- font-weight: 500;
405
+ width: fit-content;
406
+ padding: 12px 28px;
407
+ background: #fff;
408
+ color: #111827;
409
+ border: 2px solid #111827;
410
+ border-radius: 9999px;
411
+ font-weight: 700;
414
412
  cursor: pointer;
415
- font-size: 14px;
413
+ font-size: 16px;
414
+ transition: all 0.2s;
416
415
  "
417
- onmouseover="this.style.background='#333'"
418
- onmouseout="this.style.background='#000'"
416
+ onmouseover="this.style.background='#111827'; this.style.color='#fff';"
417
+ onmouseout="this.style.background='#fff'; this.style.color='#111827';"
419
418
  >
420
419
  ${pageData.scheduleNow}
421
420
  </button>
@@ -467,41 +466,53 @@ var StudioMap = ({
467
466
  const marker = markersRef.current[markerIndex];
468
467
  if (location && marker) {
469
468
  const content = `
470
- <div style="padding: 16px; max-width: 300px; font-family: system-ui, sans-serif;">
471
- <h3 style="margin: 0 0 12px 0; font-size: 18px; font-weight: 600;">${location.name}</h3>
472
- ${location.availableTime ? `<div style="margin-bottom: 8px; color: #666;">
473
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
474
- <path d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"/>
469
+ <div style="padding: 0 16px 16px 16px; font-weight: 700; font-family: 'MontForAnker'; max-width: 420px;">
470
+ <h3 style="margin: 0 0 16px 0; font-size: 24px; color: #080A0F;">${location.name}</h3>
471
+ ${location.availableTime ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
472
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
473
+ <rect x="3" y="4" width="14" height="13" rx="2" stroke="currentColor" stroke-width="1.5"/>
474
+ <path d="M3 8H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
475
+ <path d="M6 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
476
+ <path d="M14 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
475
477
  </svg>
476
- <span style="vertical-align: middle;">${pageData.available} ${location.availableTime}</span>
478
+ <div>
479
+ <p style="margin: 0;font-size: 16px; color: #2A2C32;">${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</p>
480
+ </div>
477
481
  </div>` : ""}
478
- <div style="margin-bottom: 8px; color: #666;">
479
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
480
- <path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"/>
482
+ <div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
483
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
484
+ <path d="M10 10C11.1046 10 12 9.10457 12 8C12 6.89543 11.1046 6 10 6C8.89543 6 8 6.89543 8 8C8 9.10457 8.89543 10 10 10Z" stroke="currentColor" stroke-width="1.5"/>
485
+ <path d="M10 18C10 18 16 13 16 8C16 4.68629 13.3137 2 10 2C6.68629 2 4 4.68629 4 8C4 13 10 18 10 18Z" stroke="currentColor" stroke-width="1.5"/>
481
486
  </svg>
482
- <span style="vertical-align: middle;">${location.address}</span>
487
+ <div style="flex: 1;">
488
+ <p style="margin: 0; font-size: 16px; color: #2A2C32; word-wrap: break-word;">${location.address}</p>
489
+ </div>
483
490
  </div>
484
- ${location.euifyMakeModel ? `<div style="margin-bottom: 12px; color: #666;">
485
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
486
- <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
491
+ ${location.euifyMakeModel ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px;">
492
+ <svg style="flex-shrink: 0; margin-top: 2px;" width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
493
+ <path d="M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
494
+ <path d="M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
487
495
  </svg>
488
- <span style="vertical-align: middle;">${location.euifyMakeModel}</span>
496
+ <div>
497
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.euifyMakeModel}</p>
498
+ </div>
489
499
  </div>` : ""}
490
500
  <button
491
501
  id="schedule-btn-hover-${location.id}"
492
502
  style="
493
- width: 100%;
494
- padding: 10px 16px;
495
- background: #000;
496
- color: #fff;
497
- border: none;
498
- border-radius: 6px;
499
- font-weight: 500;
503
+ width: fit-content;
504
+ padding: 12px 28px;
505
+ background: #fff;
506
+ color: #111827;
507
+ border: 2px solid #111827;
508
+ border-radius: 9999px;
509
+ font-weight: 700;
500
510
  cursor: pointer;
501
- font-size: 14px;
511
+ font-size: 16px;
512
+ transition: all 0.2s;
502
513
  "
503
- onmouseover="this.style.background='#333'"
504
- onmouseout="this.style.background='#000'"
514
+ onmouseover="this.style.background='#111827'; this.style.color='#fff';"
515
+ onmouseout="this.style.background='#fff'; this.style.color='#111827';"
505
516
  >
506
517
  ${pageData.scheduleNow}
507
518
  </button>
@@ -991,9 +1002,9 @@ var LocationFilter = ({
991
1002
  "div",
992
1003
  {
993
1004
  style: { background: "#F8F8F8" },
994
- className: "rounded-[12px] rounded-b-none h-[72px] font-bold text-[14px] flex flex-col",
1005
+ className: "rounded-[12px] rounded-b-none h-[108px] font-bold text-[14px] flex flex-col",
995
1006
  children: [
996
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-end px-[20px] pt-[12px] pb-[8px]", children: /* @__PURE__ */ jsxRuntime.jsx(
1007
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-end px-[24px] pt-[12px] pb-[8px]", children: /* @__PURE__ */ jsxRuntime.jsx(
997
1008
  "button",
998
1009
  {
999
1010
  onClick: onClose,
@@ -1017,14 +1028,14 @@ var LocationFilter = ({
1017
1028
  )
1018
1029
  }
1019
1030
  ) }),
1020
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center px-[20px] gap-[16px] pb-[8px]", children: [
1031
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center text-[16px] px-[20px] gap-[16px] py-[16px]", children: [
1021
1032
  /* @__PURE__ */ jsxRuntime.jsx(
1022
1033
  "button",
1023
1034
  {
1024
1035
  onClick: () => handleTabClick("country"),
1025
1036
  className: cn(
1026
1037
  "pb-[4px] transition-colors",
1027
- currentLevel === "country" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]"
1038
+ currentLevel === "country" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]"
1028
1039
  ),
1029
1040
  children: pageData.country
1030
1041
  }
@@ -1036,7 +1047,7 @@ var LocationFilter = ({
1036
1047
  disabled: !selectedCountry,
1037
1048
  className: cn(
1038
1049
  "pb-[4px] transition-colors",
1039
- currentLevel === "state" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]",
1050
+ currentLevel === "state" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
1040
1051
  !selectedCountry && "opacity-50 cursor-not-allowed"
1041
1052
  ),
1042
1053
  children: pageData.state
@@ -1049,7 +1060,7 @@ var LocationFilter = ({
1049
1060
  disabled: !selectedState,
1050
1061
  className: cn(
1051
1062
  "pb-[4px] transition-colors",
1052
- currentLevel === "city" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]",
1063
+ currentLevel === "city" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
1053
1064
  !selectedState && "opacity-50 cursor-not-allowed"
1054
1065
  ),
1055
1066
  children: pageData.city
@@ -1059,12 +1070,13 @@ var LocationFilter = ({
1059
1070
  ]
1060
1071
  }
1061
1072
  ),
1062
- /* @__PURE__ */ jsxRuntime.jsx(AntdMobileIsolated, { style: { height: "calc(100% - 72px)" }, children: showIndexBar ? /* @__PURE__ */ jsxRuntime.jsx(IndexBar__default.default, { style: { height: "100%" }, children: groupedItems.map((group) => {
1073
+ /* @__PURE__ */ jsxRuntime.jsx(AntdMobileIsolated, { style: { height: "calc(100% - 108px)" }, children: showIndexBar ? /* @__PURE__ */ jsxRuntime.jsx(IndexBar__default.default, { style: { height: "100%" }, children: groupedItems.map((group) => {
1063
1074
  const { title, items } = group;
1064
1075
  return /* @__PURE__ */ jsxRuntime.jsx(IndexBar__default.default.Panel, { index: title, title, children: /* @__PURE__ */ jsxRuntime.jsx(List__default.default, { children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
1065
1076
  List__default.default.Item,
1066
1077
  {
1067
1078
  onClick: () => handleItemClick(item),
1079
+ className: "text-[16px] !pl-[24px]",
1068
1080
  style: { cursor: "pointer" },
1069
1081
  children: item.name
1070
1082
  },
@@ -1074,6 +1086,7 @@ var LocationFilter = ({
1074
1086
  List__default.default.Item,
1075
1087
  {
1076
1088
  onClick: () => handleItemClick(item),
1089
+ className: "text-[16px] !pl-[24px]",
1077
1090
  style: { cursor: "pointer" },
1078
1091
  children: item.name
1079
1092
  },
@@ -1274,7 +1287,7 @@ var RoomsList = ({
1274
1287
  lat: Number(room.latitude) || 0,
1275
1288
  lng: Number(room.longitude) || 0,
1276
1289
  availableTime: nextAvailableTimeslot ? `${nextAvailableTimeslot.start_time}` : mergedPageData.noAvailableTime,
1277
- euifyMakeModel: room?.description
1290
+ euifyMakeModel: room?.equipment?.join(", ") || ""
1278
1291
  };
1279
1292
  });
1280
1293
  }, [demoRooms, mergedPageData.defaultCountry, mergedPageData.noAvailableTime]);
@@ -1326,7 +1339,7 @@ var RoomsList = ({
1326
1339
  /* @__PURE__ */ jsxRuntime.jsxs(
1327
1340
  "button",
1328
1341
  {
1329
- className: "flex cursor-pointer items-center hover:text-[#2E8B57] transition-colors",
1342
+ className: "flex cursor-pointer items-center hover:text-[#3ADB67] transition-colors",
1330
1343
  onClick: () => setShowLocationFilter(true),
1331
1344
  children: [
1332
1345
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-1", children: getSelectedLocationName() }),
@@ -1383,7 +1396,7 @@ var RoomsList = ({
1383
1396
  "div",
1384
1397
  {
1385
1398
  style: { maxHeight: "706px", overflow: "auto" },
1386
- className: "rounded-[12px] bg-white border border-[#E4E5E6]",
1399
+ className: "rounded-[12px] bg-white border h-[706px] border-[#E4E5E6]",
1387
1400
  children: filteredStudioLocations.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center h-[200px] text-[#767880]", children: mergedPageData.locationFilter.noStudiosFound }) : filteredStudioLocations.map((item) => {
1388
1401
  return /* @__PURE__ */ jsxRuntime.jsx(
1389
1402
  StudioCard,
@@ -1776,7 +1789,7 @@ var QuestionnaireForm = ({
1776
1789
  onChange: (e) => handleChange(questionId, e.target.value),
1777
1790
  placeholder: question.placeholder,
1778
1791
  className: cn(
1779
- "w-full px-4 py-3 rounded-lg border text-base",
1792
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1780
1793
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1781
1794
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1782
1795
  )
@@ -1792,7 +1805,7 @@ var QuestionnaireForm = ({
1792
1805
  onBlur: (e) => handleEmailBlur(questionId, e.target.value),
1793
1806
  placeholder: question.placeholder,
1794
1807
  className: cn(
1795
- "w-full px-4 py-3 rounded-lg border text-base",
1808
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1796
1809
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1797
1810
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1798
1811
  )
@@ -1811,6 +1824,7 @@ var QuestionnaireForm = ({
1811
1824
  "appearance-none pl-3 pr-8 py-3 rounded-lg border text-base",
1812
1825
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1813
1826
  "bg-white cursor-pointer w-[80px]",
1827
+ "dark:bg-white dark:text-gray-900",
1814
1828
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1815
1829
  ),
1816
1830
  children: countryCodes.map((item) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: item.code, children: item.code }, item.code))
@@ -1845,7 +1859,7 @@ var QuestionnaireForm = ({
1845
1859
  onChange: (e) => handleChange(questionId, e.target.value),
1846
1860
  placeholder: question.placeholder,
1847
1861
  className: cn(
1848
- "flex-1 px-4 py-3 rounded-lg border text-base",
1862
+ "flex-1 px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1849
1863
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1850
1864
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1851
1865
  )
@@ -1861,8 +1875,9 @@ var QuestionnaireForm = ({
1861
1875
  placeholder: question.placeholder,
1862
1876
  rows: 4,
1863
1877
  className: cn(
1864
- "w-full px-4 py-3 rounded-lg border text-base resize-none",
1878
+ "w-full px-4 py-3 rounded-lg border text-base resize-none bg-white",
1865
1879
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1880
+ "dark:bg-white dark:text-gray-900",
1866
1881
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1867
1882
  )
1868
1883
  }
@@ -1881,10 +1896,15 @@ var QuestionnaireForm = ({
1881
1896
  value: option.value || option.label,
1882
1897
  checked: responses[questionId] === (option.value || option.label),
1883
1898
  onChange: (e) => handleChange(questionId, e.target.value),
1884
- className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2"
1899
+ className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2",
1900
+ style: {
1901
+ backgroundColor: "white",
1902
+ borderColor: "#D1D5DB",
1903
+ colorScheme: "light"
1904
+ }
1885
1905
  }
1886
1906
  ),
1887
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base text-gray-900 group-hover:text-[#3ADB67] transition-colors", children: option.label })
1907
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1888
1908
  ]
1889
1909
  },
1890
1910
  option.value || option.label
@@ -1910,10 +1930,15 @@ var QuestionnaireForm = ({
1910
1930
  optionValue,
1911
1931
  e.target.checked
1912
1932
  ),
1913
- className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2 rounded"
1933
+ className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2 rounded",
1934
+ style: {
1935
+ backgroundColor: "white",
1936
+ borderColor: "#D1D5DB",
1937
+ colorScheme: "light"
1938
+ }
1914
1939
  }
1915
1940
  ),
1916
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base text-gray-900 group-hover:text-[#3ADB67] transition-colors", children: option.label })
1941
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1917
1942
  ]
1918
1943
  },
1919
1944
  optionValue
@@ -1926,9 +1951,9 @@ var QuestionnaireForm = ({
1926
1951
  value: responses[questionId] || "",
1927
1952
  onChange: (e) => handleChange(questionId, e.target.value),
1928
1953
  className: cn(
1929
- "w-full px-4 py-3 rounded-lg border text-base",
1954
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1930
1955
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1931
- "bg-white cursor-pointer",
1956
+ "cursor-pointer",
1932
1957
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1933
1958
  ),
1934
1959
  children: [
@@ -1948,21 +1973,21 @@ var QuestionnaireForm = ({
1948
1973
  return null;
1949
1974
  }
1950
1975
  };
1951
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pb-[80px]", children: [
1952
- questions && questions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-white rounded-[12px] border border-[#E4E5E6] p-8", children: /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, className: cn("space-y-6", className), children: questions.map((question) => {
1976
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pb-[80px] light", children: [
1977
+ questions && questions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-white rounded-[12px] border border-[#E4E5E6] p-8 dark:bg-white dark:border-[#E4E5E6] l:p-4", children: /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, className: cn("space-y-6", className), children: questions.map((question) => {
1953
1978
  const questionId = getQuestionId(question);
1954
1979
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
1955
1980
  /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "block", children: [
1956
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-base font-medium text-gray-900", children: [
1981
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-base font-bold text-gray-900 dark:text-gray-900", children: [
1957
1982
  question.label,
1958
1983
  question.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-red-500 ml-1", children: "*" })
1959
1984
  ] }),
1960
- question.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-sm text-gray-600 mt-1", children: question.description }),
1961
- question.type === "email" && questionId === "email" && pageData?.emailDescription && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-sm text-gray-600 mt-1", children: pageData.emailDescription })
1985
+ question.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-sm text-gray-600 dark:text-gray-600 font-bold mt-1", children: question.description }),
1986
+ question.type === "email" && questionId === "email" && pageData?.emailDescription && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-sm text-gray-600 dark:text-gray-600 font-bold mt-1", children: pageData.emailDescription })
1962
1987
  ] }),
1963
1988
  renderQuestion(question),
1964
- question.hint && !errors[questionId] && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-500", children: question.hint }),
1965
- errors[questionId] && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", style: { color: "#FF4D4D" }, children: errors[questionId] })
1989
+ question.hint && !errors[questionId] && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-500 dark:text-gray-500 font-bold", children: question.hint }),
1990
+ errors[questionId] && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-bold", style: { color: "#FF4D4D" }, children: errors[questionId] })
1966
1991
  ] }, questionId);
1967
1992
  }) }) }),
1968
1993
  !!selectedTimeslotId && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center", children: [
@@ -1975,20 +2000,25 @@ var QuestionnaireForm = ({
1975
2000
  id: `agreement-${index}`,
1976
2001
  checked: agreements[index] || false,
1977
2002
  onChange: (e) => handleAgreementChange(index, e.target.checked),
1978
- className: "w-5 h-5 rounded border-gray-300 text-[#2FC257] focus:ring-[#2FC257] cursor-pointer flex-shrink-0"
2003
+ className: "w-5 h-5 rounded text-[#2FC257] focus:ring-[#2FC257] cursor-pointer flex-shrink-0",
2004
+ style: {
2005
+ backgroundColor: "white",
2006
+ borderColor: "#D1D5DB",
2007
+ colorScheme: "light"
2008
+ }
1979
2009
  }
1980
2010
  ),
1981
2011
  /* @__PURE__ */ jsxRuntime.jsx(
1982
2012
  "label",
1983
2013
  {
1984
2014
  htmlFor: `agreement-${index}`,
1985
- className: "text-sm text-gray-700 cursor-pointer select-none flex-1 [&_a]:underline [&_a]:text-blue-600 [&_a:hover]:text-blue-700",
2015
+ className: "text-sm text-gray-700 dark:text-gray-700 font-bold cursor-pointer select-none flex-1 [&_a]:underline [&_a]:text-blue-600 [&_a:hover]:text-blue-700",
1986
2016
  dangerouslySetInnerHTML: { __html: agreeContent },
1987
2017
  "aria-label": `Agreement ${index + 1}`
1988
2018
  }
1989
2019
  )
1990
2020
  ] }, index)),
1991
- agreementError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm mt-2", style: { color: "#FF4D4D" }, children: agreementError })
2021
+ agreementError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-bold mt-2", style: { color: "#FF4D4D" }, children: agreementError })
1992
2022
  ] }),
1993
2023
  /* @__PURE__ */ jsxRuntime.jsx(
1994
2024
  "button",
@@ -1998,7 +2028,7 @@ var QuestionnaireForm = ({
1998
2028
  onClick: handleSubmit,
1999
2029
  className: cn(
2000
2030
  "w-fit mt-6 px-6 py-4 rounded-full",
2001
- "bg-[#080A0F] text-white font-medium text-base",
2031
+ "bg-[#080A0F] text-white font-bold text-base",
2002
2032
  "hover:bg-[#2FC257] transition-colors",
2003
2033
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:ring-offset-2",
2004
2034
  "disabled:opacity-50 disabled:cursor-not-allowed"
@@ -2143,10 +2173,10 @@ var DateTimePicker = ({
2143
2173
  const wrapperStyle = {
2144
2174
  background: "#fff",
2145
2175
  border: `1px solid ${token.colorBorderSecondary}`,
2146
- borderRadius: token.borderRadiusLG
2176
+ borderRadius: 16
2147
2177
  };
2148
2178
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
2149
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[48px] l:text-[32px] py-[64px] l:py-[24px] font-bold text-center", children: pageData.scheduleYourVisit }),
2179
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[48px] l:text-[32px] py-[64px] l:py-[24px] l:pt-[64px] font-bold text-center", children: pageData.scheduleYourVisit }),
2150
2180
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4 l:flex-col", children: [
2151
2181
  /* @__PURE__ */ jsxRuntime.jsx(
2152
2182
  antd.ConfigProvider,
@@ -2170,6 +2200,20 @@ var DateTimePicker = ({
2170
2200
  className: "calendar-custom-cell w-[calc(824/1920*100vw)] min-l:max-w-[824px] l:w-full",
2171
2201
  children: [
2172
2202
  /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
2203
+ .calendar-custom-cell {
2204
+ border-radius: 16px !important;
2205
+ overflow: hidden;
2206
+ padding: 0 24px 16px 24px !important;
2207
+ }
2208
+ .calendar-custom-cell,
2209
+ .calendar-custom-cell *,
2210
+ .calendar-custom-cell .ant-picker-panel,
2211
+ .calendar-custom-cell .ant-picker-calendar,
2212
+ .calendar-custom-cell .ant-picker-content,
2213
+ .calendar-custom-cell .ant-picker-cell,
2214
+ .calendar-custom-cell .ant-picker-calendar-date-value {
2215
+ font-family: 'MontForAnker' !important;
2216
+ }
2173
2217
  .calendar-custom-cell .ant-picker-cell {
2174
2218
  padding: 6px !important;
2175
2219
  text-align: center !important;
@@ -2187,6 +2231,11 @@ var DateTimePicker = ({
2187
2231
  border: 1px solid #E4E5E6 !important;
2188
2232
  aspect-ratio: 1 / 1 !important;
2189
2233
  }
2234
+ .calendar-custom-cell .ant-picker-calendar-date-value {
2235
+ line-height: 38px !important;
2236
+ font-weight: 700 !important;
2237
+ font-size: 14px !important;
2238
+ }
2190
2239
  @media (min-width: 1024px) and (max-width: 1919px) {
2191
2240
  .calendar-custom-cell .ant-picker-cell-inner {
2192
2241
  width: 54px !important;
@@ -2195,6 +2244,8 @@ var DateTimePicker = ({
2195
2244
  }
2196
2245
  .calendar-custom-cell .ant-picker-calendar-date-value {
2197
2246
  line-height: 54px !important;
2247
+ font-weight: 700 !important;
2248
+ font-size: 20px !important;
2198
2249
  }
2199
2250
  }
2200
2251
  @media (min-width: 1920px) {
@@ -2205,17 +2256,19 @@ var DateTimePicker = ({
2205
2256
  }
2206
2257
  .calendar-custom-cell .ant-picker-calendar-date-value {
2207
2258
  line-height: 100px !important;
2259
+ font-weight: 700 !important;
2260
+ font-size: 20px !important;
2208
2261
  }
2209
2262
  }
2210
2263
  .calendar-custom-cell .ant-picker-cell-selected .ant-picker-cell-inner,
2211
2264
  .calendar-custom-cell .ant-picker-cell-selected:not(.ant-picker-cell-disabled) .ant-picker-cell-inner {
2212
2265
  background-color: #3ADB67 !important;
2213
- color: white !important;
2266
+ color: #080A0F !important;
2214
2267
  border-color: #3ADB67 !important;
2215
2268
  }
2216
2269
  .calendar-custom-cell .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner {
2217
2270
  background-color: #3ADB67 !important;
2218
- color: white !important;
2271
+ color: #080A0F !important;
2219
2272
  }
2220
2273
  .calendar-custom-cell .ant-picker-cell-today .ant-picker-cell-inner {
2221
2274
  border-color: #3ADB67 !important;
@@ -2234,25 +2287,24 @@ var DateTimePicker = ({
2234
2287
  .calendar-custom-cell .ant-picker-cell-today .ant-picker-cell-inner::before {
2235
2288
  display: none !important;
2236
2289
  }
2237
- .calendar-custom-cell .ant-picker-calendar-date-value {
2238
- line-height: 38px !important;
2239
- }
2240
2290
  .calendar-custom-cell .ant-picker-content {
2241
2291
  width: 100% !important;
2242
2292
  }
2243
2293
  .calendar-custom-cell .ant-picker-content thead tr th {
2244
2294
  line-height: 48px !important;
2295
+ font-weight: 700 !important;
2296
+ font-size: 18px !important;
2245
2297
  }
2246
2298
  .calendar-custom-cell .ant-picker-cell-disabled .ant-picker-cell-inner {
2247
2299
  background-color: #F5F5F5 !important;
2248
- color: #BDBDBD !important;
2249
- border-color: #E4E5E6 !important;
2300
+ color: #2A2C32 !important;
2301
+ border: none !important;
2250
2302
  cursor: not-allowed !important;
2251
2303
  box-shadow: none !important;
2252
2304
  }
2253
2305
  .calendar-custom-cell .ant-picker-cell-disabled:hover .ant-picker-cell-inner {
2254
2306
  background-color: #F5F5F5 !important;
2255
- border-color: #E4E5E6 !important;
2307
+ border: none !important;
2256
2308
  box-shadow: none !important;
2257
2309
  }
2258
2310
  .calendar-custom-cell .ant-picker-cell-disabled::before {
@@ -2292,7 +2344,7 @@ var DateTimePicker = ({
2292
2344
  className: `ant-picker-cell-inner ${isSelected ? "ant-picker-cell-inner-selected" : ""} ${isToday ? "ant-picker-cell-inner-today" : ""}`,
2293
2345
  style: {
2294
2346
  backgroundColor: isSelected ? "#3ADB67" : void 0,
2295
- color: isSelected ? "white" : isDisabled ? "#BDBDBD" : void 0,
2347
+ color: isSelected ? "#080A0F" : isDisabled ? "#2A2C32" : void 0,
2296
2348
  borderColor: isSelected ? "#3ADB67" : isToday ? "#3ADB67" : void 0
2297
2349
  },
2298
2350
  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ant-picker-calendar-date-value", children: date.date() })
@@ -2310,7 +2362,7 @@ var DateTimePicker = ({
2310
2362
  label,
2311
2363
  value: index
2312
2364
  }));
2313
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [
2365
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between py-3 l:pb-[0px]", children: [
2314
2366
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2315
2367
  /* @__PURE__ */ jsxRuntime.jsx(
2316
2368
  antd.Select,
@@ -2322,14 +2374,15 @@ var DateTimePicker = ({
2322
2374
  onChange(now);
2323
2375
  },
2324
2376
  variant: "borderless",
2325
- className: "text-2xl font-medium",
2377
+ className: "text-[32px] l:text-[20px] font-bold",
2326
2378
  popupMatchSelectWidth: false,
2379
+ suffixIcon: null,
2327
2380
  style: {
2328
- fontSize: "24px",
2329
- fontWeight: 500
2381
+ fontWeight: 700
2330
2382
  }
2331
2383
  }
2332
2384
  ),
2385
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[20px] text-[#E4E5E6]", children: "/" }),
2333
2386
  /* @__PURE__ */ jsxRuntime.jsx(
2334
2387
  antd.Select,
2335
2388
  {
@@ -2340,11 +2393,11 @@ var DateTimePicker = ({
2340
2393
  onChange(now);
2341
2394
  },
2342
2395
  variant: "borderless",
2343
- className: "text-2xl font-medium",
2396
+ className: "text-[32px] l:text-[20px] font-bold",
2344
2397
  popupMatchSelectWidth: false,
2398
+ suffixIcon: null,
2345
2399
  style: {
2346
- fontSize: "24px",
2347
- fontWeight: 500
2400
+ fontWeight: 700
2348
2401
  }
2349
2402
  }
2350
2403
  )
@@ -2420,10 +2473,10 @@ var DateTimePicker = ({
2420
2473
  )
2421
2474
  }
2422
2475
  ),
2423
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white p-[24px] rounded-[12px] flex-1", children: [
2424
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
2425
- pageData.timeSlot,
2426
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
2476
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white p-[24px] rounded-[16px] flex-1", children: [
2477
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center", children: [
2478
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[24px] l:text-[16px]", children: pageData.timeSlot }),
2479
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex text-[18px] l:text-[14px] l:gap-1 gap-2", children: [
2427
2480
  /* @__PURE__ */ jsxRuntime.jsx(
2428
2481
  "button",
2429
2482
  {
@@ -2437,7 +2490,7 @@ var DateTimePicker = ({
2437
2490
  }
2438
2491
  },
2439
2492
  disabled: !selectedDate || selectedDate.isSame(dayjs__default.default(), "day") || selectedDate.isBefore(dayjs__default.default(), "day"),
2440
- className: "w-10 h-10 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2493
+ className: "w-8 h-8 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2441
2494
  children: /* @__PURE__ */ jsxRuntime.jsx(
2442
2495
  "svg",
2443
2496
  {
@@ -2457,7 +2510,7 @@ var DateTimePicker = ({
2457
2510
  )
2458
2511
  }
2459
2512
  ),
2460
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center", children: selectedDate ? selectedDate.format("MMMM D, YYYY") : "" }),
2513
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center", children: selectedDate ? selectedDate.format("MMMM D") : "" }),
2461
2514
  /* @__PURE__ */ jsxRuntime.jsx(
2462
2515
  "button",
2463
2516
  {
@@ -2469,7 +2522,7 @@ var DateTimePicker = ({
2469
2522
  }
2470
2523
  },
2471
2524
  disabled: !selectedDate,
2472
- className: "w-10 h-10 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2525
+ className: "w-8 h-8 flex items-center justify-center hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
2473
2526
  children: /* @__PURE__ */ jsxRuntime.jsx(
2474
2527
  "svg",
2475
2528
  {
@@ -2491,7 +2544,7 @@ var DateTimePicker = ({
2491
2544
  )
2492
2545
  ] })
2493
2546
  ] }),
2494
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 mt-[40px] gap-4", children: timeslotsLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.loadingTimeSlots }) : timeslotsError ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-center text-red-600 py-8", children: pageData.failedToLoadTimeSlots }) : dayTimeslots.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.noAvailableTimeSlots }) : dayTimeslots.map((slot) => {
2547
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 mt-[40px] gap-4 l:mt-[16px] l:flex l:flex-col l:gap-2", children: timeslotsLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-center text-[#2A2C32] py-8", children: pageData.loadingTimeSlots }) : timeslotsError ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-center text-red-600 py-8", children: pageData.failedToLoadTimeSlots }) : dayTimeslots.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-center text-[#2A2C32] py-8", children: pageData.noAvailableTimeSlots }) : dayTimeslots.map((slot) => {
2495
2548
  const isAvailable = slot.status === "available";
2496
2549
  const isFull = slot.status === "full";
2497
2550
  const isSelected = selectedTimeslotId === slot.id;
@@ -2505,19 +2558,19 @@ var DateTimePicker = ({
2505
2558
  }
2506
2559
  },
2507
2560
  className: `
2508
- rounded-[20px] w-full flex items-center justify-center gap-4 h-[76px]
2561
+ rounded-[20px] w-full text-[18px] l:gap-2 l:text-[16px] flex items-center justify-center gap-4 h-[76px]
2509
2562
  border text-center transition-colors
2510
- ${isSelected ? "border-[#3ADB67] bg-[#3ADB67] text-white cursor-pointer" : isAvailable ? "border-[#E4E5E6] hover:border-[#3ADB67] hover:bg-[#3ADB67] cursor-pointer" : "border-[#E4E5E6] bg-[#F5F5F5] text-[#BDBDBD] cursor-not-allowed"}
2563
+ ${isSelected ? "border-[#3ADB67] bg-[#3ADB67] cursor-pointer" : isAvailable ? "border-[#E4E5E6] hover:border-[#3ADB67] hover:bg-[#3ADB67] cursor-pointer" : "border-[#E4E5E6] bg-[#F5F5F5] text-[#2A2C32] cursor-not-allowed"}
2511
2564
  `,
2512
2565
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
2513
2566
  /* @__PURE__ */ jsxRuntime.jsx("div", { children: formatTimeslot(slot) }),
2514
- isFull && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-[#BDBDBD] mt-1", children: pageData.full }),
2515
- isAvailable && !isSelected && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-[#767880] mt-1", children: [
2567
+ isFull && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[16px] l:text-[14px] text-[#2A2C32] mt-[2px]", children: pageData.full }),
2568
+ isAvailable && !isSelected && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[16px] l:text-[14px] text-[#2A2C32] mt-1", children: [
2516
2569
  slot.capacity - slot.booked_count,
2517
2570
  " ",
2518
2571
  pageData.spotsLeft
2519
2572
  ] }),
2520
- isAvailable && isSelected && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-white mt-1", children: [
2573
+ isAvailable && isSelected && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[16px] l:text-[14px] mt-1", children: [
2521
2574
  slot.capacity - slot.booked_count,
2522
2575
  " ",
2523
2576
  pageData.spotsLeft
@@ -2527,15 +2580,15 @@ var DateTimePicker = ({
2527
2580
  slot.id
2528
2581
  );
2529
2582
  }) }),
2530
- !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-4 text-right", children: pageData?.timezone?.replace(
2583
+ !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-[24px] text-[#6d6d6F] text-center", children: pageData?.timezone?.replace(
2531
2584
  "{{timezone}}",
2532
2585
  demoRoom?.timezone || timezone || ""
2533
2586
  ) })
2534
2587
  ] })
2535
2588
  ] }),
2536
2589
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-12", children: [
2537
- !!questionnaire?.questions?.length && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[48px] font-bold text-center mb-8", children: pageData.fillOutForm }),
2538
- questionnaireLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center text-[#767880] py-8", children: pageData.loadingQuestionnaire }) : /* @__PURE__ */ jsxRuntime.jsx(
2590
+ !!questionnaire?.questions?.length && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[48px] font-bold text-center mb-8 l:mb-[24px] l:text-[32px] l:text-left", children: pageData.fillOutForm }),
2591
+ questionnaireLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center text-[#2A2C32] py-8", children: pageData.loadingQuestionnaire }) : /* @__PURE__ */ jsxRuntime.jsx(
2539
2592
  QuestionnaireForm,
2540
2593
  {
2541
2594
  questions: questionnaire?.questions || [],
@@ -2656,7 +2709,7 @@ var DemoRoomDetail = ({
2656
2709
  });
2657
2710
  const title = demoRoom?.name || titleProp || "Design District Demo Room";
2658
2711
  const descriptions = demoRoom?.description ? [demoRoom.description] : descriptionsProp || defaultDescriptions;
2659
- const devices = demoRoom?.description || devicesProp || "eufyMake E1, eufyMake M5";
2712
+ const devices = demoRoom?.equipment?.join(", ") || devicesProp || "eufyMake E1, eufyMake M5";
2660
2713
  const address = demoRoom?.address || addressProp || "1111 8th St, San Francisco, CA United States 94108";
2661
2714
  const images = demoRoom?.images && demoRoom.images.length > 0 ? demoRoom.images : imagesProp || defaultImages;
2662
2715
  const googleMapsLink = mapsLink || (() => {
@@ -2682,10 +2735,10 @@ var DemoRoomDetail = ({
2682
2735
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm mt-2", children: error.message })
2683
2736
  ] }) });
2684
2737
  }
2685
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-8 l:flex l:flex-col items-start py-[24px]", children: [
2686
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6 py-[24px]", children: [
2687
- /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-[40px] font-bold text-gray-900 leading-tight", children: title }),
2688
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: descriptions.map((desc, index) => /* @__PURE__ */ jsxRuntime.jsx(
2738
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-[80px] l:gap-[40px] l:flex l:flex-col-reverse items-start py-[24px] l:pb-[64px]", children: [
2739
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
2740
+ /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-[48px] l:text-[32px] font-bold text-gray-900 leading-tight", children: title }),
2741
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-[20px]", children: descriptions.map((desc, index) => /* @__PURE__ */ jsxRuntime.jsx(
2689
2742
  "p",
2690
2743
  {
2691
2744
  className: "text-base text-gray-600 leading-relaxed",
@@ -2704,34 +2757,24 @@ var DemoRoomDetail = ({
2704
2757
  xmlns: "http://www.w3.org/2000/svg",
2705
2758
  className: "flex-shrink-0 mt-0.5",
2706
2759
  children: [
2707
- /* @__PURE__ */ jsxRuntime.jsx(
2708
- "rect",
2709
- {
2710
- x: "3",
2711
- y: "3",
2712
- width: "18",
2713
- height: "18",
2714
- rx: "2",
2715
- stroke: "currentColor",
2716
- strokeWidth: "2"
2717
- }
2718
- ),
2719
2760
  /* @__PURE__ */ jsxRuntime.jsx(
2720
2761
  "path",
2721
2762
  {
2722
- d: "M8 10H16",
2763
+ d: "M14.4643 7.4929H9.65565M3.16391 18.7132H20.8171C22.0122 18.7132 22.981 17.7563 22.981 16.576L23 13.8348L22.981 6.42431C22.981 5.24396 22.0122 4.28711 20.8171 4.28711H3.16391C1.96882 4.28711 1 5.24396 1 6.42431V16.576C1 17.7563 1.96882 18.7132 3.16391 18.7132Z",
2723
2764
  stroke: "currentColor",
2724
2765
  strokeWidth: "2",
2725
- strokeLinecap: "round"
2766
+ strokeLinecap: "round",
2767
+ strokeLinejoin: "round"
2726
2768
  }
2727
2769
  ),
2728
2770
  /* @__PURE__ */ jsxRuntime.jsx(
2729
2771
  "path",
2730
2772
  {
2731
- d: "M8 14H16",
2773
+ d: "M5.32812 18.2325V14.4238C5.32812 13.8715 5.77584 13.4238 6.32813 13.4238H17.7925C18.3447 13.4238 18.7925 13.8715 18.7925 14.4238V18.2325",
2732
2774
  stroke: "currentColor",
2733
2775
  strokeWidth: "2",
2734
- strokeLinecap: "round"
2776
+ strokeLinecap: "round",
2777
+ strokeLinejoin: "round"
2735
2778
  }
2736
2779
  )
2737
2780
  ]
@@ -2810,7 +2853,7 @@ var DemoRoomDetail = ({
2810
2853
  ] })
2811
2854
  ] })
2812
2855
  ] }),
2813
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative l:w-full h-[400px] rounded-2xl overflow-hidden", children: images.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
2856
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative l:w-full min-l:h-[400px] rounded-2xl overflow-hidden", children: images.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
2814
2857
  react.Swiper,
2815
2858
  {
2816
2859
  ...swiperVersion === "11+" && Navigation && Pagination && Autoplay ? { modules: [Navigation, Pagination, Autoplay] } : {},
@@ -2888,15 +2931,18 @@ var BookingForm = ({
2888
2931
  () => createDemoRoomApi(apiConfig),
2889
2932
  [apiConfig]
2890
2933
  );
2891
- const dateTimePickerPageData = React2.useMemo(() => ({
2892
- ...pageData?.dateTimePicker,
2893
- ...pageData?.questionnaireForm
2894
- }), [pageData?.dateTimePicker, pageData?.questionnaireForm]);
2934
+ const dateTimePickerPageData = React2.useMemo(
2935
+ () => ({
2936
+ ...pageData?.dateTimePicker,
2937
+ ...pageData?.questionnaireForm
2938
+ }),
2939
+ [pageData?.dateTimePicker, pageData?.questionnaireForm]
2940
+ );
2895
2941
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
2896
2942
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
2897
2943
  DemoRoomDetail,
2898
2944
  {
2899
- className: cn("mt-8", layoutClassName),
2945
+ className: cn("min-l:mt-8", layoutClassName),
2900
2946
  apiClient,
2901
2947
  demoRoomCode,
2902
2948
  locale: apiConfig.locale,
@@ -2974,7 +3020,9 @@ var BookingSuccess = ({
2974
3020
  }, [token, apiConfig, initialBookingData]);
2975
3021
  const handleCancelAppointment = async () => {
2976
3022
  if (!token || !apiConfig) {
2977
- setCancelError(pageData.cancelError || "Unable to cancel: Missing token or API configuration");
3023
+ setCancelError(
3024
+ pageData.cancelError || "Unable to cancel: Missing token or API configuration"
3025
+ );
2978
3026
  return;
2979
3027
  }
2980
3028
  setCancelLoading(true);
@@ -2995,13 +3043,15 @@ var BookingSuccess = ({
2995
3043
  }
2996
3044
  } catch (err) {
2997
3045
  console.error("Failed to cancel booking:", err);
2998
- setCancelError(pageData.cancelError || "Failed to cancel appointment. Please try again.");
3046
+ setCancelError(
3047
+ pageData.cancelError || "Failed to cancel appointment. Please try again."
3048
+ );
2999
3049
  } finally {
3000
3050
  setCancelLoading(false);
3001
3051
  }
3002
3052
  };
3003
3053
  if (loading) {
3004
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-3xl mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "animate-pulse space-y-6", children: [
3054
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "animate-pulse space-y-6", children: [
3005
3055
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-8 bg-gray-200 rounded w-1/3" }),
3006
3056
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-24 bg-gray-200 rounded" }),
3007
3057
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
@@ -3014,24 +3064,24 @@ var BookingSuccess = ({
3014
3064
  if (!bookingData) {
3015
3065
  return null;
3016
3066
  }
3017
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-3xl mx-auto", children: [
3067
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `min-h-screen l:py-0 l:px-0 py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto", children: [
3018
3068
  /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-[40px] font-bold text-gray-900 mb-8", children: pageData.yourAppointment }),
3019
- isCancelled && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-lg p-6 mb-8 flex items-center justify-between", children: [
3069
+ isCancelled && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-[16px] l:items-start p-6 mb-4 l:gap-2 flex l:flex-col items-center justify-between", children: [
3020
3070
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-700", children: pageData.appointmentCanceled }),
3021
- onScheduleAgain && /* @__PURE__ */ jsxRuntime.jsx(
3071
+ onScheduleAgain && bookingData && /* @__PURE__ */ jsxRuntime.jsx(
3022
3072
  "button",
3023
3073
  {
3024
- onClick: onScheduleAgain,
3025
- className: "px-6 py-3 bg-black text-white rounded-full font-medium hover:bg-gray-800 transition-colors whitespace-nowrap",
3074
+ onClick: () => onScheduleAgain(bookingData.demoroom_code),
3075
+ className: "px-6 py-3 bg-black text-white rounded-full hover:bg-gray-800 transition-colors whitespace-nowrap",
3026
3076
  children: pageData.scheduleAgain
3027
3077
  }
3028
3078
  )
3029
3079
  ] }),
3030
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-8 bg-white px-[48px] py-[32px] rounded-lg", children: [
3080
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-8 bg-white px-[48px] l:px-[16px] l:py-[16px] py-[32px] rounded-[16px]", children: [
3031
3081
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
3032
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.location }),
3082
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.location }),
3033
3083
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
3034
- bookingData.demoroom_name && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base font-medium text-gray-900", children: bookingData.demoroom_name }),
3084
+ bookingData.demoroom_name && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-900", children: bookingData.demoroom_name }),
3035
3085
  bookingData.address && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-600", children: bookingData.address }),
3036
3086
  bookingData.latitude && bookingData.longitude && /* @__PURE__ */ jsxRuntime.jsx(
3037
3087
  "a",
@@ -3046,7 +3096,7 @@ var BookingSuccess = ({
3046
3096
  ] })
3047
3097
  ] }),
3048
3098
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
3049
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.dateAndTime }),
3099
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.dateAndTime }),
3050
3100
  /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-base text-gray-900", children: [
3051
3101
  bookingData.booking_date,
3052
3102
  bookingData.time_slot && `, ${bookingData.time_slot}`,
@@ -3054,15 +3104,15 @@ var BookingSuccess = ({
3054
3104
  ] })
3055
3105
  ] }),
3056
3106
  bookingData.equipment && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
3057
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.event }),
3058
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-900", children: bookingData.equipment })
3107
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.event }),
3108
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-900", children: Array.isArray(bookingData.equipment) ? bookingData.equipment.join(", ") : bookingData.equipment })
3059
3109
  ] }),
3060
3110
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
3061
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.demoRoom }),
3111
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.demoRoom }),
3062
3112
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-900", children: bookingData.demoroom_code })
3063
3113
  ] }),
3064
3114
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
3065
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.visitorInfo }),
3115
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.visitorInfo }),
3066
3116
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
3067
3117
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-gray-900", children: bookingData.customer_name }),
3068
3118
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-base text-gray-600", children: [
@@ -3120,13 +3170,13 @@ var BookingSuccess = ({
3120
3170
  {
3121
3171
  onClick: () => setShowCancelDialog(true),
3122
3172
  disabled: cancelLoading,
3123
- className: "text-[14px] cursor-pointer w-fit rounded-full text-[#080A0F] border border-[#080A0F] px-[20px] py-[10px] leading-[1] hover:bg-gray-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
3173
+ className: "text-[14px] cursor-pointer w-fit rounded-full text-[#080A0F] border-2 border-[#080A0F] px-[20px] py-[10px] leading-[1] hover:bg-gray-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
3124
3174
  children: pageData.cancelAppointment
3125
3175
  }
3126
3176
  ),
3127
3177
  cancelError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm mt-2", style: { color: "#FF4D4D" }, children: cancelError })
3128
3178
  ] }),
3129
- showCancelDialog && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 px-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-[24px] max-w-[400px] p-8 shadow-xl relative", children: [
3179
+ showCancelDialog && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 px-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-[24px] max-w-[600px] p-8 shadow-xl relative", children: [
3130
3180
  /* @__PURE__ */ jsxRuntime.jsx(
3131
3181
  "button",
3132
3182
  {
@@ -3156,28 +3206,28 @@ var BookingSuccess = ({
3156
3206
  )
3157
3207
  }
3158
3208
  ),
3159
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-16 h-16 rounded-full bg-[#F59E0B] flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
3209
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-16 h-16 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs(
3160
3210
  "svg",
3161
3211
  {
3162
- width: "32",
3163
- height: "32",
3164
- viewBox: "0 0 32 32",
3165
- fill: "none",
3166
3212
  xmlns: "http://www.w3.org/2000/svg",
3167
- children: /* @__PURE__ */ jsxRuntime.jsx(
3168
- "path",
3169
- {
3170
- d: "M16 10V17M16 22H16.01",
3171
- stroke: "white",
3172
- strokeWidth: "3",
3173
- strokeLinecap: "round",
3174
- strokeLinejoin: "round"
3175
- }
3176
- )
3213
+ width: "48",
3214
+ height: "48",
3215
+ viewBox: "0 0 48 48",
3216
+ fill: "none",
3217
+ children: [
3218
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "24", cy: "24", r: "21", fill: "#FFC24D" }),
3219
+ /* @__PURE__ */ jsxRuntime.jsx(
3220
+ "path",
3221
+ {
3222
+ d: "M23.9971 30.5703C25.4881 30.5704 26.6972 31.7795 26.6973 33.2705C26.6973 34.7616 25.4881 35.9706 23.9971 35.9707C22.5059 35.9707 21.2969 34.7617 21.2969 33.2705C21.297 31.7794 22.506 30.5703 23.9971 30.5703ZM23.9961 12.0176C25.2387 12.0176 26.2461 13.0249 26.2461 14.2676V26.2676C26.2461 27.5102 25.2387 28.5176 23.9961 28.5176C22.7535 28.5176 21.7461 27.5102 21.7461 26.2676V14.2676C21.7461 13.0249 22.7535 12.0176 23.9961 12.0176Z",
3223
+ fill: "white"
3224
+ }
3225
+ )
3226
+ ]
3177
3227
  }
3178
3228
  ) }) }),
3179
3229
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-8", children: [
3180
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[18px] font-semibold text-gray-900 mb-2", children: pageData.cancelDialog?.title }),
3230
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[18px] text-gray-900 mb-2", children: pageData.cancelDialog?.title }),
3181
3231
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[14px] text-gray-600", children: pageData.cancelDialog?.description })
3182
3232
  ] }),
3183
3233
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3 justify-center", children: [
@@ -3186,7 +3236,7 @@ var BookingSuccess = ({
3186
3236
  {
3187
3237
  onClick: () => setShowCancelDialog(false),
3188
3238
  disabled: cancelLoading,
3189
- className: "px-8 py-3 border-2 border-black rounded-full text-black font-medium hover:bg-gray-50 transition-colors disabled:opacity-50 min-w-[120px]",
3239
+ className: "px-8 py-3 border-2 border-black rounded-full text-black hover:bg-gray-50 transition-colors disabled:opacity-50 min-w-[120px]",
3190
3240
  children: pageData.cancelDialog?.backButton
3191
3241
  }
3192
3242
  ),
@@ -3195,7 +3245,7 @@ var BookingSuccess = ({
3195
3245
  {
3196
3246
  onClick: handleCancelAppointment,
3197
3247
  disabled: cancelLoading,
3198
- className: "px-8 py-3 bg-black text-white rounded-full font-medium hover:bg-gray-800 transition-colors disabled:opacity-50 flex items-center gap-2 min-w-[180px] justify-center",
3248
+ className: "px-8 py-3 bg-black text-white rounded-full hover:bg-gray-800 transition-colors disabled:opacity-50 flex items-center gap-2 min-w-[180px] justify-center",
3199
3249
  children: cancelLoading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3200
3250
  /* @__PURE__ */ jsxRuntime.jsxs(
3201
3251
  "svg",