:root {
    /*--dxbl-grid-header-bg: #f4f4f4;*/
    --dxbl-grid-header-bg: rgba(0,0,0,0.05);
    --dxbl-fl-group-header-font-size: 0.8rem !important;
    --dxbl-fl-group-header-font-weight: 400 !important;
    --dxbl-group-header-font-size: 0.8rem !important;
    --dxbl-group-header-font-weight: 400 !important;
    --dxbl-fl-group-header-bg: white;
    --dxbl-group-header-bg: white;
    --dxbl-fl-group-header-font-weight: 400;
    --bs-danger: #ee5151;
    --bs-primary: #70C787;
    --bs-success: #70C787;
    /*--dxbl-grid-header-color: #7a7a7a;*/
    /*--dxbl-text-font-size: 0.85rem;*/
    /*  --dxbl-text-font-family: "Instrument Sans", sans-serif;
    --bs-font-sans-serif: "Instrument Sans", sans-serif;
    --bs-body-font-family: "Instrument Sans", sans-serif;*/
    /* Redefine primary color variables to use success color values */
    /*--bs-primary: #09b850;*/ /* Background color */
    /*--bs-primary-rgb: 47, 179, 128;
    --bs-primary-hover-bg: #279f6e;
    --bs-primary-active-bg: #218b5f;
    --bs-primary-border-color: #09b850;
    --bs-primary-hover-border: #249266;
    --bs-primary-active-border: #218b5f;*/
    --bs-gray-400: #e9ecef;
    --dxbl-fl-group-header-bg: #f4f4f4;
    --dxbl-group-header-bg: #f4f4f4;
    --dxbl-btn-link-text-decoration: none;
    --dxbl-accordion-group-item-hover-bg: #09b850;
    --dxbl-accordion-group-item-hover-color: #fff;
    --dxbl-accordion-group-item-selection-bg: #09b850;
    --dxbl-accordion-group-item-selection-color: #fff;
    /* Light soft colors*/
    /* --dxbl-accordion-group-item-hover-bg: rgba(12, 188, 135, 0.1);
    --dxbl-accordion-group-item-hover-color: #0cbc87;
    --dxbl-accordion-group-item-selection-bg: rgba(12, 188, 135, 0.1);
    --dxbl-accordion-group-item-selection-color: #0cbc87;*/

    --dxbl-fl-group-header-font-size: 0.9rem !important;
    --dxbl-fl-group-header-font-weight: 400 !important;
    --dxbl-group-header-font-size: 0.9rem !important;
    --dxbl-group-header-font-weight: 400 !important;
    --dxbl-grid-selection-bg: var(--bs-primary);
    --dxbl-treeview-item-border-radius: 1.1rem;
    /*--dxbl-grid-header-color: #7a7a7a;*/
    /*--dxbl-text-font-size: 0.85rem;*/
    /*--dxbl-text-font-family: "Instrument Sans", sans-serif;
    --bs-font-sans-serif: "Instrument Sans", sans-serif;
    --bs-body-font-family: "Instrument Sans", sans-serif;*/
    /*--bs-table-bg: #f4f4f4;*/
}
/*body{*/
/*background-color:#f4f3ec;*/
/*background-image:url(/images/back.png);
}*/

/*rect {
    rx: 10;
    ry: 10;
}*/
.dxbl-treeview {
    --dxbl-treeview-item-selection-color: darkslategray;
    --dxbl-treeview-item-selection-focused-color: var(--bs-primary);
}

.dx-dashboard-widget-container * {
    border-radius: 10px;
}

/*.dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
    border-radius: 0 20px 0 20px;
    margin-right: -10px;
}*/

.parametrized-action-wrapper.xaf-action-fulltextsearch {
    width: 175px !important;
}

[role="treeitem"]:hover {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.075);
    background-color: #f5f5f5;
    cursor: pointer;
    border-radius: 10px;
    /*border: solid;*/
    border-width: 0.1px;
}

.dxbl-grid-header-row {
    color: lightslategray;
    color: darkslategray;
}

.dxbl-grid .dxbl-grid-table .dxbl-grid-detail-cell{
    border-top:none;
    font-size: smaller;
}
.dxbl-list-box-render-container td {
    white-space: normal !important;
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 250px; /* optional: limit width */
}

.dxbl-grid>.dxbl-grid-toolbar-container, .dxbl-grid>.dxbl-grid-top-panel{
    border-bottom-width:0px;
}

.dxbl-grid {
    --dxbl-grid-text-cell-padding-y: 0.55rem;
    --dxbl-grid-editor-cell-padding-y: 0.55rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* bottom */
    border-radius: 10px;
    --dxbl-grid-header-font-weight: 500;
    border: none;
    /*margin:5px;*/
}

    .dxbl-grid > .dxbl-scroll-viewer {
        /*border-radius: 10px;*/
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        border: none;
    }

    .dxbl-grid .dxbl-grid-table > tbody > tr > td > .dxbl-checkbox {
        vertical-align: middle;
    }

    .dxbl-grid .dxbl-grid-table > tbody, .dxbl-grid .dxbl-grid-table > tfoot, .dxbl-grid .dxbl-grid-table > thead {
        border-radius: 10px;
    }

    .dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-grid-table > tbody {
        border-left: none;
    }

    .dxbl-grid::after {
        height: calc(100% - 10px);
        box-shadow: 1px 0 10px rgba(0, 0, 0, 0.2);
    }

    .dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-grid-table > tbody > tr:hover {
        /*background-color: #f0f8ff;*/
        /*background-color: var(--bs-primary);*/
        background-color: rgba(0,0,0,0.03);
        cursor: pointer;
    }

    .dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-grid-table > tbody > tr {
        transition: background-color 0.5s ease;
    }


.main-toolbar {
    /*background-image: url('../images/back_2.jpg');*/
    background-color: #f4f4f4;
}

.main-content {
    margin-top: 10px;
    /*background-color: #f4f4f4;*/
}

#main-view-content {
    border-radius: 20px;
    /*padding: 5px;*/
    margin: 10px;
    box-shadow: 0 2px 50px 20px rgba(0,0,0,0.1);
    background-color: #f4f4f4;
}

.dxbl-fl .dxbl-fl-gd {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.01);
    border-radius: 20px;
}

.dxbl-group-header {
    padding: 10px;
    margin: 5px;
}
/*.dxbl-group > .dxbl-group-header{
    font-size:1.5rem;
}*/

.header {
    /*background-image: url('../images/back_2.jpg');*/
}

.xaf-sidebar {
    /* background-image: url('../images/back_2.jpg');
    background-size: 1000px;*/
    /*background-color: #f4f4f4;*/
    box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.16);
    margin: 10px;
    border-radius: 20px;
    overflow:auto;
    /*background:white;*/
    /*background-color:rgba(0,0,0,0.01);
    z-index:10000;*/
}

.dxbl-treeview .dxbl-navigation-filter {
    border-radius: 20px;
    box-shadow: 0 10px 10px 10px rgba(0, 0, 0, 0.01);
}

.dxbl-scroll-viewer > .dxbl-scroll-viewer-vert-scroll-bar:not(.dxbl-disabled):not(:disabled).dxbl-active {
    color: var(--bs-primary)
}

.dxbl-group > .dxbl-group-header {
    font-weight: 400;
    font-size: 1.15rem;
    border-bottom: unset;
    background-color: white;
    /*background-image: linear-gradient(135deg, #ff7e5f, #feb47b);*/
    /*background-image: url('../images/back_2.jpg');*/
}

    .dxbl-group > .dxbl-group-header:before {
        filter: blur(20px);
    }

.dxbl-navigation-filter {
    margin-top: 10px;
}
/*
.dxbl-btn-secondary {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 45px;
    height: 45px;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition-duration: .3s;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.199);
    background-color: rgb(255, 65, 65);
}
.sign {
    width: 100%;
    transition-duration: .3s;
    display: flex;
    align-items: center;
    justify-content: center;
}
    .sign svg {
        width: 17px;
    }

        .sign svg path {
            fill: white;
        }
.text {
    position: absolute;
    right: 0%;
    width: 0%;
    opacity: 0;
    color: white;
    font-size: 1.2em;
    font-weight: 600;
    transition-duration: .3s;
}
.dxbl-btn-secondary:hover {
    width: 125px;
    border-radius: 40px;
    transition-duration: .3s;
}

    .dxbl-btn-secondary:hover .sign {
        width: 30%;
        transition-duration: .3s;
        padding-left: 20px;
    }
    .dxbl-btn-secondary:hover .text {
        opacity: 1;
        width: 70%;
        transition-duration: .3s;
        padding-right: 10px;
    }
.dxbl-btn-secondary:active {
    transform: translate(2px,2px);
}*/

/* Inherit Bootstrap's btn-secondary styles for dxbl-btn-secondary */
.dxbl-btn-secondary {
    color: #000; /* from .btn-secondary */
    background-color: #fff; /* from .btn-secondary */
    /*border-color: #e6e6e6;*/
    border-color: rgba(0,0,0, 0.1);
    box-shadow: 0 6px 10px rgba(0, 0, 0, .01); /* from .btn-secondary */
    border-radius: 10px;
    padding: 5px;
    padding-right: 10px;
    padding-left: 10px;
    /*padding-top: 10px;
    padding-bottom: 10px;*/
}

    /* Apply additional styles for hover, focus, active states if necessary */
    .dxbl-btn-secondary:hover {
        color: #000;
        background-color: #e6e6e6; /* adjust as per hover styles */
        border-color: #dcdcdc; /* adjust as per hover styles */
    }

    .dxbl-btn-secondary:focus, .dxbl-btn-secondary.focus {
        color: #000;
        background-color: #e6e6e6; /* adjust as per focus styles */
        border-color: #dcdcdc; /* adjust as per focus styles */
        box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5); /* adjust as per focus styles */
    }

    .dxbl-btn-secondary.disabled, .dxbl-btn-secondary:disabled {
        color: #000;
        background-color: #fff; /* adjust as per disabled styles */
        border-color: #fff; /* adjust as per disabled styles */
    }

    .dxbl-btn-secondary:not(:disabled):not(.disabled):active, .dxbl-btn-secondary:not(:disabled):not(.disabled).active,
    .show > .dxbl-btn-secondary.dropdown-toggle {
        color: #000;
        background-color: #dcdcdc; /* adjust as per active styles */
        border-color: #d3d3d3; /* adjust as per active styles */
    }

        .dxbl-btn-secondary:not(:disabled):not(.disabled):active:focus, .dxbl-btn-secondary:not(:disabled):not(.disabled).active:focus,
        .show > .dxbl-btn-secondary.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5); /* adjust as per focus styles */
        }


/* Inherit Bootstrap's btn-success styles for dxbl-btn-primary */
.dxbl-btn-primary {
    color: #fff; /* from .btn-success */
    /*background-color: #09b850;*/ /* from .btn-success */
    /*border-color: #09b850;*/ /* from .btn-success */
    /*background-color: #09b850;*/
    /*border-color: #09b850;*/

    border-radius: 5px;
    box-shadow: 0 3px 2px rgba(0, 0, 0, .05); /* from .btn-success */
}

    /* Apply additional styles for hover, focus, active states with increased specificity */
    .dxbl-btn-primary:hover,
    .dxbl-btn-primary:focus,
    .dxbl-btn-primary:active,
    .dxbl-btn-primary:focus-visible {
        color: #fff !important;
        /*background-color: #279f6e !important;*/ /* adjust as per hover styles */
        border-color: #249266 !important; /* adjust as per hover styles */
    }

    .dxbl-btn-primary:focus, .dxbl-btn-primary.focus {
        box-shadow: 0 0 0 0.25rem rgba(47, 179, 128, 0.5) !important; /* adjust as per focus styles */
    }

    .dxbl-btn-primary.disabled, .dxbl-btn-primary:disabled {
        color: #fff !important;
        /*background-color: #09b850 !important;*/ /* adjust as per disabled styles */
        border-color: #09b850 !important; /* adjust as per disabled styles */
    }

    .dxbl-btn-primary:not(:disabled):not(.disabled):active, .dxbl-btn-primary:not(:disabled):not(.disabled).active,
    .show > .dxbl-btn-primary.dropdown-toggle {
        color: #fff !important;
        /*background-color: #249266 !important;*/ /* adjust as per active styles */
        border-color: #218b5f !important; /* adjust as per active styles */
    }

        .dxbl-btn-primary:not(:disabled):not(.disabled):active:focus, .dxbl-btn-primary:not(:disabled):not(.disabled).active:focus,
        .show > .dxbl-btn-primary.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.25rem rgba(47, 179, 128, 0.5) !important; /* adjust as per focus styles */
        }


.dxbl-text {
}

.clickable-xaf-nav-item > a .xaf-nav-link, .clickable-xaf-nav-item > div > a .xaf-nav-link {
    text-decoration: none;
}

.clickable-xaf-nav-item > a .xaf-nav-link {
    text-decoration: none;
}

.dxbl-fl .dxbl-fl-group > .dxbl-group {
    --dxbl-fl-group-header-font-size: 0.9rem !important;
    --dxbl-fl-group-header-font-weight: 400 !important;
    border-radius: 20px
}

.dxbl-group-header {
    box-shadow: var(--bs-card-box-shadow);
    /*text-transform: uppercase;*/
    /*font-weight:bold;
    font-size: 1rem;
    font-weight: 500;
    font-family:"Instrument Sans", sans-serif;*/
}

    .dxbl-group-header::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 1px;
        background-color: #ccc;
    }

.dxbl-group > .dxbl-group-header ::after {
    content: "";
    display: block;
    margin-top: 8px;
    border-bottom: 1px solid #ccc;
}

.main-view-content {
    --bs-card-spacer-y: 1rem;
    --bs-card-spacer-x: 1rem;
    --bs-card-title-spacer-y: 0.5rem;
    --bs-card-border-width: 1px;
    --bs-card-border-color: #F4F4F4;
    --bs-card-border-radius: 0.625rem;
    --bs-card-box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.02);
    --bs-card-inner-border-radius: calc(0.625rem - 1px);
    --bs-card-cap-padding-y: 0.5rem;
    --bs-card-cap-padding-x: 1rem;
    --bs-card-cap-bg: transparent;
    --bs-card-cap-color:;
    --bs-card-height:;
    --bs-card-color:;
    --bs-card-bg: #ffffff;
    --bs-card-img-overlay-padding: 1rem;
    --bs-card-group-margin: 0.75rem;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: var(--bs-card-height);
    word-wrap: break-word;
    background-color: var(--bs-card-bg);
    background-clip: border-box;
    border: var(--bs-card-border-width) solid var(--bs-card-border-color);
    border-radius: var(--bs-card-border-radius);
    box-shadow: var(--bs-card-box-shadow);
    box-shadow: 0 0.1rem 1rem 0.25rem rgba(0, 0, 0, 0.05) !important;
}

.dxbl-accordion-group {
    position: relative; /* Ensure the container is positioned relative for the absolute positioning of the background image */
}

    .dxbl-accordion-group::before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 50px; /* Adjust the width as needed */
        height: 50px; /* Adjust the height as needed */
        /*background-image: url('../images/img2.svg');*/
        background-size: contain;
        background-repeat: no-repeat;
        z-index: 1;
    }

.dxbl-group-body-content {
    position: relative; /* Ensure the container is positioned relative for the absolute positioning of the background image */
}

    .dxbl-group-body-content::before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 100px; /* Adjust the width as needed */
        height: 100px; /* Adjust the height as needed */
        /*background-image: url('../images/img4.svg');*/
        background-size: cover;
        background-repeat: no-repeat;
        z-index: -10000;
    }

.img-fluid {
    max-width: 100%;
    height: auto;
}

.img-bg {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -10000;
}

.dx-dashboard-widget-container .dx-dashboard-surface .dx-layout-item-wrapper .dx-layout-item-container {
    border-radius: 10px;
}