feat: account label card (#2870)

Co-authored-by: Sk Niyaj Ali <[email protected]>

Author: Nagarjuna0033

core/designsystem/src/commonMain/kotlin/org/mifos/mobile/core/designsystem/theme/Type.kt

@@ -341,6 +341,15 @@ object MifosTypography {
             fontWeight = FontWeight(400),
         )
 
+    val bodyMediumEmphasized: TextStyle
+        @Composable get() = TextStyle(
+            fontSize = 14.sp,
+            lineHeight = 20.sp,
+            fontFamily = fontFamily(),
+            letterSpacing = 0.25.sp,
+            fontWeight = FontWeight(500),
+        )
+
     // verified
     val bodySmall: TextStyle
         @Composable get() = TextStyle(

core/ui/src/commonMain/kotlin/org/mifos/mobile/core/ui/component/MifosLabelValueCard.kt

@@ -0,0 +1,98 @@
+/*
+ * Copyright 2025 Mifos Initiative
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * See https://github.com/openMF/mobile-mobile/blob/master/LICENSE.md
+ */
+package org.mifos.mobile.core.ui.component
+
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.CardDefaults
+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.graphics.Color
+import androidx.compose.ui.unit.dp
+import org.jetbrains.compose.ui.tooling.preview.Preview
+import org.mifos.mobile.core.designsystem.component.CardVariant
+import org.mifos.mobile.core.designsystem.component.MifosCustomCard
+import org.mifos.mobile.core.designsystem.theme.AppColors
+import org.mifos.mobile.core.designsystem.theme.DesignToken
+import org.mifos.mobile.core.designsystem.theme.MifosMobileTheme
+import org.mifos.mobile.core.designsystem.theme.MifosTypography
+
+@Composable
+fun MifosLabelValueCard(
+    label: String,
+    value: String,
+    color: Color,
+    modifier: Modifier = Modifier,
+) {
+    MifosCustomCard(
+        variant = CardVariant.OUTLINED,
+        modifier = modifier
+            .border(
+                1.dp,
+                MaterialTheme.colorScheme.secondaryContainer,
+                DesignToken.shapes.medium,
+            ),
+        shape = DesignToken.shapes.medium,
+        colors = CardDefaults.outlinedCardColors(containerColor = MaterialTheme.colorScheme.onPrimary),
+    ) {
+        Column(
+            modifier = Modifier
+                .padding(DesignToken.padding.medium),
+            verticalArrangement = Arrangement.spacedBy(DesignToken.spacing.extraSmall),
+            horizontalAlignment = Alignment.Start,
+        ) {
+            Text(
+                text = label,
+                style = MifosTypography.bodySmall,
+                color = MaterialTheme.colorScheme.secondary,
+
+            )
+
+            Text(
+                text = value,
+                style = MifosTypography.bodyMediumEmphasized,
+                color = color,
+            )
+        }
+    }
+}
+
+@Preview
+@Composable
+private fun Mifos_Label_Card_Preview() {
+    MifosMobileTheme {
+        Column(
+            modifier = Modifier
+                .fillMaxSize()
+                .padding(16.dp),
+            verticalArrangement = Arrangement.spacedBy(16.dp),
+        ) {
+            MifosLabelValueCard(
+                label = "Account Number",
+                value = "268978976666",
+                color = MaterialTheme.colorScheme.onBackground,
+
+            )
+
+            MifosLabelValueCard(
+                label = "Product Type",
+                value = "Education Loan",
+                color = AppColors.customEnable,
+
+            )
+        }
+    }
+}