package com.seven.ikar.kotlin.feature.login

import androidx.compose.foundation.background
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Surface
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.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.unit.dp
import androidx.compose.foundation.text.KeyboardOptions

@Composable
fun LoginScreen(
    state: LoginUiState,
    onPhoneNumberChanged: (String) -> Unit,
    onDisplayNameChanged: (String) -> Unit,
    onVerificationCodeChanged: (String) -> Unit,
    onRequestCodeClick: () -> Unit,
    onVerifyCodeClick: () -> Unit,
    onChangePhoneNumberClick: () -> Unit
) {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(
                Brush.linearGradient(
                    colors = listOf(
                        Color(0xFF3DA9F5),
                        Color(0xFF229AF0),
                        Color(0xFF1A9CEF)
                    )
                )
            )
    ) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .verticalScroll(rememberScrollState())
                .padding(horizontal = 24.dp, vertical = 32.dp),
            verticalArrangement = Arrangement.spacedBy(20.dp)
        ) {
            Column(
                modifier = Modifier.fillMaxWidth(),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = Arrangement.spacedBy(12.dp)
            ) {
                Surface(
                    shape = CircleShape,
                    color = Color.White.copy(alpha = 0.14f)
                ) {
                    Box(
                        modifier = Modifier.padding(28.dp),
                        contentAlignment = Alignment.Center
                    ) {
                        Text(
                            text = "ИКАР",
                            style = MaterialTheme.typography.headlineSmall,
                            color = Color.White,
                            fontWeight = FontWeight.SemiBold
                        )
                    }
                }

                Column(
                    horizontalAlignment = Alignment.CenterHorizontally,
                    verticalArrangement = Arrangement.spacedBy(4.dp)
                ) {
                    Text(
                        text = state.pageTitle,
                        style = MaterialTheme.typography.headlineSmall,
                        color = Color.White,
                        fontWeight = FontWeight.SemiBold
                    )
                    Text(
                        text = state.subtitle,
                        style = MaterialTheme.typography.bodyMedium,
                        color = Color(0xFFDDEEFF)
                    )
                }
            }

            Surface(
                modifier = Modifier.fillMaxWidth(),
                shape = RoundedCornerShape(28.dp),
                color = Color.White
            ) {
                Column(
                    modifier = Modifier.padding(22.dp),
                    verticalArrangement = Arrangement.spacedBy(16.dp)
                ) {
                    Text(
                        text = "АККАУНТ",
                        style = MaterialTheme.typography.labelLarge,
                        color = Color(0xFF5A8EB2),
                        fontWeight = FontWeight.SemiBold
                    )

                    if (state.showPhoneStep) {
                        OutlinedTextField(
                            value = state.phoneNumber,
                            onValueChange = onPhoneNumberChanged,
                            modifier = Modifier.fillMaxWidth(),
                            label = { Text("Номер телефона") },
                            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Phone),
                            singleLine = true
                        )

                        Button(
                            onClick = onRequestCodeClick,
                            enabled = !state.isLoading,
                            contentPadding = PaddingValues(horizontal = 20.dp, vertical = 14.dp)
                        ) {
                            if (state.isLoading) {
                                CircularProgressIndicator(
                                    strokeWidth = 2.dp,
                                    modifier = Modifier.padding(horizontal = 8.dp)
                                )
                            } else {
                                Text("Получить тестовый код")
                            }
                        }
                    }

                    if (state.showCodeStep) {
                        Surface(
                            modifier = Modifier.fillMaxWidth(),
                            shape = RoundedCornerShape(18.dp),
                            color = Color(0xFFF5FAFF),
                            border = BorderStroke(1.dp, Color(0xFFD7E8F7))
                        ) {
                            Column(
                                modifier = Modifier.padding(14.dp),
                                verticalArrangement = Arrangement.spacedBy(10.dp)
                            ) {
                                Text(
                                    text = "Подтверждение номера",
                                    style = MaterialTheme.typography.titleMedium,
                                    fontWeight = FontWeight.SemiBold
                                )
                                Text(
                                    text = "Для тестового режима код показывается прямо в приложении. После подключения SMS-провайдера это сообщение исчезнет.",
                                    style = MaterialTheme.typography.bodyMedium,
                                    color = Color(0xFF617A8F)
                                )

                                if (state.hasTestCodeHint) {
                                    Text(
                                        text = "Тестовый код: ${state.testCodeHint}",
                                        style = MaterialTheme.typography.bodyMedium,
                                        color = Color(0xFF229AF0),
                                        fontWeight = FontWeight.SemiBold
                                    )
                                }

                                OutlinedTextField(
                                    value = state.verificationCode,
                                    onValueChange = onVerificationCodeChanged,
                                    modifier = Modifier.fillMaxWidth(),
                                    label = { Text("Код подтверждения") },
                                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
                                    singleLine = true
                                )

                                if (state.showDisplayName) {
                                    OutlinedTextField(
                                        value = state.displayName,
                                        onValueChange = onDisplayNameChanged,
                                        modifier = Modifier.fillMaxWidth(),
                                        label = { Text("Ваше имя") },
                                        singleLine = true
                                    )
                                }

                                Button(
                                    onClick = onVerifyCodeClick,
                                    enabled = !state.isLoading,
                                    contentPadding = PaddingValues(horizontal = 20.dp, vertical = 14.dp)
                                ) {
                                    if (state.isLoading) {
                                        CircularProgressIndicator(
                                            strokeWidth = 2.dp,
                                            modifier = Modifier.padding(horizontal = 8.dp)
                                        )
                                    } else {
                                        Text("Продолжить")
                                    }
                                }

                                Button(
                                    onClick = onChangePhoneNumberClick,
                                    enabled = !state.isLoading,
                                    colors = ButtonDefaults.buttonColors(
                                        containerColor = Color.Transparent,
                                        contentColor = Color(0xFF229AF0)
                                    ),
                                    contentPadding = PaddingValues(horizontal = 0.dp, vertical = 12.dp)
                                ) {
                                    Text("Изменить номер")
                                }
                            }
                        }
                    }

                    state.errorMessage?.let {
                        Text(
                            text = it,
                            color = MaterialTheme.colorScheme.error,
                            style = MaterialTheme.typography.bodyMedium
                        )
                    }
                }
            }
        }
    }
}
