@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    /*background: url(../images/white-gradient-background.jpg) no-repeat center center fixed;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    height: 100%;
    font-family: Calibri, sans-serif;
}

.col-form-label {
    display: none;
}

.xaf-alert-message {
    white-space: pre-line !important;
}

/*.xaf-nav-link {*/
/*    color: black;*/
/*    font-weight: bold;*/
/*}*/

/*.modal-content {*/
/*    background: url(../images/white-gradient-background.jpg) no-repeat center center fixed;*/
/*    !* Add the blur effect *!*/
/*    !*filter: blur(8px);*!*/
/*    !*-webkit-filter: blur(8px);*!*/

/*    opacity: 1.0;*/
/*    !*-webkit-transition: background 1.5s linear;*!*/
/*    !*-moz-transition: background 1.5s linear;*!*/
/*    !*-o-transition: background 1.5s linear;*!*/
/*    !*transition: background 1.5s linear;*!*/
/*}*/

/*.card {*/
/*    background-color: rgba(255, 255, 255, .9) !important;*/
/*}*/

app {
    display: block;
    height: 100%;
}

.header-logo {
    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask: url('../images/AppifySheets_Logo.svg');
    mask: url('../images/AppifySheets_Logo.svg');
    -webkit-mask-position: left;
    mask-position: left;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 180px;
    height: 50px;
}

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

.dxbs-popup.modal-dialog {
    /*max-width: 90% !important*/
}

/*.border {*/
/*    white-space: pre-line !important;*/
/*}*/

/*button {*/
/*    background-color: #4353FF !important;*/
/*}*/

/*.form-control[readonly]:not([disabled]).dx-reset-readonly-style {*/
/*    background-color: rgb(255, 255, 255);*/
/*}*/

.btn-secondary {
    border-color: #fe7109;
}

.loading-image {
    width: 100px !important;
    height: 100px !important;
    padding-top: 5px;
    padding-right: 5px;
}

.bg-primary {
    --bs-bg-opacity: 0 !important;
}

.border-primary {
    border-color: lightgray !important;
}

/*.form-check-input:checked {*/
/*    background-color: #D97800;*/
/*    border-color: #D97800;*/
/*}*/

/* The folded header bar (app-header.css, copied unchanged from hris.ifc.ge) keeps WhoIsLoggedOn a visible button
   for administrators by giving its toolbar a 100px minimum. That fits the button at XAF's default size; at size M
   (body.xaf-size-m, this app's setting) the button is 107px, so DxToolbar folded it into "...". 120px fits it. The
   body.xaf-size-m prefix outranks app-header.css's rule, which loads after this file. The tab row already reserves
   140px for this toolbar (app-header.css), so nothing else moves. Kept here, not in app-header.css, so that file
   stays identical to hris and can be copied over again as a whole. */
@media (min-width: 576px) {
    body.xaf-size-m .app > .header .header-right-side > dxbl-toolbar:has([data-action-name="WhoIsLoggedOn"]) {
        min-width: 120px !important;
    }
}


/* Nested list view grids (a collection inside a detail view; the class comes from TableStripedListViewController).
   From hris.ifc.ge. The max-height below is only a FALLBACK: js/nestedGridFill.js measures the space actually left
   in the view and writes an inline height, which outranks this rule (inline !important beats stylesheet !important).
   This value applies only in the moment before that first pass runs, or if the script fails to load. Do not delete
   it: without it an unsized nested grid grows to its full content height, XAF's native behaviour and the taller
   version of the double-scrollbar defect the script fixes. Do not "correct" the 130px either: no constant is right
   for a nested grid, which starts below the detail view's own toolbar and fields, hence the runtime measurement. */
.AppifySheets-grid {
    word-wrap: break-word !important;
    max-height: calc(100vh - 130px) !important;
}