<html>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
    {{head}}
</head>

<body>
    <div id="wrapper">
        <!-- Sidebar -->
        <nav id="sidebar-wrapper">
            <button class="form-control btn-danger menu-toggle menu-small">Fechar</button>
            <div class="logo">
                <img src='/media/logo_white.png' alt="logo" />
            </div>

            <div class="search-nav">
                <input class="form-control" type="text" placeholder="Busca" />
            </div>

            {{elements}}

            <ul id="side-second-menu" class="hidden nav"></ul>
        </nav>
        <!-- /#sidebar-wrapper -->
        <!-- /#sidebar-wrapper -->

        <!-- Page Content -->
        <div id="main-page-wrapper">

            <header class='navbar navbar-default navbar-fixed-top' style='min-height: 50px; background-color: #000;'>

                <ul class="nav navbar-nav navbar-left">
                    <li class="tooltip-sidebar-toggle">
                        <a href="" class="menu-toggle">
                            {{#icons}} th-list {{/icons}}
                        </a>
                    </li>
                </ul>

                <ul class="nav navbar-top-links navbar-right">
                    <li class="nav-item dropdown no-arrow">
                        <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown"
                            aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-cog fa-fw"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right">
                            {{dropdown}}
                        </div>
                    </li>
                </ul>

            </header>

            <div id="progress" class="progress hidden">
                <div class="progress-bar progress-bar-striped progress-bar-animated active" style="width: 100%;"></div>
            </div>

            <!-- BreadCrumbs -->
            <div class='breadcrumb'>{{> /core/breadcrumb/view/breadcrumb}}</div>
            <!-- /BreadCrumbs -->

            <div id="page-content-wrapper" style="margin-bottom: 60px;">
                <div class="container-fluid">
                    <div class="row">
                        <div id="content" class="col-lg-12">
                            {{content}}
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <div id="toast-container" class="toast-container p-3 error" style="position: fixed; right: 0px; bottom: 0px;">
    </div>

    <div id="modal" class="modal fade">
        <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title"></h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                </div>
            </div>
        </div>
    </div>

    {{footer}}

</body>

</html>