.custom-swal-container {
    background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important
}
        #tree {
            overflow-y: auto;
            max-height: 200px;
        }

        .footer-div {
            margin-left: 2%;
            float: left;
            direction: rtl;
            position: absolute;
            bottom: 0;
            left: 0;
        }

        .table td, .table th {
            font-size: 1.0rem
        }

        .sidebar .nav-link {
            padding: 0.25rem 0.75rem !important;
        }

        .sidebar .nav-item {
            margin-bottom: 0.1rem !important;
        }

        .table thead th {
            font-size: 0.875rem
        }

        .overlay {
            position: fixed;
            width: 100%;
            height: 100%;
            background: #f2f4f699;
        }


        .sidebar {
            background-color: #1e3664 !important;
        }

        .spinner-border {
            display: inline-block;
            width: 4rem;
            height: 4rem;
            vertical-align: -0.125em;
            border: 0.25em solid currentColor;
            border-right-color: transparent;
            border-radius: 50%;
            animation: 0.75s linear infinite spinner-border;
            margin-left: 20%;
        }



        .pagerow {
            background-color: #F2F4F6;
        }


        .content {
            direction: rtl !important;
            margin-top: 5% !important;
        }
        /* Chrome, Safari, Edge, Opera */
        input::-webkit-outer-spin-button,
        input::-webkit-inner-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }

        /* Firefox */
        input[type=number] {
            -moz-appearance: textfield;
        }

        html, body, div, table, td, label, h1, h2, h3, h4, h5, h6, a, span, input, button, p, li {
            font-family: "Heebo",'Open Sans',Arial !important;
        }

        .icontitle {
            font-size: 0.7em;
            padding-right: 0.5em;
        }

        .subicon {
            font-size: 0.65em;
            padding-right: 0.35em;
        }

        .icon {
            font-size: 0.7em;
        }

        input::-webkit-datetime-edit {
            font-family: "Heebo",'Open Sans',Arial !important;
        }

        input::-webkit-datetime-edit-fields-wrapper {
            font-family: "Heebo",'Open Sans',Arial !important;
        }


        @media (min-width: 768px) {
            .item {
                flex: 0 0 auto;
                width: 18% !important;
            }

            .discount {
                flex: 0 0 auto;
                width: 14% !important;
            }

            .shorter-input {
                width: 33.33% !important;
            }

            .quarter-input {
                width: 25% !important;
            }

            .fifth-input {
                width: 20% !important;
            }

            .sixth-input {
                width: 16.66% !important;
            }
        }

        @media (min-width: 1200px) {
            .col-xl-8 {
                flex: 0 0 auto !important;
                width: 85% !important;
                margin-right: 5% !important;
            }

            .w-100 {
                width: 98% !important;
            }

            .container {
                max-width: 1940px !important;
            }
        }





        @media only screen and (max-width: 1600px) and (min-width: 992px) {

            .sidebar {
                max-width: 100px !important;
            }

            .icontitle, subicon {
                font-size: 0.6em !important;
            }

            .col-xl-8 {
                flex: 0 0 auto !important;
                width: 85% !important;
                margin-right: 5% !important;
            }
        }



        @media only screen and (min-width: 700px and max-width: 1200px) {

            .shorter-input, .quarter-input, .fifth-input, .sixth-input {
                width: 100% !important;
            }

            .col-xl-8 {
                flex: 0 0 auto !important;
                width: 85% !important;
                margin-right: 5% !important;
            }

            .w-100 {
                width: 98% !important;
            }

            .container {
                max-width: 900px !important;
            }
        }

        @media (min-width: 1200px) {
            .col-xl-8 {
                flex: 0 0 auto !important;
                width: 80% !important;
                margin-right: 5% !important;
            }

            .w-100 {
                width: 98% !important;
            }

            .container {
                max-width: 1940px !important;
            }
        }

        .nav-item a:hover {
            background-color: transparent !important;
        }

        /* Tooltip text */
        [data-tooltip]:before {
            /* needed - do not touch */
            content: attr(data-tooltip);
            position: absolute;
            opacity: 0;
            /* customizable */
            transition: all 0.15s ease;
            padding: 10px;
            color: #ffffff;
            border-radius: 10px;
            font-size: 12px;
            z-index: 1;
            font-family: "Heebo",'Open Sans',Arial !important;
        }

        [data-tooltip]:hover:before {
            /* needed - do not touch */
            opacity: 1;
            /* customizable */
            background: #000;
            margin-right: 45px;
            position: fixed;
            font-family: "Heebo",'Open Sans',Arial !important;
        }

        [data-tooltip]:not([data-tooltip-persistent]):before {
            pointer-events: none;
            font-family: "Heebo",'Open Sans',Arial !important;
        }

        .sidebar, .nav-link {
            width: 100%;
            max-width: 120px !important;
            font-size: 1.3rem !important;
        }

        .navbar-expand .navbar-nav {
            margin-left: 5% !important;
        }

        .submenuItem {
            margin-right: -40px !important;
        }