package com.tt.honeyDue.ui.screens.onboarding

import androidx.compose.animation.core.*
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
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.material.icons.Icons
import androidx.compose.material.icons.filled.*
import androidx.compose.material.icons.automirrored.filled.ArrowForward
import androidx.compose.material3.*
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.graphics.Brush
import androidx.compose.ui.graphics.Color
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 com.tt.honeyDue.ui.theme.*
import honeydue.composeapp.generated.resources.*
import org.jetbrains.compose.resources.stringResource

enum class SubscriptionPlan {
    MONTHLY,
    YEARLY
}

data class SubscriptionBenefit(
    val icon: ImageVector,
    val title: String,
    val description: String,
    val gradientColors: List<Color>
)

@Composable
fun OnboardingSubscriptionContent(
    onSubscribe: () -> Unit,
    onSkip: () -> Unit
) {
    var selectedPlan by remember { mutableStateOf(SubscriptionPlan.YEARLY) }
    var isLoading by remember { mutableStateOf(false) }

    // Animate crown glow
    val infiniteTransition = rememberInfiniteTransition(label = "crown_glow")
    val scale by infiniteTransition.animateFloat(
        initialValue = 1f,
        targetValue = 1.1f,
        animationSpec = infiniteRepeatable(
            animation = tween(2000, easing = EaseInOut),
            repeatMode = RepeatMode.Reverse
        ),
        label = "crown_scale"
    )

    val benefits = listOf(
        SubscriptionBenefit(
            icon = Icons.Default.Home,
            title = stringResource(Res.string.onboarding_subscription_benefit_properties),
            description = stringResource(Res.string.onboarding_subscription_benefit_properties_desc),
            gradientColors = listOf(
                MaterialTheme.colorScheme.primary,
                MaterialTheme.colorScheme.secondary
            )
        ),
        SubscriptionBenefit(
            icon = Icons.Default.Folder,
            title = stringResource(Res.string.onboarding_subscription_benefit_documents),
            description = stringResource(Res.string.onboarding_subscription_benefit_documents_desc),
            gradientColors = listOf(
                Color(0xFF34C759),
                Color(0xFF30D158)
            )
        ),
        SubscriptionBenefit(
            icon = Icons.Default.Group,
            title = stringResource(Res.string.onboarding_subscription_benefit_family),
            description = stringResource(Res.string.onboarding_subscription_benefit_family_desc),
            gradientColors = listOf(
                Color(0xFFAF52DE),
                Color(0xFFBF5AF2)
            )
        ),
        SubscriptionBenefit(
            icon = Icons.Default.Share,
            title = stringResource(Res.string.onboarding_subscription_benefit_contractor_sharing),
            description = stringResource(Res.string.onboarding_subscription_benefit_contractor_sharing_desc),
            gradientColors = listOf(
                MaterialTheme.colorScheme.tertiary,
                Color(0xFFFF9500)
            )
        ),
        SubscriptionBenefit(
            icon = Icons.Default.Notifications,
            title = stringResource(Res.string.onboarding_subscription_benefit_notifications),
            description = stringResource(Res.string.onboarding_subscription_benefit_notifications_desc),
            gradientColors = listOf(
                Color(0xFFFF3B30),
                Color(0xFFFF6961)
            )
        ),
        SubscriptionBenefit(
            icon = Icons.Default.Widgets,
            title = stringResource(Res.string.onboarding_subscription_benefit_widgets),
            description = stringResource(Res.string.onboarding_subscription_benefit_widgets_desc),
            gradientColors = listOf(
                Color(0xFF007AFF),
                Color(0xFF5AC8FA)
            )
        )
    )

    WarmGradientBackground(
        modifier = Modifier.fillMaxSize()
    ) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .verticalScroll(rememberScrollState())
        ) {
            Column(
                modifier = Modifier.padding(horizontal = OrganicSpacing.xl),
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                Spacer(modifier = Modifier.height(OrganicSpacing.lg))

                // Crown header with animation
                Box(
                    modifier = Modifier.size(180.dp),
                    contentAlignment = Alignment.Center
                ) {
                    // Glow effect
                    Box(
                        modifier = Modifier
                            .size(140.dp)
                            .scale(scale)
                            .clip(CircleShape)
                            .background(
                                Brush.radialGradient(
                                    colors = listOf(
                                        MaterialTheme.colorScheme.tertiary.copy(alpha = 0.3f),
                                        Color.Transparent
                                    )
                                )
                            )
                    )

                    // Crown icon using OrganicIconContainer
                    OrganicIconContainer(
                        icon = Icons.Default.EmojiEvents,
                        size = 100.dp,
                        iconSize = 50.dp,
                        gradientColors = listOf(
                            MaterialTheme.colorScheme.tertiary,
                            Color(0xFFFF9500)
                        ),
                        contentDescription = null // decorative
                    )
                }

                // PRO badge
                Surface(
                    shape = RoundedCornerShape(OrganicRadius.full),
                    color = MaterialTheme.colorScheme.tertiary.copy(alpha = 0.15f)
                ) {
                    Row(
                        modifier = Modifier.padding(horizontal = OrganicSpacing.lg, vertical = OrganicSpacing.sm),
                        horizontalArrangement = Arrangement.spacedBy(OrganicSpacing.xs),
                        verticalAlignment = Alignment.CenterVertically
                    ) {
                        Icon(
                            Icons.Default.AutoAwesome,
                            contentDescription = null, // decorative
                            modifier = Modifier.size(16.dp),
                            tint = MaterialTheme.colorScheme.tertiary
                        )
                        Text(
                            text = stringResource(Res.string.onboarding_subscription_pro),
                            style = MaterialTheme.typography.labelLarge,
                            fontWeight = FontWeight.Black,
                            color = MaterialTheme.colorScheme.tertiary
                        )
                        Icon(
                            Icons.Default.AutoAwesome,
                            contentDescription = null, // decorative
                            modifier = Modifier.size(16.dp),
                            tint = MaterialTheme.colorScheme.tertiary
                        )
                    }
                }

                Spacer(modifier = Modifier.height(OrganicSpacing.md))

                Text(
                    text = stringResource(Res.string.onboarding_subscription_subtitle),
                    style = MaterialTheme.typography.titleLarge,
                    fontWeight = FontWeight.Bold,
                    color = MaterialTheme.colorScheme.onBackground,
                    textAlign = TextAlign.Center
                )

                Spacer(modifier = Modifier.height(OrganicSpacing.sm))

                // Social proof
                Row(
                    horizontalArrangement = Arrangement.spacedBy(OrganicSpacing.xs),
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    repeat(5) {
                        Icon(
                            Icons.Default.Star,
                            contentDescription = null, // decorative
                            modifier = Modifier.size(16.dp),
                            tint = MaterialTheme.colorScheme.tertiary
                        )
                    }
                    Text(
                        text = stringResource(Res.string.onboarding_subscription_social_proof),
                        style = MaterialTheme.typography.bodySmall,
                        color = MaterialTheme.colorScheme.onSurfaceVariant
                    )
                }

                Spacer(modifier = Modifier.height(OrganicSpacing.xl))

                // Benefits list
                Column(
                    verticalArrangement = Arrangement.spacedBy(OrganicSpacing.sm)
                ) {
                    benefits.forEach { benefit ->
                        BenefitRow(benefit = benefit)
                    }
                }

                Spacer(modifier = Modifier.height(OrganicSpacing.xl))

                // Plan selection
                Text(
                    text = stringResource(Res.string.onboarding_subscription_choose_plan),
                    style = MaterialTheme.typography.titleMedium,
                    fontWeight = FontWeight.SemiBold,
                    color = MaterialTheme.colorScheme.onBackground
                )

                Spacer(modifier = Modifier.height(OrganicSpacing.md))

                // Yearly plan
                PlanCard(
                    plan = SubscriptionPlan.YEARLY,
                    isSelected = selectedPlan == SubscriptionPlan.YEARLY,
                    onClick = { selectedPlan = SubscriptionPlan.YEARLY }
                )

                Spacer(modifier = Modifier.height(OrganicSpacing.sm))

                // Monthly plan
                PlanCard(
                    plan = SubscriptionPlan.MONTHLY,
                    isSelected = selectedPlan == SubscriptionPlan.MONTHLY,
                    onClick = { selectedPlan = SubscriptionPlan.MONTHLY }
                )

                Spacer(modifier = Modifier.height(OrganicSpacing.xl))

                // Start trial button
                OrganicPrimaryButton(
                    text = stringResource(Res.string.onboarding_subscription_start_trial),
                    onClick = {
                        isLoading = true
                        // Simulate subscription flow
                        onSubscribe()
                    },
                    modifier = Modifier.fillMaxWidth(),
                    enabled = !isLoading,
                    isLoading = isLoading,
                    icon = Icons.AutoMirrored.Filled.ArrowForward
                )

                Spacer(modifier = Modifier.height(OrganicSpacing.md))

                // Continue free button
                TextButton(onClick = onSkip) {
                    Text(
                        text = stringResource(Res.string.onboarding_subscription_continue_free),
                        style = MaterialTheme.typography.bodyMedium,
                        fontWeight = FontWeight.Medium,
                        color = MaterialTheme.colorScheme.onSurfaceVariant
                    )
                }

                Spacer(modifier = Modifier.height(OrganicSpacing.sm))

                // Legal text
                Text(
                    text = "7-day free trial, then ${if (selectedPlan == SubscriptionPlan.YEARLY) "$23.99/year" else "$2.99/month"}",
                    style = MaterialTheme.typography.bodySmall,
                    color = MaterialTheme.colorScheme.onSurfaceVariant
                )

                Text(
                    text = "Cancel anytime in Settings • No commitment",
                    style = MaterialTheme.typography.bodySmall,
                    color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.7f)
                )

                Spacer(modifier = Modifier.height(OrganicSpacing.xl * 2))
            }
        }
    }
}

@Composable
private fun BenefitRow(benefit: SubscriptionBenefit) {
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .padding(horizontal = OrganicSpacing.md, vertical = OrganicSpacing.sm),
        verticalAlignment = Alignment.CenterVertically
    ) {
        // Gradient icon using OrganicIconContainer
        OrganicIconContainer(
            icon = benefit.icon,
            size = 44.dp,
            iconSize = 24.dp,
            gradientColors = benefit.gradientColors,
            contentDescription = null // decorative
        )

        Spacer(modifier = Modifier.width(OrganicSpacing.md))

        Column(modifier = Modifier.weight(1f)) {
            Text(
                text = benefit.title,
                style = MaterialTheme.typography.bodyMedium,
                fontWeight = FontWeight.SemiBold,
                color = MaterialTheme.colorScheme.onBackground
            )
            Text(
                text = benefit.description,
                style = MaterialTheme.typography.bodySmall,
                color = MaterialTheme.colorScheme.onSurfaceVariant,
                maxLines = 2
            )
        }

        Icon(
            Icons.Default.Check,
            contentDescription = "Included",
            modifier = Modifier.size(20.dp),
            tint = benefit.gradientColors.first()
        )
    }
}

@Composable
private fun PlanCard(
    plan: SubscriptionPlan,
    isSelected: Boolean,
    onClick: () -> Unit
) {
    val isYearly = plan == SubscriptionPlan.YEARLY

    OrganicCard(
        modifier = Modifier
            .fillMaxWidth()
            .clickable { onClick() },
        accentColor = if (isSelected) MaterialTheme.colorScheme.tertiary else MaterialTheme.colorScheme.surfaceVariant,
        showBlob = isSelected
    ) {
        Row(
            modifier = Modifier.padding(OrganicSpacing.lg),
            verticalAlignment = Alignment.CenterVertically
        ) {
            // Selection indicator
            Box(
                modifier = Modifier
                    .size(24.dp)
                    .clip(CircleShape)
                    .border(
                        width = 2.dp,
                        color = if (isSelected) MaterialTheme.colorScheme.tertiary else MaterialTheme.colorScheme.outline.copy(alpha = 0.5f),
                        shape = CircleShape
                    ),
                contentAlignment = Alignment.Center
            ) {
                if (isSelected) {
                    Box(
                        modifier = Modifier
                            .size(14.dp)
                            .clip(CircleShape)
                            .background(MaterialTheme.colorScheme.tertiary)
                    )
                }
            }

            Spacer(modifier = Modifier.width(OrganicSpacing.md))

            Column(modifier = Modifier.weight(1f)) {
                Row(
                    horizontalArrangement = Arrangement.spacedBy(OrganicSpacing.sm),
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    Text(
                        text = if (isYearly) {
                            stringResource(Res.string.onboarding_subscription_yearly)
                        } else {
                            stringResource(Res.string.onboarding_subscription_monthly)
                        },
                        style = MaterialTheme.typography.titleMedium,
                        fontWeight = FontWeight.SemiBold,
                        color = MaterialTheme.colorScheme.onBackground
                    )

                    if (isYearly) {
                        Surface(
                            shape = RoundedCornerShape(OrganicRadius.full),
                            color = Color(0xFF34C759)
                        ) {
                            Text(
                                text = stringResource(Res.string.onboarding_subscription_save),
                                style = MaterialTheme.typography.labelSmall,
                                fontWeight = FontWeight.Bold,
                                color = Color.White,
                                modifier = Modifier.padding(horizontal = OrganicSpacing.sm, vertical = 2.dp)
                            )
                        }
                    }
                }

                if (isYearly) {
                    Text(
                        text = stringResource(Res.string.onboarding_subscription_yearly_monthly),
                        style = MaterialTheme.typography.bodySmall,
                        color = MaterialTheme.colorScheme.onSurfaceVariant
                    )
                }
            }

            Column(horizontalAlignment = Alignment.End) {
                Text(
                    text = if (isYearly) "$23.99" else "$2.99",
                    style = MaterialTheme.typography.titleLarge,
                    fontWeight = FontWeight.Bold,
                    color = if (isSelected) MaterialTheme.colorScheme.tertiary else MaterialTheme.colorScheme.onBackground
                )
                Text(
                    text = if (isYearly) "/year" else "/month",
                    style = MaterialTheme.typography.bodySmall,
                    color = MaterialTheme.colorScheme.onSurfaceVariant
                )
            }
        }
    }
}
