package com.rosetta.messenger.ui.auth

import androidx.compose.animation.*
import androidx.compose.animation.core.*
import androidx.compose.foundation.*
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.*
import compose.icons.TablerIcons
import compose.icons.tablericons.*
import com.rosetta.messenger.ui.icons.TelegramIcons
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.scale
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.painterResource
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.PasswordVisualTransformation
import androidx.compose.ui.text.input.VisualTransformation
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.fragment.app.FragmentActivity
import com.rosetta.messenger.R
import com.rosetta.messenger.biometric.BiometricAuthManager
import com.rosetta.messenger.biometric.BiometricAvailability
import com.rosetta.messenger.biometric.BiometricPreferences
import com.rosetta.messenger.crypto.CryptoManager
import com.rosetta.messenger.data.AccountManager
import com.rosetta.messenger.data.DecryptedAccount
import com.rosetta.messenger.data.EncryptedAccount
import com.rosetta.messenger.data.resolveAccountDisplayName
import com.rosetta.messenger.database.RosettaDatabase
import com.rosetta.messenger.di.SessionCoordinator
import com.rosetta.messenger.repository.AvatarRepository
import com.rosetta.messenger.ui.components.AvatarImage
import com.rosetta.messenger.ui.chats.getAvatarColor
import com.rosetta.messenger.ui.chats.getAvatarText
import com.rosetta.messenger.ui.chats.utils.getInitials
import com.rosetta.messenger.ui.onboarding.PrimaryBlue
import kotlinx.coroutines.flow.first
import kotlinx.coroutines.launch

// Account model for dropdown
data class AccountItem(
        val publicKey: String,
        val name: String,
        val encryptedAccount: EncryptedAccount
)

/**
 * Функция для выполнения разблокировки аккаунта
 */
private suspend fun performUnlock(
    selectedAccount: AccountItem?,
    password: String,
    accountManager: AccountManager,
    sessionCoordinator: SessionCoordinator,
    onUnlocking: (Boolean) -> Unit,
    onError: (String) -> Unit,
    onSuccess: (DecryptedAccount) -> Unit
) {
    val TAG = "UnlockScreen"
    val totalStart = System.currentTimeMillis()
    
    if (selectedAccount == null) {
        onError("Please select an account")
        return
    }
    
    onUnlocking(true)
    try {
        val account = selectedAccount.encryptedAccount

        // Try to decrypt private key
        val decryptStart = System.currentTimeMillis()
val decryptedPrivateKey = CryptoManager.decryptWithPassword(
            account.encryptedPrivateKey,
            password
        )
        val decryptPrivateKeyTime = System.currentTimeMillis() - decryptStart
        if (decryptedPrivateKey == null) {
            onError("Incorrect password")
            onUnlocking(false)
            return
        }

        // Decrypt seed phrase
        val seedStart = System.currentTimeMillis()
        val decryptedSeedPhrase = CryptoManager.decryptWithPassword(
            account.encryptedSeedPhrase,
            password
        )?.split(" ") ?: emptyList()
        val seedTime = System.currentTimeMillis() - seedStart
        // Generate private key hash
        val hashStart = System.currentTimeMillis()
        val privateKeyHash = CryptoManager.generatePrivateKeyHash(decryptedPrivateKey)
        val hashTime = System.currentTimeMillis() - hashStart
        val decryptedAccount = DecryptedAccount(
            publicKey = account.publicKey,
            privateKey = decryptedPrivateKey,
            seedPhrase = decryptedSeedPhrase,
            privateKeyHash = privateKeyHash,
            name = selectedAccount.name
        )

        sessionCoordinator.bootstrapAuthenticatedSession(
            account = decryptedAccount,
            reason = "unlock"
        )
        onSuccess(decryptedAccount)
    } catch (e: Exception) {
        onError("Failed to unlock: ${e.message}")
        onUnlocking(false)
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun UnlockScreen(
        isDarkTheme: Boolean,
        selectedAccountId: String? = null,
        accountManager: AccountManager,
        sessionCoordinator: SessionCoordinator,
        onUnlocked: (DecryptedAccount) -> Unit,
        onSwitchAccount: () -> Unit = {},
        onRecover: () -> Unit = {}
) {
    val themeAnimSpec =
            tween<Color>(durationMillis = 500, easing = CubicBezierEasing(0.4f, 0f, 0.2f, 1f))
    val backgroundColor by
            animateColorAsState(
                    if (isDarkTheme) AuthBackground else AuthBackgroundLight,
                    animationSpec = themeAnimSpec
            )
    val textColor by
            animateColorAsState(
                    if (isDarkTheme) Color.White else Color.Black,
                    animationSpec = themeAnimSpec
            )
    val secondaryTextColor by
            animateColorAsState(
                    if (isDarkTheme) Color(0xFF8E8E93) else Color(0xFF666666),
                    animationSpec = themeAnimSpec
            )
    val cardBackground by
            animateColorAsState(
                    if (isDarkTheme) Color(0xFF2A2A2A) else Color(0xFFF5F5F5),
                    animationSpec = themeAnimSpec
            )

    val context = LocalContext.current
    val activity = context as? FragmentActivity
    val biometricManager = remember { BiometricAuthManager(context) }
    val biometricPrefs = remember { BiometricPreferences(context) }
    val scope = rememberCoroutineScope()
    

    var password by remember { mutableStateOf("") }
    var passwordVisible by remember { mutableStateOf(false) }
    var isUnlocking by remember { mutableStateOf(false) }
    var error by remember { mutableStateOf<String?>(null) }

    // Биометрия
    var biometricAvailable by remember { mutableStateOf<BiometricAvailability>(BiometricAvailability.NotAvailable("Проверка...")) }
    var isBiometricEnabled by remember { mutableStateOf(false) }
    var savedPasswordsMap by remember { mutableStateOf<Map<String, String>>(emptyMap()) }
    var dataLoaded by remember { mutableStateOf(false) }

    // Account selection state
    var accounts by remember { mutableStateOf<List<AccountItem>>(emptyList()) }
    var selectedAccount by remember { mutableStateOf<AccountItem?>(null) }
    var isDropdownExpanded by remember { mutableStateOf(false) }
    var searchQuery by remember { mutableStateOf("") }
    val searchFocusRequester = remember { FocusRequester() }

    // Load accounts and pre-select last used account
    LaunchedEffect(Unit) {
        // ⚡ СИНХРОННОЕ чтение последнего аккаунта ДО загрузки списка
        val lastLoggedKey = accountManager.getLastLoggedPublicKey()

        val allAccounts = accountManager.getAllAccounts()
        accounts =
                allAccounts.map { acc ->
                    AccountItem(
                        publicKey = acc.publicKey,
                        name = resolveAccountDisplayName(acc.publicKey, acc.name, acc.username),
                        encryptedAccount = acc
                    )
                }

        // Find the target account - приоритет: selectedAccountId > lastLoggedKey > первый
        val targetAccount =
                when {
                    !selectedAccountId.isNullOrEmpty() -> {
                        accounts.find { it.publicKey == selectedAccountId }
                    }
                    !lastLoggedKey.isNullOrEmpty() -> {
                        accounts.find { it.publicKey == lastLoggedKey }
                    }
                    else -> {
                        accounts.firstOrNull()
                    }
                }

        selectedAccount = targetAccount ?: accounts.firstOrNull()
        
        // Проверяем доступность биометрии
        biometricAvailable = biometricManager.isBiometricAvailable()
        val accountKey = targetAccount?.publicKey ?: accounts.firstOrNull()?.publicKey ?: ""
        if (accountKey.isNotEmpty()) {
            biometricPrefs.loadForAccount(accountKey)
        }
        isBiometricEnabled = biometricPrefs.isBiometricEnabled.first()
        
        // Загружаем сохранённые пароли для всех аккаунтов
        val passwords = mutableMapOf<String, String>()
        accounts.forEach { account ->
            val encryptedPwd = biometricPrefs.getEncryptedPassword(account.publicKey)
            if (encryptedPwd != null) {
                passwords[account.publicKey] = encryptedPwd
            }
        }
        savedPasswordsMap = passwords
        
        
        dataLoaded = true
        
    }

    // Функция для запуска биометрической разблокировки
    fun tryBiometricUnlock() {
        if (selectedAccount == null || activity == null) {
            return
        }
        
        val encryptedPassword = savedPasswordsMap[selectedAccount!!.publicKey]
        if (encryptedPassword == null) {
            return
        }
        
        
        biometricManager.decryptPassword(
            activity = activity,
            encryptedData = encryptedPassword,
            onSuccess = { decryptedPassword ->
                scope.launch {
                    performUnlock(
                        selectedAccount = selectedAccount,
                        password = decryptedPassword,
                        accountManager = accountManager,
                        sessionCoordinator = sessionCoordinator,
                        onUnlocking = { isUnlocking = it },
                        onError = { error = it },
                        onSuccess = { decryptedAccount ->
                            onUnlocked(decryptedAccount)
                        }
                    )
                }
            },
            onError = { errorMessage ->
                error = errorMessage
            },
            onCancel = {
            }
        )
    }

    // Filter accounts by search
    val filteredAccounts =
            remember(searchQuery, accounts) {
                if (searchQuery.isEmpty()) accounts
                else
                        accounts.filter {
                            it.name.contains(searchQuery, ignoreCase = true) ||
                                    it.publicKey.contains(searchQuery, ignoreCase = true)
                        }
            }

    // Entry animation
    var visible by remember { mutableStateOf(false) }
    LaunchedEffect(Unit) { visible = true }

    // Dropdown animation
    val dropdownProgress by
            animateFloatAsState(
                    targetValue = if (isDropdownExpanded) 1f else 0f,
                    animationSpec =
                            spring(
                                    dampingRatio = Spring.DampingRatioMediumBouncy,
                                    stiffness = Spring.StiffnessLow
                            ),
                    label = "dropdownProgress"
            )

    // Auto-focus search when dropdown opens
    LaunchedEffect(isDropdownExpanded) {
        if (isDropdownExpanded) {
            kotlinx.coroutines.delay(300)
            try {
                searchFocusRequester.requestFocus()
            } catch (e: Exception) {
                // FocusRequester may not be attached yet, ignore
            }
        } else {
            searchQuery = ""
        }
    }

    Box(modifier = Modifier.fillMaxSize().background(backgroundColor).navigationBarsPadding()) {
        Column(
                modifier =
                        Modifier.fillMaxSize()
                                .verticalScroll(rememberScrollState())
                                .imePadding()
                                .padding(horizontal = 32.dp)
                                .statusBarsPadding(),
                horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Spacer(modifier = Modifier.height(60.dp))

            // 🔥 Большой аватар пользователя - главный элемент (как в desktop)
            AnimatedVisibility(
                    visible = visible,
                    enter = fadeIn(tween(400)) + scaleIn(tween(400, easing = FastOutSlowInEasing))
            ) {
                if (selectedAccount != null) {
                    val database = RosettaDatabase.getDatabase(context)
                    val avatarRepository = remember(selectedAccount!!.publicKey) {
                        AvatarRepository(context, database.avatarDao(), selectedAccount!!.publicKey)
                    }
                    AvatarImage(
                        publicKey = selectedAccount!!.publicKey,
                        avatarRepository = avatarRepository,
                        size = 120.dp,
                        isDarkTheme = isDarkTheme,
                        displayName = selectedAccount!!.name,
                        shape = RoundedCornerShape(28.dp)
                    )
                } else {
                    Box(
                        modifier = Modifier
                            .size(120.dp)
                            .clip(RoundedCornerShape(28.dp))
                            .background(cardBackground),
                        contentAlignment = Alignment.Center
                    ) {
                        Text(
                            text = "?",
                            fontSize = 48.sp,
                            fontWeight = FontWeight.Bold,
                            color = Color.White
                        )
                    }
                }
            }

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

            // 🔥 Имя пользователя с иконкой переключения (как в desktop)
            AnimatedVisibility(
                    visible = visible,
                    enter = fadeIn(tween(400, delayMillis = 150))
            ) {
                Row(
                    modifier = Modifier
                        .then(
                            if (accounts.size > 1) 
                                Modifier.clickable { isDropdownExpanded = !isDropdownExpanded }
                            else Modifier
                        )
                        .padding(horizontal = 6.dp),
                    verticalAlignment = Alignment.CenterVertically,
                    horizontalArrangement = Arrangement.Center
                ) {
                    Text(
                            text = selectedAccount?.name ?: "Select Account",
                            fontSize = 24.sp,
                            fontWeight = FontWeight.Bold,
                            color = textColor,
                            maxLines = 1,
                            overflow = TextOverflow.Ellipsis
                    )
                    
                    // Иконка переключения аккаунта (только если > 1 аккаунта)
                    if (accounts.size > 1) {
                        Spacer(modifier = Modifier.width(4.dp))
                        Icon(
                            imageVector = TablerIcons.ChevronDown,
                            contentDescription = "Switch account",
                            tint = PrimaryBlue,
                            modifier = Modifier.size(20.dp)
                        )
                    }
                }
            }

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

            // Подзаголовок
            AnimatedVisibility(visible = visible, enter = fadeIn(tween(400, delayMillis = 200))) {
                Text(
                        text = "Enter password to unlock",
                        fontSize = 15.sp,
                        color = secondaryTextColor,
                        textAlign = TextAlign.Center
                )
            }

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

            // 🔥 Dropdown для выбора аккаунта (показывается только при клике на иконку)
            AnimatedVisibility(
                    visible = isDropdownExpanded && accounts.size > 1,
                    enter = fadeIn(tween(200)) + expandVertically(expandFrom = Alignment.Top),
                    exit = fadeOut(tween(150)) + shrinkVertically(shrinkTowards = Alignment.Top)
            ) {
                Card(
                        modifier = Modifier
                            .fillMaxWidth()
                            .heightIn(max = if (accounts.size > 5) 300.dp else ((accounts.size * 64).dp)),
                        colors = CardDefaults.cardColors(containerColor = cardBackground),
                        shape = RoundedCornerShape(14.dp)
                ) {
                    LazyColumn(
                            modifier = Modifier.fillMaxWidth()
                    ) {
                        items(accounts, key = { it.publicKey }) { account ->
                            val isSelected = account.publicKey == selectedAccount?.publicKey
                            
                            Row(
                                    modifier = Modifier
                                        .fillMaxWidth()
                                        .clickable {
                                            selectedAccount = account
                                            isDropdownExpanded = false
                                            password = ""
                                            error = null
                                            biometricPrefs.loadForAccount(account.publicKey)
                                            isBiometricEnabled = biometricPrefs.isBiometricEnabledForAccount(account.publicKey)
                                        }
                                        .background(
                                            if (isSelected) PrimaryBlue.copy(alpha = 0.1f)
                                            else Color.Transparent
                                        )
                                        .padding(horizontal = 16.dp, vertical = 12.dp),
                                    verticalAlignment = Alignment.CenterVertically
                            ) {
                                val database = RosettaDatabase.getDatabase(context)
                                val avatarRepository = remember(account.publicKey) {
                                    AvatarRepository(context, database.avatarDao(), account.publicKey)
                                }
                                AvatarImage(
                                    publicKey = account.publicKey,
                                    avatarRepository = avatarRepository,
                                    size = 40.dp,
                                    isDarkTheme = isDarkTheme,
                                    displayName = account.name
                                )

                                Spacer(modifier = Modifier.width(12.dp))

                                Column(modifier = Modifier.weight(1f)) {
                                    Text(
                                            text = account.name,
                                            fontSize = 15.sp,
                                            fontWeight = if (isSelected) FontWeight.SemiBold else FontWeight.Normal,
                                            color = textColor,
                                            maxLines = 1,
                                            overflow = TextOverflow.Ellipsis
                                    )
                                    val displayText = account.encryptedAccount.username
                                            ?: account.publicKey.take(16) + "..."
                                    Text(
                                            text = displayText,
                                            fontSize = 12.sp,
                                            color = secondaryTextColor,
                                            maxLines = 1,
                                            overflow = TextOverflow.Ellipsis
                                    )
                                }

                                if (isSelected) {
                                    Icon(
                                            painter = TelegramIcons.Done,
                                            contentDescription = null,
                                            tint = PrimaryBlue,
                                            modifier = Modifier.size(20.dp)
                                    )
                                }
                            }
                        }
                    }
                }
            }

            // 🔥 Минималистичное поле пароля
            AnimatedVisibility(
                    visible = visible && !isDropdownExpanded,
                    enter = fadeIn(tween(400, delayMillis = 300))
            ) {
                OutlinedTextField(
                        value = password,
                        onValueChange = {
                            password = it
                            error = null
                        },
                        placeholder = { 
                            Text(
                                "Password",
                                color = secondaryTextColor.copy(alpha = 0.6f)
                            ) 
                        },
                        singleLine = true,
                        visualTransformation =
                                if (passwordVisible) VisualTransformation.None
                                else PasswordVisualTransformation(),
                        trailingIcon = {
                            IconButton(onClick = { passwordVisible = !passwordVisible }) {
                                Icon(
                                        imageVector =
                                                if (passwordVisible) TablerIcons.EyeOff
                                                else TablerIcons.Eye,
                                        contentDescription = if (passwordVisible) "Hide" else "Show",
                                        tint = secondaryTextColor
                                )
                            }
                        },
                        isError = error != null,
                        colors = OutlinedTextFieldDefaults.colors(
                                focusedBorderColor = PrimaryBlue,
                                unfocusedBorderColor = Color.Transparent,
                                focusedContainerColor = cardBackground,
                                unfocusedContainerColor = cardBackground,
                                focusedTextColor = textColor,
                                unfocusedTextColor = textColor,
                                cursorColor = PrimaryBlue,
                                errorBorderColor = Color(0xFFE53935),
                                errorContainerColor = cardBackground
                        ),
                        modifier = Modifier.fillMaxWidth(),
                        shape = RoundedCornerShape(14.dp),
                        keyboardOptions = KeyboardOptions(
                                keyboardType = KeyboardType.Password,
                                imeAction = ImeAction.Done
                        )
                )
            }

            // Error message
            AnimatedVisibility(
                    visible = error != null,
                    enter = fadeIn(tween(200)),
                    exit = fadeOut(tween(150))
            ) {
                Spacer(modifier = Modifier.height(8.dp))
                Text(text = error ?: "", fontSize = 14.sp, color = Color(0xFFE53935))
            }

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

            // 🔥 Градиентная кнопка Unlock
            AnimatedVisibility(
                    visible = visible && !isDropdownExpanded,
                    enter = fadeIn(tween(400, delayMillis = 400))
            ) {
                val canUseBiometric = remember(selectedAccount, isBiometricEnabled, biometricAvailable) {
                    selectedAccount != null && 
                    isBiometricEnabled && 
                    biometricAvailable is BiometricAvailability.Available &&
                    activity != null
                }
                
                val hasSavedPassword = remember(selectedAccount, savedPasswordsMap) {
                    selectedAccount?.let { savedPasswordsMap.containsKey(it.publicKey) } ?: false
                }
                
                val showBiometricButton = canUseBiometric && hasSavedPassword
                
                Column(horizontalAlignment = Alignment.CenterHorizontally) {
                    // Основная кнопка Unlock
                    Button(
                            onClick = {
                                if (selectedAccount == null) {
                                    error = "Please select an account"
                                    return@Button
                                }
                                if (password.isEmpty()) {
                                    error = "Please enter your password"
                                    return@Button
                                }

                                scope.launch {
                                    performUnlock(
                                        selectedAccount = selectedAccount,
                                        password = password,
                                        accountManager = accountManager,
                                        sessionCoordinator = sessionCoordinator,
                                        onUnlocking = { isUnlocking = it },
                                        onError = { error = it },
                                        onSuccess = { decryptedAccount ->
                                            onUnlocked(decryptedAccount)
                                        }
                                    )
                                }
                            },
                            enabled = selectedAccount != null && password.isNotEmpty() && !isUnlocking,
                            modifier = Modifier
                                .fillMaxWidth()
                                .height(54.dp),
                            colors = ButtonDefaults.buttonColors(
                                    containerColor = PrimaryBlue,
                                    contentColor = Color.White,
                                    disabledContainerColor = PrimaryBlue.copy(alpha = 0.4f),
                                    disabledContentColor = Color.White.copy(alpha = 0.6f)
                            ),
                            shape = RoundedCornerShape(14.dp)
                    ) {
                        if (isUnlocking) {
                            CircularProgressIndicator(
                                    modifier = Modifier.size(22.dp),
                                    color = Color.White,
                                    strokeWidth = 2.dp
                            )
                        } else {
                            Icon(
                                    painter = TelegramIcons.Unlock,
                                    contentDescription = null,
                                    modifier = Modifier.size(20.dp)
                            )
                            Spacer(modifier = Modifier.width(10.dp))
                            Text(text = "Unlock", fontSize = 16.sp, fontWeight = FontWeight.SemiBold)
                        }
                    }
                    
                    // Кнопка биометрии (если доступна)
                    if (showBiometricButton) {
                        Spacer(modifier = Modifier.height(16.dp))
                        
                        TextButton(
                            onClick = { tryBiometricUnlock() },
                            enabled = !isUnlocking
                        ) {
                            Icon(
                                    painter = TelegramIcons.Fingerprint,
                                    contentDescription = null,
                                    tint = PrimaryBlue,
                                    modifier = Modifier.size(22.dp)
                            )
                            Spacer(modifier = Modifier.width(8.dp))
                            Text(
                                text = "Use biometric",
                                color = PrimaryBlue,
                                fontSize = 15.sp,
                                fontWeight = FontWeight.Medium
                            )
                        }
                    }
                }
            }

            Spacer(modifier = Modifier.weight(1f))

            // 🔥 Footer - Create/Import account
            AnimatedVisibility(
                    visible = visible && !isDropdownExpanded,
                    enter = fadeIn(tween(400, delayMillis = 500))
            ) {
                Column(
                    horizontalAlignment = Alignment.CenterHorizontally,
                    modifier = Modifier.padding(bottom = 32.dp)
                ) {
                    // Разделитель
                    Row(
                        modifier = Modifier.fillMaxWidth(),
                        verticalAlignment = Alignment.CenterVertically
                    ) {
                        Box(
                            modifier = Modifier
                                .weight(1f)
                                .height(0.5.dp)
                                .background(secondaryTextColor.copy(alpha = 0.3f))
                        )
                        Text(
                            text = "  or  ",
                            color = secondaryTextColor,
                            fontSize = 13.sp
                        )
                        Box(
                            modifier = Modifier
                                .weight(1f)
                                .height(0.5.dp)
                                .background(secondaryTextColor.copy(alpha = 0.3f))
                        )
                    }
                    
                    Spacer(modifier = Modifier.height(16.dp))
                    
                    TextButton(onClick = onRecover) {
                        Icon(
                                painter = TelegramIcons.Unlock,
                                contentDescription = null,
                                tint = PrimaryBlue,
                                modifier = Modifier.size(18.dp)
                        )
                        Spacer(modifier = Modifier.width(8.dp))
                        Text(
                            text = "Recover account",
                            color = PrimaryBlue,
                            fontSize = 15.sp,
                            fontWeight = FontWeight.Medium
                        )
                    }
                    
                    Spacer(modifier = Modifier.height(4.dp))
                    
                    TextButton(onClick = onSwitchAccount) {
                        Icon(
                                painter = TelegramIcons.AddContact,
                                contentDescription = null,
                                tint = secondaryTextColor,
                                modifier = Modifier.size(18.dp)
                        )
                        Spacer(modifier = Modifier.width(8.dp))
                        Text(
                            text = "Create new account",
                            color = secondaryTextColor,
                            fontSize = 14.sp,
                            fontWeight = FontWeight.Normal
                        )
                    }
                }
            }
        }
    }
}
