{{--  GEAS_COMPTABLE_v2  --}}
{{-- 
    :::comparison-table
    columns: [Feature, GE-AS, Tactical Arbitrage, SellerAmp]
    highlight: 1                                    (optional: index of column to highlight, default 1 for GE-AS)
    rows:
      - [Starting capital, "$50", "$60/mo", "$97/mo"]
      - [AI trading plans, true, false, false]
      - [Copy trading, true, false, false]
    :::
    
    Cell values of `true`/`false` render as green check / red dash.
--}}
@php
    $columns = $columns ?? [];
    $rows = $rows ?? [];
    $highlight = (int) ($highlight ?? 1);
    $caption = $caption ?? null;
@endphp

@if(!empty($columns) && !empty($rows))
<div style="margin: 2.5rem 0; overflow-x: auto; border-radius: 12px; border: 1px solid #e2e8f0; background: #ffffff;">
    <table style="width: 100%; min-width: 640px; border-collapse: collapse; font-family: 'DM Sans', sans-serif;">
        <thead>
            <tr style="background: #f8fafc; border-bottom: 2px solid #e2e8f0;">
                @foreach($columns as $ci => $col)
                    <th style="padding: 1rem 1.25rem; text-align: {{ $ci === 0 ? 'left' : 'center' }}; font-size: 0.8125rem; font-weight: 600; color: {{ $ci === $highlight ? '#c2410c' : '#334155' }}; letter-spacing: 0.01em; white-space: nowrap; {{ $ci === $highlight ? 'background: #fff7ed;' : '' }} {{ $ci === 0 ? 'position: sticky; left: 0; background: #f8fafc; z-index: 1;' : '' }}">
                        {{ $col }}
                    </th>
                @endforeach
            </tr>
        </thead>
        <tbody>
            @foreach($rows as $ri => $row)
                <tr style="border-bottom: 1px solid #f1f5f9; {{ $ri % 2 === 1 ? 'background: #fafbfc;' : '' }}">
                    @foreach($row as $ci => $cell)
                        <td style="padding: 0.875rem 1.25rem; text-align: {{ $ci === 0 ? 'left' : 'center' }}; font-size: 0.9375rem; color: #334155; vertical-align: middle; {{ $ci === $highlight ? 'background: #fff7ed;' : '' }} {{ $ci === 0 ? 'position: sticky; left: 0; background: ' . ($ri % 2 === 1 ? '#fafbfc' : '#ffffff') . '; font-weight: 500; color: #0f172a; z-index: 1;' : '' }}">
                            @if($cell === true || $cell === 'true')
                                <span style="display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #d1fae5; color: #10b981; font-weight: 700;">✓</span>
                            @elseif($cell === false || $cell === 'false')
                                <span style="display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #fee2e2; color: #ef4444; font-weight: 700;">−</span>
                            @else
                                {!! $cell !!}
                            @endif
                        </td>
                    @endforeach
                </tr>
            @endforeach
        </tbody>
        @if($caption)
            <caption style="caption-side: bottom; padding: 0.75rem 1.25rem; font-size: 0.8125rem; color: #64748b; text-align: left; font-style: italic;">
                {{ $caption }}
            </caption>
        @endif
    </table>
</div>
@endif