Material Typo applied

2026-06-30 14:31:22 +06:30 · 2026-06-30 14:31:22 +06:30 · 0ecfa8f06e
commit 0ecfa8f06e
parent 4c23e53983
25 changed files with 213 additions and 257 deletions
--- a/app/src/main/java/com/mob/utsmyanmar/ui/cardwaiting/CardWaitingScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/cardwaiting/CardWaitingScreen.kt
@ -26,6 +26,7 @@ import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@ -38,7 +39,6 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
@ -134,8 +134,7 @@ private fun CardWaitingScreenContent(
        Text(
            text = "AMOUNT TO PAY",
            color = Color.Black,
-            fontSize = 10.sp,
-            fontWeight = FontWeight.Medium
+            style = MaterialTheme.typography.labelSmall
        )

        Spacer(modifier = Modifier.height(6.dp))
@ -144,8 +143,7 @@ private fun CardWaitingScreenContent(
            Text(
                text = amount,
                color = Color.LegacyRed,
-                fontSize = 30.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.displayMedium
            )

            Spacer(modifier = Modifier.width(6.dp))
@ -153,8 +151,7 @@ private fun CardWaitingScreenContent(
            Text(
                text = "MMK",
                color = Color.LegacyRed,
-                fontSize = 10.sp,
-                fontWeight = FontWeight.Bold,
+                style = MaterialTheme.typography.labelSmall,
                modifier = Modifier.padding(bottom = 6.dp)
            )
        }
@ -172,8 +169,7 @@ private fun CardWaitingScreenContent(
                else -> "Tap Your Card"
            },
            color = Color.LegacyRed,
-            fontSize = 13.sp,
-            fontWeight = FontWeight.Bold
+            style = MaterialTheme.typography.titleSmall
        )

        Text(
@ -183,7 +179,7 @@ private fun CardWaitingScreenContent(
                "Hold your card near the reader"
            },
            color = Color.Black,
-            fontSize = 9.sp
+            style = MaterialTheme.typography.labelSmall.copy(fontSize = 9.sp)
        )

        Spacer(modifier = Modifier.height(14.dp))
@ -201,7 +197,7 @@ private fun CardWaitingScreenContent(
                text = "OR",
                modifier = Modifier.padding(horizontal = 12.dp),
                color = Color.Gray,
-                fontSize = 10.sp
+                style = MaterialTheme.typography.labelSmall
            )

            HorizontalDivider(
@ -219,7 +215,7 @@ private fun CardWaitingScreenContent(
        Text(
            text = uiState.alertMessage,
            color = Color.Black,
-            fontSize = 11.sp,
+            style = MaterialTheme.typography.labelSmall,
            textAlign = TextAlign.Center,
            lineHeight = 16.sp
        )
@ -315,13 +311,12 @@ private fun InsertCardRow(onMockClick: ()->Unit) {
            Text(
                text = "Insert Your Card",
                color = Color.LegacyRed,
-                fontSize = 11.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.labelSmall
            )
            Text(
                text = "Chip facing up",
                color = Color.Black,
-                fontSize = 9.sp
+                style = MaterialTheme.typography.labelSmall.copy(fontSize = 9.sp)
            )
        }
    }
@ -348,8 +343,7 @@ private fun StatusPanel(uiState: CardWaitingUiState) {
                    else -> "Ready for card"
                },
                color = Color.LegacyRed,
-                fontSize = 12.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.labelMedium
            )

            Text(
@ -359,7 +353,7 @@ private fun StatusPanel(uiState: CardWaitingUiState) {
                    else -> "Waiting"
                },
                color = Color.Gray,
-                fontSize = 11.sp
+                style = MaterialTheme.typography.labelSmall
            )
        }
    }
@ -383,8 +377,7 @@ private fun ManualEntryAction(onManualEntryClick: () -> Unit) {
            Text(
                text = "Manual Entry",
                color = Color.LegacyRed,
-                fontSize = 14.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.titleSmall
            )
        }
    }
@ -405,10 +398,10 @@ private fun CardLogoRow() {
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
-            Text("VISA", fontSize = 22.sp, fontWeight = FontWeight.Bold)
-            Text("MC", fontSize = 18.sp, fontWeight = FontWeight.Bold)
-            Text("MPU", fontSize = 20.sp, fontWeight = FontWeight.Bold)
-            Text("UnionPay", fontSize = 12.sp, fontWeight = FontWeight.Bold)
+            Text("VISA", style = MaterialTheme.typography.titleLarge)
+            Text("MC", style = MaterialTheme.typography.titleMedium)
+            Text("MPU", style = MaterialTheme.typography.titleLarge)
+            Text("UnionPay", style = MaterialTheme.typography.labelMedium)
        }
    }
 }
@ -419,7 +412,7 @@ private fun PoweredByMob() {
        Text(
            text = "Powered by",
            color = Color.Gray,
-            fontSize = 8.sp
+            style = MaterialTheme.typography.labelSmall.copy(fontSize = 8.sp)
        )

        Spacer(modifier = Modifier.width(4.dp))
@ -427,8 +420,7 @@ private fun PoweredByMob() {
        Text(
            text = "MOB",
            color = Color.Gray,
-            fontSize = 9.sp,
-            fontWeight = FontWeight.Bold
+            style = MaterialTheme.typography.labelSmall.copy(fontSize = 9.sp)
        )
    }
 }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/components/NumericEntryScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/components/NumericEntryScreen.kt
@ -22,6 +22,7 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@ -30,7 +31,6 @@ import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.theme.Color

@Composable
@ -72,7 +72,7 @@ fun NumericEntryScreen(
            Text(
                text = prompt,
                color = Color.Gray,
-                fontSize = 11.sp,
+                style = MaterialTheme.typography.labelSmall,
                modifier = Modifier.align(Alignment.CenterHorizontally)
            )

@ -86,17 +86,14 @@ fun NumericEntryScreen(
                    Text(
                        text = prefixLabel,
                        color = Color.LegacyRed,
-                        fontSize = 13.sp,
-                        fontWeight = FontWeight.Medium,
+                        style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.Medium),
                        modifier = Modifier.padding(end = 10.dp, bottom = 6.dp)
                    )
                }

                Text(
                    text = displayValue,
-                    color = Color.LegacyRed,
-                    fontSize = 32.sp,
-                    fontWeight = FontWeight.Bold
+                    style = MaterialTheme.typography.displayLarge.copy(color = Color.LegacyRed)
                )
            }

@ -105,7 +102,7 @@ fun NumericEntryScreen(
            Text(
                text = supportingText,
                color = if (errorMessage == null) Color.Gray else Color.Error,
-                fontSize = 11.sp,
+                style = MaterialTheme.typography.labelSmall,
                modifier = Modifier.align(Alignment.CenterHorizontally)
            )

@ -152,8 +149,7 @@ fun NumericEntryScreen(
                ) {
                    Text(
                        text = confirmText,
-                        fontSize = 14.sp,
-                        fontWeight = FontWeight.Medium
+                        style = MaterialTheme.typography.titleSmall
                    )
                }
            }
@ -234,8 +230,7 @@ private fun KeyPadButton(
        Text(
            text = text,
            color = if (enabled) Color.LegacyRed else Color.White,
-            fontSize = 24.sp,
-            fontWeight = FontWeight.Normal,
+            style = MaterialTheme.typography.headlineLarge,
            textAlign = TextAlign.Center
        )
    }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/components/SquareButton.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/components/SquareButton.kt
@ -10,11 +10,9 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.theme.MOBPOSTheme
 import com.mob.utsmyanmar.ui.theme.Primary
 import com.mob.utsmyanmar.ui.theme.White
@ -66,8 +64,7 @@ fun SquareButton(

            Text(
                text = title,
-                fontSize = 24.sp,
-                fontWeight = FontWeight.SemiBold,
+                style = MaterialTheme.typography.headlineLarge,
                textAlign = TextAlign.Center,
                maxLines = 1
            )
--- a/app/src/main/java/com/mob/utsmyanmar/ui/components/appbar/AppBar.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/components/appbar/AppBar.kt
@ -9,7 +9,7 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.vector.ImageVector
-import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.ui.tooling.preview.Preview
 import com.mob.utsmyanmar.ui.theme.Color
 import com.mob.utsmyanmar.ui.theme.Primary
@ -28,7 +28,7 @@ fun AppBar(
            Text(
                text = title,
                color = White,
-                fontWeight = FontWeight.SemiBold
+                style = MaterialTheme.typography.titleMedium
            )
        },

--- a/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/DashboardScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/DashboardScreen.kt
@ -87,7 +87,6 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import coil3.compose.AsyncImage
 import com.mob.utsmyanmar.R
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
@ -266,20 +265,17 @@ fun DashboardScreen2(
                            Text(
                                text = "MOB Merchant",
                                color = Color.CrimsonRed,
-                                fontSize = 12.sp,
-                                fontWeight = FontWeight.Bold
+                                style = MaterialTheme.typography.labelMedium
                            )
                            Text(
                                text = "S/N:${deviceInfo.serialNumber}",
                                color = Color.Black,
-                                fontSize = 12.sp,
-                                fontWeight = FontWeight.Bold
+                                style = MaterialTheme.typography.labelMedium
                            )
                            Text(
                                text = if (isOnline) "Online" else "Offline",
                                color = if (isOnline) Color.Success else Color.Error,
-                                fontSize = 12.sp,
-                                fontWeight = FontWeight.Bold
+                                style = MaterialTheme.typography.labelMedium
                            )
                        }
                    }
@ -591,7 +587,7 @@ private fun SummaryCard(
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    Text(
-                        text = "Last Sync", fontSize = 12.sp
+                        text = "Last Sync", style = MaterialTheme.typography.bodySmall
                    )
                    Box(
                        modifier = Modifier
@ -622,9 +618,8 @@ private fun SummaryCard(

                Text(
                    text = formatRelativeTime(lastSyncTime, now),
-                    fontSize = 18.sp,
-                    color = Color.LegacyRed,
-                    fontWeight = FontWeight.SemiBold
+                    style = MaterialTheme.typography.titleMedium,
+                    color = Color.LegacyRed
                )
            }
        }
@ -643,11 +638,11 @@ private fun SummaryItem(
        verticalAlignment = Alignment.Top, modifier = Modifier.padding(6.dp)
    ) {
        Column(modifier = Modifier.weight(1f)) {
-            Text(title, fontSize = 12.sp)
+            Text(title, style = MaterialTheme.typography.bodySmall)
            Text(
-                value, fontSize = 14.sp, color = Color.LegacyRed, fontWeight = FontWeight.Bold
+                value, style = MaterialTheme.typography.titleSmall, color = Color.LegacyRed
            )
-            Text(subtitle, fontSize = 12.sp)
+            Text(subtitle, style = MaterialTheme.typography.bodySmall)
        }
        IconCircle(icon, iconBg)
    }
@ -909,7 +904,7 @@ private fun MenuCard(
                ) {
                    Text(
                        text = title,
-                        fontSize = 12.sp,
+                        style = MaterialTheme.typography.bodySmall,
                        color = Color.Black,
                        overflow = TextOverflow.Ellipsis,
                        maxLines = 1,
@ -937,8 +932,7 @@ private fun LazyListScope.recentTransactionsItems(transactions: List<TrnxRecord>
        ) {
            Text(
                text = "Recent Transactions",
-                fontWeight = FontWeight.SemiBold,
-                fontSize = 14.sp
+                style = MaterialTheme.typography.titleSmall
            )
        }
        HorizontalDivider(
@ -951,7 +945,7 @@ private fun LazyListScope.recentTransactionsItems(transactions: List<TrnxRecord>
            Text(
                text = "No recent transactions",
                color = Color.Gray,
-                fontSize = 13.sp,
+                style = MaterialTheme.typography.bodyMedium,
                textAlign = TextAlign.Center,
                modifier = Modifier
                    .fillMaxWidth()
@ -985,8 +979,7 @@ private fun TrnxRow(record: TrnxRecord) {
            Text(
                text = record.typeLabel.take(1),
                color = Color.LegacyRed,
-                fontWeight = FontWeight.Bold,
-                fontSize = 15.sp
+                style = MaterialTheme.typography.bodyLarge
            )
        }

@ -995,13 +988,12 @@ private fun TrnxRow(record: TrnxRecord) {
        Column(modifier = Modifier.weight(1f)) {
            Text(
                text =record.typeLabel,
-                fontSize = 13.sp,
-                fontWeight = FontWeight.SemiBold,
+                style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.SemiBold),
                color = Color.Black
            )
            Text(
                text = record.maskedCard,
-                fontSize = 11.sp,
+                style = MaterialTheme.typography.labelSmall,
                color = Color.Gray
            )
        }
@ -1009,13 +1001,12 @@ private fun TrnxRow(record: TrnxRecord) {
        Column(horizontalAlignment = Alignment.End) {
            Text(
                text = record.amountDisplay,
-                fontSize = 13.sp,
-                fontWeight = FontWeight.Bold,
+                style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.Bold),
                color = if (record.isVoided) Color.Gray else Color.LegacyRed
            )
            Text(
                text = record.dateTime,
-                fontSize = 10.sp,
+                style = MaterialTheme.typography.labelSmall,
                color = Color.Gray
            )
        }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/SeeMoreScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/dashboard/SeeMoreScreen.kt
@ -26,16 +26,15 @@ import androidx.compose.material.icons.filled.Undo
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.preview.P2Preview
 import com.mob.utsmyanmar.ui.theme.Color
@ -121,8 +120,7 @@ private fun MoreMenuCard(
            Text(
                text = title,
                color = Color.Black,
-                fontSize = 14.sp,
-                fontWeight = FontWeight.SemiBold,
+                style = MaterialTheme.typography.titleSmall,
                textAlign = TextAlign.Start
            )
        }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/disable/DisableScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/disable/DisableScreen.kt
@ -22,6 +22,7 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.CenterAlignedTopAppBar
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.Scaffold
@ -32,10 +33,8 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.R
 import com.mob.utsmyanmar.ui.theme.Color

@ -53,8 +52,7 @@ fun DisableScreen(
                    Text(
                        text = "Terminal Disabled",
                        color = Color.White,
-                        fontWeight = FontWeight.Bold,
-                        fontSize = 18.sp
+                        style = MaterialTheme.typography.titleMedium
                    )
                },
                colors = TopAppBarDefaults.centerAlignedTopAppBarColors(
@ -108,8 +106,7 @@ fun DisableScreen(

            Text(
                text = "This terminal is disabled",
-                fontSize = 22.sp,
-                fontWeight = FontWeight.Bold,
+                style = MaterialTheme.typography.titleLarge,
                color = Color.LegacyRed,
                textAlign = TextAlign.Center
            )
@ -118,7 +115,7 @@ fun DisableScreen(

            Text(
                text = "You won't be able to process any\ntransactions until the terminal is enabled.",
-                fontSize = 14.sp,
+                style = MaterialTheme.typography.bodyMedium,
                color = Color.Gray,
                textAlign = TextAlign.Center,
                modifier = Modifier.padding(horizontal = 32.dp)
@ -161,15 +158,14 @@ fun DisableScreen(
                        Column(modifier = Modifier.weight(1f)) {
                            Text(
                                text = "Why is this terminal disabled?",
-                                fontWeight = FontWeight.SemiBold,
-                                fontSize = 14.sp
+                                style = MaterialTheme.typography.titleSmall
                            )
                            Spacer(Modifier.height(4.dp))
                            Text(
                                text = message.ifBlank {
                                    "The terminal may be disabled by an administrator due to security, compliance or configuration changes."
                                },
-                                fontSize = 13.sp,
+                                style = MaterialTheme.typography.bodyMedium,
                                color = Color.Gray
                            )
                        }
@ -206,13 +202,12 @@ fun DisableScreen(
                        Column(modifier = Modifier.weight(1f)) {
                            Text(
                                text = "Need help?",
-                                fontWeight = FontWeight.SemiBold,
-                                fontSize = 14.sp
+                                style = MaterialTheme.typography.titleSmall
                            )
                            Spacer(Modifier.height(4.dp))
                            Text(
                                text = "Contact your system administrator or support team.",
-                                fontSize = 13.sp,
+                                style = MaterialTheme.typography.bodyMedium,
                                color = Color.Gray
                            )
                        }
@ -241,8 +236,7 @@ fun DisableScreen(
                Text(
                    text = "Retry",
                    color = Color.White,
-                    fontSize = 16.sp,
-                    fontWeight = FontWeight.SemiBold
+                    style = MaterialTheme.typography.titleMedium
                )
            }

--- a/app/src/main/java/com/mob/utsmyanmar/ui/functions/FunctionsScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/functions/FunctionsScreen.kt
@ -57,7 +57,7 @@ fun FunctionsScreen(
                .padding(16.dp).verticalScroll(rememberScrollState()),
            verticalArrangement = Arrangement.spacedBy(12.dp)
        ) {
-            Text(text = "General Settings")
+            Text(text = "General Settings", style = MaterialTheme.typography.titleMedium)
            FunctionButton(
                onClick = {},
                title = "App Version",
@ -93,7 +93,7 @@ fun FunctionsScreen(
                }
            )

-            Text(text = "System Configuration")
+            Text(text = "System Configuration", style = MaterialTheme.typography.titleMedium)

            FunctionButton(
                onClick = {},
--- a/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/HistoryComponents.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/HistoryComponents.kt
@ -16,13 +16,12 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.theme.Color
 import com.utsmyanmar.paylibs.model.PayDetail
 import com.utsmyanmar.paylibs.utils.POSUtil
@ -52,21 +51,19 @@ internal fun HistoryTransactionCard(
                Text(
                    text = payDetail.transType.ifBlank { "UNKNOWN" },
                    color = Color.LegacyRed,
-                    fontWeight = FontWeight.Bold,
-                    fontSize = 14.sp
+                    style = MaterialTheme.typography.titleSmall
                )
                Text(
                    text = POSUtil.getInstance().formatAmount(payDetail.amount),
-                    fontWeight = FontWeight.SemiBold,
-                    fontSize = 14.sp
+                    style = MaterialTheme.typography.titleSmall
                )
            }
            Spacer(modifier = Modifier.height(4.dp))
-            Text("Trace ${payDetail.voucherNo.ifBlank { "-" }}", fontSize = 12.sp)
-            Text("RRN ${payDetail.referNo.ifBlank { "-" }}", fontSize = 12.sp, color = Color.Gray)
+            Text("Trace ${payDetail.voucherNo.ifBlank { "-" }}", style = MaterialTheme.typography.bodySmall)
+            Text("RRN ${payDetail.referNo.ifBlank { "-" }}", style = MaterialTheme.typography.bodySmall, color = Color.Gray)
            Text(
                "${payDetail.transDate} ${payDetail.transTime}",
-                fontSize = 12.sp,
+                style = MaterialTheme.typography.bodySmall,
                color = Color.Gray
            )
        }
@ -86,8 +83,7 @@ internal fun HistoryTransactionDetailCard(payDetail: PayDetail) {
            Text(
                text = payDetail.transType.ifBlank { "Transaction" },
                color = Color.LegacyRed,
-                fontWeight = FontWeight.Bold,
-                fontSize = 16.sp
+                style = MaterialTheme.typography.titleMedium
            )
            SummaryLine("Trace", payDetail.voucherNo)
            SummaryLine("Amount", POSUtil.getInstance().formatAmount(payDetail.amount))
@ -107,11 +103,10 @@ internal fun SummaryLine(label: String, value: String) {
        modifier = Modifier.fillMaxWidth(),
        horizontalArrangement = Arrangement.SpaceBetween
    ) {
-        Text(label, color = Color.Gray, fontSize = 13.sp)
+        Text(label, color = Color.Gray, style = MaterialTheme.typography.bodyMedium)
        Text(
            value.ifBlank { "-" },
-            fontSize = 13.sp,
-            fontWeight = FontWeight.Medium
+            style = MaterialTheme.typography.bodyMedium
        )
    }
 }
@ -135,7 +130,7 @@ internal fun SummaryPickerRow(
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
-            Text(label, fontWeight = FontWeight.Medium)
+            Text(label, style = MaterialTheme.typography.titleSmall)
            Text(value, color = Color.Gray)
        }
    }
@ -181,7 +176,7 @@ internal fun HistoryNumericKeypad(
                        if (key == "⌫") {
                            Icon(Icons.Rounded.Backspace, contentDescription = "Backspace")
                        } else {
-                            Text(key, fontSize = 20.sp, fontWeight = FontWeight.Bold)
+                            Text(key, style = MaterialTheme.typography.headlineMedium)
                        }
                    }
                }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/ReviewTraceScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/ReviewTraceScreen.kt
@ -24,7 +24,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
@ -88,7 +88,7 @@ fun ReviewTraceScreen(
                } else {
                    Color.Black
                },
-                fontSize = 14.sp
+                style = MaterialTheme.typography.bodyMedium
            )

            Spacer(modifier = Modifier.height(16.dp))
@ -103,8 +103,7 @@ fun ReviewTraceScreen(
                        .fillMaxWidth()
                        .padding(24.dp),
                    textAlign = TextAlign.Center,
-                    fontSize = 28.sp,
-                    fontWeight = FontWeight.Bold
+                    style = MaterialTheme.typography.displayMedium.copy(fontSize = 28.sp)
                )
            }

--- a/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/SelectHostScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/SelectHostScreen.kt
@ -12,6 +12,7 @@ import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.ElevatedButton
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
@ -21,9 +22,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.theme.Color
 import com.utsmyanmar.paylibs.utils.core_utils.SystemParamsOperation
@ -94,6 +93,6 @@ private fun HostButton(
            .fillMaxWidth()
            .height(64.dp)
    ) {
-        Text(label, fontSize = 16.sp, fontWeight = FontWeight.SemiBold)
+        Text(label, style = MaterialTheme.typography.titleMedium)
    }
 }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/TransactionNotFoundScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/history_functions/TransactionNotFoundScreen.kt
@ -5,12 +5,12 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.theme.Color

@ -35,7 +35,7 @@ fun TransactionNotFoundScreen(onBack: () -> Unit) {
            Text(
                text = "Transaction not found.",
                color = Color.Gray,
-                fontSize = 16.sp
+                style = MaterialTheme.typography.bodyLarge
            )
        }
    }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/input_amount/InputAmountScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/input_amount/InputAmountScreen.kt
@ -19,6 +19,7 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@ -30,7 +31,6 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.components.NumericKeypad
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.preview.P2Preview
@ -97,7 +97,7 @@ fun InputAmount(
                    Text(
                        text = "Enter Amount",
                        color = Color.Gray,
-                        fontSize = 18.sp,
+                        style = MaterialTheme.typography.titleMedium,
                        modifier = Modifier.align(Alignment.CenterHorizontally)
                    )
                    Spacer(modifier = Modifier.height(8.dp))
@ -110,8 +110,7 @@ fun InputAmount(
                            Text(
                                text = prefixLabel,
                                color = Color.LegacyRed,
-                                fontSize = 16.sp,
-                                fontWeight = FontWeight.Medium,
+                                style = MaterialTheme.typography.titleMedium.copy(fontWeight = FontWeight.Medium),
                                modifier = Modifier.padding(end = 10.dp, bottom = 6.dp)
                            )
                        }
@ -119,8 +118,7 @@ fun InputAmount(
                        Text(
                            text = formatAmount(amount.ifEmpty { "0" }),
                            color = Color.LegacyRed,
-                            fontSize = 32.sp,
-                            fontWeight = FontWeight.Bold
+                            style = MaterialTheme.typography.displayLarge
                        )
                    }

@ -129,7 +127,7 @@ fun InputAmount(
                    Text(
                        text = supportingText,
                        color = Color.Gray,
-                        fontSize = 14.sp,
+                        style = MaterialTheme.typography.bodyMedium,
                        modifier = Modifier.align(Alignment.CenterHorizontally)
                    )
                }
@ -195,8 +193,7 @@ fun InputAmount(
                    ) {
                    Text(
                        text = "Next",
-                            fontSize = 14.sp,
-                            fontWeight = FontWeight.Medium
+                        style = MaterialTheme.typography.titleSmall
                    )
                    }
                }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/manual_entry/ManualEntryRoute.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/manual_entry/ManualEntryRoute.kt
@ -40,7 +40,6 @@ import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.text.TextRange
 import androidx.compose.ui.text.font.FontFamily
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.TextFieldValue
@ -339,8 +338,7 @@ private fun ManualCardEntryScreen(
                    ) {
                        Text(
                            text = "Confirm",
-                            fontSize = 14.sp,
-                            fontWeight = FontWeight.Medium
+                            style = MaterialTheme.typography.titleSmall
                        )
                    }
                }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/notification/NotificationDetailScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/notification/NotificationDetailScreen.kt
@ -17,12 +17,12 @@ import androidx.compose.material.icons.filled.Notifications
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
@ -87,8 +87,7 @@ fun NotificationDetailScreen(

                        Text(
                            text = notification.title,
-                            fontSize = 18.sp,
-                            fontWeight = FontWeight.Bold,
+                            style = MaterialTheme.typography.titleMedium,
                            color = Color.Black
                        )

@ -96,7 +95,7 @@ fun NotificationDetailScreen(

                        Text(
                            text = notification.timestamp,
-                            fontSize = 12.sp,
+                            style = MaterialTheme.typography.bodySmall,
                            color = Color.Gray
                        )

@ -104,8 +103,8 @@ fun NotificationDetailScreen(

                        Text(
                            text = notification.message,
-                            fontSize = 14.sp,
                            color = Color.Black,
+                            style = MaterialTheme.typography.bodyMedium,
                            lineHeight = 22.sp
                        )
                    }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/notification/NotificationListScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/notification/NotificationListScreen.kt
@ -21,6 +21,7 @@ import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material.icons.filled.Notifications
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
@ -33,7 +34,6 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.theme.Color

@ -55,7 +55,7 @@ fun NotificationListScreen(
                actions = {
                    if (notifications.any { !it.isRead }) {
                        TextButton(onClick = { viewModel.markAllAsRead() }) {
-                            Text(text = "Mark all read", color = Color.White, fontSize = 12.sp)
+                            Text(text = "Mark all read", color = Color.White, style = MaterialTheme.typography.bodySmall)
                        }
                    }
                }
@ -76,7 +76,7 @@ fun NotificationListScreen(
                        tint = Color.Gray,
                        modifier = Modifier.size(64.dp)
                    )
-                    Text(text = "No notifications", color = Color.Gray, fontSize = 14.sp)
+                    Text(text = "No notifications", color = Color.Gray, style = MaterialTheme.typography.bodyMedium)
                }
            }
        } else {
@ -142,8 +142,8 @@ private fun NotificationItem(
            ) {
                Text(
                    text = notification.title,
-                    fontSize = 13.sp,
-                    fontWeight = if (notification.isRead) FontWeight.Normal else FontWeight.SemiBold,
+                    style = if (notification.isRead) MaterialTheme.typography.bodyMedium
+                    else MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.SemiBold),
                    color = if (notification.isRead) Color.Gray else Color.Black,
                    modifier = Modifier.weight(1f),
                    maxLines = 1,
@ -159,14 +159,14 @@ private fun NotificationItem(
            }
            Text(
                text = notification.message,
-                fontSize = 12.sp,
+                style = MaterialTheme.typography.bodySmall,
                color = Color.Gray,
                maxLines = 1,
                overflow = TextOverflow.Ellipsis
            )
            Text(
                text = notification.timestamp,
-                fontSize = 11.sp,
+                style = MaterialTheme.typography.labelSmall,
                color = Color.Gray.copy(alpha = 0.7f)
            )
        }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/pinpad/PinPadScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/pinpad/PinPadScreen.kt
@ -14,6 +14,7 @@ import androidx.compose.material3.CenterAlignedTopAppBar
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBarDefaults
@ -26,7 +27,6 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
@ -64,8 +64,7 @@ fun PinPadScreen(
                    Text(
                        text = "PIN ENTRY",
                        color = White,
-                        fontSize = 16.sp,
-                        fontWeight = FontWeight.SemiBold
+                        style = MaterialTheme.typography.titleMedium
                    )
                },
                navigationIcon = {
@ -108,8 +107,7 @@ fun PinPadScreen(
                    Text(
                        text = "Please Input PIN",
                        color = White,
-                        fontSize = 22.sp,
-                        fontWeight = FontWeight.Bold
+                        style = MaterialTheme.typography.titleLarge
                    )

                    Spacer(modifier = Modifier.height(14.dp))
@ -117,8 +115,7 @@ fun PinPadScreen(
                    Text(
                        text = if (pinText.isBlank()) "------" else pinText,
                        color = White,
-                        fontSize = 30.sp,
-                        fontWeight = FontWeight.Bold,
+                        style = MaterialTheme.typography.displayMedium,
                        letterSpacing = 4.sp
                    )

@ -127,7 +124,7 @@ fun PinPadScreen(
                        Text(
                            text = alertMessage,
                            color = White,
-                            fontSize = 15.sp,
+                            style = MaterialTheme.typography.bodyLarge,
                            textAlign = TextAlign.Center
                        )
                    }
@ -139,7 +136,7 @@ fun PinPadScreen(
            Text(
                text = "Enter your PIN on the secured keypad below.",
                color = Black,
-                fontSize = 16.sp,
+                style = MaterialTheme.typography.bodyLarge,
                textAlign = TextAlign.Center
            )

@ -172,7 +169,7 @@ fun PinPadScreen(
                        "Cancel on device to exit."
                    },
                    color = Black,
-                    fontSize = 14.sp,
+                    style = MaterialTheme.typography.bodyMedium,
                    textAlign = TextAlign.Center
                )
            }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/print_receipt/PrintReceiptScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/print_receipt/PrintReceiptScreen.kt
@ -27,10 +27,8 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.graphicsLayer
 import androidx.compose.ui.text.font.FontFamily
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
@ -101,10 +99,7 @@ fun PrintReceiptScreen(
                ) {
                    Text(
                        text = "Cancel",
-                        style = MaterialTheme.typography.bodyLarge.copy(
-                            fontSize = 16.sp,
-                            fontWeight = FontWeight.SemiBold
-                        )
+                        style = MaterialTheme.typography.titleMedium
                    )
                }

@ -153,10 +148,7 @@ fun PrintReceiptScreen(
                ) {
                    Text(
                        text = "Print",
-                        style = MaterialTheme.typography.bodyLarge.copy(
-                            fontSize = 16.sp,
-                            fontWeight = FontWeight.SemiBold
-                        )
+                        style = MaterialTheme.typography.titleMedium
                    )
                }
            }
@ -186,15 +178,12 @@ fun ReceiptPreview(
    ) {
        Text(
            text = "MOB POS",
-            fontSize = 24.sp,
-            fontWeight = FontWeight.Bold,
-            fontFamily = FontFamily.Monospace
+            style = MaterialTheme.typography.headlineLarge.copy(fontFamily = FontFamily.Monospace)
        )
        Spacer(modifier = Modifier.height(8.dp))
        Text(
            text = "Transaction Receipt",
-            fontSize = 14.sp,
-            fontFamily = FontFamily.Monospace
+            style = MaterialTheme.typography.bodyMedium.copy(fontFamily = FontFamily.Monospace)
        )
        Spacer(modifier = Modifier.height(16.dp))
        ReceiptDivider()
@ -213,17 +202,14 @@ fun ReceiptPreview(
        Spacer(modifier = Modifier.height(8.dp))
        Text(
            text = "Thank You",
-            fontSize = 16.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontFamily = FontFamily.Monospace
+            style = MaterialTheme.typography.titleMedium.copy(fontFamily = FontFamily.Monospace)
        )

        Spacer(modifier = Modifier.height(4.dp))

        Text(
            text = "Please keep this receipt",
-            fontSize = 12.sp,
-            fontFamily = FontFamily.Monospace
+            style = MaterialTheme.typography.bodySmall.copy(fontFamily = FontFamily.Monospace)
        )
    }
 }
@ -241,16 +227,13 @@ fun ReceiptRow(
    ) {
            Text(
                text = label,
-            fontSize = 13.sp,
-            fontFamily = FontFamily.Monospace,
+                style = MaterialTheme.typography.bodyMedium.copy(fontFamily = FontFamily.Monospace),
                color = Color.Gray
            )

            Text(
                text = value,
-            fontSize = 13.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontFamily = FontFamily.Monospace
+                style = MaterialTheme.typography.titleSmall.copy(fontFamily = FontFamily.Monospace)
            )
    }
 }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/sale_void/VoidTraceScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/sale_void/VoidTraceScreen.kt
@ -20,6 +20,7 @@ import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@ -33,9 +34,8 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
+
 import androidx.lifecycle.LiveData
 import androidx.lifecycle.MutableLiveData
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
@ -144,7 +144,7 @@ fun VoidTraceScreen(
                Text(
                    text = headerMessage,
                    color = headerColor,
-                    fontSize = 14.sp
+                    style = MaterialTheme.typography.bodyMedium
                )

                Spacer(modifier = Modifier.height(28.dp))
@ -152,7 +152,7 @@ fun VoidTraceScreen(
                Text(
                    text = "Trace Number",
                    color = Color.Gray,
-                    fontSize = 11.sp,
+                    style = MaterialTheme.typography.labelSmall,
                    modifier = Modifier.align(Alignment.CenterHorizontally)
                )

@ -161,8 +161,7 @@ fun VoidTraceScreen(
                Text(
                    text = displayTraceNumber,
                    color = Color.LegacyRed,
-                    fontSize = 32.sp,
-                    fontWeight = FontWeight.Bold,
+                    style = MaterialTheme.typography.displayLarge,
                    modifier = Modifier.align(Alignment.CenterHorizontally)
                )

@ -171,7 +170,7 @@ fun VoidTraceScreen(
                Text(
                    text = "Enter 6-digit trace number",
                    color = Color.Gray,
-                    fontSize = 11.sp,
+                    style = MaterialTheme.typography.labelSmall,
                    modifier = Modifier.align(Alignment.CenterHorizontally)
                )

@ -314,8 +313,7 @@ private fun TraceKeypadButton(
        Text(
            text = text,
            color = Color.LegacyRed,
-            fontSize = 24.sp,
-            fontWeight = FontWeight.Normal,
+            style = MaterialTheme.typography.headlineLarge,
            textAlign = TextAlign.Center
        )
    }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/sending_to_host/SendingToHostScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/sending_to_host/SendingToHostScreen.kt
@ -16,15 +16,14 @@ import androidx.compose.material.icons.rounded.Check
 import androidx.compose.material.icons.rounded.Close
 import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.input_amount.InputAmount
 import com.mob.utsmyanmar.ui.preview.P2Preview
 import com.mob.utsmyanmar.ui.preview.P3Preview
@ -90,8 +89,7 @@ fun ProcessingScreen(state: ProcessingState) {
                    Text(
                        text = state.title,
                        color = White,
-                        fontSize = 24.sp,
-                        fontWeight = FontWeight.Bold
+                        style = MaterialTheme.typography.headlineLarge
                    )

                    Spacer(modifier = Modifier.height(10.dp))
@ -99,7 +97,7 @@ fun ProcessingScreen(state: ProcessingState) {
                    Text(
                        text = "Please wait while your transaction is being processed.",
                        color = White,
-                        fontSize = 15.sp,
+                        style = MaterialTheme.typography.bodyLarge,
                        textAlign = TextAlign.Center
                    )
                }
@ -110,7 +108,7 @@ fun ProcessingScreen(state: ProcessingState) {
            Text(
                text = "Transaction processing in progress.",
                color = Black,
-                fontSize = 14.sp,
+                style = MaterialTheme.typography.bodyMedium,
                textAlign = TextAlign.Center
            )
        }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/settlement/SettlementScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/settlement/SettlementScreen.kt
@ -17,6 +17,7 @@ import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@ -24,9 +25,8 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
+
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.theme.Color
 import com.mob.utsmyanmar.viewmodel.SharedViewModel
@ -68,8 +68,7 @@ fun SettlementScreen(
                    Text(
                        text = "Settlement Summary",
                        color = Color.LegacyRed,
-                        fontSize = 18.sp,
-                        fontWeight = FontWeight.Bold
+                        style = MaterialTheme.typography.titleMedium
                    )

                    Spacer(modifier = Modifier.height(12.dp))
@ -84,8 +83,7 @@ fun SettlementScreen(
            Text(
                text = "Unsettled Records",
                color = Color.Black,
-                fontSize = 15.sp,
-                fontWeight = FontWeight.SemiBold
+                style = MaterialTheme.typography.bodyLarge
            )

            Spacer(modifier = Modifier.height(8.dp))
@ -100,7 +98,7 @@ fun SettlementScreen(
                    Text(
                        text = "No records available for settlement.",
                        color = Color.Gray,
-                        fontSize = 14.sp,
+                        style = MaterialTheme.typography.bodyMedium,
                        modifier = Modifier.padding(18.dp)
                    )
                } else {
@ -146,13 +144,12 @@ private fun SummaryRow(
        Text(
            text = label,
            color = Color.Gray,
-            fontSize = 13.sp
+            style = MaterialTheme.typography.bodyMedium
        )
        Text(
            text = value,
            color = Color.Black,
-            fontSize = 13.sp,
-            fontWeight = FontWeight.Medium
+            style = MaterialTheme.typography.bodyMedium
        )
    }
 }
@ -167,14 +164,12 @@ private fun SettlementRecordRow(record: PayDetail) {
            Text(
                text = record.transType.ifBlank { "UNKNOWN" },
                color = Color.LegacyRed,
-                fontSize = 14.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.titleSmall
            )
            Text(
                text = POSUtil.getInstance().formatAmount(record.amount),
                color = Color.Black,
-                fontSize = 14.sp,
-                fontWeight = FontWeight.SemiBold
+                style = MaterialTheme.typography.titleSmall
            )
        }

@ -183,12 +178,12 @@ private fun SettlementRecordRow(record: PayDetail) {
        Text(
            text = "Trace ${record.voucherNo.ifBlank { "-" }}",
            color = Color.Black,
-            fontSize = 12.sp
+            style = MaterialTheme.typography.bodySmall
        )
        Text(
            text = "Card ${record.cardNo.ifBlank { "-" }}",
            color = Color.Gray,
-            fontSize = 12.sp
+            style = MaterialTheme.typography.bodySmall
        )

        Spacer(modifier = Modifier.height(12.dp))
--- a/app/src/main/java/com/mob/utsmyanmar/ui/sign_on/SignOnScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/sign_on/SignOnScreen.kt
@ -32,9 +32,8 @@ import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
+
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.mob.utsmyanmar.ui.components.appbar.AppBar
 import com.mob.utsmyanmar.ui.theme.Color as AppColor
@ -101,8 +100,7 @@ fun SignOnScreen(
                    )
                    Text(
                        text = "Host Sign On",
-                        fontSize = 22.sp,
-                        fontWeight = FontWeight.Bold,
+                        style = MaterialTheme.typography.titleLarge,
                        color = AppColor.LegacyRed
                    )
                    Text(
@ -226,8 +224,7 @@ fun SignOnResultScreen(

                    Text(
                        text = if (isSuccess) "Sign On Success" else "Sign On Failed",
-                        fontSize = 24.sp,
-                        fontWeight = FontWeight.Bold,
+                        style = MaterialTheme.typography.headlineLarge,
                        color = accent
                    )

--- a/app/src/main/java/com/mob/utsmyanmar/ui/theme/Type.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/theme/Type.kt
@ -6,29 +6,72 @@ import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.sp

-// Set of Material typography styles to start with
 val Typography = Typography(
+    displayLarge = TextStyle(
+        fontWeight = FontWeight.Bold,
+        fontSize = 32.sp,
+        lineHeight = 40.sp,
+    ),
+    displayMedium = TextStyle(
+        fontWeight = FontWeight.Bold,
+        fontSize = 30.sp,
+        lineHeight = 38.sp,
+    ),
+    headlineLarge = TextStyle(
+        fontWeight = FontWeight.Bold,
+        fontSize = 24.sp,
+        lineHeight = 32.sp,
+    ),
+    headlineMedium = TextStyle(
+        fontWeight = FontWeight.Bold,
+        fontSize = 20.sp,
+        lineHeight = 28.sp,
+    ),
+    titleLarge = TextStyle(
+        fontWeight = FontWeight.SemiBold,
+        fontSize = 22.sp,
+        lineHeight = 28.sp,
+    ),
+    titleMedium = TextStyle(
+        fontWeight = FontWeight.SemiBold,
+        fontSize = 18.sp,
+        lineHeight = 26.sp,
+    ),
+    titleSmall = TextStyle(
+        fontWeight = FontWeight.Medium,
+        fontSize = 14.sp,
+        lineHeight = 20.sp,
+    ),
    bodyLarge = TextStyle(
-        fontFamily = FontFamily.Default,
        fontWeight = FontWeight.Normal,
        fontSize = 16.sp,
        lineHeight = 24.sp,
        letterSpacing = 0.5.sp
-    )
-    /* Other default text styles to override
-    titleLarge = TextStyle(
-        fontFamily = FontFamily.Default,
+    ),
+    bodyMedium = TextStyle(
        fontWeight = FontWeight.Normal,
-        fontSize = 22.sp,
-        lineHeight = 28.sp,
-        letterSpacing = 0.sp
+        fontSize = 14.sp,
+        lineHeight = 20.sp,
+    ),
+    bodySmall = TextStyle(
+        fontWeight = FontWeight.Normal,
+        fontSize = 12.sp,
+        lineHeight = 16.sp,
+    ),
+    labelLarge = TextStyle(
+        fontWeight = FontWeight.Medium,
+        fontSize = 14.sp,
+        lineHeight = 20.sp,
+    ),
+    labelMedium = TextStyle(
+        fontWeight = FontWeight.Medium,
+        fontSize = 12.sp,
+        lineHeight = 16.sp,
    ),
    labelSmall = TextStyle(
-        fontFamily = FontFamily.Default,
        fontWeight = FontWeight.Medium,
        fontSize = 11.sp,
        lineHeight = 16.sp,
        letterSpacing = 0.5.sp
    )
-    */
 )
--- a/app/src/main/java/com/mob/utsmyanmar/ui/tms_setup/TmsSetupScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/tms_setup/TmsSetupScreen.kt
@ -22,6 +22,7 @@ import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.Icon
 import androidx.compose.material3.LinearProgressIndicator
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedButton
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@ -31,10 +32,8 @@ import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.StrokeCap
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.theme.Color as AppColor

@Composable
@ -92,8 +91,7 @@ fun TmsSetupScreen(
                    state.isError -> "Configuration Error"
                    else -> "Setting Up Terminal"
                },
-                fontSize = 22.sp,
-                fontWeight = FontWeight.Bold,
+                style = MaterialTheme.typography.titleLarge,
                color = AppColor.LegacyRed,
                textAlign = TextAlign.Center
            )
@ -124,7 +122,7 @@ fun TmsSetupScreen(

                    Text(
                        text = state.statusText,
-                        fontSize = 14.sp,
+                        style = MaterialTheme.typography.bodyMedium,
                        color = AppColor.Black,
                        textAlign = TextAlign.Center
                    )
@ -141,7 +139,7 @@ fun TmsSetupScreen(
                        ) {
                            Text(
                                text = state.errorMessage,
-                                fontSize = 13.sp,
+                                style = MaterialTheme.typography.bodyMedium,
                                color = AppColor.Error,
                                textAlign = TextAlign.Center,
                                modifier = Modifier.fillMaxWidth()
@ -165,7 +163,7 @@ fun TmsSetupScreen(
                            .padding(end = 8.dp)
                            .size(18.dp)
                    )
-                    Text(text = "Retry", fontSize = 16.sp)
+                    Text(text = "Retry", style = MaterialTheme.typography.bodyLarge)
                }

                if (!state.isTerminalDisabled) {
@ -175,7 +173,7 @@ fun TmsSetupScreen(
                        shape = RoundedCornerShape(12.dp),
                        colors = ButtonDefaults.outlinedButtonColors(contentColor = AppColor.LegacyRed)
                    ) {
-                        Text(text = "Skip", fontSize = 16.sp)
+                        Text(text = "Skip", style = MaterialTheme.typography.bodyLarge)
                    }
                }
            }
--- a/app/src/main/java/com/mob/utsmyanmar/ui/transaction_result/TransactionResultScreen.kt
+++ b/app/src/main/java/com/mob/utsmyanmar/ui/transaction_result/TransactionResultScreen.kt
@ -20,10 +20,8 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.vector.ImageVector
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.mob.utsmyanmar.ui.preview.P2Preview
 import com.mob.utsmyanmar.ui.theme.Color
 import com.utsmyanmar.paylibs.model.PayDetail
@ -65,8 +63,7 @@ fun TransactionResultScreen(
            Text(
                text = state.title,
                color = Color.LegacyRed,
-                fontSize = 24.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.headlineLarge
            )

            Spacer(modifier = Modifier.height(6.dp))
@ -74,7 +71,7 @@ fun TransactionResultScreen(
            Text(
                text = state.message.ifBlank { "Your payment has been processed successfully." },
                color = Color.Gray,
-                fontSize = 13.sp,
+                style = MaterialTheme.typography.bodyMedium,
                textAlign = TextAlign.Center
            )

@ -193,16 +190,14 @@ private fun AmountCard(
            Text(
                text = "PAID AMOUNT",
                color = Color.Gray,
-                fontSize = 15.sp,
-                fontWeight = FontWeight.SemiBold
+                style = MaterialTheme.typography.bodyLarge
            )


            Text(
                text = amount,
                color = Color.LegacyRed,
-                fontSize = 30.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.displayMedium
            )

            Spacer(modifier = Modifier.height(6.dp))
@ -210,8 +205,7 @@ private fun AmountCard(
            Text(
                text = "MMK",
                color = Color.LegacyRed,
-                fontSize = 14.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.titleSmall
            )
        }
    }
@ -296,21 +290,20 @@ private fun InfoItem(
            Text(
                text = title,
                color = Color.Gray,
-                fontSize = 11.sp
+                style = MaterialTheme.typography.labelSmall
            )

            Text(
                text = value,
                color = Color.Black,
-                fontSize = 13.sp,
-                fontWeight = FontWeight.Bold
+                style = MaterialTheme.typography.titleSmall
            )

            if (subValue.isNotEmpty()) {
                Text(
                    text = subValue,
                    color = Color.Black,
-                    fontSize = 11.sp
+                    style = MaterialTheme.typography.labelSmall
                )
            }
        }