<div class="rounded-2xl border border-border bg-card shadow-sm">
    <div class="flex flex-col gap-3 border-b border-border px-5 py-4 md:flex-row md:items-start md:justify-between">
        <div>
            <h3 class="text-base font-semibold text-foreground"><?= $read_mail->subject; ?></h3>
            <p class="text-xs text-muted-foreground">
                <?php if (!empty($reply)) { ?>
                    <?= lang('from') ?>: <?= $read_mail->from; ?>
                <?php } else { ?>
                    <?= lang('to') ?>: <?= $read_mail->to; ?>
                <?php } ?>
                Â· <?= date('d M , Y h:i:A', safe_strtotime($read_mail->message_time)) ?>
            </p>
        </div>
        <?php if (!empty($reply)) { ?>
            <div class="flex items-center gap-2">
                <a href="<?= base_url() ?>client/mailbox/index/compose/<?= $read_mail->inbox_id ?>/reply"
                   class="inline-flex items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 text-xs font-semibold text-foreground hover:bg-muted">
                    <i data-lucide="reply" class="h-4 w-4 shrink-0"></i><?= lang('reply') ?>
                </a>
                <a href="<?= base_url() ?>client/mailbox/delete_inbox_mail/<?= $read_mail->inbox_id ?>"
                   class="inline-flex items-center gap-2 rounded-lg bg-rose-50 px-3 py-2 text-xs font-semibold text-rose-600 hover:bg-rose-100">
                    <i data-lucide="trash-2" class="h-4 w-4 shrink-0"></i><?= lang('delete') ?>
                </a>
            </div>
        <?php } ?>
    </div>
    <div class="p-5 text-sm text-foreground">
        <div class="prose max-w-none text-sm text-foreground">
            <?= $read_mail->message_body; ?>
        </div>
    </div>
    <?php
    $uploaded_file = !empty($read_mail->attach_file) ? json_decode($read_mail->attach_file) : array();
    if (!empty($uploaded_file)):
    ?>
        <div class="border-t border-border px-5 py-4">
            <h4 class="text-sm font-semibold text-foreground mb-3"><?= lang('attachment') ?></h4>
            <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
                <?php foreach ($uploaded_file as $v_files): ?>
                    <?php if (!empty($v_files)): ?>
                        <div class="rounded-xl border border-border bg-muted/20 p-3">
                            <?php if (!empty($v_files->is_image) && $v_files->is_image == 1) : ?>
                                <img src="<?= base_url() . $v_files->path ?>" alt="Attachment" class="mb-2 h-28 w-full rounded-lg object-cover">
                            <?php else : ?>
                                <div class="mb-2 flex h-28 items-center justify-center rounded-lg bg-white text-2xl text-muted-foreground">
                                    <i data-lucide="file-text" class="h-8 w-8"></i>
                                </div>
                            <?php endif; ?>
                            <div class="text-xs font-semibold text-foreground truncate"><?= $v_files->fileName ?></div>
                            <div class="mt-1 flex items-center justify-between text-[11px] text-muted-foreground">
                                <span><?= $v_files->size ?> <?= lang('kb') ?></span>
                                <a href="<?= base_url() ?>client/mailbox/download_file/<?= $v_files->fileName ?>"
                                   class="inline-flex items-center gap-1 rounded-md border border-border bg-card px-2 py-1 text-[11px] font-semibold text-foreground hover:bg-muted">
                                    <i data-lucide="download" class="h-3.5 w-3.5 shrink-0"></i><?= lang('download') ?>
                                </a>
                            </div>
                        </div>
                    <?php endif; ?>
                <?php endforeach; ?>
            </div>
        </div>
    <?php endif; ?>
</div>


