{{-- Denison Culture Model Quadrant Visualization --}}
@php
    $denisonCategories = ['denison-mission', 'denison-adaptability', 'denison-involvement', 'denison-consistency'];
    $scores = $analytics->category_scores ?? [];
    $benchmarks = $benchmarkComparison ?? [];

    $mission = $scores['denison-mission'] ?? 0;
    $adaptability = $scores['denison-adaptability'] ?? 0;
    $involvement = $scores['denison-involvement'] ?? 0;
    $consistency = $scores['denison-consistency'] ?? 0;

    $overallCulture = round(($mission + $adaptability + $involvement + $consistency) / 4, 1);

    // Denison axis groupings
    $externalFocus = round(($mission + $adaptability) / 2, 1);
    $internalFocus = round(($involvement + $consistency) / 2, 1);
    $flexible = round(($adaptability + $involvement) / 2, 1);
    $stable = round(($mission + $consistency) / 2, 1);

    function denisonColor($score) {
        if ($score >= 80) return '#16a34a';
        if ($score >= 70) return '#65a30d';
        if ($score >= 60) return '#ca8a04';
        if ($score >= 50) return '#ea580c';
        return '#dc2626';
    }
@endphp

<div class="card">
    <div class="card-header">
        <div class="flex items-center justify-between">
            <div>
                <h3 class="font-semibold text-secondary-900">Denison Culture Profile</h3>
                <p class="text-sm text-gray-500 mt-1">Organizational culture assessment across four critical traits</p>
            </div>
            <div class="text-right">
                <div class="text-3xl font-bold text-secondary-900">{{ $overallCulture }}%</div>
                <div class="text-xs text-gray-500">Overall Culture Score</div>
            </div>
        </div>
    </div>
    <div class="card-body">
        <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
            {{-- Quadrant Visualization --}}
            <div class="relative">
                <div class="grid grid-cols-2 gap-1" style="min-height: 320px;">
                    {{-- Top-Left: Involvement (Internal + Flexible) --}}
                    <div class="rounded-tl-2xl p-5 flex flex-col justify-between relative overflow-hidden" style="background-color: {{ denisonColor($involvement) }}15; border: 2px solid {{ denisonColor($involvement) }}40;">
                        <div>
                            <div class="text-xs font-semibold uppercase tracking-wider" style="color: {{ denisonColor($involvement) }}">Internal + Flexible</div>
                            <div class="text-lg font-bold text-gray-900 mt-1">Involvement</div>
                        </div>
                        <div>
                            <div class="text-4xl font-bold" style="color: {{ denisonColor($involvement) }}">{{ round($involvement) }}%</div>
                            @if(isset($benchmarks['denison-involvement']))
                                <div class="text-xs mt-1" style="color: {{ $benchmarks['denison-involvement']['color'] }}">
                                    {{ $benchmarks['denison-involvement']['icon'] }} {{ $benchmarks['denison-involvement']['diff_text'] }} vs benchmark ({{ $benchmarks['denison-involvement']['benchmark_value'] }}%)
                                </div>
                            @endif
                            <div class="text-xs text-gray-500 mt-1 space-y-0.5">
                                <div>Empowerment</div>
                                <div>Team Orientation</div>
                                <div>Capability Development</div>
                            </div>
                        </div>
                    </div>

                    {{-- Top-Right: Adaptability (External + Flexible) --}}
                    <div class="rounded-tr-2xl p-5 flex flex-col justify-between relative overflow-hidden" style="background-color: {{ denisonColor($adaptability) }}15; border: 2px solid {{ denisonColor($adaptability) }}40;">
                        <div class="text-right">
                            <div class="text-xs font-semibold uppercase tracking-wider" style="color: {{ denisonColor($adaptability) }}">External + Flexible</div>
                            <div class="text-lg font-bold text-gray-900 mt-1">Adaptability</div>
                        </div>
                        <div class="text-right">
                            <div class="text-4xl font-bold" style="color: {{ denisonColor($adaptability) }}">{{ round($adaptability) }}%</div>
                            @if(isset($benchmarks['denison-adaptability']))
                                <div class="text-xs mt-1" style="color: {{ $benchmarks['denison-adaptability']['color'] }}">
                                    {{ $benchmarks['denison-adaptability']['icon'] }} {{ $benchmarks['denison-adaptability']['diff_text'] }} vs benchmark ({{ $benchmarks['denison-adaptability']['benchmark_value'] }}%)
                                </div>
                            @endif
                            <div class="text-xs text-gray-500 mt-1 space-y-0.5">
                                <div>Creating Change</div>
                                <div>Stakeholder Focus</div>
                                <div>Organizational Learning</div>
                            </div>
                        </div>
                    </div>

                    {{-- Bottom-Left: Consistency (Internal + Stable) --}}
                    <div class="rounded-bl-2xl p-5 flex flex-col justify-between relative overflow-hidden" style="background-color: {{ denisonColor($consistency) }}15; border: 2px solid {{ denisonColor($consistency) }}40;">
                        <div>
                            <div class="text-4xl font-bold" style="color: {{ denisonColor($consistency) }}">{{ round($consistency) }}%</div>
                            @if(isset($benchmarks['denison-consistency']))
                                <div class="text-xs mt-1" style="color: {{ $benchmarks['denison-consistency']['color'] }}">
                                    {{ $benchmarks['denison-consistency']['icon'] }} {{ $benchmarks['denison-consistency']['diff_text'] }} vs benchmark ({{ $benchmarks['denison-consistency']['benchmark_value'] }}%)
                                </div>
                            @endif
                            <div class="text-xs text-gray-500 mt-1 space-y-0.5">
                                <div>Core Values</div>
                                <div>Agreement</div>
                                <div>Coordination</div>
                            </div>
                        </div>
                        <div>
                            <div class="text-lg font-bold text-gray-900">Consistency</div>
                            <div class="text-xs font-semibold uppercase tracking-wider" style="color: {{ denisonColor($consistency) }}">Internal + Stable</div>
                        </div>
                    </div>

                    {{-- Bottom-Right: Mission (External + Stable) --}}
                    <div class="rounded-br-2xl p-5 flex flex-col justify-between relative overflow-hidden" style="background-color: {{ denisonColor($mission) }}15; border: 2px solid {{ denisonColor($mission) }}40;">
                        <div class="text-right">
                            <div class="text-4xl font-bold" style="color: {{ denisonColor($mission) }}">{{ round($mission) }}%</div>
                            @if(isset($benchmarks['denison-mission']))
                                <div class="text-xs mt-1" style="color: {{ $benchmarks['denison-mission']['color'] }}">
                                    {{ $benchmarks['denison-mission']['icon'] }} {{ $benchmarks['denison-mission']['diff_text'] }} vs benchmark ({{ $benchmarks['denison-mission']['benchmark_value'] }}%)
                                </div>
                            @endif
                            <div class="text-xs text-gray-500 mt-1 space-y-0.5">
                                <div>Strategic Direction</div>
                                <div>Goals & Objectives</div>
                                <div>Vision</div>
                            </div>
                        </div>
                        <div class="text-right">
                            <div class="text-lg font-bold text-gray-900">Mission</div>
                            <div class="text-xs font-semibold uppercase tracking-wider" style="color: {{ denisonColor($mission) }}">External + Stable</div>
                        </div>
                    </div>
                </div>

                {{-- Axis Labels --}}
                <div class="absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1 bg-blue-100 text-blue-800 text-xs font-semibold px-3 py-1 rounded-full">
                    Flexible
                </div>
                <div class="absolute bottom-0 left-1/2 transform -translate-x-1/2 translate-y-1 bg-blue-100 text-blue-800 text-xs font-semibold px-3 py-1 rounded-full">
                    Stable
                </div>
                <div class="absolute left-0 top-1/2 transform -translate-y-1/2 -translate-x-1 bg-gray-100 text-gray-700 text-xs font-semibold px-3 py-1 rounded-full">
                    Internal
                </div>
                <div class="absolute right-0 top-1/2 transform -translate-y-1/2 translate-x-1 bg-gray-100 text-gray-700 text-xs font-semibold px-3 py-1 rounded-full">
                    External
                </div>
            </div>

            {{-- Axis Scores & Insights --}}
            <div class="space-y-6">
                <div>
                    <h4 class="text-sm font-semibold text-gray-500 uppercase tracking-wider mb-3">Axis Analysis</h4>
                    <div class="space-y-3">
                        <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
                            <div>
                                <div class="text-sm font-medium text-gray-700">External Focus</div>
                                <div class="text-xs text-gray-500">Mission + Adaptability</div>
                            </div>
                            <div class="text-lg font-bold" style="color: {{ denisonColor($externalFocus) }}">{{ $externalFocus }}%</div>
                        </div>
                        <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
                            <div>
                                <div class="text-sm font-medium text-gray-700">Internal Focus</div>
                                <div class="text-xs text-gray-500">Involvement + Consistency</div>
                            </div>
                            <div class="text-lg font-bold" style="color: {{ denisonColor($internalFocus) }}">{{ $internalFocus }}%</div>
                        </div>
                        <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
                            <div>
                                <div class="text-sm font-medium text-gray-700">Flexibility</div>
                                <div class="text-xs text-gray-500">Adaptability + Involvement</div>
                            </div>
                            <div class="text-lg font-bold" style="color: {{ denisonColor($flexible) }}">{{ $flexible }}%</div>
                        </div>
                        <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
                            <div>
                                <div class="text-sm font-medium text-gray-700">Stability</div>
                                <div class="text-xs text-gray-500">Mission + Consistency</div>
                            </div>
                            <div class="text-lg font-bold" style="color: {{ denisonColor($stable) }}">{{ $stable }}%</div>
                        </div>
                    </div>
                </div>

                {{-- Key Insight --}}
                <div class="p-4 bg-blue-50 rounded-lg border border-blue-100">
                    <h4 class="text-sm font-semibold text-blue-800 mb-2">
                        <i class="fas fa-lightbulb mr-1"></i> Key Insight
                    </h4>
                    <p class="text-sm text-blue-700">
                        @if($mission > 70 && $adaptability < 55)
                            The organization has a strong sense of direction and clear strategic goals, but struggles to translate that clarity into agile responses to change. Employees understand the vision but may feel constrained in how they can adapt and innovate.
                        @elseif($consistency > 65 && $involvement < 55)
                            Systems and processes are well-established, but employee empowerment and team engagement need attention. The culture may be experienced as top-down, with limited opportunity for staff to contribute to decision-making.
                        @elseif($externalFocus > $internalFocus + 10)
                            The organization is more externally-oriented than internally-focused. While strategy and market awareness are strong, internal alignment and employee engagement require investment.
                        @elseif($stable > $flexible + 10)
                            The culture favors stability and direction over flexibility and empowerment. This provides consistency but may limit the organization's ability to adapt quickly and empower innovation.
                        @else
                            The culture profile shows a balanced but moderate pattern. There is opportunity to strengthen all four traits, with particular focus on the lowest-scoring areas to drive meaningful improvement.
                        @endif
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- Denison Model Explanation --}}
<div class="card mt-6">
    <div class="card-header bg-gray-50">
        <h3 class="font-semibold text-gray-700">
            <i class="fas fa-book-open mr-2"></i>
            About the Denison Organizational Culture Model
        </h3>
    </div>
    <div class="card-body text-sm text-gray-600 space-y-3">
        <p>The Denison Model is one of the most widely researched and validated culture assessment tools globally, with a benchmark database of over 8,000 organizations. It measures four critical cultural traits:</p>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-3">
            <div class="p-3 rounded-lg bg-gray-50">
                <div class="font-semibold text-gray-800">Mission</div>
                <p class="text-xs mt-1">Does the organization have a clear sense of purpose and long-term direction? Covers strategic direction, goals and objectives, and vision.</p>
            </div>
            <div class="p-3 rounded-lg bg-gray-50">
                <div class="font-semibold text-gray-800">Adaptability</div>
                <p class="text-xs mt-1">Can the organization respond to external changes effectively? Covers creating change, stakeholder focus, and organizational learning.</p>
            </div>
            <div class="p-3 rounded-lg bg-gray-50">
                <div class="font-semibold text-gray-800">Involvement</div>
                <p class="text-xs mt-1">Are people aligned, engaged, and capable? Covers empowerment, team orientation, and capability development.</p>
            </div>
            <div class="p-3 rounded-lg bg-gray-50">
                <div class="font-semibold text-gray-800">Consistency</div>
                <p class="text-xs mt-1">Are systems and processes aligned to create internal stability? Covers core values, agreement, and coordination & integration.</p>
            </div>
        </div>
        <p class="text-xs text-gray-400 mt-2">Scores represent favorability percentage (% of responses rating 4 or 5 on a 5-point Likert scale). Higher scores indicate stronger cultural traits.</p>
    </div>
</div>