fix styling

Signed-off-by: Aabid Sofi <mailtoaabid01@gmail.com>

Author: aabidsofi19

src/components/CookieConsent/index.js

@@ -10,6 +10,15 @@ import {
 
 
 import Button from "../../reusecore/Button";
+import styled from "styled-components";
+
+const StyledContainer = styled.div`
+   .paper-container {
+   background-color: ${props => props.theme.elevationColor};
+   color: ${props => props.theme.text};
+   }
+`
+
 
 const CookieConsent = () => {
     const [open, setOpen] = useState(false);
@@ -31,47 +40,47 @@ const CookieConsent = () => {
             open={open}
             anchorOrigin={{ vertical: "bottom", horizontal: "center" }}
         >
-            <Paper
-                elevation={6}
-                sx={{
-                    p: 2,
-                    maxWidth: 420,
-                    borderRadius: 2,
-                }}
-            >
-                <Stack spacing={2}>
-                    <Typography variant="body1" fontWeight="500">
-                        🍪 We value your privacy
-                    </Typography>
-                    <Typography variant="body2" color="text.secondary">
-                        We use cookies to enhance your browsing experience. By clicking
-                        "Accept", you consent to our use of cookies. Read more in our{" "}
-                        <a href="/company/legal/privacy" target="_blank" rel="noopener noreferrer">
-                            Privacy Policy
-                        </a>
-                        .
-                    </Typography>
+            <StyledContainer>
+                <Paper
+                    elevation={6}
+                    sx={{
+                        p: 2,
+                        maxWidth: 620,
+                        borderRadius: 2,
+                    }}
+                    className="paper-container"
+                >
+                    <Stack spacing={2}>
+                        <Typography variant="body2" >
+                            We use cookies to enhance your browsing experience. By clicking
+                            "Accept", you consent to our use of cookies. Read more in our{" "}
+                            <a href="/company/legal/privacy" target="_blank" rel="noopener noreferrer">
+                                Privacy Policy
+                            </a>
+                            .
+                        </Typography>
 
-                    <Box display="flex" justifyContent="flex-end" gap={1}>
-                        <Button
-                            variant="outlined"
-                            size="small"
-                            $outlined
-                            onClick={() => handleResponse("declined")}
-                        >
-                            Decline
-                        </Button>
-                        <Button
-                            variant="contained"
-                            size="small"
-                            $secondary
-                            onClick={() => handleResponse("accepted")}
-                        >
-                            Accept
-                        </Button>
-                    </Box>
-                </Stack>
-            </Paper>
+                        <Box display="flex" justifyContent="flex-end" gap={1}>
+                            <Button
+                                variant="outlined"
+                                size="small"
+                                $outlined
+                                onClick={() => handleResponse("declined")}
+                            >
+                                Decline
+                            </Button>
+                            <Button
+                                variant="contained"
+                                size="small"
+                                $secondary
+                                onClick={() => handleResponse("accepted")}
+                            >
+                                Accept
+                            </Button>
+                        </Box>
+                    </Stack>
+                </Paper>
+            </StyledContainer>
         </Snackbar>
     );
 };

src/reusecore/Button/btn.style.js

@@ -37,8 +37,8 @@ const ButtonStyle = styled.button`
 
     ${props => props.$outlined && css`
         background: transparent;
-        border: 2px solid ${props => props.theme.blackFourToWhiteFour};
-        color: ${props => props.theme.blackToWhite};
+        border: 2px solid ${props => props.theme.whiteToBlack};
+        color: ${props => props.theme.whiteToBlack};
         &:hover{
             box-shadow: 0 2px 10px ${props.theme.whiteFourToBlackFour};
         }