package com.craigvg.lichun_android.ui.screens.events.components

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
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.unit.dp
import androidx.compose.ui.unit.sp
import com.craigvg.lichun_android.ui.theme.AppColors
import com.craigvg.lichun_android.ui.theme.AppSpacing
import com.craigvg.lichun_android.ui.theme.AppTypography

/**
 * Stats header showing energy, diamonds, and money at top of event modal.
 * Extracted from EventModal.kt
 */
@Composable
fun EventStatsHeader(
    energy: Int,
    diamonds: Int,
    money: Double,
    modifier: Modifier = Modifier
) {
    Row(
        modifier = modifier
            .fillMaxWidth()
            .background(
                Brush.horizontalGradient(
                    colors = listOf(
                        AppColors.primary.copy(alpha = 0.2f),
                        AppColors.secondary.copy(alpha = 0.2f)
                    )
                ),
                RoundedCornerShape(topStart = AppSpacing.largeCornerRadius, topEnd = AppSpacing.largeCornerRadius)
            )
            .padding(horizontal = AppSpacing.md, vertical = AppSpacing.sm),
        horizontalArrangement = Arrangement.SpaceEvenly
    ) {
        EventResourcePill(emoji = "\u26a1\ufe0f", value = energy, color = AppColors.energy)
        EventResourcePill(emoji = "\ud83d\udc8e", value = diamonds, color = AppColors.diamond)
        EventResourcePill(emoji = "\ud83d\udcb0", value = money.toInt(), color = AppColors.money)
    }
}

@Composable
internal fun EventResourcePill(
    emoji: String,
    value: Int,
    color: Color
) {
    Row(
        modifier = Modifier
            .background(color.copy(alpha = 0.3f), CircleShape)
            .padding(horizontal = AppSpacing.sm, vertical = 6.dp),
        verticalAlignment = Alignment.CenterVertically
    ) {
        Text(text = emoji, fontSize = 14.sp)
        Spacer(modifier = Modifier.width(4.dp))
        Text(text = "$value", style = AppTypography.captionBold, color = AppColors.primaryText)
    }
}