From 69d6b817e34643633f508142441253294c0f38f2 Mon Sep 17 00:00:00 2001
From: mortezaei <mortezaei2324@gmail.com>
Date: Thu, 27 Aug 2026 12:24:21 +0330
Subject: [PATCH] fix image

---
 public/assets/images/home-Checkups-List.svg   |   4 +-
 .../candidate-contact-client.tsx              |   6 +-
 .../finding-match/finding-match-client.tsx    |   8 +-
 src/app/globals.css                           |  14 +-
 src/app/intro/intro-client.tsx                |   4 +-
 src/app/new-match/new-match-client.tsx        |   2 +-
 .../[slug]/question-detail-client.tsx         |   4 +-
 .../request-accepted-client.tsx               | 155 +++++++++++-------
 src/app/request-sent/request-sent-client.tsx  |   4 +-
 .../Componentes/advisor-actions-card.tsx      |   2 +-
 .../Componentes/call-result-sheet.tsx         |   2 +-
 src/components/Componentes/currency-sheet.tsx |   2 +-
 .../Componentes/dismiss-reason-sheet.tsx      |   2 +-
 .../Componentes/female-consent-sheet.tsx      |   2 +-
 .../Componentes/female-outcome-sheet.tsx      |   2 +-
 src/components/Componentes/fix-to-the-end.tsx |   2 +-
 src/components/Componentes/help-modal.tsx     |   2 +-
 .../Componentes/information-sheet.tsx         |   2 +-
 .../Componentes/outcome-selection-sheet.tsx   |   2 +-
 src/components/Componentes/page-header.tsx    |  10 +-
 .../Componentes/question-birthplace.tsx       |   2 +-
 .../Componentes/question-date-sheet.tsx       |   2 +-
 src/components/Componentes/question-phone.tsx |   2 +-
 src/components/Componentes/question-sheet.tsx |   2 +-
 .../Componentes/report-actions-sheet.tsx      |   2 +-
 .../Componentes/required-steps-card.tsx       |   2 +-
 src/components/Componentes/slider-page.tsx    |   4 +-
 src/components/Componentes/support-sheet.tsx  |   2 +-
 src/icons.tsx                                 |   1 +
 29 files changed, 151 insertions(+), 99 deletions(-)

diff --git a/public/assets/images/home-Checkups-List.svg b/public/assets/images/home-Checkups-List.svg
index 4c90975..9cb570e 100644
--- a/public/assets/images/home-Checkups-List.svg
+++ b/public/assets/images/home-Checkups-List.svg
@@ -1,6 +1,6 @@
 <svg width="375" height="813" viewBox="0 0 375 813" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 <g clip-path="url(#clip0_2035_16047)">
-<rect width="375" height="813" rx="20" fill="#F5F5F5"/>
+<rect width="375" height="813" fill="#F5F5F5"/>
 <rect width="375" height="375" fill="url(#pattern0_2035_16047)" fill-opacity="0.15"/>
 <g clip-path="url(#clip1_2035_16047)">
 <rect width="375" height="26.4128" fill="#F5F5F5"/>
@@ -39,7 +39,7 @@
 <use xlink:href="#image0_2035_16047" transform="scale(0.000694444)"/>
 </pattern>
 <clipPath id="clip0_2035_16047">
-<rect width="375" height="813" rx="20" fill="white"/>
+<rect width="375" height="813" fill="white"/>
 </clipPath>
 <clipPath id="clip1_2035_16047">
 <rect width="375" height="26.4128" fill="white"/>
diff --git a/src/app/candidate-contact/candidate-contact-client.tsx b/src/app/candidate-contact/candidate-contact-client.tsx
index c3b56b2..62c850e 100644
--- a/src/app/candidate-contact/candidate-contact-client.tsx
+++ b/src/app/candidate-contact/candidate-contact-client.tsx
@@ -284,10 +284,10 @@ export default function CandidateContactClient() {
               />
 
               {/* Profile Locked banner */}
-              <section className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full sm:max-w-[375px] -translate-x-1/2 bg-[#F5F5F5]">
+              <section className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full max-w-[834px] -translate-x-1/2 bg-[#F5F5F5]">
                 <div
                   style={{ paddingBottom: "calc(20px + var(--safe-bottom))" }}
-                  className="pointer-events-auto px-[17px] pt-3"
+                  className="pointer-events-auto px-[17px] md:px-8 pt-3"
                 >
                   <div className="flex items-center justify-center w-full gap-1 rounded-[11px] bg-[#DBDBDB] py-3.5">
                     <Image
@@ -374,7 +374,7 @@ export default function CandidateContactClient() {
 
         <section
           style={{ paddingBottom: `calc(2rem + var(--safe-bottom))` }}
-          className="fixed right-0 bottom-0 left-0 z-20 mx-auto flex w-full sm:max-w-[375px] gap-3 rounded-t-[30px] bg-white px-[17px] pt-6 shadow-[0_-18px_50px_rgba(15,23,42,0.08)]"
+          className="fixed right-0 bottom-0 left-0 z-20 mx-auto flex w-full max-w-[834px] gap-3 rounded-t-[30px] bg-white px-[17px] md:px-8 pt-6 shadow-[0_-18px_50px_rgba(15,23,42,0.08)]"
         >
           <button
             type="button"
diff --git a/src/app/finding-match/finding-match-client.tsx b/src/app/finding-match/finding-match-client.tsx
index 9a28419..6a619a6 100644
--- a/src/app/finding-match/finding-match-client.tsx
+++ b/src/app/finding-match/finding-match-client.tsx
@@ -111,11 +111,11 @@ export default function FindingMatchClient() {
       />
 
       <main
-        style={{ paddingBottom: "calc(100px + var(--safe-bottom))" }}
-        className="flex min-h-0 flex-1 flex-col text-center page-slide-enter"
+        style={{ paddingBottom: "calc(80px + var(--safe-bottom))" }}
+        className="flex min-h-0 flex-1 flex-col justify-between text-center page-slide-enter"
       >
 
-        <section className="mt-20 flex flex-1 flex-col items-center px-[23px]">
+        <section className="mt-6 flex flex-1 flex-col items-center px-[23px]">
           <div className="relative h-[124px] w-[130px]" aria-hidden="true">
             <Image
               src={matchImageSrc}
@@ -126,7 +126,7 @@ export default function FindingMatchClient() {
               priority
             />
           </div>
-          <h1 className="mt-5 group-16 font-bold leading-none tracking-[0.02em] text-[#171717] uppercase">
+          <h1 className="mt-4 group-16 font-bold leading-none tracking-[0.02em] text-[#171717] uppercase">
             {copy.title}
           </h1>
           <p className="mt-3 max-w-[320px] mx-auto text-center group-12 leading-[1.35] font-semibold text-[#747474]">
diff --git a/src/app/globals.css b/src/app/globals.css
index c5abd06..d117f4a 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -219,10 +219,13 @@ html:lang(ar) body,
 }
 
 .app-shell {
+  --app-shell-px: 17px;
   width: 100%;
+  max-width: 834px;
+  margin-inline: auto;
   height: 100%;
   height: 100dvh;
-  padding-inline: 17px;
+  padding-inline: var(--app-shell-px);
   padding-bottom: var(--safe-bottom, 0px);
   box-sizing: border-box;
   overflow-x: hidden;
@@ -237,9 +240,9 @@ html:lang(ar) body,
   -webkit-overflow-scrolling: touch;
 }
 
-@media (min-width: 640px) {
+@media (min-width: 600px) {
   .app-shell {
-    width: 375px;
+    --app-shell-px: clamp(24px, 5vw, 48px);
   }
 }
 
@@ -332,6 +335,7 @@ body.section-overlay-open .app-shell {
   inset-inline: 0;
   margin-inline: auto;
   width: 100%;
+  max-width: 834px;
   height: 100%;
   height: 100dvh;
   z-index: 50;
@@ -357,9 +361,9 @@ body.section-overlay-open .app-shell {
   contain: paint layout;
 }
 
-@media (min-width: 640px) {
+@media (min-width: 600px) {
   .section-overlay {
-    width: 375px;
+    padding-inline: clamp(24px, 5vw, 48px);
   }
 }
 
diff --git a/src/app/intro/intro-client.tsx b/src/app/intro/intro-client.tsx
index f1d794e..3844f63 100644
--- a/src/app/intro/intro-client.tsx
+++ b/src/app/intro/intro-client.tsx
@@ -225,10 +225,10 @@ export default function IntroClient() {
               />
             </>
           )}
-          <div className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full sm:max-w-[375px] -translate-x-1/2 bg-[#F5F5F5]">
+          <div className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full max-w-[834px] -translate-x-1/2 bg-[#F5F5F5]">
             <div
               style={{ paddingBottom: "calc(20px + var(--safe-bottom))" }}
-              className="pointer-events-auto px-[17px] pt-3"
+              className="pointer-events-auto px-[17px] md:px-8 pt-3"
             >
               <Button
                 onClick={handleSubmit}
diff --git a/src/app/new-match/new-match-client.tsx b/src/app/new-match/new-match-client.tsx
index 299f9d7..23f8ec8 100644
--- a/src/app/new-match/new-match-client.tsx
+++ b/src/app/new-match/new-match-client.tsx
@@ -929,7 +929,7 @@ export default function NewMatchClient() {
       {profile?.can_edit_profile === false && (
         <div
           style={{ paddingBottom: `${16 + bottom}px` }}
-          className="fixed inset-x-0 bottom-0 z-20 mx-auto w-full sm:max-w-[375px] bg-[#F9F8F8] px-[17px] pt-3 pb-[16px]"
+          className="fixed inset-x-0 bottom-0 z-20 mx-auto w-full max-w-[834px] bg-[#F9F8F8] px-[17px] md:px-8 pt-3 pb-[16px]"
         >
           <div
             className="inline-flex w-full items-center justify-center gap-2 rounded-[9px] border-none bg-[#D1D1D6] px-4 h-[52px] text-center text-[#747474] shadow-none"
diff --git a/src/app/questions-list/[slug]/question-detail-client.tsx b/src/app/questions-list/[slug]/question-detail-client.tsx
index 0e5f2aa..49bf376 100644
--- a/src/app/questions-list/[slug]/question-detail-client.tsx
+++ b/src/app/questions-list/[slug]/question-detail-client.tsx
@@ -819,7 +819,7 @@ export default function QuestionDetailClient({
             </div>
           </StickyHeader>
 
-          <div className="mx-auto flex w-full max-w-md flex-1 flex-col px-[17px] pt-3 min-h-0">
+          <div className="mx-auto flex w-full max-w-[834px] flex-1 flex-col px-[17px] md:px-8 pt-3 min-h-0">
             <TestIntroPage
               title={item.title}
               estimateTime={item.estimate}
@@ -1008,7 +1008,7 @@ export default function QuestionDetailClient({
             </div>
           </StickyHeader>
 
-          <div className="mx-auto flex w-full max-w-md flex-1 flex-col px-[17px] pt-3 min-h-0">
+          <div className="mx-auto flex w-full max-w-[834px] flex-1 flex-col px-[17px] md:px-8 pt-3 min-h-0">
             <QuestionFlowWrapper
               questions={item.questions}
               itemSlug={item.slug}
diff --git a/src/app/request-accepted/request-accepted-client.tsx b/src/app/request-accepted/request-accepted-client.tsx
index df8dc9e..a5a85cc 100644
--- a/src/app/request-accepted/request-accepted-client.tsx
+++ b/src/app/request-accepted/request-accepted-client.tsx
@@ -39,6 +39,8 @@ import {
 } from "@/hooks/marriage/use-habcoin-payment";
 import { useMarriageProfileQuery } from "@/hooks/marriage/use-profile-main";
 import { getSubmitPath } from "@/lib/get-submit-path";
+import { copyToClipboard } from "@/lib/webview-actions";
+import { Ic } from "@/icons";
 import { localizePath } from "@/translations/config";
 import { useI18n } from "@/translations/provider";
 
@@ -96,28 +98,79 @@ function isMarriagePhoneFieldValue(
 }
 
 function getContactInfoPhoneItems(
-  contactInfoFields: MarriageField[] | null | undefined,
+  contactInfoFields: any[] | null | undefined,
 ): ContactInfoPhoneItem[] {
-  if (!contactInfoFields) {
+  if (!contactInfoFields || !Array.isArray(contactInfoFields)) {
     return [];
   }
 
+  // Look for contextual representative info if available
+  const repNameField = contactInfoFields.find(
+    (f) =>
+      typeof f?.key === "string" &&
+      f.key.toLowerCase().includes("representative_s_full_name") &&
+      f.value,
+  );
+  const repRelationField = contactInfoFields.find(
+    (f) =>
+      typeof f?.key === "string" &&
+      f.key.toLowerCase().includes("relationship_to_representative") &&
+      f.value,
+  );
+
+  const repName = repNameField?.value ? String(repNameField.value).trim() : "";
+  const repRelation = repRelationField?.value
+    ? String(repRelationField.value).trim()
+    : "";
+
   return contactInfoFields
     .map((field) => {
-      const phoneNumber = sanitizePhoneNumber(field.value);
+      if (!field) return null;
+
+      // Extract phone number from field properties
+      let phoneNumber: string | null = null;
+
+      if (field.phone_number && typeof field.phone_number === "string") {
+        phoneNumber = field.phone_number.trim();
+      } else if (field.raw_number && typeof field.raw_number === "string") {
+        const countryCode = field.country_code
+          ? String(field.country_code).replace(/\D/g, "")
+          : "98";
+        phoneNumber = `+${countryCode} ${field.raw_number.trim()}`;
+      } else if (field.raw_value && typeof field.raw_value === "object") {
+        phoneNumber = sanitizePhoneNumber(field.raw_value);
+      } else if (field.value) {
+        phoneNumber = sanitizePhoneNumber(field.value);
+      }
 
-      if (!phoneNumber) {
+      // If this field is not a phone field, skip it
+      if (
+        !phoneNumber ||
+        (field.type &&
+          field.type !== "phone" &&
+          !field.phone_number &&
+          !field.raw_number)
+      ) {
         return null;
       }
 
-      const rawLabel = field.label || field.key;
-      const label = rawLabel
+      const key = String(field.key || "");
+      const rawLabel = String(field.label || field.key || "");
+      let label = rawLabel
         .replace(/\s+with\s+Country\s+Code/gi, "")
         .replace(/\s+با\s+کد\s+کشور/g, "")
         .trim();
 
+      // Add representative context to label if applicable
+      if (key.includes("representative")) {
+        const contextParts = [repRelation, repName].filter(Boolean);
+        if (contextParts.length > 0 && !label.includes(contextParts[0])) {
+          label = `${label} (${contextParts.join(" - ")})`;
+        }
+      }
+
       return {
-        key: field.key,
+        key: key || phoneNumber,
         label,
         phoneNumber,
       };
@@ -126,54 +179,44 @@ function getContactInfoPhoneItems(
 }
 
 function ContactInfoPhoneCard({ item }: { item: ContactInfoPhoneItem }) {
+  const [isCopied, setIsCopied] = useState(false);
+
+  const handleCopy = async () => {
+    try {
+      await copyToClipboard(item.phoneNumber, item.label);
+      setIsCopied(true);
+      setTimeout(() => {
+        setIsCopied(false);
+      }, 1500);
+    } catch (err) {
+      console.error("Error copying contact to clipboard", err);
+    }
+  };
+
   return (
-    <div className="flex items-center justify-between rounded-[15px] border border-[#E4E4E4] bg-[#FBFBFB] px-4 py-3.5 shadow-[0_4px_12px_rgba(0,0,0,0.03)] gap-4">
-      <div className="text-left min-w-0">
-        <p className="text-xs font-semibold text-[#8F8F8F] break-words">
-          {item.label}
-        </p>
-        <p className="text-base font-bold text-[#1F1F1F] dir-ltr">
+    <div className="flex items-center justify-between rounded-[20px] bg-[#FFF5F6] border border-[#FFE4E8] px-5 py-4 shadow-sm transition-all hover:border-[#FFD0D8]">
+      <div className="text-start min-w-0 flex-1 pe-3">
+        <p className="text-[19px] font-black text-[#1F2937] tracking-wider dir-ltr text-start select-all leading-tight">
           {item.phoneNumber}
         </p>
+        <p className="mt-1 text-[13px] font-semibold text-[#F0445B] text-start truncate leading-snug">
+          {item.label}
+        </p>
       </div>
 
-      <div className="flex items-center gap-2 shrink-0">
-        <a
-          href={`tel:${item.phoneNumber}`}
-          onClick={(e) => {
-            if (typeof window !== "undefined" && "HabibApp" in window) {
-              e.preventDefault();
-              try {
-                const app = (
-                  window as Window & {
-                    HabibApp?: { postMessage: (msg: string) => void };
-                  }
-                ).HabibApp;
-                app?.postMessage(
-                  JSON.stringify({
-                    action: "open_external_url",
-                    data: {
-                      url: `tel:${item.phoneNumber}`,
-                      mode: "externalApplication",
-                      title: "phone_call",
-                    },
-                  }),
-                );
-              } catch (err) {
-                console.error("Error calling HabibApp bridge", err);
-              }
-            }
-          }}
-          className="inline-flex p-3 items-center justify-center rounded-[10px] bg-[#F0445B] text-white shrink-0"
-        >
-          <Image
-            src={"/assets/images/Vecfdastor.svg"}
-            width={16}
-            height={16}
-            alt="call"
-          />
-        </a>
-      </div>
+      <button
+        type="button"
+        onClick={handleCopy}
+        title="Copy"
+        aria-label="Copy phone number"
+        className="size-[44px] rounded-[14px] bg-[linear-gradient(180deg,#F0445B_0%,#F54B64_100%)] text-white flex items-center justify-center shrink-0 shadow-[0_4px_12px_rgba(240,68,91,0.25)] active:scale-[0.90] transition-all duration-150 cursor-pointer hover:opacity-95"
+      >
+        {isCopied ? (
+          <Ic name="check" className="size-5 text-white transition-transform scale-110" />
+        ) : (
+          <Ic name="copy" className="size-5 text-white" />
+        )}
+      </button>
     </div>
   );
 }
@@ -670,7 +713,7 @@ export default function RequestAcceptedClient() {
                       )}
                     </div>
                   ) : (
-                    <div className="flex mt-8 w-full justify-center gap-3.5 max-w-[360px] mx-auto">
+                    <div className="flex mt-8 w-full justify-center gap-3.5 max-w-md mx-auto">
                       {isFemaleProfile ? (
                         <button
                           type="button"
@@ -690,7 +733,7 @@ export default function RequestAcceptedClient() {
                       ) : (
                         <Link
                           href={profileHref}
-                          className="flex-1 max-w-[170px]"
+                          className="flex-1"
                         >
                           <div className="w-full min-h-[48px] px-3.5 py-2.5 rounded-[14px] border border-[#E2E8F0] bg-white/95 backdrop-blur-sm text-[#475569] font-bold text-[14px] leading-tight shadow-sm flex items-center justify-center text-center whitespace-nowrap transition-all hover:bg-[#F8FAFC] active:scale-[0.98]">
                             {primaryActionText}
@@ -713,7 +756,7 @@ export default function RequestAcceptedClient() {
                         className={
                           isFemaleProfile
                             ? "flex-1 min-h-[48px] px-3.5 py-2.5 rounded-[14px] bg-gradient-to-r from-[#FF6687] to-[#FF456C] text-white font-bold text-[13.5px] leading-tight flex items-center justify-center text-center whitespace-nowrap shadow-sm transition-all duration-150 cursor-pointer hover:opacity-95 active:scale-[0.96] disabled:opacity-50 disabled:cursor-not-allowed"
-                            : "flex-1 max-w-[170px] min-h-[48px] appearance-none border-0 bg-transparent p-0 text-center cursor-pointer transition-transform duration-150 active:scale-[0.96] disabled:opacity-50 disabled:cursor-not-allowed"
+                            : "flex-1 min-h-[48px] appearance-none border-0 bg-transparent p-0 text-center cursor-pointer transition-transform duration-150 active:scale-[0.96] disabled:opacity-50 disabled:cursor-not-allowed"
                         }
                       >
                         {isFemaleProfile ? (
@@ -743,7 +786,7 @@ export default function RequestAcceptedClient() {
                   !isFemaleContactConfirmed &&
                   !noContactReportedSuccess &&
                   !(isFemaleProfile && contactStatusMutation.isPending) ? (
-                    <div className="border border-[#FDA4AF]/60 bg-[#FFF1F2]/80 backdrop-blur-sm rounded-[16px] mt-6 p-4 max-w-[360px] shadow-sm">
+                    <div className="border border-[#FDA4AF]/60 bg-[#FFF1F2]/80 backdrop-blur-sm rounded-[16px] mt-6 p-4 max-w-md mx-auto shadow-sm">
                       <p className="text-[#BE123C] text-[12px] font-medium leading-[1.65] whitespace-pre-line text-justify">
                         {
                           t[
@@ -773,10 +816,10 @@ export default function RequestAcceptedClient() {
               onGetAdvisor={openAdvisors}
             />
 
-            <section className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full sm:max-w-[375px] -translate-x-1/2 bg-[#F5F5F5]">
+            <section className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full max-w-[834px] -translate-x-1/2 bg-[#F5F5F5]">
               <div
                 style={{ paddingBottom: "calc(20px + var(--safe-bottom))" }}
-                className="pointer-events-auto px-[17px] pt-3"
+                className="pointer-events-auto px-[17px] md:px-8 pt-3"
               >
                 <div className="flex items-center justify-center w-full gap-1 rounded-[11px] bg-[#DBDBDB] py-3.5">
                   <Image
diff --git a/src/app/request-sent/request-sent-client.tsx b/src/app/request-sent/request-sent-client.tsx
index b22b40b..bebdbf2 100644
--- a/src/app/request-sent/request-sent-client.tsx
+++ b/src/app/request-sent/request-sent-client.tsx
@@ -142,10 +142,10 @@ export default function RequestSentClient() {
               onGetAdvisor={openAdvisors}
             />
 
-            <section className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full sm:max-w-[375px] -translate-x-1/2 bg-[#F5F5F5]">
+            <section className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full max-w-[834px] -translate-x-1/2 bg-[#F5F5F5]">
               <div
                 style={{ paddingBottom: "calc(20px + var(--safe-bottom))" }}
-                className="pointer-events-auto px-[17px] pt-3"
+                className="pointer-events-auto px-[17px] md:px-8 pt-3"
               >
                 <div className="flex items-center justify-center w-full gap-1 rounded-[11px] bg-[#DBDBDB] py-3.5">
                   <Image
diff --git a/src/components/Componentes/advisor-actions-card.tsx b/src/components/Componentes/advisor-actions-card.tsx
index ed00b0f..333e796 100644
--- a/src/components/Componentes/advisor-actions-card.tsx
+++ b/src/components/Componentes/advisor-actions-card.tsx
@@ -61,7 +61,7 @@ export function AdvisorActionsCard({
         <h2 className="text-[13.5px] leading-tight font-bold text-[#1C1C1C]">
           {title}
         </h2>
-        <p className="mt-1.5 max-w-[280px] text-[10.5px] leading-[1.4] font-medium text-[#8A8A8A]">
+        <p className="mt-1.5 max-w-md text-[10.5px] leading-[1.4] font-medium text-[#8A8A8A]">
           {description}
         </p>
 
diff --git a/src/components/Componentes/call-result-sheet.tsx b/src/components/Componentes/call-result-sheet.tsx
index bdb7065..1733c09 100644
--- a/src/components/Componentes/call-result-sheet.tsx
+++ b/src/components/Componentes/call-result-sheet.tsx
@@ -117,7 +117,7 @@ export function CallResultSheet({
       <section
         {...props}
         className={[
-          "w-full sm:max-w-[375px] rounded-t-[22px] bg-white p-3.5 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
+          "w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white p-3.5 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
           className,
         ]
diff --git a/src/components/Componentes/currency-sheet.tsx b/src/components/Componentes/currency-sheet.tsx
index 766d83f..e9bc5a1 100644
--- a/src/components/Componentes/currency-sheet.tsx
+++ b/src/components/Componentes/currency-sheet.tsx
@@ -143,7 +143,7 @@ export function CurrencySheet({
       <section
         ref={sheetRef}
         className={[
-          "flex w-full flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.16)] sm:max-w-[420px] h-[82svh] min-h-[82svh] max-h-[82svh]",
+          "flex w-full flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.16)] max-w-[834px] sm:max-w-[540px] h-[82svh] min-h-[82svh] max-h-[82svh]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
         ].join(" ")}
       >
diff --git a/src/components/Componentes/dismiss-reason-sheet.tsx b/src/components/Componentes/dismiss-reason-sheet.tsx
index 3defaad..789ad7f 100644
--- a/src/components/Componentes/dismiss-reason-sheet.tsx
+++ b/src/components/Componentes/dismiss-reason-sheet.tsx
@@ -132,7 +132,7 @@ export function DismissReasonSheet({
       <section
         {...props}
         className={[
-          "flex h-[80vh] w-full flex-col overflow-hidden rounded-t-[22px] bg-white p-3.5 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)] sm:max-w-[375px]",
+          "flex h-[80vh] w-full max-w-[834px] sm:max-w-[540px] flex-col overflow-hidden rounded-t-[22px] bg-white p-3.5 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
           className,
         ]
diff --git a/src/components/Componentes/female-consent-sheet.tsx b/src/components/Componentes/female-consent-sheet.tsx
index a6319a3..9a0238e 100644
--- a/src/components/Componentes/female-consent-sheet.tsx
+++ b/src/components/Componentes/female-consent-sheet.tsx
@@ -109,7 +109,7 @@ export function FemaleConsentSheet({
       <section
         {...props}
         className={[
-          "w-full sm:max-w-[375px] rounded-t-[22px] bg-white py-5 px-4 text-left shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
+          "w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white py-5 px-4 text-left shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
           className,
         ]
diff --git a/src/components/Componentes/female-outcome-sheet.tsx b/src/components/Componentes/female-outcome-sheet.tsx
index 041e556..ee698d2 100644
--- a/src/components/Componentes/female-outcome-sheet.tsx
+++ b/src/components/Componentes/female-outcome-sheet.tsx
@@ -135,7 +135,7 @@ export function FemaleOutcomeSheet({
     >
       <section
         className={[
-          "flex max-h-[85vh] w-full flex-col overflow-hidden rounded-t-[22px] bg-white p-4 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)] sm:max-w-[375px]",
+          "flex max-h-[85vh] w-full max-w-[834px] sm:max-w-[540px] flex-col overflow-hidden rounded-t-[22px] bg-white p-4 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
         ]
           .filter(Boolean)
diff --git a/src/components/Componentes/fix-to-the-end.tsx b/src/components/Componentes/fix-to-the-end.tsx
index 86ec978..2103239 100644
--- a/src/components/Componentes/fix-to-the-end.tsx
+++ b/src/components/Componentes/fix-to-the-end.tsx
@@ -12,7 +12,7 @@ export function FixToTheEnd({ children, className }: FixToTheEndProps) {
     <div
       style={{ paddingBottom: "calc(16px + var(--safe-bottom))" }}
       className={[
-        "question-fix-to-end fixed inset-x-0 bottom-0 z-20 mx-auto w-full sm:max-w-[375px] bg-[#F5F5F5]/95 px-[17px] pt-3 backdrop-blur-md",
+        "question-fix-to-end fixed inset-x-0 bottom-0 z-20 mx-auto w-full max-w-[834px] bg-[#F5F5F5]/95 px-[17px] md:px-8 pt-3 backdrop-blur-md",
         className,
       ]
         .filter(Boolean)
diff --git a/src/components/Componentes/help-modal.tsx b/src/components/Componentes/help-modal.tsx
index 9eb6767..23fa010 100644
--- a/src/components/Componentes/help-modal.tsx
+++ b/src/components/Componentes/help-modal.tsx
@@ -124,7 +124,7 @@ export function HelpModal({
     >
       <section
         className={[
-          "w-full sm:max-w-[375px] rounded-t-[22px] bg-white px-4 pb-5 pt-4 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
+          "w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white px-4 pb-5 pt-4 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
         ].join(" ")}
       >
diff --git a/src/components/Componentes/information-sheet.tsx b/src/components/Componentes/information-sheet.tsx
index bb590d3..e3af875 100644
--- a/src/components/Componentes/information-sheet.tsx
+++ b/src/components/Componentes/information-sheet.tsx
@@ -324,7 +324,7 @@ export function InformationSheet({
       <section
         {...props}
         className={[
-          "relative w-full sm:max-w-[375px] rounded-t-[22px] bg-white px-4 pt-4 pb-[max(24px,calc(24px+var(--safe-bottom)))] text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
+          "relative w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white px-4 pt-4 pb-[max(24px,calc(24px+var(--safe-bottom)))] text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
           className,
         ]
diff --git a/src/components/Componentes/outcome-selection-sheet.tsx b/src/components/Componentes/outcome-selection-sheet.tsx
index 80e0975..e207cef 100644
--- a/src/components/Componentes/outcome-selection-sheet.tsx
+++ b/src/components/Componentes/outcome-selection-sheet.tsx
@@ -111,7 +111,7 @@ export function OutcomeSelectionSheet({
       <section
         {...props}
         className={[
-          "w-full sm:max-w-[375px] rounded-t-[22px] bg-white p-3.5 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
+          "w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white p-3.5 text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
           className,
         ]
diff --git a/src/components/Componentes/page-header.tsx b/src/components/Componentes/page-header.tsx
index 0d9a643..dba551c 100644
--- a/src/components/Componentes/page-header.tsx
+++ b/src/components/Componentes/page-header.tsx
@@ -63,16 +63,20 @@ export function PageHeader({
 
   return (
     <header
+      style={sticky ? {
+        marginInline: "calc(-1 * var(--app-shell-px, 17px))",
+        paddingInline: "var(--app-shell-px, 17px)",
+      } : undefined}
       className={[
         sticky
-          ? "sticky top-0 z-30 -mx-[17px] px-[17px] bg-[#F5F5F5] bg-[url('/assets/images/home-Checkups-List.svg')] bg-top bg-no-repeat bg-cover pt-[max(12px,calc(var(--safe-top)+4px))]"
-          : "pb-3",
+          ? "sticky top-0 z-30 pt-[max(12px,calc(var(--safe-top)+6px))]"
+          : "pb-3 pt-[max(8px,calc(var(--safe-top)+4px))]",
         className,
       ]
         .filter(Boolean)
         .join(" ")}
     >
-      <div className="relative flex h-[56px] items-center justify-between">
+      <div className="relative flex h-[56px] w-full max-w-[834px] mx-auto items-center justify-between">
         {leftButton?.className?.includes("hidden") ? (
           <div className="size-10 shrink-0" />
         ) : (
diff --git a/src/components/Componentes/question-birthplace.tsx b/src/components/Componentes/question-birthplace.tsx
index e073c89..d821b2d 100644
--- a/src/components/Componentes/question-birthplace.tsx
+++ b/src/components/Componentes/question-birthplace.tsx
@@ -712,7 +712,7 @@ export function QuestionBirthplace({
           >
             <section
               className={[
-                "flex h-[82svh] min-h-[82svh] max-h-[82svh] w-full flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.12)] sm:max-w-[375px]",
+                "flex h-[82svh] min-h-[82svh] max-h-[82svh] w-full max-w-[834px] sm:max-w-[540px] flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.12)]",
                 isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
               ].join(" ")}
               onClick={(e) => e.stopPropagation()}
diff --git a/src/components/Componentes/question-date-sheet.tsx b/src/components/Componentes/question-date-sheet.tsx
index a434dc0..3486496 100644
--- a/src/components/Componentes/question-date-sheet.tsx
+++ b/src/components/Componentes/question-date-sheet.tsx
@@ -290,7 +290,7 @@ export function QuestionDateSheet({
     >
       <section
         className={[
-          "flex w-full flex-col overflow-hidden rounded-t-[22px] bg-white pb-[calc(16px+env(safe-area-inset-bottom))] shadow-[0_-10px_32px_rgba(0,0,0,0.12)] sm:max-w-[375px]",
+          "flex w-full max-w-[834px] sm:max-w-[540px] flex-col overflow-hidden rounded-t-[22px] bg-white pb-[calc(16px+env(safe-area-inset-bottom))] shadow-[0_-10px_32px_rgba(0,0,0,0.12)]",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
         ].join(" ")}
       >
diff --git a/src/components/Componentes/question-phone.tsx b/src/components/Componentes/question-phone.tsx
index d99ef6b..c1274ca 100644
--- a/src/components/Componentes/question-phone.tsx
+++ b/src/components/Componentes/question-phone.tsx
@@ -839,7 +839,7 @@ export function QuestionPhone({
           >
             <section
               className={[
-                "flex h-[82svh] min-h-[82svh] max-h-[82svh] w-full flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.12)] sm:max-w-[375px]",
+                "flex h-[82svh] min-h-[82svh] max-h-[82svh] w-full max-w-[834px] sm:max-w-[540px] flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.12)]",
                 isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
               ].join(" ")}
             >
diff --git a/src/components/Componentes/question-sheet.tsx b/src/components/Componentes/question-sheet.tsx
index 155c199..f589ad0 100644
--- a/src/components/Componentes/question-sheet.tsx
+++ b/src/components/Componentes/question-sheet.tsx
@@ -449,7 +449,7 @@ export function QuestionSheet({ question, disabled }: QuestionSheetProps) {
             <section
               ref={sheetRef}
               className={[
-                "flex w-full flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.12)] sm:max-w-[375px]",
+                "flex w-full max-w-[834px] sm:max-w-[540px] flex-col overflow-hidden rounded-t-[22px] bg-white pb-[env(safe-area-inset-bottom)] shadow-[0_-10px_32px_rgba(0,0,0,0.12)]",
                 !showSearch
                   ? "h-auto max-h-[82svh]"
                   : "h-[82svh] min-h-[82svh] max-h-[82svh]",
diff --git a/src/components/Componentes/report-actions-sheet.tsx b/src/components/Componentes/report-actions-sheet.tsx
index bd7b4b1..738fa3e 100644
--- a/src/components/Componentes/report-actions-sheet.tsx
+++ b/src/components/Componentes/report-actions-sheet.tsx
@@ -189,7 +189,7 @@ export function ReportActionsSheet({ onClose }: ReportActionsSheetProps) {
     >
       <section
         className={[
-          "w-full sm:max-w-[375px] rounded-t-[22px] bg-white shadow-[0_20px_60px_rgba(15,23,42,0.08)] max-h-[85vh] overflow-y-auto",
+          "w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white shadow-[0_20px_60px_rgba(15,23,42,0.08)] max-h-[85vh] overflow-y-auto",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
         ]
           .filter(Boolean)
diff --git a/src/components/Componentes/required-steps-card.tsx b/src/components/Componentes/required-steps-card.tsx
index 8775085..ba1de12 100644
--- a/src/components/Componentes/required-steps-card.tsx
+++ b/src/components/Componentes/required-steps-card.tsx
@@ -39,7 +39,7 @@ export default function RequiredStepsCard({
             </h2>
           </div>
 
-          <p className="mt-2.5 max-w-[220px] group-12 leading-[1.25] font-medium text-white/80">
+          <p className="mt-2.5 max-w-md group-12 leading-[1.25] font-medium text-white/80">
             {isCompleted
               ? t[
                   "You can now submit your request so we can start finding the right match for you"
diff --git a/src/components/Componentes/slider-page.tsx b/src/components/Componentes/slider-page.tsx
index c3ac3b8..46cc76e 100644
--- a/src/components/Componentes/slider-page.tsx
+++ b/src/components/Componentes/slider-page.tsx
@@ -220,10 +220,10 @@ export default function SliderPage({ onClose }: SliderPageProps = {}) {
         </div>
       </main>
 
-      <div className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full sm:max-w-[375px] -translate-x-1/2 bg-[#F5F5F5]">
+      <div className="pointer-events-none fixed bottom-0 left-1/2 z-20 w-full max-w-[834px] -translate-x-1/2 bg-[#F5F5F5]">
         <div
           style={{ paddingBottom: `calc(1rem + var(--safe-bottom))` }}
-          className="mx-auto w-full sm:max-w-[375px] px-[17px] pt-4"
+          className="mx-auto w-full max-w-[834px] px-[17px] md:px-8 pt-4"
         >
           <div className="pointer-events-auto">
             {activeSlide === 0 ? (
diff --git a/src/components/Componentes/support-sheet.tsx b/src/components/Componentes/support-sheet.tsx
index 2ef31c1..6a9115f 100644
--- a/src/components/Componentes/support-sheet.tsx
+++ b/src/components/Componentes/support-sheet.tsx
@@ -122,7 +122,7 @@ export function SupportSheet({ isOpen, onClose }: SupportSheetProps) {
     >
       <section
         className={[
-          "w-full sm:max-w-[375px] rounded-t-[22px] bg-white px-[14px] py-[14px] text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)] flex flex-col items-center",
+          "w-full max-w-[834px] sm:max-w-[540px] rounded-t-[22px] bg-white px-[14px] py-[14px] text-center shadow-[0_20px_60px_rgba(15,23,42,0.08)] flex flex-col items-center",
           isClosing ? "flutter-sheet-surface-exit" : "flutter-sheet-surface",
         ]
           .filter(Boolean)
diff --git a/src/icons.tsx b/src/icons.tsx
index 3223b8e..c6d6578 100644
--- a/src/icons.tsx
+++ b/src/icons.tsx
@@ -21,6 +21,7 @@ const PATHS: Record<string, string> = {
   plus: '<line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>',
   check: '<path d="m4 12.5 5 5L20 6.5"/>',
   checkmark: '<path d="m4 12.5 5 5L20 6.5"/>',
+  copy: '<rect width="13" height="13" x="9" y="9" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>',
   dots: '<circle cx="12" cy="5" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="12" cy="19" r="1.5"/>',
   moreVertical: '<circle cx="12" cy="5" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="12" cy="19" r="1.5"/>',
   moreHorizontal: '<circle cx="5" cy="12" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="19" cy="12" r="1.5"/>',