@php
/*
|----------------------------------------------------------------------
| TALLY-STYLE BALANCE SHEET
| Left = Liabilities + Capital
| Right = Assets
|----------------------------------------------------------------------
*/

// Split top-level natures into two sides
$leftSide = []; // Liabilities, Capital, Equity, etc.
$rightSide = []; // Assets

$leftTotal = 0;
$rightTotal = 0;

foreach ($group as $key => $nature) {
$natureName = strtolower($nature['group_nature'] ?? '');
if (str_contains($natureName, 'asset')) {
$rightSide[$key] = $nature;
$rightTotal += $nature['amount'] ?? 0;
} else {
$leftSide[$key] = $nature;
$leftTotal += $nature['amount'] ?? 0;
}
}

// 🔴 Move Equity nature to the bottom of the Liabilities side
$equityNature = null;
foreach ($leftSide as $key => $nature) {
if (strtolower($nature['group_nature'] ?? '') === 'equity') {
$equityNature = $nature;
unset($leftSide[$key]);
break;
}
}
if ($equityNature) {
$leftSide[] = $equityNature;
}

// Mandatory groups that should ALWAYS show
$mandatoryGroups = [
'Fixed Assets', 'Investment', 'Investments', 'Current Assets',
'Capital Accounts', 'Loan Accounts', 'Current Liability', 'Current Liabilities'
];

// Helper: render one side recursively, returns HTML string
function renderSide(array $natures, string $fromDate, string $toDate, array $mandatoryGroups): string
{
$ledgerBase = route('account-ledger-report.index');
$html = '';
static $grpId = 0;

foreach ($natures as $L1 => $nature) {
if (!is_array($nature) || !isset($nature['group_nature'])) continue;

$hasMandatory = false;
foreach ($nature as $L2 => $grp) {
if (is_array($grp) && isset($grp['group_name']) && in_array($grp['group_name'], $mandatoryGroups)) {
$hasMandatory = true;
break;
}
}

if (round(abs($nature['amount'] ?? 0), 2) == 0 && !$hasMandatory) continue;

if (strtolower($nature['group_nature'] ?? '') !== 'equity') {
$html .= '<tr class="bs-lvl1">';
    $html .= '<td colspan="2" style="font-weight:bold;font-size:14px;background:#C9D5F0;padding:4px 8px;">'
        . e($nature['group_nature'])
        . '</td>';
    $html .= '</tr>';
}

foreach ($nature as $L2 => $grp) {
if (!is_array($grp) || !isset($grp['group_name'])) continue;

$isMandatory = in_array($grp['group_name'], $mandatoryGroups);
if (round(abs($grp['amount'] ?? 0), 2) == 0 && !$isMandatory) continue;

$nameToShow = e($grp['group_name']);
if ($grp['group_name'] === 'Current Year Profit') {
$plLink = route('profit-and-loss-report.index')
. '?from_date=' . urlencode($fromDate)
. '&to_date=' . urlencode($toDate);
$nameToShow = '<a href="' . $plLink . '" class="bs-ledger-link" target="_blank" title="View P&L">'
    . $nameToShow . '</a>';
}

$html .= '<tr class="bs-lvl2">';
    $html .= '<td style="padding-left:14px;font-weight:bold;background:#D9E1F2;">'
        . $nameToShow . '</td>';
    $html .= '<td class="text-end" style="font-weight:bold;background:#D9E1F2;white-space:nowrap;">'
        . number_format($grp['amount'], 2) . '</td>';
    $html .= '</tr>';

foreach ($grp as $L3 => $aGrp) {
if (!is_array($aGrp) || !isset($aGrp['a_group_name'])) continue;
if (round(abs($aGrp['amount'] ?? 0), 2) == 0) continue;
$ledgers = array_filter($aGrp, fn($v) =>
is_array($v) && isset($v['ledger_account']) && round(abs($v['amount'] ?? 0), 2) != 0
);

$grpId++;
$hasChildren = count($ledgers) > 0;
$chevron = $hasChildren ? '<i class="fa fa-chevron-right bs-chevron" style="font-size:10px; margin-right:5px;"></i>' : '';
// Default to collapsed if has children
$rowClass = $hasChildren ? 'bs-toggle bs-collapsed' : '';

$html .= '<tr class="bs-lvl3 ' . $rowClass . '" data-target="group-' . $grpId . '" style="cursor:pointer;">';
    $html .= '<td style="padding-left:28px;color:#333;">' . $chevron . e($aGrp['a_group_name']) . '</td>';
    $html .= '<td class="text-end" style="color:#333;white-space:nowrap;">'
        . number_format($aGrp['amount'], 2) . '</td>';
    $html .= '</tr>';

foreach ($ledgers as $ledger) {
$ledId = $ledger['ledger_id'] ?? null;
$ledName = $ledger['ledger_account'];
$ledAmt = $ledger['amount'];

$link = ($ledId === 'CLOSING_STOCK')
? route('stock-valuation.index') . '?as_of_date=' . urlencode($toDate)
: ($ledId
? $ledgerBase . '?ledger_id=' . $ledId
. '&from_date=' . urlencode($fromDate)
. '&to_date=' . urlencode($toDate)
: '#');

// Hidden by default
$html .= '<tr class="bs-lvl4 group-' . $grpId . '" style="display:none;">';
    $html .= '<td style="padding-left:44px;">'
        . '<a href="' . $link . '" class="bs-ledger-link" target="_blank" title="Open Ledger">'
            . e($ledName) . '</a></td>';
    $html .= '<td class="text-end" style="white-space:nowrap;">'
        . number_format($ledAmt, 2) . '</td>';
    $html .= '</tr>';
}
}
}
}
return $html;
}
@endphp

<style>
    .bs-wrapper {
        display: flex;
        gap: 0;
        font-family: 'Courier New', monospace;
        font-size: 15px;
        /* Increased from 13px */
        color: #000;
        border: 1px solid #4472C4;
    }

    .bs-side {
        flex: 1;
        border-right: 2px solid #4472C4;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .bs-side:last-child {
        border-right: none;
    }

    .bs-side table {
        width: 100%;
        border-collapse: collapse;
    }

    .bs-side table td {
        border-bottom: 1px solid #c8d4ee;
        padding: 3px 6px;
        vertical-align: middle;
    }

    .bs-header-row {
        background: #36506b;
        color: #fff;
        font-weight: bold;
        font-size: 15px;
        /* Increased */
        text-align: center;
        padding: 8px 10px;
    }

    .bs-total-row td {
        background: #B4C6E7 !important;
        font-weight: bold;
        font-size: 15px;
        /* Increased */
        border-top: 2px solid #4472C4 !important;
    }

    .bs-ledger-link {
        color: #1a3a8f;
        text-decoration: none;
    }

    .bs-ledger-link:hover {
        text-decoration: underline;
        color: #0056b3;
    }

    .bs-lvl1 td {
        background: #C9D5F0 !important;
        font-weight: bold;
        font-size: 16px;
    }

    .bs-lvl2 td {
        background: #D9E1F2 !important;
        font-size: 15px;
    }

    .bs-lvl3 td {
        background: #ECEFF9 !important;
        font-size: 14px;
    }

    .bs-lvl4 td {
        background: #F8F9FE !important;
        font-size: 14px;
    }

    .bs-title {
        text-align: center;
        font-size: 18px;
        font-weight: bold;
        padding: 10px 0 4px;
        color: #1a3a8f;
        border-bottom: 2px solid #4472C4;
        margin-bottom: 8px;
        font-family: Arial, sans-serif;
    }

    .bs-subtitle {
        text-align: center;
        font-size: 12px;
        color: #555;
        margin-bottom: 10px;
        font-family: Arial, sans-serif;
    }

    /* Chevron Rotation */
    .bs-chevron {
        transition: transform 0.2s;
    }

    .bs-toggle:not(.bs-collapsed) .bs-chevron {
        transform: rotate(90deg);
    }

    @media (max-width: 768px) {
        .bs-wrapper {
            flex-direction: column;
        }

        .bs-side {
            border-right: none !important;
            border-bottom: 2px solid #4472C4;
        }

        .bs-side:last-child {
            border-bottom: none;
        }
    }
</style>

<div class="bs-title">Balance Sheet</div>
<div class="bs-subtitle">As on {{ date('d-M-Y', strtotime($toDate)) }}</div>

<div class="bs-wrapper">

    {{-- ============ LEFT SIDE: Liabilities + Capital ============ --}}
    <div class="bs-side">
        <div class="bs-header-row">LIabilities</div>
        <div style="flex-grow: 1;">
            <table>
                <tbody>
                    {!! renderSide($leftSide, $fromDate, $toDate, $mandatoryGroups) !!}
                </tbody>
            </table>
        </div>
        <table>
            <tfoot>
                <tr class="bs-total-row">
                    <td>Total Liabilities &amp; Capital</td>
                    <td class="text-end" style="white-space:nowrap; width:130px;">{{ number_format($leftTotal, 2) }}</td>
                </tr>
            </tfoot>
        </table>
    </div>

    {{-- ============ RIGHT SIDE: Assets ============ --}}
    <div class="bs-side">
        <div class="bs-header-row">Assets</div>
        <div style="flex-grow: 1;">
            <table>
                <tbody>
                    {!! renderSide($rightSide, $fromDate, $toDate, $mandatoryGroups) !!}
                </tbody>
            </table>
        </div>
        <table>
            <tfoot>
                <tr class="bs-total-row">
                    <td>Total Assets</td>
                    <td class="text-end" style="white-space:nowrap; width:130px;">{{ number_format($rightTotal, 2) }}</td>
                </tr>
            </tfoot>
        </table>
    </div>

</div>

@if(round(abs($leftTotal - $rightTotal), 2) > 0)
<div class="alert alert-warning mt-2 py-1" style="font-size:12px;">
    ⚠️ Balance Sheet is out of balance by
    <strong>{{ number_format(abs($leftTotal - $rightTotal), 2) }}</strong>
</div>
@endif

<script>
    document.querySelectorAll('.bs-toggle').forEach(row => {
        row.addEventListener('click', function() {
            const targetClass = this.getAttribute('data-target');
            const children = document.querySelectorAll('.' + targetClass);

            const wasCollapsed = this.classList.contains('bs-collapsed');
            this.classList.toggle('bs-collapsed');

            children.forEach(child => {
                child.style.display = wasCollapsed ? 'table-row' : 'none';
            });
        });
    });
</script>