<!DOCTYPE html>
<html>
<head>
    <title><?= lang('salary_details') ?></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <?php
    $direction = $this->session->userdata('direction');
    if (!empty($direction) && $direction == 'rtl') {
        $RTL = 'on';
    } else {
        $RTL = config_item('RTL');
    }

    $currency = $this->db->where('code', config_item('default_currency'))->get('tbl_currencies')->row();
    $total_allowance = 0;
    if (!empty($salary_allowance_info)) {
        foreach ($salary_allowance_info as $v_allowance_info) {
            $total_allowance += $v_allowance_info->allowance_value;
        }
    }

    $total_deduction = 0;
    if (!empty($salary_deduction_info)) {
        foreach ($salary_deduction_info as $v_deduction_info) {
            $total_deduction += $v_deduction_info->deduction_value;
        }
    }

    $basic_salary = !empty($emp_salary_info->basic_salary) ? $emp_salary_info->basic_salary : 0;
    $gross_salary = $basic_salary + $total_allowance;
    $net_salary = $gross_salary - $total_deduction;
    ?>
    <style>
        body { margin: 0; color: #172033; background: #ffffff; font: 12px/1.55 DejaVu Sans, Arial, Helvetica, sans-serif; min-width: 100%; min-height: 100%;<?php if (!empty($RTL)) { ?> text-align: right;<?php } ?> }
        table { width: 100%; border-collapse: collapse; border-spacing: 0;<?php if (!empty($RTL)) { ?> text-align: right;<?php } ?> }
        .page-wrap { padding: 18px 22px 24px; }
        .brand-shell, .profile-shell { border: 1px solid #d7deea; padding: 18px 20px; background: #f8fafc; margin-bottom: 18px; }
        .brand-logo, .profile-photo { width: 60px; height: 60px; background: #ffffff; border: 1px solid #d7deea; padding: 6px; }
        .profile-photo { width: 108px; height: 108px; padding: 4px; }
        .brand-title { font-size: 24px; font-weight: 500; color: #0f172a; margin: 0 0 4px; }
        .brand-text { font-size: 12px; color: #64748b; margin: 0; }
        .header-title { font-size: 20px; font-weight: 700; color: #0f172a; margin: 0 0 4px; line-height: 1.15; }
        .header-subtitle { font-size: 10px; color: #64748b; margin: 0; line-height: 1.35; }
        .report-meta { width: 300px;<?php if (!empty($RTL)) { ?> text-align: left;<?php } else { ?> text-align: right;<?php } ?> }
        .range-chip { display: inline-block; padding-top: 4px; color: #475569; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
        .employee-name { font-size: 22px; font-weight: 700; color: #0f172a; margin: 0 0 6px; }
        .detail-row td { padding: 5px 0; font-size: 11px; }
        .label { width: 34%; color: #64748b; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
        .value { color: #0f172a; }
        .metrics { margin: 0 0 18px; }
        .metric-card { width: 23.5%; border: 1px solid #d7deea; background: #ffffff; padding: 14px 16px; vertical-align: top; }
        .metric-gap { width: 2%; }
        .metric-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; color: #64748b; margin-bottom: 6px; }
        .metric-value { font-size: 21px; font-weight: 700; color: #0f172a; margin: 0; }
        .metric-note { font-size: 11px; color: #94a3b8; margin-top: 4px; }
        .table-shell { border: 1px solid #d7deea; overflow: hidden; background: #ffffff; margin-bottom: 18px; }
        .table-shell table { border-collapse: separate; border-spacing: 0; }
        .table-head td { background: #1e293b; color: #f8fafc; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 12px 14px; border-bottom: 1px solid #1e293b; }
        .row td { padding: 12px 14px; border-bottom: 1px solid #e2e8f0; color: #1e293b; vertical-align: top; }
        .row-alt td { background: #f8fafc; }
        .number {<?php if (!empty($RTL)) { ?> text-align: left;<?php } else { ?> text-align: right;<?php } ?> }
        .muted { color: #64748b; }
        .total-row td { padding: 14px; background: #eef2ff; border-top: 1px solid #c7d2fe; font-weight: 700; color: #1e1b4b; }
        .strong { font-weight: 700; }
    </style>
</head>
<body>
<?php
$rootPath = defined('ROOTPATH') ? ROOTPATH : FCPATH;
$img = $rootPath . '/' . config_item('company_logo');
if (!file_exists($img)) {
    $img = base_url() . config_item('company_logo');
}
if (!file_exists($img)) {
    $img = $rootPath . '/uploads/default_logo.png';
}
?>
<div class="page-wrap">
    <div class="brand-shell">
        <table>
            <tr>
                <td style="width: 84px; border: 0;"><img class="brand-logo" src="<?= $img ?>" alt="<?= config_item('company_name') ?>"></td>
                <td style="border: 0;"><p class="brand-title"><?= config_item('company_name') ?></p><p class="brand-text"><?= lang('salary_details') ?></p></td>
                <td class="report-meta" style="border: 0;"><p class="header-title"><?= lang('salary_details') ?></p><p class="header-subtitle">Employee compensation template, earnings structure, and net salary overview.</p><span class="range-chip"><?= lang('generated_on') ?> <?= display_date(date('Y-m-d')) ?></span></td>
            </tr>
        </table>
    </div>

    <div class="profile-shell">
        <table>
            <tr>
                <td style="width: 132px; border: 0;"><img class="profile-photo" src="<?= staffImage($emp_salary_info->user_id); ?>" alt="<?= $emp_salary_info->fullname ?>"></td>
                <td style="border: 0;">
                    <p class="employee-name"><?= $emp_salary_info->fullname ?></p>
                    <table>
                        <tr class="detail-row"><td class="label"><?= lang('emp_id') ?></td><td class="value"><?= $emp_salary_info->employment_id ?></td></tr>
                        <tr class="detail-row"><td class="label"><?= lang('departments') ?></td><td class="value"><?= $emp_salary_info->deptname ?></td></tr>
                        <tr class="detail-row"><td class="label"><?= lang('designation') ?></td><td class="value"><?= $emp_salary_info->designations ?></td></tr>
                        <tr class="detail-row"><td class="label"><?= lang('joining_date') ?></td><td class="value"><?= display_date($emp_salary_info->joining_date) ?></td></tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>

    <table class="metrics">
        <tr>
            <td class="metric-card"><div class="metric-label"><?= lang('salary_grade') ?></div><p class="metric-value"><?= !empty($emp_salary_info->salary_grade) ? $emp_salary_info->salary_grade : '-' ?></p><div class="metric-note"><?= lang('template') ?></div></td>
            <td class="metric-gap"></td>
            <td class="metric-card"><div class="metric-label"><?= lang('basic_salary') ?></div><p class="metric-value"><?= display_money($basic_salary, $currency->symbol) ?></p><div class="metric-note"><?= !empty($emp_salary_info->overtime_salary) ? lang('overtime') . ': ' . display_money($emp_salary_info->overtime_salary, $currency->symbol) : lang('standard') ?></div></td>
            <td class="metric-gap"></td>
            <td class="metric-card"><div class="metric-label"><?= lang('gross_salary') ?></div><p class="metric-value"><?= display_money($gross_salary, $currency->symbol) ?></p><div class="metric-note"><?= lang('allowances') ?>: <?= display_money($total_allowance, $currency->symbol) ?></div></td>
            <td class="metric-gap"></td>
            <td class="metric-card"><div class="metric-label"><?= lang('net_salary') ?></div><p class="metric-value"><?= display_money($net_salary, $currency->symbol) ?></p><div class="metric-note"><?= lang('total_deduction') ?>: <?= display_money($total_deduction, $currency->symbol) ?></div></td>
        </tr>
    </table>

    <div class="table-shell">
        <table>
            <thead><tr class="table-head"><td><?= lang('salary_details') ?></td><td class="number"><?= lang('amount') ?></td></tr></thead>
            <tbody>
                <tr class="row"><td class="strong"><?= lang('salary_grade') ?></td><td class="number"><?= !empty($emp_salary_info->salary_grade) ? $emp_salary_info->salary_grade : '-' ?></td></tr>
                <tr class="row row-alt"><td class="strong"><?= lang('basic_salary') ?></td><td class="number"><?= display_money($basic_salary, $currency->symbol) ?></td></tr>
                <tr class="row"><td class="strong"><?= lang('overtime') ?> (<?= lang('per_hour') ?>)</td><td class="number"><?= !empty($emp_salary_info->overtime_salary) ? display_money($emp_salary_info->overtime_salary, $currency->symbol) : '-' ?></td></tr>
            </tbody>
        </table>
    </div>

    <div class="table-shell">
        <table>
            <thead><tr class="table-head"><td><?= lang('allowances') ?></td><td class="number"><?= lang('amount') ?></td></tr></thead>
            <tbody>
            <?php if (!empty($salary_allowance_info)): foreach ($salary_allowance_info as $index => $v_allowance_info): ?>
                <tr class="row<?= ($index % 2 !== 0) ? ' row-alt' : '' ?>"><td class="strong"><?= $v_allowance_info->allowance_label ?></td><td class="number"><?= display_money($v_allowance_info->allowance_value, $currency->symbol) ?></td></tr>
            <?php endforeach; ?>
                <tr class="total-row"><td><?= lang('total') ?></td><td class="number"><?= display_money($total_allowance, $currency->symbol) ?></td></tr>
            <?php else: ?>
                <tr class="row"><td colspan="2" class="muted"><?= lang('nothing_to_display') ?></td></tr>
            <?php endif; ?>
            </tbody>
        </table>
    </div>

    <div class="table-shell">
        <table>
            <thead><tr class="table-head"><td><?= lang('deductions') ?></td><td class="number"><?= lang('amount') ?></td></tr></thead>
            <tbody>
            <?php if (!empty($salary_deduction_info)): foreach ($salary_deduction_info as $index => $v_deduction_info): ?>
                <tr class="row<?= ($index % 2 !== 0) ? ' row-alt' : '' ?>"><td class="strong"><?= $v_deduction_info->deduction_label ?></td><td class="number"><?= display_money($v_deduction_info->deduction_value, $currency->symbol) ?></td></tr>
            <?php endforeach; ?>
                <tr class="total-row"><td><?= lang('total') ?></td><td class="number"><?= display_money($total_deduction, $currency->symbol) ?></td></tr>
            <?php else: ?>
                <tr class="row"><td colspan="2" class="muted"><?= lang('nothing_to_display') ?></td></tr>
            <?php endif; ?>
            </tbody>
        </table>
    </div>

    <div class="table-shell">
        <table>
            <thead><tr class="table-head"><td><?= lang('total_salary_details') ?></td><td class="number"><?= lang('amount') ?></td></tr></thead>
            <tbody>
                <tr class="row"><td class="strong"><?= lang('gross_salary') ?></td><td class="number"><?= display_money($gross_salary, $currency->symbol) ?></td></tr>
                <tr class="row row-alt"><td class="strong"><?= lang('total_deduction') ?></td><td class="number"><?= display_money($total_deduction, $currency->symbol) ?></td></tr>
                <tr class="total-row"><td><?= lang('net_salary') ?></td><td class="number"><?= display_money($net_salary, $currency->symbol) ?></td></tr>
            </tbody>
        </table>
    </div>
</div>
</body>
</html>
