    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">

    <link rel="stylesheet" href="<?= base_url('/css/style.css') . '?' . rand() ?>" />
    <link rel="stylesheet" href="<?= base_url('/css/home.css') . '?' . rand() ?>" />

    <style>
        nav a {
            text-decoration: none;
            color: #dd810f;
            font-weight: 600;
            transition: color 0.3s ease;
        }

        nav a:hover {
            color: #e04d2b;
            font-weight: 700;
        }
    </style>

    <div style="position: relative; z-index: 1; height: 7.5rem;">

        <div style="position: absolute; z-index: 10;">
            <a class="/*button*/" href="<?= url_to('Home::index') ?>"><img style="max-width: 20rem; border-style: solid; border-width: 2px; border-radius: 10px; border-color:#213242 ;" src="<?= base_url('/images/RoastPRO-02.jpg') ?>" alt=""></a>
        </div>


        <!-- <div style="position: relative; top: 10px; left:296px; z-index: 3;"> -->
        <nav style="position: relative; top: 1.1rem; left:20rem; z-index: 3;  display:flex; align-items:center; justify-content:space-between; padding:10px 20px; background:#213242; border-bottom:1px solid #ddd; font-family: 'Montserrat', sans-serif; font-size:18px;">
            <div style="display:flex; align-items:center; gap:25px;left: 15vw;">
                <div style="color:#ffffff; font-size: 20px; font-weight: 700;">
                    <?= $title ?>
                </div>
                <?php if (!(null == $links || empty($links))): ?>
                    <?php foreach ($links as $descr => $link): ?>
                        <?php if ($link['auth_check']): ?>
                            <?php if (auth()->user()->can_edit_by_controller($controller)) : ?>
                                <a style="text-decoration: none;" href="<?= $link['url'] ?>" target="<?= isset($link['target']) ? $link['target'] : '_self' ?>" ><?= $descr ?></a>
                            <?php endif; ?>
                        <?php else: ?>
                            <a style="text-decoration: none;" href="<?= $link['url'] ?>"><?= $descr ?></a>
                        <?php endif; ?>
                    <?php endforeach; ?>
                <?php endif;    ?>
            </div>
            <!-- <div> -->
            <!-- <img src="user-image.jpg" alt="User" style="height:40px; width:40px; border-radius:50%; object-fit:cover; cursor:pointer;"> -->
            <div class="dropdown" style="position: absolute; max-width: 30rem; left: calc(100% - 32rem); /*margin-right: 25rem;*/">
                <div class="dropbtn">
                    <img src="<?= site_url('images/img_avatar.png'); ?> " alt="Avatar" class="avatar">
                    <?= esc(auth()->user()->username) ?>
                </div>
                <div class="dropdown-content">
                    <?php if (auth()->user()->inGroup('admin')): ?>
                        <a href="<?= url_to("users") ?>">Users</a>
                    <?php endif; ?>
                    <?php if (auth()->loggedIn()): ?>
                        <a href="<?= url_to("change-password") ?>">Change Password</a>
                        <a href="<?= url_to("logout") ?>">Log out</a>
                    <?php else: ?>
                        <a class="button" href="<?= url_to("login") ?>">Log in</a>
                    <?php endif; ?>
                </div>
            </div>
            <!-- </div> -->
        </nav>
        <!-- </div> -->
    </div>
    <?php if (session()->has("message")): ?>
        <div style="padding-top: 3px; padding-bottom: 3px; background-color:#8ca0aa; color: #ffffff;">
            <p style="margin:10px; font-weight: 700;"><?= session("message") ?></p>
        </div>
    <?php endif; ?>

    <?php if (session()->has("errors")): ?>
        <ul style="padding-top: 3px; padding-bottom: 3px; background-color:#e04d2b; color: #ffffff;">
            <?php foreach (session("errors") as $error): ?>
                <li style="color: #ffffff;"><?= $error ?></li>
            <?php endforeach; ?>
        </ul>
    <?php endif; ?>