@yield('css')
<link href="{{ asset('assets/vendors/apexcharts/apexcharts.css') }}" rel="stylesheet" />
<link href="{{ asset('assets/vendors/keenicons/styles.bundle.css') }}" rel="stylesheet" />

<link href="{{ asset('assets/vendors/fontawesome/css/fontawesome.css') }}" rel="stylesheet" />
<link href="{{ asset('assets/vendors/fontawesome/css/brands.css') }}" rel="stylesheet" />
<link href="{{ asset('assets/vendors/fontawesome/css/solid.css') }}" rel="stylesheet" />

<link href="{{ asset('assets/css/styles.css') }}" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet" />
<style>
    /* Loading Overlay */
    #apps-loader {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.8);
        z-index: 9999;
        justify-content: center;
        align-items: center;
    }

    #apps-loader.active {
        display: flex;
    }

    /* CSS Loader from cssloaders.github.io */
    .loader {
        width: 48px;
        height: 48px;
        border: 5px solid #FFF;
        border-bottom-color: #18CB96;
        border-radius: 50%;
        display: inline-block;
        box-sizing: border-box;
        animation: rotation 1s linear infinite;
    }

    @keyframes rotation {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    .dt-search label {
        display: none;
    }
</style>
@yield('custom_stylesheet')