
html, body {
    height: 100%;
}
/*
body {
    overflow-y: hidden;
}*/

app {
    display: block;
    height: 100%;
}

.xaf-loading {
    background-color: rgba(0,0,0,.35);
    backdrop-filter: blur(1px);
}

.nested-toolbar {
    /* padding-bottom: 0.75rem; */
    padding: .5rem;
   /* xbackground-color: #f2f2f2;
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-top: 1px solid;
    border-radius: 5px 5px 0 0;
    border-color: #d2d2d2;*/
}

/*
button.account-button > .xaf-image {
    background-position: center !important;
}*/

/*.dxbl-grid {
}

    .dxbl-grid .dxbl-grid-table > tbody > tr > td,
    .dxbl-grid .dxbl-grid-table > tbody > tr > th,
    .dxbl-grid .dxbl-grid-table > tfoot > tr > td,
    .dxbl-grid .dxbl-grid-table > tfoot > tr > th,
    .dxbl-grid .dxbl-grid-table > thead > tr > td,
    .dxbl-grid .dxbl-grid-table > thead > tr > th {
        border-right-width: 1px;
        border-left-width: 1px;
        padding-left: 10px !important;*/ /* blazing berry css more specific so paddding gets lost without imporatnt*/
/*}*/
.property-google-map-container { 
    height: 400px;
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(95, 54, 141, 0.5);
    display:flex;
    align-content:center;
    justify-items: center;
}

.header {
    background-color: #484748;
    color: #aaa;
}

.xaf-sidebar.sidebar {
    background-color: #262526;
}

.xaf-sidebar .dxbl-group {
    -webkit-tap-highlight-color: transparent;
    --dxbl-group-bg: #262526;
    --dxbl-group-color: white;
}

    .xaf-sidebar .dxbl-group,
    .xaf-sidebar .dxbl-group > .dxbl-group-header {
        border: none;
    }

        .xaf-sidebar .dxbl-group > .dxbl-group-header::before {
            visibility: hidden;
        }

.clickable-xaf-nav-item > a .xaf-nav-link, .clickable-xaf-nav-item > div > a .xaf-nav-link {
    text-decoration: none;
}

.dxbl-accordion-group-header .xaf-nav-link {
    font-weight: 200;
}


dxbl-expandable-container > .dxbl-accordion-items-container {
    margin-left: 20px;
}

.baum-fullheight-container {
    height: calc(100vh - 160px);
    /*border: 3px solid cyan !important;*/
}


/* baum-tabbed-dashboard goes on custom css class for "MAIN", top-level layout to allow listviews to be sized to height of page and enable scrolling when page size is larger than page*/
.baum-tabbed-dashboard-layout-main > .dxbl-row:first-child > .dxbl-col > dxbl-tabs .nested-content {
    height: calc(100vh - var(--dxbl-tabs-tab-padding-y) * 2 - var(--tab-title-text-height) - 0.625rem - 180px);
   /*border: 2px solid pink;*/
}

.direction-horizontal > .xaf-masterdetail-splitter {
    margin-bottom: 0;
}

.main-toolbar {
    padding-top:8px;
    padding-bottom:8px;
}

.contacttoemail-viewitem {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

    .contacttoemail-viewitem h2 {
        cursor: pointer;
        font-weight: bold;
        position: absolute;
        font-size: 22px;
        top: 2px;
        left: 10px;
    }

.contacttoemail-viewitem-stepcontainer {
    overflow-y: auto;
    margin-left: 10px;
}

    .contacttoemail-viewitem-stepcontainer > div {
        display: none;
        margin-left: 20px;
    }

        .contacttoemail-viewitem-stepcontainer > div.active {
            display: block;
        }

.baum-choice-container {
    display: flex;
    gap: 20px;
    cursor: pointer;
    margin: 10px;
    border: 1px solid white;
    border-radius: 5px;
    padding: 5px 15px;
}

    .baum-choice-container:hover, .baum-choice-container.selected {
        border-color: #ccc;
        background-color: #5f368d;
        color: white;
    }

.baum-choice-title {
    font-size: 16px;
    font-weight: bold;
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup:not(.dxbl-popup-resized):not(.dxbl-popup-fixed-width) {
    max-width: unset;
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup {
    width: clamp(300px,90%, 1440px);
}

@media (max-width:430) {
    dxbl-modal-dialog {
        width: 100%;
    }
}
