html, body {
    height: 100%;
}

app {
    display: block;
    height: 100%;
}
@import url(https://fonts.googleapis.com/css?family=Cabin+Sketch&display=swap);
@font-face {
    font-family: 'Cabin Sketch';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/cabinsketch/v21/QGYpz_kZZAGCONcK2A4bGOj8mNhN.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.header-logo {
    /*-webkit-mask: url('../images/IvoryLogo.jpeg');*/
    /*mask: url('../images/IvoryLogo.jpeg');*/
    background-image: url(../images/IvoryLogo.jpeg);
    width: 180px;
    height: 24px;
    font-family: 'Cabin Sketch';
    font-size: 22.2px;
    font-weight: 700;
    /* ... */
    /*background-color: currentColor;*/
    /*-webkit-mask-position: center;*/
    /*   mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;*/
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}
.logoncontainer {
    display: flex;
    width: 100%;
    height: 100%;
    background-color: #5156be;
}

.logonleft,
.logonright {
    flex: 1;
    text-align: center;
    transition: all 0.3s;
    display: flex;
    position: relative;
    top: 0;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.logonleft {
    flex: 25%;
    float: left;
    left: 0;
    background-color: ghostwhite;
}

.logonright {
    flex: 75%;
    float: right;
    right: 0;
    background-image: url('../../images/auth-bg.jpg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.logondivider {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 576px) {
    .hideinmob {
        display: none;
    }
}

/* Editors and captions */
.dxbl-text-edit {
    border-radius: 8px;
    padding: 6px 2px ;
}

.dxbl-fl .dxbl-fl-item.dxbl-fl-item-horizontal > .dxbl-fl-cpt {
    padding: 10px;
}

/* List and dialogs */
.dxbl-dropdown > .dxbl-dropdown-dialog, .dxbl-itemlist-dropdown > .dxbl-dropdown-dialog {
    border: thick;
    border-radius: 8px;
}

.logon-toolbar button {
    color: white;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s;
    background-color: cornflowerblue;
    border: none;
}

.logon-viewsite .dxbl-text-edit-input {
    border-radius: 8px;
}

.logon-main {
    max-width: 400px;
    min-width: 400px;
    width: 400px;
    border-radius: 8px;
    background-color: transparent;
    border: none !important;
    box-shadow: none !important;
}

.logon-slogan-text {
    position: absolute;
    bottom: 20px;
    font-size: 1.5vw;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 1px 15% 1px 15%;
    background-color: cornflowerblue;
}

.dxbl-tabs > .dxbl-tabs-tablist.dxbl-tabs-tablist-scrollable {
    background-color: transparent;
}

/*.dxbl-scroll-viewer > .dxbl-scroll-viewer-content {
    background-color: transparent;
}
*/

.bg-overlay {
    inset: 0;
    opacity: 0.3;
    background-color: #000;
}

.dxbl-toolbar.dxbl-toolbar-adaptive > .dxbl-btn-toolbar > div > .dxbl-toolbar-item > .dxbl-btn {
    border-radius: 8px;
    padding: 10px;
}

.dxbl-btn-secondary {
    border-radius: 8px;
    padding: 10px;
}

.dxbl-btn-primary {
    border-radius: 8px;
    padding: 10px;
}

/* Navigation */
/*.clickable-xaf-nav-item > a .xaf-nav-link, .clickable-xaf-nav-item > div > a .xaf-nav-link {
    text-decoration: none !important;
    transition: color 0.3s, text-decoration 0.3s;*/ /* Optional: for smooth transition */
/*}*/
/* Filter */
/*.dxbl-accordion .dxbl-accordion-group:first-child:not(:last-child), .dxbl-accordion .dxbl-accordion-group:first-child:not(:last-child) > .dxbl-accordion-group-header {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-color: ghostwhite;
    border-top: 0;
    border-right: 0;
    border-left: 0;
}*/
/*.dxbl-accordion .dxbl-accordion-group:not(:first-child):last-child,
.dxbl-accordion .dxbl-accordion-group:not(:first-child):last-child > .dxbl-accordion-group-header {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-color: ghostwhite;
    transition: background-color 0.3s, box-shadow 0.3s;*/ /* Optional: smooth transition */
/*border: 0;
}*/
/*.dxbl-accordion .dxbl-accordion-group:not(:first-child):last-child:hover,
.dxbl-accordion .dxbl-accordion-group:not(:first-child):last-child > .dxbl-accordion-group-header:hover {
    color: mediumblue;
    background-color: ghostwhite !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/ /* Optional: add shadow on hover */
/*box-shadow: none !important;
}*/

/* Grid */
tr:nth-child(odd) {
    background-color: white;
}

tr:nth-child(even) {
    background-color: #f1f1f1b8;
}

.dxbl-grid-header-row {
    background-color: #f0f0f0 !important;
}

.app .main-content > .grid-content, .xaf-masterdetail-listview > .grid-content {
    border-radius: 8px;
}

dxbl-grid-header-content {
    padding: 6px 0
}

.dxbl-grid .dxbl-grid-table > tbody > tr > td > .dxbl-checkbox, .dxbl-grid .dxbl-grid-table > tfoot > tr > td > .dxbl-checkbox, .dxbl-grid .dxbl-grid-table > thead > tr > td > .dxbl-checkbox {
    padding: 6px 0;
}


tr.dxbl-listbox-item-selected {
    background-color: inherit; 
    color: var(--contrast-color, black) !important; 
}