diff --git a/src/screens/PaymentResultScreen.tsx b/src/screens/PaymentResultScreen.tsx
index 64f0ba1..2a42c56 100644
--- a/src/screens/PaymentResultScreen.tsx
+++ b/src/screens/PaymentResultScreen.tsx
@@ -1,14 +1,12 @@
+import { asp as g } from "@asp/asp";
+import { BarnoinPayBackground } from "@components/BarnoinPayBackground";
 import BeasyLogoIcon from "@components/BeasyLogoIcon";
-import Button from "@components/Button";
-import BeasyDefaultBackgroundWrapper from "@components/backgrounds/BeasyDefaultBackground";
-import Box from "@components/bases/Box";
-import Text from "@components/bases/Text";
-import GoBackIconButton from "@components/GoBackIconButton";
+import * as Button from "@components/ButtonNew";
 import CheckIcon from "@components/icons/CheckIcon";
+import { AntDesign } from "@expo/vector-icons";
 import { LOG } from "@logger";
-import { CommonActions } from "@react-navigation/native";
-// import { Text } from "react-native";
-import { SafeAreaView, useSafeAreaInsets } from "react-native-safe-area-context";
+import { Text, View } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import type { MainStackScreenComponentProps } from "@/navigations/types";
 
 const log = LOG.extend("PaymentResultScreen");
@@ -20,122 +18,109 @@ const PaymentResultScreen: MainStackScreenComponentProps<"paymentResultScreen"> 
 	const insets = useSafeAreaInsets();
 	log.debug("insets", insets);
 	return (
-		<BeasyDefaultBackgroundWrapper>
-			<SafeAreaView edges={["top", "left", "right"]}>
-				<Box
-					style={{
-						height: "100%",
-						width: "100%",
-						// marginTop: insets.top,
-					}}
+		<BarnoinPayBackground style={[g.gap_lg]}>
+			<View style={[g.px_lg, g.flex_row, g.align_center, g.justify_between]}>
+				<BeasyLogoIcon />
+				<AntDesign
+					name="arrowleft"
+					size={24}
+					color="black"
+					onPress={() => navigation.goBack()}
+				/>
+			</View>
+			<View style={[g.flex_1]}>
+				<View
+					style={[
+						g.flex_1,
+						g.gap_lg,
+						g.p_lg,
+						{
+							backgroundColor: "white",
+							borderTopLeftRadius: 20,
+							borderTopRightRadius: 20,
+						},
+					]}
 				>
-					<Box
-						px={"l"}
-						flexDirection={"row"}
-						justifyContent={"space-between"}
-						alignItems={"center"}
-						mb={"m"}
-					>
-						<BeasyLogoIcon />
-						<GoBackIconButton
-							onPress={() => {
-								navigation.dispatch(
-									CommonActions.reset({
-										index: 1,
-										routes: [{ name: "appBottomTabsNavigator" }],
-									}),
-								);
-							}}
-						/>
-					</Box>
-					<Box
-						flex={1}
-						backgroundColor={"white"}
-						borderRadius={20}
-						p={"l"}
-						flexDirection={"column"}
-						gap={"l"}
-					>
-						<Box alignItems={"center"}>
-							<CheckIcon />
-						</Box>
-						<Text variant={"secondary"} fontWeight={"bold"} textAlign={"center"}>
-							Transactions effectué avec succès !
-						</Text>
-						<Button
-							width={200}
-							alignSelf={"center"}
-							variant={"full"}
-							textVariants={"white"}
-							label={"Imprimer le réçu"}
-							onPress={() => {}}
-						/>
-						<Box backgroundColor={"lightGray"} flex={1} borderRadius={20} p={"l"}>
-							<Box
-								flexDirection={"row"}
-								justifyContent={"space-between"}
-								borderBottomColor={"gray"}
-								borderBottomWidth={1}
-								py={"m"}
-							>
-								<Text fontWeight={"bold"}>Caisse</Text>
-								<Text variant={"black"}>00147C</Text>
-							</Box>
-							<Box
-								flexDirection={"row"}
-								justifyContent={"space-between"}
-								borderBottomColor={"gray"}
-								borderBottomWidth={1}
-								py={"m"}
-							>
-								<Text fontWeight={"bold"}>Reference</Text>
-								<Text variant={"black"}>CP...</Text>
-							</Box>
-							<Box
-								flexDirection={"row"}
-								justifyContent={"space-between"}
-								borderBottomColor={"gray"}
-								borderBottomWidth={1}
-								py={"m"}
-							>
-								<Text fontWeight={"bold"}>Mode de paiement</Text>
-								<Text variant={"black"}>Orange</Text>
-							</Box>
-							<Box
-								flexDirection={"row"}
-								justifyContent={"space-between"}
-								borderBottomColor={"gray"}
-								borderBottomWidth={1}
-								py={"m"}
-							>
-								<Text fontWeight={"bold"}>Infos client</Text>
-								<Text variant={"black"}>Dogeless Miso</Text>
-							</Box>
-							<Box
-								flexDirection={"row"}
-								justifyContent={"space-between"}
-								borderBottomColor={"gray"}
-								borderBottomWidth={1}
-								py={"m"}
-							>
-								<Text fontWeight={"bold"}>Montant</Text>
-								<Text variant={"black"}>10</Text>
-							</Box>
-							<Box
-								flexDirection={"row"}
-								justifyContent={"space-between"}
-								borderBottomColor={"gray"}
-								borderBottomWidth={1}
-								py={"m"}
-							>
-								<Text fontWeight={"bold"}>N° Client</Text>
-								<Text variant={"black"}>Dogeless Misso</Text>
-							</Box>
-						</Box>
-					</Box>
-				</Box>
-			</SafeAreaView>
-		</BeasyDefaultBackgroundWrapper>
+					<View style={[g.self_center]}>
+						<CheckIcon />
+					</View>
+					<Text style={[g.text_center]}>Transactions effectué avec succès !</Text>
+
+					<Button.Container style={[g.self_center, { width: 200 }]}>
+						<Button.Label>Imprimer le réçu</Button.Label>
+					</Button.Container>
+
+					<View style={[g.rounded_lg, g.p_lg, { backgroundColor: "#eeeef1ff" }]}>
+						<View
+							style={[
+								g.flex_row,
+								g.justify_between,
+								g.p_md,
+								{ borderBottomColor: "#000", borderBottomWidth: 1 },
+							]}
+						>
+							<Text style={[g.font_bold]}>Caisse</Text>
+							<Text>00147C</Text>
+						</View>
+						<View
+							style={[
+								g.flex_row,
+								g.justify_between,
+								g.p_md,
+								{ borderBottomColor: "#000", borderBottomWidth: 1 },
+							]}
+						>
+							<Text style={[g.font_bold]}>Reference</Text>
+							<Text>CP...</Text>
+						</View>
+						<View
+							style={[
+								g.flex_row,
+								g.justify_between,
+								g.p_md,
+								{ borderBottomColor: "#000", borderBottomWidth: 1 },
+							]}
+						>
+							<Text style={[g.font_bold]}>Mode de paiement</Text>
+							<Text>Orange</Text>
+						</View>
+						<View
+							style={[
+								g.flex_row,
+								g.justify_between,
+								g.p_md,
+								{ borderBottomColor: "#000", borderBottomWidth: 1 },
+							]}
+						>
+							<Text style={[g.font_bold]}>Infos client</Text>
+							<Text>Dogeless Miso</Text>
+						</View>
+						<View
+							style={[
+								g.flex_row,
+								g.justify_between,
+								g.p_md,
+								{ borderBottomColor: "#000", borderBottomWidth: 1 },
+							]}
+						>
+							<Text style={[g.font_bold]}>Montant</Text>
+							<Text>10</Text>
+						</View>
+						<View
+							style={[
+								g.flex_row,
+								g.justify_between,
+								g.p_md,
+								{ borderBottomColor: "#000" },
+							]}
+						>
+							<Text style={[g.font_bold]}>N° Client</Text>
+							<Text>Dogeless Misso</Text>
+						</View>
+					</View>
+				</View>
+			</View>
+		</BarnoinPayBackground>
 	);
 };