<?php

declare(strict_types=1);

$pageTitle = trim((string)($title ?? 'Installation'));
$appName = (string)($config['application'] ?? 'Darlink ERP');
$version = (string)($config['version'] ?? '');
$currentStep = max(1, (int)($step ?? 1));
$totalSteps = max(1, (int)($config['total_steps'] ?? 8));
$progressValue = max(
    0,
    min(100, (int)($progress ?? round(($currentStep / $totalSteps) * 100)))
);
?>
<!doctype html>
<html lang="fr">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title><?= htmlspecialchars($pageTitle . ' — ' . $appName, ENT_QUOTES, 'UTF-8') ?></title>

    <link
        href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
        rel="stylesheet"
    >

    <link
        href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
        rel="stylesheet"
    >

    <link href="Assets/css/install.css" rel="stylesheet">
</head>
<body class="darlink-install-body">

<div class="darlink-install-shell">
    <main class="darlink-install-card">
        <header class="darlink-install-header">
            <div class="darlink-install-brand">
                <div class="darlink-install-logo">
                    <span>DARLINK</span>
                    <small>ERP</small>
                </div>

                <div>
                    <h1><?= htmlspecialchars($appName, ENT_QUOTES, 'UTF-8') ?></h1>
                    <p><?= htmlspecialchars($version, ENT_QUOTES, 'UTF-8') ?></p>
                </div>
            </div>

            <div class="darlink-install-step">
                Étape <?= $currentStep ?> / <?= $totalSteps ?>
            </div>
        </header>

        <section class="darlink-install-progress">
            <div class="d-flex justify-content-between align-items-center mb-2">
                <strong>Progression de l’installation</strong>
                <span><?= $progressValue ?> %</span>
            </div>

            <div
                class="progress"
                role="progressbar"
                aria-valuenow="<?= $progressValue ?>"
                aria-valuemin="0"
                aria-valuemax="100"
            >
                <div
                    class="progress-bar"
                    style="width: <?= $progressValue ?>%"
                ></div>
            </div>
        </section>

        <section class="darlink-install-content">
            <?php require $viewFile; ?>
        </section>

        <footer class="darlink-install-footer">
            <span>
                <?= htmlspecialchars(
                    (string)($config['application'] ?? 'Darlink ERP'),
                    ENT_QUOTES,
                    'UTF-8'
                ) ?>
                —
                <?= htmlspecialchars(
                    (string)($config['wizard_build'] ?? 'P1.1'),
                    ENT_QUOTES,
                    'UTF-8'
                ) ?>
            </span>

            <span>Assistant d’installation officiel</span>
        </footer>
    </main>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="Assets/js/install.js"></script>
</body>
</html>
