<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/x-icon" href="/images/logo2.png">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <style>
        .sidebar,
        .sidebar * {
            box-sizing: border-box;
        }

        .sidebar {
            background: #1e1e2d;
            width: 265px;
            top: 0;
            bottom: 0;
            right: 0;
            left: 0;
            transition: 2.2s cubic-bezier(.36, -0.01, 0, .77);
        }

        .frame-1686552330 {
            display: flex;
            flex-direction: column;
            margin-top: 65px;
            align-items: center;
            justify-content: space-between;
            width: 265px;
            left: 0px;
            top: 104px;
        }

        .frame-1686552328 {
            display: flex;
            flex-direction: column;
            gap: 15px;
            align-items: flex-start;
            justify-content: flex-start;
            flex-shrink: 0;
            width: 245px;
            position: relative;
        }

        .frame-1686552317 {
            background: #009ef6;
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .frame-1686552316 {
            display: flex;
            flex-direction: row;
            gap: 9px;
            align-items: center;
            justify-content: flex-start;
            flex-shrink: 0;
            position: relative;
        }

        .layout-4-blocks {
            padding: 4px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: flex-start;
            flex-shrink: 0;
            width: 24px;
            height: 24px;
            position: relative;
        }

        .group-1000006241 {
            flex-shrink: 0;
            width: 16px;
            height: 14.93px;
            position: relative;
            overflow: visible;
        }

        .home {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552318 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .icons-bright {
            flex-shrink: 0;
            width: 24px;
            height: 24px;
            position: static;
        }

        .layout-4-blocks2 {
            width: 24px;
            height: 24px;
            position: static;
        }

        .bound {
            width: 24px;
            height: 24px;
            position: absolute;
            left: 0px;
            top: 0px;
        }

        .frame-1686552326 {
            display: flex;
            flex-direction: column;
            gap: 0px;
            align-items: center;
            justify-content: flex-start;
            width: 23.88%;
            height: 52.78%;
            position: absolute;
            right: 70.15%;
            left: 5.97%;
            bottom: 24.91%;
            top: 22.31%;
            overflow: visible;
        }

        .users {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552319 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .group-157 {
            width: 19.51%;
            height: 66.67%;
            position: absolute;
            right: 75.61%;
            left: 4.88%;
            bottom: 18.23%;
            top: 15.1%;
            overflow: visible;
        }

        .clock-in {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552320 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .layout-4-blocks3 {
            padding: 4px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: center;
            justify-content: center;
            width: 29.27%;
            height: 100%;
            position: absolute;
            right: 70.73%;
            left: 0%;
            bottom: 0%;
            top: 0%;
        }

        .group-1000006245 {
            flex-shrink: 0;
            width: 16px;
            height: 12.71px;
            position: relative;
            overflow: visible;
        }

        .impress {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552321 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .layout-4-blocks4 {
            padding: 4px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: center;
            justify-content: center;
            width: 24px;
            height: 24px;
            position: absolute;
            left: 0px;
            top: 0px;
        }

        .group-1000006244 {
            flex-shrink: 0;
            width: 16px;
            height: 12.8px;
            position: relative;
            overflow: visible;
        }

        .departments {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552322 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .icons-bright2 {
            width: 24px;
            height: 24px;
            position: static;
        }

        .layout-4-blocks5 {
            padding: 4px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: center;
            justify-content: center;
            width: 17.52%;
            height: 100%;
            position: absolute;
            right: 82.48%;
            left: 0%;
            bottom: 0%;
            top: 0%;
        }

        .group-1000006246 {
            flex-shrink: 0;
            width: 16px;
            height: 16px;
            position: relative;
            overflow: visible;
        }

        .vendors-account {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552323 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .layout-4-blocks6 {
            padding: 4px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: center;
            justify-content: center;
            width: 23.53%;
            height: 100%;
            position: absolute;
            right: 76.47%;
            left: 0%;
            bottom: 0%;
            top: 0%;
        }

        .group-1000006243 {
            flex-shrink: 0;
            width: 16px;
            height: 12.8px;
            position: relative;
            overflow: visible;
        }

        .training-hr {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552324 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            align-self: stretch;
            flex-shrink: 0;
            height: 40px;
            position: relative;
        }

        .group-1000006242 {
            flex-shrink: 0;
            width: 12.62px;
            height: 16px;
            position: relative;
            overflow: visible;
        }

        .support {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-16865523262 {
            border-radius: 6px;
            padding: 7px 11px 7px 11px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            justify-content: center;
            flex-shrink: 0;
            width: 245px;
            height: 40px;
            position: relative;
        }

        .group-156 {
            width: 19.28%;
            height: 66.67%;
            position: absolute;
            right: 75.9%;
            left: 4.82%;
            bottom: 16.67%;
            top: 16.67%;
            overflow: visible;
        }

        .settings {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: relative;
        }

        .frame-1686552329 {
            height: 66px;
            margin-bottom: 140px;
        }

        .sep {
            background: #2d2d43;
            width: 265px;
            height: 1px;
            position: absolute;
            left: 0px;
            top: 65px;
        }

        .text {
            position: absolute;
            inset: 0;
        }

        .online {
            color: #50cd89;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 9px;
            font-weight: 500;
            left: 94px;
            top: 38px;
        }

        .rectangle-368 {
            background: #50cd89;
            border-radius: 20px;
            width: 3px;
            height: 3px;
            left: 88px;
            top: 44px;
        }

        .hr-manager {
            color: #7e8299;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 10px;
            font-weight: 500;
            left: 88px;
            top: 21px;
        }

        .paul-melone {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 14px;
            font-weight: 500;
            left: 88px;
            top: 0px;
        }

        .avatar {
            border-radius: 6px;
            width: 50px;
            height: 50px;
            left: 24px;
            top: 0px;
            overflow: hidden;
        }

        ._300-2-3 {
            width: 50px;
            height: 50px;
            left: 0px;
            top: 0px;
            object-fit: cover;
        }

        .top-part {
            position: absolute;
            inset: 0;
        }

        .sep2 {
            background: #2d2d43;
            width: 265px;
            height: 1px;
            left: 0px;
            top: 73px;
        }

        .group-1000006247 {
            position: absolute;
            inset: 0;
        }

        .secure-point {
            color: #ffffff;
            text-align: left;
            font-family: "MuseoSans-700", sans-serif;
            font-size: 14px;
            font-weight: 400;
            position: absolute;
            left: 55px;
            top: 28px;
        }

        .w-xz-mt-p-25-400-x-400-3 {
            width: 28px;
            height: 28px;
            position: absolute;
            left: 24px;
            top: 25px;
            object-fit: cover;
        }

        /* bodysection */

        /* subheader section */
        .subheader {
            height: 74px;
            top: 0px;
            background: #FFFFFF;
            box-shadow: 0px 5px 40px rgba(0, 0, 0, 0.05);
            padding-left: 20px;
            padding-right: 20px;
        }

        .subheader-title {
            width: 103px;
            height: 27px;
            font-style: normal;
            font-weight: 600;
            font-size: 18px;
            line-height: 27px;
            color: #3F4254;

        }

        /* content  */

        .content {
            overflow: auto;
        }

        /* counter section */
        .frame-1686552331,
        .frame-1686552331 * {
            box-sizing: border-box;
        }

        .frame-1686552331 {
            height: 180px;
            position: relative;
        }

        .widget-3 {
            background: #181c32;
            border-radius: 12px;
            width: 372px;
            height: 180px;
            position: absolute;
            left: 804px;
            top: 0px;
            overflow: hidden;
        }

        .flats-shared-rooms-duplex {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-Medium", sans-serif;
            font-size: 12px;
            font-weight: 500;
            position: absolute;
            left: 29px;
            bottom: 35px;
        }

        ._410-customers {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-SemiBold", sans-serif;
            font-size: 17px;
            font-weight: 600;
            position: absolute;
            left: 29px;
            bottom: 57px;
        }

        .user-group-296-3 {
            width: 52px;
            height: 52px;
            position: absolute;
            left: 29px;
            top: 31px;
            object-fit: cover;
        }

        .widget-2 {
            background: #3699ff;
            border-radius: 12px;
            width: 372px;
            height: 180px;
            position: absolute;
            left: 402px;
            top: 0px;
            overflow: hidden;
        }

        ._865-personal {
            color: #ffffff;
            text-align: left;
            font-family: "Poppins-SemiBold", sans-serif;
            font-size: 17px;
            font-weight: 600;
            position: absolute;
            left: 29px;
            bottom: 57px;
        }

        .user-group-296-2 {
            width: 52px;
            height: 52px;
            position: absolute;
            left: 29px;
            top: 31px;
            object-fit: cover;
        }

        .widget-1 {
            background: #ffffff;
            border-radius: 12px;
            width: 373px;
            height: 180px;
            position: absolute;
            left: 0px;
            top: 0px;
            box-shadow: 0px 0px 30px 0px rgba(56, 71, 109, 0.09);
            overflow: hidden;
        }

        ._1-583-00-users {
            color: #3f4254;
            text-align: left;
            font-family: "Poppins-SemiBold", sans-serif;
            font-size: 17px;
            font-weight: 600;
            position: absolute;
            left: 29px;
            bottom: 57px;
        }

        .user-group-296-1 {
            width: 52px;
            height: 52px;
            position: absolute;
            left: 29px;
            top: 25px;
            object-fit: cover;
        }

        .subDasText {
            font-family: 'Poppins';
            font-style: normal;
            font-weight: 500;
            font-size: 12px;
            line-height: 21px;
            color: #B5B5C3;
        }

        .subDasTextPage {
            font-family: 'Poppins';
            font-style: normal;
            font-weight: 500;
            font-size: 12px;
            line-height: 21px;
            color: #3F4254;
        }

        /* table sections first table */

        .inprest {
            box-sizing: border-box;
            width: 425px;
            height: 423px;
            background: #FFFFFF;
            border: 0.96px solid #FFFFFF;
            border-radius: 11.52px;
        }

        .Imprest {
            width: 110.4px;
            height: 21.12px;

            font-family: 'Poppins';
            font-style: normal;
            font-weight: 500;
            font-size: 17.28px;
            line-height: 20px;
            color: #3F4254;
        }

        .inprestTitleView {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            padding-right: 10px;
        }

        .pettyCash {
            height: 21px;
            font-family: 'Poppins';
            font-style: normal;
            font-weight: 500;
            font-size: 11.52px;
            line-height: 20px;
            color: #B5B5C3;
        }

        html {
            overflow: scroll;
            overflow-x: hidden;
        }

        ::-webkit-scrollbar {
            width: 0;
            /* Remove scrollbar space */
            background: transparent;
            /* Optional: just make scrollbar invisible */
        }

        /* Optional: show position indicator in red */
        ::-webkit-scrollbar-thumb {
            /* background: #FF0000; */
        }

        .sidebarClosed {
            margin-left: -300px;
            position: absolute;
        }

        .sidebarActive {
            margin-left: 0;
            position: absolute;
        }
    </style>
    <title>{{$title}} : Dashboard</title>
    @vite('resources/css/app.css')
</head>

<body class="flex flex-row w-full">
    @include('includes.adminSidebar')


    <div class="w-full">


        @include('includes.subheader',['title'=> $title ])
        @yield('statusmenue')
        <div class="w-full mt-8 px-4">

            @yield('content')
        </div>


    </div>
    <script>
        function toggleSidebarClose() {
            document.getElementById("sidebar").classList.remove("sidebarActive");
            document.getElementById("sidebar").classList.add("sidebarClosed");
        }

        function toggleSidebarActive() {
            document.getElementById("sidebar").classList.remove("sidebarClosed");
            document.getElementById("sidebar").classList.add("sidebarActive");
        }
    </script>
</body>

</html>