@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.
package/dist/index.mjs CHANGED
@@ -62,7 +62,7 @@ var StudioCard = ({
62
62
  {
63
63
  ...props,
64
64
  className: cn(
65
- "p-6 cursor-pointer transition-colors duration-200",
65
+ "p-6 cursor-pointer transition-colors duration-200 border-b border-[#E4E5E6] last:border-b-0",
66
66
  className
67
67
  ),
68
68
  style: {
@@ -79,8 +79,8 @@ var StudioCard = ({
79
79
  },
80
80
  children: [
81
81
  /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between mb-4", children: [
82
- /* @__PURE__ */ jsx("h3", { className: "text-xl font-semibold text-gray-900", children: name }),
83
- distance !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-sm font-medium text-[#2E8B57] bg-[#E8F5E9] px-3 py-1 rounded-full whitespace-nowrap ml-2", children: [
82
+ /* @__PURE__ */ jsx("h3", { className: "text-[24px] l:text-[20px] font-bold text-[#080A0F]", children: name }),
83
+ distance !== void 0 && /* @__PURE__ */ 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: [
84
84
  formatDistance(distance),
85
85
  " ",
86
86
  pageData.away
@@ -139,7 +139,7 @@ var StudioCard = ({
139
139
  ]
140
140
  }
141
141
  ),
142
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-600", children: [
142
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("p", { className: "text-[16px] l:text-[12px] text-[#2A2C32]", children: [
143
143
  availableTime === pageData.noAvailableTime ? "" : pageData.available,
144
144
  " ",
145
145
  availableTime
@@ -175,7 +175,7 @@ var StudioCard = ({
175
175
  ]
176
176
  }
177
177
  ),
178
- /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600 break-words", children: address }) })
178
+ /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("p", { className: "text-[16px] l:text-[14px] text-[#2A2C32] break-words", children: address }) })
179
179
  ] }),
180
180
  /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 mb-6", children: [
181
181
  /* @__PURE__ */ jsxs(
@@ -183,55 +183,44 @@ var StudioCard = ({
183
183
  {
184
184
  width: "20",
185
185
  height: "20",
186
- viewBox: "0 0 20 20",
186
+ viewBox: "0 0 24 24",
187
187
  fill: "none",
188
188
  xmlns: "http://www.w3.org/2000/svg",
189
189
  className: "flex-shrink-0 mt-0.5",
190
190
  children: [
191
- /* @__PURE__ */ jsx(
192
- "rect",
193
- {
194
- x: "3",
195
- y: "5",
196
- width: "14",
197
- height: "10",
198
- rx: "1.5",
199
- stroke: "currentColor",
200
- strokeWidth: "1.5"
201
- }
202
- ),
203
191
  /* @__PURE__ */ jsx(
204
192
  "path",
205
193
  {
206
- d: "M7 15V17",
194
+ 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",
207
195
  stroke: "currentColor",
208
- strokeWidth: "1.5",
209
- strokeLinecap: "round"
196
+ strokeWidth: "2",
197
+ strokeLinecap: "round",
198
+ strokeLinejoin: "round"
210
199
  }
211
200
  ),
212
201
  /* @__PURE__ */ jsx(
213
202
  "path",
214
203
  {
215
- d: "M13 15V17",
204
+ 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",
216
205
  stroke: "currentColor",
217
- strokeWidth: "1.5",
218
- strokeLinecap: "round"
206
+ strokeWidth: "2",
207
+ strokeLinecap: "round",
208
+ strokeLinejoin: "round"
219
209
  }
220
- ),
221
- /* @__PURE__ */ jsx("circle", { cx: "10", cy: "10", r: "1.5", fill: "currentColor" })
210
+ )
222
211
  ]
223
212
  }
224
213
  ),
225
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600", children: euifyMakeModel }) })
214
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-[16px] l:text-[14px] text-[#2A2C32]", children: euifyMakeModel }) })
226
215
  ] }),
227
216
  /* @__PURE__ */ jsx(
228
217
  "button",
229
218
  {
230
219
  onClick: handleScheduleClick,
231
220
  className: cn(
232
- "w-full px-6 py-3 rounded-full",
233
- "bg-white text-gray-900 border border-gray-900",
234
- "font-medium text-sm",
221
+ "w-fit px-[28px] l:px-[20px] l:py-[8px] py-3 rounded-full",
222
+ "bg-white text-gray-900 border-2 border-gray-900",
223
+ "font-bold text-[16px] l:text-[14px]",
235
224
  "hover:bg-gray-900 hover:text-white",
236
225
  "transition-all duration-200"
237
226
  ),
@@ -351,14 +340,12 @@ var StudioMap = ({
351
340
  const lng = Number(location.lng);
352
341
  const svgIcon = {
353
342
  url: `data:image/svg+xml;charset=UTF-8,${encodeURIComponent(`
354
- <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
355
- <circle cx="24" cy="24" r="22" fill="#00000010"/>
356
- <circle cx="24" cy="24" r="10" fill="#000000"/>
357
- <circle cx="24" cy="24" r="5" fill="#3ADB67"/>
343
+ <svg xmlns="http://www.w3.org/2000/svg" width="34" height="44" viewBox="0 0 17 22" fill="none">
344
+ <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"/>
358
345
  </svg>
359
346
  `)}`,
360
- scaledSize: { width: 48, height: 48 },
361
- anchor: { x: 24, y: 24 }
347
+ scaledSize: { width: 34, height: 44 },
348
+ anchor: { x: 17, y: 44 }
362
349
  };
363
350
  const marker = new google.maps.Marker({
364
351
  position: { lat, lng },
@@ -369,41 +356,53 @@ var StudioMap = ({
369
356
  marker.addListener("click", () => {
370
357
  setSelectedLocation(location);
371
358
  const content = `
372
- <div style="padding: 16px; max-width: 300px; font-family: system-ui, sans-serif;">
373
- <h3 style="margin: 0 0 12px 0; font-size: 18px; font-weight: 600;">${location.name}</h3>
374
- ${location.availableTime ? `<div style="margin-bottom: 8px; color: #666;">
375
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
376
- <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"/>
359
+ <div style="padding: 0 16px 16px 16px; font-weight: 700; font-family: 'MontForAnker'; max-width: 420px;">
360
+ <h3 style="margin: 0 0 16px 0; font-size: 24px; color: #080A0F;">${location.name}</h3>
361
+ ${location.availableTime ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
362
+ <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">
363
+ <rect x="3" y="4" width="14" height="13" rx="2" stroke="currentColor" stroke-width="1.5"/>
364
+ <path d="M3 8H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
365
+ <path d="M6 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
366
+ <path d="M14 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
377
367
  </svg>
378
- <span style="vertical-align: middle;"> ${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</span>
368
+ <div>
369
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</p>
370
+ </div>
379
371
  </div>` : ""}
380
- <div style="margin-bottom: 8px; color: #666;">
381
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
382
- <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"/>
372
+ <div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
373
+ <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">
374
+ <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"/>
375
+ <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"/>
383
376
  </svg>
384
- <span style="vertical-align: middle;">${location.address}</span>
377
+ <div style="flex: 1;">
378
+ <p style="margin: 0; font-size: 16px; color: #2A2C32; word-wrap: break-word;">${location.address}</p>
379
+ </div>
385
380
  </div>
386
- ${location.euifyMakeModel ? `<div style="margin-bottom: 12px; 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="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"/>
381
+ ${location.euifyMakeModel ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px;">
382
+ <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">
383
+ <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"/>
384
+ <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"/>
389
385
  </svg>
390
- <span style="vertical-align: middle;">${location.euifyMakeModel}</span>
386
+ <div>
387
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.euifyMakeModel}</p>
388
+ </div>
391
389
  </div>` : ""}
392
390
  <button
393
391
  id="schedule-btn-${location.id}"
394
392
  style="
395
- width: 100%;
396
- padding: 10px 16px;
397
- background: #000;
398
- color: #fff;
399
- border: none;
400
- border-radius: 6px;
401
- font-weight: 500;
393
+ width: fit-content;
394
+ padding: 12px 28px;
395
+ background: #fff;
396
+ color: #111827;
397
+ border: 2px solid #111827;
398
+ border-radius: 9999px;
399
+ font-weight: 700;
402
400
  cursor: pointer;
403
- font-size: 14px;
401
+ font-size: 16px;
402
+ transition: all 0.2s;
404
403
  "
405
- onmouseover="this.style.background='#333'"
406
- onmouseout="this.style.background='#000'"
404
+ onmouseover="this.style.background='#111827'; this.style.color='#fff';"
405
+ onmouseout="this.style.background='#fff'; this.style.color='#111827';"
407
406
  >
408
407
  ${pageData.scheduleNow}
409
408
  </button>
@@ -455,41 +454,53 @@ var StudioMap = ({
455
454
  const marker = markersRef.current[markerIndex];
456
455
  if (location && marker) {
457
456
  const content = `
458
- <div style="padding: 16px; max-width: 300px; font-family: system-ui, sans-serif;">
459
- <h3 style="margin: 0 0 12px 0; font-size: 18px; font-weight: 600;">${location.name}</h3>
460
- ${location.availableTime ? `<div style="margin-bottom: 8px; color: #666;">
461
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
462
- <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"/>
457
+ <div style="padding: 0 16px 16px 16px; font-weight: 700; font-family: 'MontForAnker'; max-width: 420px;">
458
+ <h3 style="margin: 0 0 16px 0; font-size: 24px; color: #080A0F;">${location.name}</h3>
459
+ ${location.availableTime ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
460
+ <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">
461
+ <rect x="3" y="4" width="14" height="13" rx="2" stroke="currentColor" stroke-width="1.5"/>
462
+ <path d="M3 8H17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
463
+ <path d="M6 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
464
+ <path d="M14 2V4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
463
465
  </svg>
464
- <span style="vertical-align: middle;">${pageData.available} ${location.availableTime}</span>
466
+ <div>
467
+ <p style="margin: 0;font-size: 16px; color: #2A2C32;">${location.availableTime === pageData?.noAvailableTime ? "" : pageData.available} ${location.availableTime}</p>
468
+ </div>
465
469
  </div>` : ""}
466
- <div style="margin-bottom: 8px; color: #666;">
467
- <svg style="display: inline-block; width: 16px; height: 16px; margin-right: 4px; vertical-align: middle;" fill="currentColor" viewBox="0 0 20 20">
468
- <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"/>
470
+ <div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;">
471
+ <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">
472
+ <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"/>
473
+ <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"/>
469
474
  </svg>
470
- <span style="vertical-align: middle;">${location.address}</span>
475
+ <div style="flex: 1;">
476
+ <p style="margin: 0; font-size: 16px; color: #2A2C32; word-wrap: break-word;">${location.address}</p>
477
+ </div>
471
478
  </div>
472
- ${location.euifyMakeModel ? `<div style="margin-bottom: 12px; 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="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"/>
479
+ ${location.euifyMakeModel ? `<div style="display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px;">
480
+ <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">
481
+ <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"/>
482
+ <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"/>
475
483
  </svg>
476
- <span style="vertical-align: middle;">${location.euifyMakeModel}</span>
484
+ <div>
485
+ <p style="margin: 0; font-size: 16px; color: #2A2C32;">${location.euifyMakeModel}</p>
486
+ </div>
477
487
  </div>` : ""}
478
488
  <button
479
489
  id="schedule-btn-hover-${location.id}"
480
490
  style="
481
- width: 100%;
482
- padding: 10px 16px;
483
- background: #000;
484
- color: #fff;
485
- border: none;
486
- border-radius: 6px;
487
- font-weight: 500;
491
+ width: fit-content;
492
+ padding: 12px 28px;
493
+ background: #fff;
494
+ color: #111827;
495
+ border: 2px solid #111827;
496
+ border-radius: 9999px;
497
+ font-weight: 700;
488
498
  cursor: pointer;
489
- font-size: 14px;
499
+ font-size: 16px;
500
+ transition: all 0.2s;
490
501
  "
491
- onmouseover="this.style.background='#333'"
492
- onmouseout="this.style.background='#000'"
502
+ onmouseover="this.style.background='#111827'; this.style.color='#fff';"
503
+ onmouseout="this.style.background='#fff'; this.style.color='#111827';"
493
504
  >
494
505
  ${pageData.scheduleNow}
495
506
  </button>
@@ -979,9 +990,9 @@ var LocationFilter = ({
979
990
  "div",
980
991
  {
981
992
  style: { background: "#F8F8F8" },
982
- className: "rounded-[12px] rounded-b-none h-[72px] font-bold text-[14px] flex flex-col",
993
+ className: "rounded-[12px] rounded-b-none h-[108px] font-bold text-[14px] flex flex-col",
983
994
  children: [
984
- /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end px-[20px] pt-[12px] pb-[8px]", children: /* @__PURE__ */ jsx(
995
+ /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end px-[24px] pt-[12px] pb-[8px]", children: /* @__PURE__ */ jsx(
985
996
  "button",
986
997
  {
987
998
  onClick: onClose,
@@ -1005,14 +1016,14 @@ var LocationFilter = ({
1005
1016
  )
1006
1017
  }
1007
1018
  ) }),
1008
- /* @__PURE__ */ jsxs("div", { className: "flex items-center px-[20px] gap-[16px] pb-[8px]", children: [
1019
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[16px] px-[20px] gap-[16px] py-[16px]", children: [
1009
1020
  /* @__PURE__ */ jsx(
1010
1021
  "button",
1011
1022
  {
1012
1023
  onClick: () => handleTabClick("country"),
1013
1024
  className: cn(
1014
1025
  "pb-[4px] transition-colors",
1015
- currentLevel === "country" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]"
1026
+ currentLevel === "country" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]"
1016
1027
  ),
1017
1028
  children: pageData.country
1018
1029
  }
@@ -1024,7 +1035,7 @@ var LocationFilter = ({
1024
1035
  disabled: !selectedCountry,
1025
1036
  className: cn(
1026
1037
  "pb-[4px] transition-colors",
1027
- currentLevel === "state" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]",
1038
+ currentLevel === "state" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
1028
1039
  !selectedCountry && "opacity-50 cursor-not-allowed"
1029
1040
  ),
1030
1041
  children: pageData.state
@@ -1037,7 +1048,7 @@ var LocationFilter = ({
1037
1048
  disabled: !selectedState,
1038
1049
  className: cn(
1039
1050
  "pb-[4px] transition-colors",
1040
- currentLevel === "city" ? "text-[#1D1D1F] border-b-2 border-[#2E8B57]" : "text-[#767880]",
1051
+ currentLevel === "city" ? "text-[#080A0F] border-b-2 border-[#3ADB67]" : "text-[#080A0F]",
1041
1052
  !selectedState && "opacity-50 cursor-not-allowed"
1042
1053
  ),
1043
1054
  children: pageData.city
@@ -1047,12 +1058,13 @@ var LocationFilter = ({
1047
1058
  ]
1048
1059
  }
1049
1060
  ),
1050
- /* @__PURE__ */ jsx(AntdMobileIsolated, { style: { height: "calc(100% - 72px)" }, children: showIndexBar ? /* @__PURE__ */ jsx(IndexBar, { style: { height: "100%" }, children: groupedItems.map((group) => {
1061
+ /* @__PURE__ */ jsx(AntdMobileIsolated, { style: { height: "calc(100% - 108px)" }, children: showIndexBar ? /* @__PURE__ */ jsx(IndexBar, { style: { height: "100%" }, children: groupedItems.map((group) => {
1051
1062
  const { title, items } = group;
1052
1063
  return /* @__PURE__ */ jsx(IndexBar.Panel, { index: title, title, children: /* @__PURE__ */ jsx(List, { children: items.map((item) => /* @__PURE__ */ jsx(
1053
1064
  List.Item,
1054
1065
  {
1055
1066
  onClick: () => handleItemClick(item),
1067
+ className: "text-[16px] !pl-[24px]",
1056
1068
  style: { cursor: "pointer" },
1057
1069
  children: item.name
1058
1070
  },
@@ -1062,6 +1074,7 @@ var LocationFilter = ({
1062
1074
  List.Item,
1063
1075
  {
1064
1076
  onClick: () => handleItemClick(item),
1077
+ className: "text-[16px] !pl-[24px]",
1065
1078
  style: { cursor: "pointer" },
1066
1079
  children: item.name
1067
1080
  },
@@ -1262,7 +1275,7 @@ var RoomsList = ({
1262
1275
  lat: Number(room.latitude) || 0,
1263
1276
  lng: Number(room.longitude) || 0,
1264
1277
  availableTime: nextAvailableTimeslot ? `${nextAvailableTimeslot.start_time}` : mergedPageData.noAvailableTime,
1265
- euifyMakeModel: room?.description
1278
+ euifyMakeModel: room?.equipment?.join(", ") || ""
1266
1279
  };
1267
1280
  });
1268
1281
  }, [demoRooms, mergedPageData.defaultCountry, mergedPageData.noAvailableTime]);
@@ -1314,7 +1327,7 @@ var RoomsList = ({
1314
1327
  /* @__PURE__ */ jsxs(
1315
1328
  "button",
1316
1329
  {
1317
- className: "flex cursor-pointer items-center hover:text-[#2E8B57] transition-colors",
1330
+ className: "flex cursor-pointer items-center hover:text-[#3ADB67] transition-colors",
1318
1331
  onClick: () => setShowLocationFilter(true),
1319
1332
  children: [
1320
1333
  /* @__PURE__ */ jsx("span", { className: "mr-1", children: getSelectedLocationName() }),
@@ -1371,7 +1384,7 @@ var RoomsList = ({
1371
1384
  "div",
1372
1385
  {
1373
1386
  style: { maxHeight: "706px", overflow: "auto" },
1374
- className: "rounded-[12px] bg-white border border-[#E4E5E6]",
1387
+ className: "rounded-[12px] bg-white border h-[706px] border-[#E4E5E6]",
1375
1388
  children: filteredStudioLocations.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-[200px] text-[#767880]", children: mergedPageData.locationFilter.noStudiosFound }) : filteredStudioLocations.map((item) => {
1376
1389
  return /* @__PURE__ */ jsx(
1377
1390
  StudioCard,
@@ -1764,7 +1777,7 @@ var QuestionnaireForm = ({
1764
1777
  onChange: (e) => handleChange(questionId, e.target.value),
1765
1778
  placeholder: question.placeholder,
1766
1779
  className: cn(
1767
- "w-full px-4 py-3 rounded-lg border text-base",
1780
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1768
1781
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1769
1782
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1770
1783
  )
@@ -1780,7 +1793,7 @@ var QuestionnaireForm = ({
1780
1793
  onBlur: (e) => handleEmailBlur(questionId, e.target.value),
1781
1794
  placeholder: question.placeholder,
1782
1795
  className: cn(
1783
- "w-full px-4 py-3 rounded-lg border text-base",
1796
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1784
1797
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1785
1798
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1786
1799
  )
@@ -1799,6 +1812,7 @@ var QuestionnaireForm = ({
1799
1812
  "appearance-none pl-3 pr-8 py-3 rounded-lg border text-base",
1800
1813
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1801
1814
  "bg-white cursor-pointer w-[80px]",
1815
+ "dark:bg-white dark:text-gray-900",
1802
1816
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1803
1817
  ),
1804
1818
  children: countryCodes.map((item) => /* @__PURE__ */ jsx("option", { value: item.code, children: item.code }, item.code))
@@ -1833,7 +1847,7 @@ var QuestionnaireForm = ({
1833
1847
  onChange: (e) => handleChange(questionId, e.target.value),
1834
1848
  placeholder: question.placeholder,
1835
1849
  className: cn(
1836
- "flex-1 px-4 py-3 rounded-lg border text-base",
1850
+ "flex-1 px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1837
1851
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1838
1852
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1839
1853
  )
@@ -1849,8 +1863,9 @@ var QuestionnaireForm = ({
1849
1863
  placeholder: question.placeholder,
1850
1864
  rows: 4,
1851
1865
  className: cn(
1852
- "w-full px-4 py-3 rounded-lg border text-base resize-none",
1866
+ "w-full px-4 py-3 rounded-lg border text-base resize-none bg-white",
1853
1867
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1868
+ "dark:bg-white dark:text-gray-900",
1854
1869
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1855
1870
  )
1856
1871
  }
@@ -1869,10 +1884,15 @@ var QuestionnaireForm = ({
1869
1884
  value: option.value || option.label,
1870
1885
  checked: responses[questionId] === (option.value || option.label),
1871
1886
  onChange: (e) => handleChange(questionId, e.target.value),
1872
- className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2"
1887
+ className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2",
1888
+ style: {
1889
+ backgroundColor: "white",
1890
+ borderColor: "#D1D5DB",
1891
+ colorScheme: "light"
1892
+ }
1873
1893
  }
1874
1894
  ),
1875
- /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 group-hover:text-[#3ADB67] transition-colors", children: option.label })
1895
+ /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1876
1896
  ]
1877
1897
  },
1878
1898
  option.value || option.label
@@ -1898,10 +1918,15 @@ var QuestionnaireForm = ({
1898
1918
  optionValue,
1899
1919
  e.target.checked
1900
1920
  ),
1901
- className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2 rounded"
1921
+ className: "w-5 h-5 text-[#3ADB67] focus:ring-[#3ADB67] focus:ring-2 rounded",
1922
+ style: {
1923
+ backgroundColor: "white",
1924
+ borderColor: "#D1D5DB",
1925
+ colorScheme: "light"
1926
+ }
1902
1927
  }
1903
1928
  ),
1904
- /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 group-hover:text-[#3ADB67] transition-colors", children: option.label })
1929
+ /* @__PURE__ */ jsx("span", { className: "text-base text-gray-900 dark:text-gray-900 font-bold group-hover:text-[#3ADB67] transition-colors", children: option.label })
1905
1930
  ]
1906
1931
  },
1907
1932
  optionValue
@@ -1914,9 +1939,9 @@ var QuestionnaireForm = ({
1914
1939
  value: responses[questionId] || "",
1915
1940
  onChange: (e) => handleChange(questionId, e.target.value),
1916
1941
  className: cn(
1917
- "w-full px-4 py-3 rounded-lg border text-base",
1942
+ "w-full px-4 py-3 rounded-lg border text-base bg-white dark:bg-white dark:text-gray-900",
1918
1943
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:border-transparent",
1919
- "bg-white cursor-pointer",
1944
+ "cursor-pointer",
1920
1945
  hasError ? "border-red-500" : "border-[#E4E5E6]"
1921
1946
  ),
1922
1947
  children: [
@@ -1936,21 +1961,21 @@ var QuestionnaireForm = ({
1936
1961
  return null;
1937
1962
  }
1938
1963
  };
1939
- return /* @__PURE__ */ jsxs("div", { className: "pb-[80px]", children: [
1940
- questions && questions.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-white rounded-[12px] border border-[#E4E5E6] p-8", children: /* @__PURE__ */ jsx("form", { onSubmit: handleSubmit, className: cn("space-y-6", className), children: questions.map((question) => {
1964
+ return /* @__PURE__ */ jsxs("div", { className: "pb-[80px] light", children: [
1965
+ questions && questions.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-white rounded-[12px] border border-[#E4E5E6] p-8 dark:bg-white dark:border-[#E4E5E6] l:p-4", children: /* @__PURE__ */ jsx("form", { onSubmit: handleSubmit, className: cn("space-y-6", className), children: questions.map((question) => {
1941
1966
  const questionId = getQuestionId(question);
1942
1967
  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
1943
1968
  /* @__PURE__ */ jsxs("label", { className: "block", children: [
1944
- /* @__PURE__ */ jsxs("span", { className: "text-base font-medium text-gray-900", children: [
1969
+ /* @__PURE__ */ jsxs("span", { className: "text-base font-bold text-gray-900 dark:text-gray-900", children: [
1945
1970
  question.label,
1946
1971
  question.required && /* @__PURE__ */ jsx("span", { className: "text-red-500 ml-1", children: "*" })
1947
1972
  ] }),
1948
- question.description && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 mt-1", children: question.description }),
1949
- question.type === "email" && questionId === "email" && pageData?.emailDescription && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 mt-1", children: pageData.emailDescription })
1973
+ question.description && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 dark:text-gray-600 font-bold mt-1", children: question.description }),
1974
+ question.type === "email" && questionId === "email" && pageData?.emailDescription && /* @__PURE__ */ jsx("span", { className: "block text-sm text-gray-600 dark:text-gray-600 font-bold mt-1", children: pageData.emailDescription })
1950
1975
  ] }),
1951
1976
  renderQuestion(question),
1952
- question.hint && !errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: question.hint }),
1953
- errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm", style: { color: "#FF4D4D" }, children: errors[questionId] })
1977
+ question.hint && !errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 dark:text-gray-500 font-bold", children: question.hint }),
1978
+ errors[questionId] && /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", style: { color: "#FF4D4D" }, children: errors[questionId] })
1954
1979
  ] }, questionId);
1955
1980
  }) }) }),
1956
1981
  !!selectedTimeslotId && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center", children: [
@@ -1963,20 +1988,25 @@ var QuestionnaireForm = ({
1963
1988
  id: `agreement-${index}`,
1964
1989
  checked: agreements[index] || false,
1965
1990
  onChange: (e) => handleAgreementChange(index, e.target.checked),
1966
- className: "w-5 h-5 rounded border-gray-300 text-[#2FC257] focus:ring-[#2FC257] cursor-pointer flex-shrink-0"
1991
+ className: "w-5 h-5 rounded text-[#2FC257] focus:ring-[#2FC257] cursor-pointer flex-shrink-0",
1992
+ style: {
1993
+ backgroundColor: "white",
1994
+ borderColor: "#D1D5DB",
1995
+ colorScheme: "light"
1996
+ }
1967
1997
  }
1968
1998
  ),
1969
1999
  /* @__PURE__ */ jsx(
1970
2000
  "label",
1971
2001
  {
1972
2002
  htmlFor: `agreement-${index}`,
1973
- className: "text-sm text-gray-700 cursor-pointer select-none flex-1 [&_a]:underline [&_a]:text-blue-600 [&_a:hover]:text-blue-700",
2003
+ 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",
1974
2004
  dangerouslySetInnerHTML: { __html: agreeContent },
1975
2005
  "aria-label": `Agreement ${index + 1}`
1976
2006
  }
1977
2007
  )
1978
2008
  ] }, index)),
1979
- agreementError && /* @__PURE__ */ jsx("p", { className: "text-sm mt-2", style: { color: "#FF4D4D" }, children: agreementError })
2009
+ agreementError && /* @__PURE__ */ jsx("p", { className: "text-sm font-bold mt-2", style: { color: "#FF4D4D" }, children: agreementError })
1980
2010
  ] }),
1981
2011
  /* @__PURE__ */ jsx(
1982
2012
  "button",
@@ -1986,7 +2016,7 @@ var QuestionnaireForm = ({
1986
2016
  onClick: handleSubmit,
1987
2017
  className: cn(
1988
2018
  "w-fit mt-6 px-6 py-4 rounded-full",
1989
- "bg-[#080A0F] text-white font-medium text-base",
2019
+ "bg-[#080A0F] text-white font-bold text-base",
1990
2020
  "hover:bg-[#2FC257] transition-colors",
1991
2021
  "focus:outline-none focus:ring-2 focus:ring-[#3ADB67] focus:ring-offset-2",
1992
2022
  "disabled:opacity-50 disabled:cursor-not-allowed"
@@ -2131,10 +2161,10 @@ var DateTimePicker = ({
2131
2161
  const wrapperStyle = {
2132
2162
  background: "#fff",
2133
2163
  border: `1px solid ${token.colorBorderSecondary}`,
2134
- borderRadius: token.borderRadiusLG
2164
+ borderRadius: 16
2135
2165
  };
2136
2166
  return /* @__PURE__ */ jsxs("div", { children: [
2137
- /* @__PURE__ */ jsx("div", { className: "text-[48px] l:text-[32px] py-[64px] l:py-[24px] font-bold text-center", children: pageData.scheduleYourVisit }),
2167
+ /* @__PURE__ */ jsx("div", { className: "text-[48px] l:text-[32px] py-[64px] l:py-[24px] l:pt-[64px] font-bold text-center", children: pageData.scheduleYourVisit }),
2138
2168
  /* @__PURE__ */ jsxs("div", { className: "flex gap-4 l:flex-col", children: [
2139
2169
  /* @__PURE__ */ jsx(
2140
2170
  ConfigProvider,
@@ -2158,6 +2188,20 @@ var DateTimePicker = ({
2158
2188
  className: "calendar-custom-cell w-[calc(824/1920*100vw)] min-l:max-w-[824px] l:w-full",
2159
2189
  children: [
2160
2190
  /* @__PURE__ */ jsx("style", { children: `
2191
+ .calendar-custom-cell {
2192
+ border-radius: 16px !important;
2193
+ overflow: hidden;
2194
+ padding: 0 24px 16px 24px !important;
2195
+ }
2196
+ .calendar-custom-cell,
2197
+ .calendar-custom-cell *,
2198
+ .calendar-custom-cell .ant-picker-panel,
2199
+ .calendar-custom-cell .ant-picker-calendar,
2200
+ .calendar-custom-cell .ant-picker-content,
2201
+ .calendar-custom-cell .ant-picker-cell,
2202
+ .calendar-custom-cell .ant-picker-calendar-date-value {
2203
+ font-family: 'MontForAnker' !important;
2204
+ }
2161
2205
  .calendar-custom-cell .ant-picker-cell {
2162
2206
  padding: 6px !important;
2163
2207
  text-align: center !important;
@@ -2175,6 +2219,11 @@ var DateTimePicker = ({
2175
2219
  border: 1px solid #E4E5E6 !important;
2176
2220
  aspect-ratio: 1 / 1 !important;
2177
2221
  }
2222
+ .calendar-custom-cell .ant-picker-calendar-date-value {
2223
+ line-height: 38px !important;
2224
+ font-weight: 700 !important;
2225
+ font-size: 14px !important;
2226
+ }
2178
2227
  @media (min-width: 1024px) and (max-width: 1919px) {
2179
2228
  .calendar-custom-cell .ant-picker-cell-inner {
2180
2229
  width: 54px !important;
@@ -2183,6 +2232,8 @@ var DateTimePicker = ({
2183
2232
  }
2184
2233
  .calendar-custom-cell .ant-picker-calendar-date-value {
2185
2234
  line-height: 54px !important;
2235
+ font-weight: 700 !important;
2236
+ font-size: 20px !important;
2186
2237
  }
2187
2238
  }
2188
2239
  @media (min-width: 1920px) {
@@ -2193,17 +2244,19 @@ var DateTimePicker = ({
2193
2244
  }
2194
2245
  .calendar-custom-cell .ant-picker-calendar-date-value {
2195
2246
  line-height: 100px !important;
2247
+ font-weight: 700 !important;
2248
+ font-size: 20px !important;
2196
2249
  }
2197
2250
  }
2198
2251
  .calendar-custom-cell .ant-picker-cell-selected .ant-picker-cell-inner,
2199
2252
  .calendar-custom-cell .ant-picker-cell-selected:not(.ant-picker-cell-disabled) .ant-picker-cell-inner {
2200
2253
  background-color: #3ADB67 !important;
2201
- color: white !important;
2254
+ color: #080A0F !important;
2202
2255
  border-color: #3ADB67 !important;
2203
2256
  }
2204
2257
  .calendar-custom-cell .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner {
2205
2258
  background-color: #3ADB67 !important;
2206
- color: white !important;
2259
+ color: #080A0F !important;
2207
2260
  }
2208
2261
  .calendar-custom-cell .ant-picker-cell-today .ant-picker-cell-inner {
2209
2262
  border-color: #3ADB67 !important;
@@ -2222,25 +2275,24 @@ var DateTimePicker = ({
2222
2275
  .calendar-custom-cell .ant-picker-cell-today .ant-picker-cell-inner::before {
2223
2276
  display: none !important;
2224
2277
  }
2225
- .calendar-custom-cell .ant-picker-calendar-date-value {
2226
- line-height: 38px !important;
2227
- }
2228
2278
  .calendar-custom-cell .ant-picker-content {
2229
2279
  width: 100% !important;
2230
2280
  }
2231
2281
  .calendar-custom-cell .ant-picker-content thead tr th {
2232
2282
  line-height: 48px !important;
2283
+ font-weight: 700 !important;
2284
+ font-size: 18px !important;
2233
2285
  }
2234
2286
  .calendar-custom-cell .ant-picker-cell-disabled .ant-picker-cell-inner {
2235
2287
  background-color: #F5F5F5 !important;
2236
- color: #BDBDBD !important;
2237
- border-color: #E4E5E6 !important;
2288
+ color: #2A2C32 !important;
2289
+ border: none !important;
2238
2290
  cursor: not-allowed !important;
2239
2291
  box-shadow: none !important;
2240
2292
  }
2241
2293
  .calendar-custom-cell .ant-picker-cell-disabled:hover .ant-picker-cell-inner {
2242
2294
  background-color: #F5F5F5 !important;
2243
- border-color: #E4E5E6 !important;
2295
+ border: none !important;
2244
2296
  box-shadow: none !important;
2245
2297
  }
2246
2298
  .calendar-custom-cell .ant-picker-cell-disabled::before {
@@ -2280,7 +2332,7 @@ var DateTimePicker = ({
2280
2332
  className: `ant-picker-cell-inner ${isSelected ? "ant-picker-cell-inner-selected" : ""} ${isToday ? "ant-picker-cell-inner-today" : ""}`,
2281
2333
  style: {
2282
2334
  backgroundColor: isSelected ? "#3ADB67" : void 0,
2283
- color: isSelected ? "white" : isDisabled ? "#BDBDBD" : void 0,
2335
+ color: isSelected ? "#080A0F" : isDisabled ? "#2A2C32" : void 0,
2284
2336
  borderColor: isSelected ? "#3ADB67" : isToday ? "#3ADB67" : void 0
2285
2337
  },
2286
2338
  children: /* @__PURE__ */ jsx("div", { className: "ant-picker-calendar-date-value", children: date.date() })
@@ -2298,7 +2350,7 @@ var DateTimePicker = ({
2298
2350
  label,
2299
2351
  value: index
2300
2352
  }));
2301
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [
2353
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between py-3 l:pb-[0px]", children: [
2302
2354
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
2303
2355
  /* @__PURE__ */ jsx(
2304
2356
  Select,
@@ -2310,14 +2362,15 @@ var DateTimePicker = ({
2310
2362
  onChange(now);
2311
2363
  },
2312
2364
  variant: "borderless",
2313
- className: "text-2xl font-medium",
2365
+ className: "text-[32px] l:text-[20px] font-bold",
2314
2366
  popupMatchSelectWidth: false,
2367
+ suffixIcon: null,
2315
2368
  style: {
2316
- fontSize: "24px",
2317
- fontWeight: 500
2369
+ fontWeight: 700
2318
2370
  }
2319
2371
  }
2320
2372
  ),
2373
+ /* @__PURE__ */ jsx("div", { className: "text-[20px] text-[#E4E5E6]", children: "/" }),
2321
2374
  /* @__PURE__ */ jsx(
2322
2375
  Select,
2323
2376
  {
@@ -2328,11 +2381,11 @@ var DateTimePicker = ({
2328
2381
  onChange(now);
2329
2382
  },
2330
2383
  variant: "borderless",
2331
- className: "text-2xl font-medium",
2384
+ className: "text-[32px] l:text-[20px] font-bold",
2332
2385
  popupMatchSelectWidth: false,
2386
+ suffixIcon: null,
2333
2387
  style: {
2334
- fontSize: "24px",
2335
- fontWeight: 500
2388
+ fontWeight: 700
2336
2389
  }
2337
2390
  }
2338
2391
  )
@@ -2408,10 +2461,10 @@ var DateTimePicker = ({
2408
2461
  )
2409
2462
  }
2410
2463
  ),
2411
- /* @__PURE__ */ jsxs("div", { className: "bg-white p-[24px] rounded-[12px] flex-1", children: [
2412
- /* @__PURE__ */ jsxs("div", { className: "flex justify-between", children: [
2413
- pageData.timeSlot,
2414
- /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
2464
+ /* @__PURE__ */ jsxs("div", { className: "bg-white p-[24px] rounded-[16px] flex-1", children: [
2465
+ /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center", children: [
2466
+ /* @__PURE__ */ jsx("div", { className: "text-[24px] l:text-[16px]", children: pageData.timeSlot }),
2467
+ /* @__PURE__ */ jsxs("div", { className: "flex text-[18px] l:text-[14px] l:gap-1 gap-2", children: [
2415
2468
  /* @__PURE__ */ jsx(
2416
2469
  "button",
2417
2470
  {
@@ -2425,7 +2478,7 @@ var DateTimePicker = ({
2425
2478
  }
2426
2479
  },
2427
2480
  disabled: !selectedDate || selectedDate.isSame(dayjs(), "day") || selectedDate.isBefore(dayjs(), "day"),
2428
- 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",
2481
+ 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",
2429
2482
  children: /* @__PURE__ */ jsx(
2430
2483
  "svg",
2431
2484
  {
@@ -2445,7 +2498,7 @@ var DateTimePicker = ({
2445
2498
  )
2446
2499
  }
2447
2500
  ),
2448
- /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: selectedDate ? selectedDate.format("MMMM D, YYYY") : "" }),
2501
+ /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: selectedDate ? selectedDate.format("MMMM D") : "" }),
2449
2502
  /* @__PURE__ */ jsx(
2450
2503
  "button",
2451
2504
  {
@@ -2457,7 +2510,7 @@ var DateTimePicker = ({
2457
2510
  }
2458
2511
  },
2459
2512
  disabled: !selectedDate,
2460
- 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",
2513
+ 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",
2461
2514
  children: /* @__PURE__ */ jsx(
2462
2515
  "svg",
2463
2516
  {
@@ -2479,7 +2532,7 @@ var DateTimePicker = ({
2479
2532
  )
2480
2533
  ] })
2481
2534
  ] }),
2482
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 mt-[40px] gap-4", children: timeslotsLoading ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.loadingTimeSlots }) : timeslotsError ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-red-600 py-8", children: pageData.failedToLoadTimeSlots }) : dayTimeslots.length === 0 ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#767880] py-8", children: pageData.noAvailableTimeSlots }) : dayTimeslots.map((slot) => {
2535
+ /* @__PURE__ */ 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__ */ jsx("div", { className: "col-span-2 text-center text-[#2A2C32] py-8", children: pageData.loadingTimeSlots }) : timeslotsError ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-red-600 py-8", children: pageData.failedToLoadTimeSlots }) : dayTimeslots.length === 0 ? /* @__PURE__ */ jsx("div", { className: "col-span-2 text-center text-[#2A2C32] py-8", children: pageData.noAvailableTimeSlots }) : dayTimeslots.map((slot) => {
2483
2536
  const isAvailable = slot.status === "available";
2484
2537
  const isFull = slot.status === "full";
2485
2538
  const isSelected = selectedTimeslotId === slot.id;
@@ -2493,19 +2546,19 @@ var DateTimePicker = ({
2493
2546
  }
2494
2547
  },
2495
2548
  className: `
2496
- rounded-[20px] w-full flex items-center justify-center gap-4 h-[76px]
2549
+ rounded-[20px] w-full text-[18px] l:gap-2 l:text-[16px] flex items-center justify-center gap-4 h-[76px]
2497
2550
  border text-center transition-colors
2498
- ${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"}
2551
+ ${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"}
2499
2552
  `,
2500
2553
  children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
2501
2554
  /* @__PURE__ */ jsx("div", { children: formatTimeslot(slot) }),
2502
- isFull && /* @__PURE__ */ jsx("div", { className: "text-xs text-[#BDBDBD] mt-1", children: pageData.full }),
2503
- isAvailable && !isSelected && /* @__PURE__ */ jsxs("div", { className: "text-xs text-[#767880] mt-1", children: [
2555
+ isFull && /* @__PURE__ */ jsx("div", { className: "text-[16px] l:text-[14px] text-[#2A2C32] mt-[2px]", children: pageData.full }),
2556
+ isAvailable && !isSelected && /* @__PURE__ */ jsxs("div", { className: "text-[16px] l:text-[14px] text-[#2A2C32] mt-1", children: [
2504
2557
  slot.capacity - slot.booked_count,
2505
2558
  " ",
2506
2559
  pageData.spotsLeft
2507
2560
  ] }),
2508
- isAvailable && isSelected && /* @__PURE__ */ jsxs("div", { className: "text-xs text-white mt-1", children: [
2561
+ isAvailable && isSelected && /* @__PURE__ */ jsxs("div", { className: "text-[16px] l:text-[14px] mt-1", children: [
2509
2562
  slot.capacity - slot.booked_count,
2510
2563
  " ",
2511
2564
  pageData.spotsLeft
@@ -2515,15 +2568,15 @@ var DateTimePicker = ({
2515
2568
  slot.id
2516
2569
  );
2517
2570
  }) }),
2518
- !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsx("div", { className: "py-4 text-right", children: pageData?.timezone?.replace(
2571
+ !timeslotsLoading && dayTimeslots?.length > 0 && /* @__PURE__ */ jsx("div", { className: "pt-[24px] text-[#6d6d6F] text-center", children: pageData?.timezone?.replace(
2519
2572
  "{{timezone}}",
2520
2573
  demoRoom?.timezone || timezone || ""
2521
2574
  ) })
2522
2575
  ] })
2523
2576
  ] }),
2524
2577
  /* @__PURE__ */ jsxs("div", { className: "mt-12", children: [
2525
- !!questionnaire?.questions?.length && /* @__PURE__ */ jsx("div", { className: "text-[48px] font-bold text-center mb-8", children: pageData.fillOutForm }),
2526
- questionnaireLoading ? /* @__PURE__ */ jsx("div", { className: "text-center text-[#767880] py-8", children: pageData.loadingQuestionnaire }) : /* @__PURE__ */ jsx(
2578
+ !!questionnaire?.questions?.length && /* @__PURE__ */ jsx("div", { className: "text-[48px] font-bold text-center mb-8 l:mb-[24px] l:text-[32px] l:text-left", children: pageData.fillOutForm }),
2579
+ questionnaireLoading ? /* @__PURE__ */ jsx("div", { className: "text-center text-[#2A2C32] py-8", children: pageData.loadingQuestionnaire }) : /* @__PURE__ */ jsx(
2527
2580
  QuestionnaireForm,
2528
2581
  {
2529
2582
  questions: questionnaire?.questions || [],
@@ -2644,7 +2697,7 @@ var DemoRoomDetail = ({
2644
2697
  });
2645
2698
  const title = demoRoom?.name || titleProp || "Design District Demo Room";
2646
2699
  const descriptions = demoRoom?.description ? [demoRoom.description] : descriptionsProp || defaultDescriptions;
2647
- const devices = demoRoom?.description || devicesProp || "eufyMake E1, eufyMake M5";
2700
+ const devices = demoRoom?.equipment?.join(", ") || devicesProp || "eufyMake E1, eufyMake M5";
2648
2701
  const address = demoRoom?.address || addressProp || "1111 8th St, San Francisco, CA United States 94108";
2649
2702
  const images = demoRoom?.images && demoRoom.images.length > 0 ? demoRoom.images : imagesProp || defaultImages;
2650
2703
  const googleMapsLink = mapsLink || (() => {
@@ -2670,10 +2723,10 @@ var DemoRoomDetail = ({
2670
2723
  /* @__PURE__ */ jsx("p", { className: "text-sm mt-2", children: error.message })
2671
2724
  ] }) });
2672
2725
  }
2673
- return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-8 l:flex l:flex-col items-start py-[24px]", children: [
2674
- /* @__PURE__ */ jsxs("div", { className: "space-y-6 py-[24px]", children: [
2675
- /* @__PURE__ */ jsx("h1", { className: "text-[40px] font-bold text-gray-900 leading-tight", children: title }),
2676
- /* @__PURE__ */ jsx("div", { className: "space-y-4", children: descriptions.map((desc, index) => /* @__PURE__ */ jsx(
2726
+ return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ 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: [
2727
+ /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
2728
+ /* @__PURE__ */ jsx("h1", { className: "text-[48px] l:text-[32px] font-bold text-gray-900 leading-tight", children: title }),
2729
+ /* @__PURE__ */ jsx("div", { className: "mt-[20px]", children: descriptions.map((desc, index) => /* @__PURE__ */ jsx(
2677
2730
  "p",
2678
2731
  {
2679
2732
  className: "text-base text-gray-600 leading-relaxed",
@@ -2692,34 +2745,24 @@ var DemoRoomDetail = ({
2692
2745
  xmlns: "http://www.w3.org/2000/svg",
2693
2746
  className: "flex-shrink-0 mt-0.5",
2694
2747
  children: [
2695
- /* @__PURE__ */ jsx(
2696
- "rect",
2697
- {
2698
- x: "3",
2699
- y: "3",
2700
- width: "18",
2701
- height: "18",
2702
- rx: "2",
2703
- stroke: "currentColor",
2704
- strokeWidth: "2"
2705
- }
2706
- ),
2707
2748
  /* @__PURE__ */ jsx(
2708
2749
  "path",
2709
2750
  {
2710
- d: "M8 10H16",
2751
+ 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",
2711
2752
  stroke: "currentColor",
2712
2753
  strokeWidth: "2",
2713
- strokeLinecap: "round"
2754
+ strokeLinecap: "round",
2755
+ strokeLinejoin: "round"
2714
2756
  }
2715
2757
  ),
2716
2758
  /* @__PURE__ */ jsx(
2717
2759
  "path",
2718
2760
  {
2719
- d: "M8 14H16",
2761
+ 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",
2720
2762
  stroke: "currentColor",
2721
2763
  strokeWidth: "2",
2722
- strokeLinecap: "round"
2764
+ strokeLinecap: "round",
2765
+ strokeLinejoin: "round"
2723
2766
  }
2724
2767
  )
2725
2768
  ]
@@ -2798,7 +2841,7 @@ var DemoRoomDetail = ({
2798
2841
  ] })
2799
2842
  ] })
2800
2843
  ] }),
2801
- /* @__PURE__ */ jsx("div", { className: "relative l:w-full h-[400px] rounded-2xl overflow-hidden", children: images.length > 0 ? /* @__PURE__ */ jsx(
2844
+ /* @__PURE__ */ jsx("div", { className: "relative l:w-full min-l:h-[400px] rounded-2xl overflow-hidden", children: images.length > 0 ? /* @__PURE__ */ jsx(
2802
2845
  Swiper,
2803
2846
  {
2804
2847
  ...swiperVersion === "11+" && Navigation && Pagination && Autoplay ? { modules: [Navigation, Pagination, Autoplay] } : {},
@@ -2876,15 +2919,18 @@ var BookingForm = ({
2876
2919
  () => createDemoRoomApi(apiConfig),
2877
2920
  [apiConfig]
2878
2921
  );
2879
- const dateTimePickerPageData = useMemo(() => ({
2880
- ...pageData?.dateTimePicker,
2881
- ...pageData?.questionnaireForm
2882
- }), [pageData?.dateTimePicker, pageData?.questionnaireForm]);
2922
+ const dateTimePickerPageData = useMemo(
2923
+ () => ({
2924
+ ...pageData?.dateTimePicker,
2925
+ ...pageData?.questionnaireForm
2926
+ }),
2927
+ [pageData?.dateTimePicker, pageData?.questionnaireForm]
2928
+ );
2883
2929
  return /* @__PURE__ */ jsxs("div", { children: [
2884
2930
  /* @__PURE__ */ jsx("div", { className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsx(
2885
2931
  DemoRoomDetail,
2886
2932
  {
2887
- className: cn("mt-8", layoutClassName),
2933
+ className: cn("min-l:mt-8", layoutClassName),
2888
2934
  apiClient,
2889
2935
  demoRoomCode,
2890
2936
  locale: apiConfig.locale,
@@ -2962,7 +3008,9 @@ var BookingSuccess = ({
2962
3008
  }, [token, apiConfig, initialBookingData]);
2963
3009
  const handleCancelAppointment = async () => {
2964
3010
  if (!token || !apiConfig) {
2965
- setCancelError(pageData.cancelError || "Unable to cancel: Missing token or API configuration");
3011
+ setCancelError(
3012
+ pageData.cancelError || "Unable to cancel: Missing token or API configuration"
3013
+ );
2966
3014
  return;
2967
3015
  }
2968
3016
  setCancelLoading(true);
@@ -2983,13 +3031,15 @@ var BookingSuccess = ({
2983
3031
  }
2984
3032
  } catch (err) {
2985
3033
  console.error("Failed to cancel booking:", err);
2986
- setCancelError(pageData.cancelError || "Failed to cancel appointment. Please try again.");
3034
+ setCancelError(
3035
+ pageData.cancelError || "Failed to cancel appointment. Please try again."
3036
+ );
2987
3037
  } finally {
2988
3038
  setCancelLoading(false);
2989
3039
  }
2990
3040
  };
2991
3041
  if (loading) {
2992
- return /* @__PURE__ */ jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsx("div", { className: "max-w-3xl mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "animate-pulse space-y-6", children: [
3042
+ return /* @__PURE__ */ jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsx("div", { className: "mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "animate-pulse space-y-6", children: [
2993
3043
  /* @__PURE__ */ jsx("div", { className: "h-8 bg-gray-200 rounded w-1/3" }),
2994
3044
  /* @__PURE__ */ jsx("div", { className: "h-24 bg-gray-200 rounded" }),
2995
3045
  /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
@@ -3002,24 +3052,24 @@ var BookingSuccess = ({
3002
3052
  if (!bookingData) {
3003
3053
  return null;
3004
3054
  }
3005
- return /* @__PURE__ */ jsx("div", { className: `min-h-screen py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxs("div", { className: "max-w-3xl mx-auto", children: [
3055
+ return /* @__PURE__ */ jsx("div", { className: `min-h-screen l:py-0 l:px-0 py-12 px-6 ${className || ""}`, children: /* @__PURE__ */ jsxs("div", { className: "mx-auto", children: [
3006
3056
  /* @__PURE__ */ jsx("h1", { className: "text-[40px] font-bold text-gray-900 mb-8", children: pageData.yourAppointment }),
3007
- isCancelled && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg p-6 mb-8 flex items-center justify-between", children: [
3057
+ isCancelled && /* @__PURE__ */ 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: [
3008
3058
  /* @__PURE__ */ jsx("p", { className: "text-base text-gray-700", children: pageData.appointmentCanceled }),
3009
- onScheduleAgain && /* @__PURE__ */ jsx(
3059
+ onScheduleAgain && bookingData && /* @__PURE__ */ jsx(
3010
3060
  "button",
3011
3061
  {
3012
- onClick: onScheduleAgain,
3013
- className: "px-6 py-3 bg-black text-white rounded-full font-medium hover:bg-gray-800 transition-colors whitespace-nowrap",
3062
+ onClick: () => onScheduleAgain(bookingData.demoroom_code),
3063
+ className: "px-6 py-3 bg-black text-white rounded-full hover:bg-gray-800 transition-colors whitespace-nowrap",
3014
3064
  children: pageData.scheduleAgain
3015
3065
  }
3016
3066
  )
3017
3067
  ] }),
3018
- /* @__PURE__ */ jsxs("div", { className: "space-y-8 bg-white px-[48px] py-[32px] rounded-lg", children: [
3068
+ /* @__PURE__ */ jsxs("div", { className: "space-y-8 bg-white px-[48px] l:px-[16px] l:py-[16px] py-[32px] rounded-[16px]", children: [
3019
3069
  /* @__PURE__ */ jsxs("div", { children: [
3020
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.location }),
3070
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.location }),
3021
3071
  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
3022
- bookingData.demoroom_name && /* @__PURE__ */ jsx("p", { className: "text-base font-medium text-gray-900", children: bookingData.demoroom_name }),
3072
+ bookingData.demoroom_name && /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.demoroom_name }),
3023
3073
  bookingData.address && /* @__PURE__ */ jsx("p", { className: "text-base text-gray-600", children: bookingData.address }),
3024
3074
  bookingData.latitude && bookingData.longitude && /* @__PURE__ */ jsx(
3025
3075
  "a",
@@ -3034,7 +3084,7 @@ var BookingSuccess = ({
3034
3084
  ] })
3035
3085
  ] }),
3036
3086
  /* @__PURE__ */ jsxs("div", { children: [
3037
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.dateAndTime }),
3087
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.dateAndTime }),
3038
3088
  /* @__PURE__ */ jsxs("p", { className: "text-base text-gray-900", children: [
3039
3089
  bookingData.booking_date,
3040
3090
  bookingData.time_slot && `, ${bookingData.time_slot}`,
@@ -3042,15 +3092,15 @@ var BookingSuccess = ({
3042
3092
  ] })
3043
3093
  ] }),
3044
3094
  bookingData.equipment && /* @__PURE__ */ jsxs("div", { children: [
3045
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.event }),
3046
- /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.equipment })
3095
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.event }),
3096
+ /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: Array.isArray(bookingData.equipment) ? bookingData.equipment.join(", ") : bookingData.equipment })
3047
3097
  ] }),
3048
3098
  /* @__PURE__ */ jsxs("div", { children: [
3049
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.demoRoom }),
3099
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.demoRoom }),
3050
3100
  /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.demoroom_code })
3051
3101
  ] }),
3052
3102
  /* @__PURE__ */ jsxs("div", { children: [
3053
- /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: pageData.visitorInfo }),
3103
+ /* @__PURE__ */ jsx("h2", { className: "text-lg text-gray-900 mb-3", children: pageData.visitorInfo }),
3054
3104
  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
3055
3105
  /* @__PURE__ */ jsx("p", { className: "text-base text-gray-900", children: bookingData.customer_name }),
3056
3106
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-base text-gray-600", children: [
@@ -3108,13 +3158,13 @@ var BookingSuccess = ({
3108
3158
  {
3109
3159
  onClick: () => setShowCancelDialog(true),
3110
3160
  disabled: cancelLoading,
3111
- 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",
3161
+ 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",
3112
3162
  children: pageData.cancelAppointment
3113
3163
  }
3114
3164
  ),
3115
3165
  cancelError && /* @__PURE__ */ jsx("p", { className: "text-sm mt-2", style: { color: "#FF4D4D" }, children: cancelError })
3116
3166
  ] }),
3117
- showCancelDialog && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 px-4", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-[24px] max-w-[400px] p-8 shadow-xl relative", children: [
3167
+ showCancelDialog && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 px-4", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-[24px] max-w-[600px] p-8 shadow-xl relative", children: [
3118
3168
  /* @__PURE__ */ jsx(
3119
3169
  "button",
3120
3170
  {
@@ -3144,28 +3194,28 @@ var BookingSuccess = ({
3144
3194
  )
3145
3195
  }
3146
3196
  ),
3147
- /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsx("div", { className: "w-16 h-16 rounded-full bg-[#F59E0B] flex items-center justify-center", children: /* @__PURE__ */ jsx(
3197
+ /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-6", children: /* @__PURE__ */ jsx("div", { className: "w-16 h-16 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxs(
3148
3198
  "svg",
3149
3199
  {
3150
- width: "32",
3151
- height: "32",
3152
- viewBox: "0 0 32 32",
3153
- fill: "none",
3154
3200
  xmlns: "http://www.w3.org/2000/svg",
3155
- children: /* @__PURE__ */ jsx(
3156
- "path",
3157
- {
3158
- d: "M16 10V17M16 22H16.01",
3159
- stroke: "white",
3160
- strokeWidth: "3",
3161
- strokeLinecap: "round",
3162
- strokeLinejoin: "round"
3163
- }
3164
- )
3201
+ width: "48",
3202
+ height: "48",
3203
+ viewBox: "0 0 48 48",
3204
+ fill: "none",
3205
+ children: [
3206
+ /* @__PURE__ */ jsx("circle", { cx: "24", cy: "24", r: "21", fill: "#FFC24D" }),
3207
+ /* @__PURE__ */ jsx(
3208
+ "path",
3209
+ {
3210
+ 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",
3211
+ fill: "white"
3212
+ }
3213
+ )
3214
+ ]
3165
3215
  }
3166
3216
  ) }) }),
3167
3217
  /* @__PURE__ */ jsxs("div", { className: "text-center mb-8", children: [
3168
- /* @__PURE__ */ jsx("h3", { className: "text-[18px] font-semibold text-gray-900 mb-2", children: pageData.cancelDialog?.title }),
3218
+ /* @__PURE__ */ jsx("h3", { className: "text-[18px] text-gray-900 mb-2", children: pageData.cancelDialog?.title }),
3169
3219
  /* @__PURE__ */ jsx("p", { className: "text-[14px] text-gray-600", children: pageData.cancelDialog?.description })
3170
3220
  ] }),
3171
3221
  /* @__PURE__ */ jsxs("div", { className: "flex gap-3 justify-center", children: [
@@ -3174,7 +3224,7 @@ var BookingSuccess = ({
3174
3224
  {
3175
3225
  onClick: () => setShowCancelDialog(false),
3176
3226
  disabled: cancelLoading,
3177
- 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]",
3227
+ 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]",
3178
3228
  children: pageData.cancelDialog?.backButton
3179
3229
  }
3180
3230
  ),
@@ -3183,7 +3233,7 @@ var BookingSuccess = ({
3183
3233
  {
3184
3234
  onClick: handleCancelAppointment,
3185
3235
  disabled: cancelLoading,
3186
- 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",
3236
+ 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",
3187
3237
  children: cancelLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
3188
3238
  /* @__PURE__ */ jsxs(
3189
3239
  "svg",