package com.example.godeye.ui.components

import androidx.compose.animation.*
import androidx.compose.animation.core.*
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.scale
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import com.example.godeye.models.*
import com.example.godeye.ui.theme.GodEyeColors

@OptIn(ExperimentalAnimationApi::class)
@Composable
fun ConnectionStatusIndicator(connectionState: ConnectionState) {
    val infiniteTransition = rememberInfiniteTransition(label = "connection_indicator")

    val animatedColor by infiniteTransition.animateColor(
        initialValue = when (connectionState) {
            ConnectionState.CONNECTED -> GodEyeColors.SuccessGreen
            ConnectionState.CONNECTING, ConnectionState.RECONNECTING -> GodEyeColors.WarningAmber
            ConnectionState.ERROR -> GodEyeColors.RecordRed
            ConnectionState.DISCONNECTED -> GodEyeColors.IvorySoft
        },
        targetValue = when (connectionState) {
            ConnectionState.CONNECTED -> GodEyeColors.SuccessGreen.copy(alpha = 0.7f)
            ConnectionState.CONNECTING, ConnectionState.RECONNECTING -> GodEyeColors.WarningAmber.copy(alpha = 0.7f)
            ConnectionState.ERROR -> GodEyeColors.RecordRed.copy(alpha = 0.7f)
            ConnectionState.DISCONNECTED -> GodEyeColors.IvorySoft.copy(alpha = 0.7f)
        },
        animationSpec = infiniteRepeatable(
            animation = tween(1500, easing = EaseInOut),
            repeatMode = RepeatMode.Reverse
        ),
        label = "indicator_color"
    )

    val scale by infiniteTransition.animateFloat(
        initialValue = 1f,
        targetValue = if (connectionState in listOf(ConnectionState.CONNECTING, ConnectionState.RECONNECTING)) 1.2f else 1f,
        animationSpec = infiniteRepeatable(
            animation = tween(1000, easing = EaseInOut),
            repeatMode = RepeatMode.Reverse
        ),
        label = "indicator_scale"
    )

    Box(
        modifier = Modifier
            .size(16.dp)
            .scale(scale)
            .background(
                brush = Brush.radialGradient(
                    colors = listOf(
                        animatedColor,
                        animatedColor.copy(alpha = 0.3f)
                    )
                ),
                shape = RoundedCornerShape(50)
            )
    )
}

@Composable
fun ServerConfigurationPrompt(onSettingsClick: () -> Unit) {
    Card(
        modifier = Modifier.fillMaxWidth(),
        colors = CardDefaults.cardColors(
            containerColor = GodEyeColors.RecordRed.copy(alpha = 0.1f)
        ),
        shape = RoundedCornerShape(16.dp)
    ) {
        Column(
            modifier = Modifier.padding(20.dp),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.spacedBy(12.dp)
        ) {
            Icon(
                Icons.Default.Warning,
                contentDescription = null,
                tint = GodEyeColors.WarningAmber,
                modifier = Modifier.size(32.dp)
            )
            Text(
                text = "Сервер не настроен",
                style = MaterialTheme.typography.titleMedium,
                fontWeight = FontWeight.Medium,
                color = GodEyeColors.IvoryPure
            )
            Text(
                text = "Откройте настройки для выбора сервера",
                style = MaterialTheme.typography.bodyMedium,
                color = GodEyeColors.IvorySoft
            )
            Button(
                onClick = onSettingsClick,
                colors = ButtonDefaults.buttonColors(
                    containerColor = GodEyeColors.NavyLight
                ),
                shape = RoundedCornerShape(12.dp),
                modifier = Modifier.fillMaxWidth()
            ) {
                Text("Открыть настройки")
            }
        }
    }
}

@Composable
fun ServerInfoDisplay(
    serverUrl: String,
    onSettingsClick: () -> Unit,
    onUpdateUrl: (String) -> Unit,
    connectionState: ConnectionState,
    isLoading: Boolean
) {
    OutlinedTextField(
        value = serverUrl,
        onValueChange = onUpdateUrl,
        label = {
            Text(
                "Server URL",
                color = GodEyeColors.NavyLight
            )
        },
        placeholder = {
            Text(
                "http://192.168.1.100:3001",
                color = GodEyeColors.IvorySoft.copy(alpha = 0.6f)
            )
        },
        modifier = Modifier.fillMaxWidth(),
        enabled = connectionState != ConnectionState.CONNECTED && !isLoading,
        singleLine = true,
        colors = OutlinedTextFieldDefaults.colors(
            focusedBorderColor = GodEyeColors.NavyLight,
            unfocusedBorderColor = GodEyeColors.IvorySoft.copy(alpha = 0.5f),
            focusedTextColor = GodEyeColors.IvoryPure,
            unfocusedTextColor = GodEyeColors.IvorySoft
        ),
        shape = RoundedCornerShape(12.dp),
        trailingIcon = {
            IconButton(onClick = onSettingsClick) {
                Icon(
                    Icons.Default.Settings,
                    contentDescription = "Настройки",
                    tint = GodEyeColors.NavyLight
                )
            }
        }
    )
}

@OptIn(ExperimentalAnimationApi::class)
@Composable
fun ConnectionControls(
    connectionState: ConnectionState,
    isLoading: Boolean,
    serverUrl: String,
    onConnect: () -> Unit,
    onDisconnect: () -> Unit,
    onSettings: () -> Unit
) {
    AnimatedContent(
        targetState = connectionState,
        transitionSpec = {
            slideInHorizontally(
                animationSpec = spring(dampingRatio = Spring.DampingRatioMediumBouncy)
            ) togetherWith slideOutHorizontally(
                animationSpec = tween(300)
            )
        },
        label = "connection_controls"
    ) { state ->
        when (state) {
            ConnectionState.CONNECTED -> {
                Button(
                    onClick = onDisconnect,
                    enabled = !isLoading,
                    modifier = Modifier.fillMaxWidth(),
                    colors = ButtonDefaults.buttonColors(
                        containerColor = GodEyeColors.RecordRed.copy(alpha = 0.8f)
                    ),
                    shape = RoundedCornerShape(12.dp)
                ) {
                    Icon(Icons.Default.PowerOff, contentDescription = null)
                    Spacer(modifier = Modifier.width(8.dp))
                    Text(
                        "Отключиться от сервера",
                        color = GodEyeColors.IvoryPure
                    )
                }
            }
            else -> {
                Button(
                    onClick = {
                        if (serverUrl.isBlank()) onSettings() else onConnect()
                    },
                    enabled = !isLoading,
                    modifier = Modifier.fillMaxWidth(),
                    colors = ButtonDefaults.buttonColors(
                        containerColor = GodEyeColors.NavyLight
                    ),
                    shape = RoundedCornerShape(12.dp)
                ) {
                    if (isLoading) {
                        Row(
                            horizontalArrangement = Arrangement.spacedBy(8.dp),
                            verticalAlignment = Alignment.CenterVertically
                        ) {
                            CircularProgressIndicator(
                                modifier = Modifier.size(16.dp),
                                strokeWidth = 2.dp,
                                color = GodEyeColors.IvoryPure
                            )
                            Text(
                                "Подключение...",
                                color = GodEyeColors.IvoryPure
                            )
                        }
                    } else {
                        Icon(Icons.Default.Link, contentDescription = null)
                        Spacer(modifier = Modifier.width(8.dp))
                        Text(
                            if (serverUrl.isBlank()) "Настроить сервер" else "Подключиться к серверу",
                            color = GodEyeColors.IvoryPure
                        )
                    }
                }
            }
        }
    }
}

@Composable
fun OperatorRequestCard(
    cameraRequest: CameraRequest,
    onAccept: () -> Unit,
    onReject: () -> Unit
) {
    AnimatedFloatingPanel(
        visible = true,
        slideDirection = SlideDirection.FromBottom
    ) {
        Column(
            modifier = Modifier.padding(24.dp),
            verticalArrangement = Arrangement.spacedBy(16.dp)
        ) {
            Row(
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.spacedBy(12.dp)
            ) {
                Icon(
                    Icons.Default.Videocam,
                    contentDescription = null,
                    tint = GodEyeColors.WarningAmber,
                    modifier = Modifier.size(32.dp)
                )
                Column {
                    Text(
                        text = "Запрос на подключение к камере",
                        style = MaterialTheme.typography.titleMedium,
                        fontWeight = FontWeight.Bold,
                        color = GodEyeColors.IvoryPure
                    )
                    Text(
                        text = "Оператор ${cameraRequest.operatorId}",
                        style = MaterialTheme.typography.bodyMedium,
                        color = GodEyeColors.NavyLight
                    )
                }
            }

            Card(
                modifier = Modifier.fillMaxWidth(),
                colors = CardDefaults.cardColors(
                    containerColor = GodEyeColors.BlackMedium.copy(alpha = 0.5f)
                ),
                shape = RoundedCornerShape(12.dp)
            ) {
                Column(
                    modifier = Modifier.padding(16.dp),
                    verticalArrangement = Arrangement.spacedBy(8.dp)
                ) {
                    InfoRow("Тип камеры", cameraRequest.cameraType)
                    InfoRow("Session ID", cameraRequest.sessionId.take(12) + "...")
                }
            }

            Row(
                modifier = Modifier.fillMaxWidth(),
                horizontalArrangement = Arrangement.spacedBy(12.dp)
            ) {
                Button(
                    onClick = onReject,
                    modifier = Modifier.weight(1f),
                    colors = ButtonDefaults.buttonColors(
                        containerColor = GodEyeColors.RecordRed.copy(alpha = 0.8f)
                    ),
                    shape = RoundedCornerShape(12.dp)
                ) {
                    Icon(Icons.Default.Close, contentDescription = null)
                    Spacer(modifier = Modifier.width(4.dp))
                    Text("Отклонить", color = GodEyeColors.IvoryPure)
                }

                Button(
                    onClick = onAccept,
                    modifier = Modifier.weight(1f),
                    colors = ButtonDefaults.buttonColors(
                        containerColor = GodEyeColors.SuccessGreen
                    ),
                    shape = RoundedCornerShape(12.dp)
                ) {
                    Icon(Icons.Default.Check, contentDescription = null)
                    Spacer(modifier = Modifier.width(4.dp))
                    Text("Разрешить", color = GodEyeColors.IvoryPure)
                }
            }
        }
    }
}

@Composable
fun ActiveSessionsCard(
    activeSessions: Map<String, SessionInfo>,
    onEndSession: (String) -> Unit
) {
    AnimatedFloatingPanel(
        visible = true,
        slideDirection = SlideDirection.FromBottom
    ) {
        Column(
            modifier = Modifier.padding(24.dp),
            verticalArrangement = Arrangement.spacedBy(16.dp)
        ) {
            Row(
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.spacedBy(12.dp)
            ) {
                Icon(
                    Icons.Default.VideoCall,
                    contentDescription = null,
                    tint = GodEyeColors.RecordRed,
                    modifier = Modifier.size(32.dp)
                )
                Column {
                    Text(
                        text = "Активная трансляция",
                        style = MaterialTheme.typography.titleMedium,
                        fontWeight = FontWeight.Bold,
                        color = GodEyeColors.IvoryPure
                    )
                    Text(
                        text = "Активных сессий: ${activeSessions.size}",
                        style = MaterialTheme.typography.bodyMedium,
                        color = GodEyeColors.IvorySoft
                    )
                }
            }

            activeSessions.forEach { (sessionId, sessionInfo) ->
                SessionCard(
                    sessionId = sessionId,
                    sessionInfo = sessionInfo,
                    onEndSession = onEndSession
                )
            }
        }
    }
}

@Composable
fun SessionCard(
    sessionId: String,
    sessionInfo: SessionInfo,
    onEndSession: (String) -> Unit
) {
    Card(
        modifier = Modifier.fillMaxWidth(),
        colors = CardDefaults.cardColors(
            containerColor = GodEyeColors.NavyDark.copy(alpha = 0.3f)
        ),
        shape = RoundedCornerShape(12.dp)
    ) {
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .padding(16.dp),
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Column(modifier = Modifier.weight(1f)) {
                Text(
                    text = "Оператор: ${sessionInfo.operatorId}",
                    style = MaterialTheme.typography.bodyMedium,
                    fontWeight = FontWeight.Medium,
                    color = GodEyeColors.IvoryPure
                )
                Text(
                    text = "Камера: ${sessionInfo.cameraType}",
                    style = MaterialTheme.typography.bodySmall,
                    color = GodEyeColors.NavyLight
                )
                Text(
                    text = "Статус: ${sessionInfo.status}",
                    style = MaterialTheme.typography.bodySmall,
                    color = GodEyeColors.IvorySoft
                )
            }

            Button(
                onClick = { onEndSession(sessionId) },
                colors = ButtonDefaults.buttonColors(
                    containerColor = GodEyeColors.RecordRed.copy(alpha = 0.8f)
                ),
                shape = RoundedCornerShape(8.dp)
            ) {
                Text("Завершить", color = GodEyeColors.IvoryPure)
            }
        }
    }
}

@Composable
fun SuccessStatusCard(
    cameraRequest: CameraRequest?,
    isStreaming: Boolean
) {
    AnimatedFloatingPanel(
        visible = true,
        slideDirection = SlideDirection.FromBottom
    ) {
        Column(
            modifier = Modifier.padding(24.dp),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.spacedBy(12.dp)
        ) {
            Icon(
                Icons.Default.CheckCircle,
                contentDescription = null,
                tint = GodEyeColors.SuccessGreen,
                modifier = Modifier.size(48.dp)
            )
            Text(
                text = "Успешно подключено!",
                style = MaterialTheme.typography.titleMedium,
                fontWeight = FontWeight.Medium,
                color = GodEyeColors.IvoryPure
            )
            Text(
                text = "Android устройство зарегистрировано на сервере",
                style = MaterialTheme.typography.bodyMedium,
                color = GodEyeColors.IvorySoft
            )
            Text(
                text = when {
                    cameraRequest != null -> "📷 Получен запрос на подключение к камере"
                    isStreaming -> "🔴 Трансляция активна"
                    else -> "Ожидание запросов от операторов..."
                },
                style = MaterialTheme.typography.bodySmall,
                color = GodEyeColors.NavyLight
            )
        }
    }
}

@Composable
private fun InfoRow(label: String, value: String) {
    Row(
        modifier = Modifier.fillMaxWidth(),
        horizontalArrangement = Arrangement.SpaceBetween
    ) {
        Text(
            text = label,
            style = MaterialTheme.typography.bodySmall,
            color = GodEyeColors.IvorySoft
        )
        Text(
            text = value,
            style = MaterialTheme.typography.bodySmall,
            fontWeight = FontWeight.Medium,
            color = GodEyeColors.IvoryPure
        )
    }
}

/**
 * Сворачиваемая плитка для главного экрана
 */
@Composable
fun CollapsibleTile(
    title: String,
    subtitle: String,
    icon: androidx.compose.ui.graphics.vector.ImageVector,
    expanded: Boolean,
    onToggle: () -> Unit,
    modifier: Modifier = Modifier,
    statusColor: androidx.compose.ui.graphics.Color = GodEyeColors.IvorySoft,
    content: @Composable () -> Unit
) {
    Card(
        modifier = modifier.fillMaxWidth(),
        colors = CardDefaults.cardColors(
            containerColor = GodEyeColors.BlackSoft.copy(alpha = 0.8f)
        ),
        shape = RoundedCornerShape(12.dp),
        elevation = CardDefaults.cardElevation(defaultElevation = 4.dp)
    ) {
        Column {
            // Заголовок плитки (всегда видимый)
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .clickable { onToggle() }
                    .padding(16.dp),
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.spacedBy(12.dp)
            ) {
                Icon(
                    imageVector = icon,
                    contentDescription = null,
                    tint = statusColor,
                    modifier = Modifier.size(24.dp)
                )

                Column(
                    modifier = Modifier.weight(1f)
                ) {
                    Text(
                        text = title,
                        style = MaterialTheme.typography.titleMedium,
                        fontWeight = FontWeight.Medium,
                        color = GodEyeColors.IvoryPure
                    )
                    Text(
                        text = subtitle,
                        style = MaterialTheme.typography.bodySmall,
                        color = statusColor
                    )
                }

                Icon(
                    imageVector = if (expanded) Icons.Default.ExpandLess else Icons.Default.ExpandMore,
                    contentDescription = if (expanded) "Свернуть" else "Развернуть",
                    tint = GodEyeColors.IvorySoft,
                    modifier = Modifier.size(20.dp)
                )
            }

            // Развернутое содержимое
            AnimatedVisibility(
                visible = expanded,
                enter = expandVertically(
                    animationSpec = spring(dampingRatio = Spring.DampingRatioMediumBouncy)
                ) + fadeIn(),
                exit = shrinkVertically(
                    animationSpec = tween(300)
                ) + fadeOut()
            ) {
                content()
            }
        }
    }
}

/**
 * Плитка-кнопка для действий
 */
@Composable
fun ActionTile(
    title: String,
    subtitle: String,
    icon: androidx.compose.ui.graphics.vector.ImageVector,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    backgroundColor: androidx.compose.ui.graphics.Color = GodEyeColors.NavyMedium
) {
    Card(
        modifier = modifier
            .fillMaxWidth()
            .clickable(enabled = enabled) { onClick() },
        colors = CardDefaults.cardColors(
            containerColor = if (enabled) backgroundColor else GodEyeColors.BlackMedium.copy(alpha = 0.5f)
        ),
        shape = RoundedCornerShape(12.dp),
        elevation = CardDefaults.cardElevation(defaultElevation = if (enabled) 6.dp else 2.dp)
    ) {
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .padding(20.dp),
            verticalAlignment = Alignment.CenterVertically,
            horizontalArrangement = Arrangement.spacedBy(16.dp)
        ) {
            Icon(
                imageVector = icon,
                contentDescription = null,
                tint = if (enabled) GodEyeColors.IvoryPure else GodEyeColors.IvorySoft.copy(alpha = 0.5f),
                modifier = Modifier.size(32.dp)
            )

            Column(
                modifier = Modifier.weight(1f)
            ) {
                Text(
                    text = title,
                    style = MaterialTheme.typography.titleMedium,
                    fontWeight = FontWeight.Medium,
                    color = if (enabled) GodEyeColors.IvoryPure else GodEyeColors.IvorySoft.copy(alpha = 0.5f)
                )
                Text(
                    text = subtitle,
                    style = MaterialTheme.typography.bodyMedium,
                    color = if (enabled) GodEyeColors.IvorySoft else GodEyeColors.IvorySoft.copy(alpha = 0.3f)
                )
            }

            if (enabled) {
                Icon(
                    imageVector = Icons.Default.ChevronRight,
                    contentDescription = null,
                    tint = GodEyeColors.IvorySoft,
                    modifier = Modifier.size(20.dp)
                )
            }
        }
    }
}

/**
 * Карточка активной сессии
 */
@Composable
fun ActiveSessionCard(
    sessionInfo: SessionInfo,
    onEndSession: () -> Unit,
    modifier: Modifier = Modifier
) {
    Card(
        modifier = modifier.fillMaxWidth(),
        colors = CardDefaults.cardColors(
            containerColor = GodEyeColors.SuccessGreen.copy(alpha = 0.1f)
        ),
        shape = RoundedCornerShape(8.dp),
        border = BorderStroke(1.dp, GodEyeColors.SuccessGreen.copy(alpha = 0.3f))
    ) {
        Column(
            modifier = Modifier
                .fillMaxWidth()
                .padding(12.dp),
            verticalArrangement = Arrangement.spacedBy(8.dp)
        ) {
            Row(
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.SpaceBetween
            ) {
                Column {
                    Text(
                        text = "Оператор: ${sessionInfo.operatorId.take(8)}...",
                        style = MaterialTheme.typography.bodyMedium,
                        fontWeight = FontWeight.Medium,
                        color = GodEyeColors.IvoryPure
                    )
                    Text(
                        text = "Камера: ${sessionInfo.cameraType}",
                        style = MaterialTheme.typography.bodySmall,
                        color = GodEyeColors.IvorySoft
                    )
                    Text(
                        text = "Статус: ${sessionInfo.status}",
                        style = MaterialTheme.typography.bodySmall,
                        color = GodEyeColors.SuccessGreen
                    )
                }

                IconButton(
                    onClick = onEndSession,
                    colors = IconButtonDefaults.iconButtonColors(
                        containerColor = GodEyeColors.RecordRed.copy(alpha = 0.2f)
                    )
                ) {
                    Icon(
                        Icons.Default.Stop,
                        contentDescription = "Завершить сессию",
                        tint = GodEyeColors.RecordRed,
                        modifier = Modifier.size(20.dp)
                    )
                }
            }
        }
    }
}

@Composable
fun CameraPreviewCard(
    isStreaming: Boolean,
    activeSessions: Map<String, SessionInfo>,
    onStartStreaming: () -> Unit,
    onStopStreaming: () -> Unit,
    onSwitchCamera: (String) -> Unit
) {
    var currentCamera by remember { mutableStateOf("back") }

    Card(
        modifier = Modifier
            .fillMaxWidth()
            .height(200.dp),
        colors = CardDefaults.cardColors(
            containerColor = GodEyeColors.NavyDark.copy(alpha = 0.8f)
        ),
        border = BorderStroke(
            1.dp,
            if (isStreaming) GodEyeColors.SuccessGreen else GodEyeColors.NavyLight
        ),
        shape = RoundedCornerShape(16.dp)
    ) {
        Box(modifier = Modifier.fillMaxSize()) {
            // Фон предпросмотра
            Box(
                modifier = Modifier
                    .fillMaxSize()
                    .background(
                        Brush.verticalGradient(
                            colors = listOf(
                                GodEyeColors.BlackSoft,
                                GodEyeColors.NavyDark
                            )
                        )
                    ),
                contentAlignment = Alignment.Center
            ) {
                if (isStreaming) {
                    // Анимированный индикатор стриминга
                    val infiniteTransition = rememberInfiniteTransition(label = "streaming")
                    val alpha by infiniteTransition.animateFloat(
                        initialValue = 0.3f,
                        targetValue = 1f,
                        animationSpec = infiniteRepeatable(
                            animation = tween(1000),
                            repeatMode = RepeatMode.Reverse
                        ),
                        label = "streaming_alpha"
                    )

                    Column(
                        horizontalAlignment = Alignment.CenterHorizontally,
                        verticalArrangement = Arrangement.spacedBy(8.dp)
                    ) {
                        Icon(
                            Icons.Default.Videocam,
                            contentDescription = "Streaming",
                            tint = GodEyeColors.SuccessGreen.copy(alpha = alpha),
                            modifier = Modifier.size(48.dp)
                        )
                        Text(
                            text = "LIVE",
                            style = MaterialTheme.typography.titleLarge,
                            fontWeight = FontWeight.Bold,
                            color = GodEyeColors.SuccessGreen.copy(alpha = alpha)
                        )
                        Text(
                            text = "${activeSessions.size} активных сессий",
                            style = MaterialTheme.typography.bodySmall,
                            color = GodEyeColors.IvorySoft
                        )
                    }
                } else {
                    Column(
                        horizontalAlignment = Alignment.CenterHorizontally,
                        verticalArrangement = Arrangement.spacedBy(8.dp)
                    ) {
                        Icon(
                            Icons.Default.VideocamOff,
                            contentDescription = "Not streaming",
                            tint = GodEyeColors.IvorySoft,
                            modifier = Modifier.size(48.dp)
                        )
                        Text(
                            text = "Камера готова",
                            style = MaterialTheme.typography.titleMedium,
                            color = GodEyeColors.IvoryPure
                        )
                        Text(
                            text = "Ожидание запроса от оператора",
                            style = MaterialTheme.typography.bodySmall,
                            color = GodEyeColors.IvorySoft
                        )
                    }
                }
            }

            // Верхняя панель управления
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(12.dp)
                    .align(Alignment.TopCenter),
                horizontalArrangement = Arrangement.SpaceBetween,
                verticalAlignment = Alignment.CenterVertically
            ) {
                // Индикатор качества
                Card(
                    colors = CardDefaults.cardColors(
                        containerColor = GodEyeColors.BlackPure.copy(alpha = 0.7f)
                    ),
                    shape = RoundedCornerShape(8.dp)
                ) {
                    Text(
                        text = "1280x720",
                        modifier = Modifier.padding(horizontal = 8.dp, vertical = 4.dp),
                        style = MaterialTheme.typography.bodySmall,
                        color = GodEyeColors.IvoryPure
                    )
                }

                // Кнопка переключения камеры
                IconButton(
                    onClick = {
                        currentCamera = if (currentCamera == "back") "front" else "back"
                        onSwitchCamera(currentCamera)
                    },
                    modifier = Modifier
                        .background(
                            GodEyeColors.BlackPure.copy(alpha = 0.7f),
                            RoundedCornerShape(8.dp)
                        )
                ) {
                    Icon(
                        Icons.Default.FlipCameraAndroid,
                        contentDescription = "Switch camera",
                        tint = GodEyeColors.IvoryPure
                    )
                }
            }

            // Нижняя панель управления
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(12.dp)
                    .align(Alignment.BottomCenter),
                horizontalArrangement = Arrangement.SpaceEvenly,
                verticalAlignment = Alignment.CenterVertically
            ) {
                // Кнопка управления стримингом
                if (isStreaming) {
                    Button(
                        onClick = onStopStreaming,
                        colors = ButtonDefaults.buttonColors(
                            containerColor = GodEyeColors.RecordRed
                        ),
                        shape = RoundedCornerShape(12.dp)
                    ) {
                        Icon(
                            Icons.Default.Stop,
                            contentDescription = null,
                            modifier = Modifier.size(18.dp)
                        )
                        Spacer(modifier = Modifier.width(8.dp))
                        Text("Остановить")
                    }
                } else {
                    Button(
                        onClick = onStartStreaming,
                        colors = ButtonDefaults.buttonColors(
                            containerColor = GodEyeColors.SuccessGreen
                        ),
                        shape = RoundedCornerShape(12.dp)
                    ) {
                        Icon(
                            Icons.Default.PlayArrow,
                            contentDescription = null,
                            modifier = Modifier.size(18.dp)
                        )
                        Spacer(modifier = Modifier.width(8.dp))
                        Text("Запустить")
                    }
                }
            }
        }
    }
}
