<!DOCTYPE html>
<html>
<head>
    <title><?= lang('overtime_report') ?></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');
    }

    $hh = 0;
    $mm = 0;
    $entry_count = 0;
    if (!empty($all_overtime_info)) {
        foreach ($all_overtime_info as $v_overtime_info) {
            if (!empty($v_overtime_info)) {
                foreach ($v_overtime_info as $v_overtime) {
                    $hh += (int) date('H', safe_strtotime($v_overtime->overtime_hours));
                    $mm += (int) date('i', safe_strtotime($v_overtime->overtime_hours));
                    $entry_count++;
                }
            }
        }
    }
    if ($mm > 59) {
        $hh += intval($mm / 60);
        $mm = intval($mm % 60);
    }
    $total_overtime = sprintf('%02d : %02d m', $hh, $mm);
    ?>
    <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 {
            border: 1px solid #d7deea;
            padding: 18px 20px;
            background: #f8fafc;
            margin-bottom: 18px;
        }
        .brand-logo {
            width: 60px;
            height: 60px;
            background: #ffffff;
            border: 1px solid #d7deea;
            padding: 6px;
        }
        .brand-title { font-size: 24px; font-weight: 500; color: #0f172a; margin: 0 0 4px; }
        .brand-text { font-size: 12px; color: #64748b; margin: 0; }
        .report-meta {
            width: 280px;
        <?php if (!empty($RTL)) { ?> text-align: left;
        <?php } else { ?> text-align: right;
        <?php } ?>
        }
        .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; }
        .range-chip { display: inline-block; padding: 4px 0 0; background: transparent; color: #475569; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
        .metrics { margin: 0 0 18px; }
        .metric-card { width: 32%; 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; }
        .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 } ?>
        }
        .strong { font-weight: 700; color: #0f172a; }
        .muted { color: #64748b; }
        .total-row td { padding: 14px; background: #eef2ff; border-top: 1px solid #c7d2fe; font-weight: 700; color: #1e1b4b; }
    </style>
</head>
<body>
<?php
$rootPath = defined('ROOTPATH') ? ROOTPATH : FCPATH;
$img = $rootPath . '/' . config_item('company_logo');
$a = file_exists($img);
if (empty($a)) {
    $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('overtime_report') ?></p>
                </td>
                <td class="report-meta" style="border:0;">
                    <p class="header-title"><?= lang('overtime_report') ?></p>
                    <p class="header-subtitle"><?= lang('for') ?> <?= $user_info->fullname ?> <?= $monthyaer ?></p>
                    <span class="range-chip"><?= lang('generated_on') ?> <?= display_date(date('Y-m-d')) ?></span>
                </td>
            </tr>
        </table>
    </div>

    <table class="metrics">
        <tr>
            <td class="metric-card">
                <div class="metric-label"><?= lang('employee') ?></div>
                <p class="metric-value"><?= $user_info->fullname ?></p>
                <div class="metric-note"><?= $monthyaer ?></div>
            </td>
            <td class="metric-gap"></td>
            <td class="metric-card">
                <div class="metric-label"><?= lang('total_overtime_hour') ?></div>
                <p class="metric-value"><?= $total_overtime ?></p>
                <div class="metric-note"><?= lang('approved') ?>/<?= lang('pending') ?>/<?= lang('rejected') ?></div>
            </td>
            <td class="metric-gap"></td>
            <td class="metric-card">
                <div class="metric-label"><?= lang('entries') ?></div>
                <p class="metric-value"><?= $entry_count ?></p>
                <div class="metric-note"><?= lang('records') ?></div>
            </td>
        </tr>
    </table>

    <div class="table-shell">
        <table>
            <thead>
            <tr class="table-head">
                <td><?= lang('sl') ?></td>
                <td><?= lang('overtime_date') ?></td>
                <td><?= lang('overtime_hour') ?></td>
            </tr>
            </thead>
            <tbody>
            <?php
            $row_index = 0;
            $sl = 1;
            if (!empty($all_overtime_info)) {
                foreach ($all_overtime_info as $v_overtime_info) {
                    if (!empty($v_overtime_info)) {
                        foreach ($v_overtime_info as $v_overtime) { ?>
                            <tr class="row<?= ($row_index % 2 !== 0) ? ' row-alt' : '' ?>">
                                <td><?= $sl ?></td>
                                <td><?= display_date($v_overtime->overtime_date) ?></td>
                                <td class="strong"><?= display_time($v_overtime->overtime_hours) ?></td>
                            </tr>
                        <?php $row_index++; $sl++; }
                    }
                }
            }
            if ($row_index > 0) { ?>
                <tr class="total-row">
                    <td colspan="2"><?= lang('total_overtime_hour') ?></td>
                    <td><?= $total_overtime ?></td>
                </tr>
            <?php } else { ?>
                <tr class="row">
                    <td colspan="3" class="muted"><?= lang('nothing_to_display') ?></td>
                </tr>
            <?php } ?>
            </tbody>
        </table>
    </div>
</div>
</body>
</html>
