diff --git a/pages/bluedialog/bluedialog.page.tsx b/pages/bluedialog/bluedialog.page.tsx
index 6dd7181eea0..1045d2d7640 100644
--- a/pages/bluedialog/bluedialog.page.tsx
+++ b/pages/bluedialog/bluedialog.page.tsx
@@ -19,7 +19,6 @@ import {
 import styles from './styles.scss';
 
 export default function Bluedialogbox() {
-  const [showDialog, setShowDialog] = React.useState(true);
   // Inputs
   const [dateValue, setDateValue] = React.useState('');
   const [amountValue, setAmountValue] = React.useState('0');
@@ -30,16 +29,22 @@ export default function Bluedialogbox() {
     console.log({ dateValue, amountValue, descriptionValue, selectedService });
   }
   function skipDialog() {
-    setShowDialog(false);
+    console.log('skip dialog');
   }
 
-  return showDialog ? (
-    <div className={styles['blue-dialog-box']}>
+  return (
+    <div
+      className={styles['blue-dialog-box']}
+      role={'dialog'}
+      aria-labelledby="dialog-box"
+      aria-modal="true"
+      tabIndex={-1}
+    >
       <Form
         header={
-          <div className={styles['blue-dialog-box__header']}>
+          <div className={styles['blue-dialog-box__header']} id={'dialog-title'}>
             <Header variant="h1">Dialog header</Header>
-            <Button iconName="close" variant="icon" onClick={skipDialog} />
+            <Button iconName="close" variant="icon" onClick={skipDialog} aria-label="Close dialog" />
           </div>
         }
       >
@@ -53,10 +58,15 @@ export default function Bluedialogbox() {
                   'Choose certificate expiry date' + (selectedDate ? `, selected date is ${selectedDate}` : '')
                 }
                 placeholder="YYYY/MM/DD"
+                ariaLabel="Select date of increase"
               />
             </FormField>
             <FormField constraintText="Enter a dollar amount in USD" label="What is the increase amount?">
-              <Input value={amountValue} onChange={({ detail }) => setAmountValue(detail.value)} />
+              <Input
+                value={amountValue}
+                onChange={({ detail }) => setAmountValue(detail.value)}
+                ariaLabel="Enter increase amount in USD"
+              />
             </FormField>
 
             <ExpandableSection
@@ -66,6 +76,7 @@ export default function Bluedialogbox() {
                   Provide more details to enhance troubleshooting
                 </Box>
               }
+              aria-expanded={true}
             >
               <SpaceBetween size={'l'}>
                 <FormField label="Which service is this related to ? - optional">
@@ -78,6 +89,7 @@ export default function Bluedialogbox() {
                       { label: 'Route 53', value: 'Route 53' },
                       { label: 'S3', value: 'S3' },
                     ]}
+                    ariaLabel="Select related service"
                   />
                 </FormField>
                 <FormField label="Describe the issue in few words. - optional">
@@ -88,11 +100,11 @@ export default function Bluedialogbox() {
           </SpaceBetween>
         </div>
         <div className={styles['blue-dialog-box__footer']}>
-          <Button onClick={submitData}>Submit</Button>
+          <Button onClick={submitData} ariaLabel="Submit form">
+            Submit
+          </Button>
         </div>
       </Form>
     </div>
-  ) : (
-    <></>
   );
 }
diff --git a/pages/bluedialog/styles.scss b/pages/bluedialog/styles.scss
index 5ed95970600..c526670051a 100644
--- a/pages/bluedialog/styles.scss
+++ b/pages/bluedialog/styles.scss
@@ -4,26 +4,35 @@
 */
 @use '~design-tokens' as awsui;
 
-
 .blue-dialog-box {
-  margin: 20px;
-  border: 1px solid awsui.$color-border-status-info;
+  margin-block: 20px;
+  margin-inline: 20px;
+  border-block: 1px solid awsui.$color-border-status-info;
+  border-inline: 1px solid awsui.$color-border-status-info;
   background-color: awsui.$color-background-status-info;
-  border-radius: 16px;
+  border-start-start-radius: 16px;
+  border-start-end-radius: 16px;
+  border-end-start-radius: 16px;
+  border-end-end-radius: 16px;
 }
 .blue-dialog-box__header {
   display: flex;
   justify-content: space-between;
-  padding: 10px 20px 0 20px;
+  padding-block-start: 10px;
+  padding-block-end: 0;
+  padding-inline: 20px;
 }
 
 .blue-dialog-box__content {
-  padding: 0 20px 20px 20px;
+  padding-block-start: 0;
+  padding-block-end: 20px;
+  padding-inline: 20px;
 }
 
 .blue-dialog-box__footer {
   border-block-start: 1px solid awsui.$color-border-divider-default;
-  padding: 10px;
+  padding-block: 10px;
+  padding-inline: 10px;
   display: flex;
   flex-direction: row-reverse;
   gap: 20px;